<template>
    <div class="widthCommon" style="margin-bottom: 20px">
      <ul class="tabCon">
        <li v-for="i in 10" :key="i">
          <div class="tabListImg">
            <img src="../../../assets/images/product/tablist0.png" alt="">
          </div>
          <p class="tabListText">城市级智慧停车云平台</p>
        </li>
      </ul>

      <v-page :total-row="100" align="center" :page-size-menu="false" :info="false" @page-change="pagePhotoChange">
      </v-page>

    </div>
</template>

<script>

export default {
  name: 'selectTab0',
  methods:{
    pagePhotoChange:function (pInfo) {
      console.log(pInfo)
    }
  }

}
</script>

<style scoped lang="scss">
.tabCon{
  overflow: hidden;
}
  .tabCon li{
    width: 427px;
    height: 360px;
    margin: 0 30px 30px 0;
    float: left;
  }
.tabCon li:nth-child(3n+0){
  margin-right: 0;
}
  .tabListImg{
    width:427px;
    height:321px;
    padding: 10px 10px;
    background:rgba(255,255,255,1);
    border:2px solid rgba(203,203,203,1);
  }
  .tabListText{
    margin-top: 20px;
    font-size: 14px;
    color: #333;
    text-align: center;
  }
  .tabListImg img{
    width: 407px;
    height: 301px;
  }
</style>
