Lou
2023-12-05 a50857b21ee10ccf41e1d461a843c20a2a9d5cee
subPackage/statistics/index.vue
@@ -4,16 +4,16 @@
         <caption-row title="社区概况"></caption-row>
         <view class="cell flex j-c-s-b flex-wrap">
            <view class="cell-item bgc-ff" v-for="i in 6">
            </view>
         </view>
      </view>
      <view class="">
         <caption-row title="共治人员"></caption-row>
         <view class="menu">
            <u-grid :border="true">
               <u-grid-item v-for="i in 6"  bgColor="#fff">
               <u-grid-item v-for="i in 6" bgColor="#fff">
                  <view class="menu-item flex f-d-c a-i-c">
                     <text class="c-main f-32 fw">1</text>
                     <text class="f-28">党员</text>
@@ -22,11 +22,45 @@
            </u-grid>
         </view>
      </view>
      <view class="">
   <!--    <view class="">
         <caption-row title="人员画像"></caption-row>
      </view> -->
      <view class="">
         <caption-row title="社区事件"></caption-row>
         <view class="block">
            <view class="block-caption f-28 fw">
               总体统计
            </view>
            <u-grid :border="true">
               <u-grid-item v-for="i in 3" bgColor="#fff">
                  <view class="grid-item flex f-d-c a-i-c">
                     <text class="f-30 fw c-main mb-20">20</text>
                     <text class="f-28">事件总数</text>
                  </view>
               </u-grid-item>
            </u-grid>
         </view>
         <view class="block">
            <view class="block-caption f-28 fw">
               事件分类
            </view>
            <view class="flex j-c-s-b a-i-c">
               <view class="report-item"  v-for="(item,index) in reportData"  :key="index">
                  <image class="report-item-bg"  :src="item.bg"  mode="right"></image>
                  <view class="report-item-inner  flex f-d-c j-c-c a-i-c">
                     <text class="f-30">{{item.num}}</text>
                     <text class="f-28">{{item.title}}</text>
                  </view>
               </view>
            </view>
         </view>
      </view>
   </view>
</template>
@@ -35,6 +69,32 @@
   export default {
      components: {
         captionRow
      },
      data(){
         return{
            reportData:[
               {
                  title:"矛盾纠纷",
                  num:1,
                  bg:"/static/icon/nav-bg-08.png"
               },
               {
                  title:"公共维护",
                  num:1,
                  bg:"/static/icon/nav-bg-06.png"
               },
               {
                  title:"居家维修",
                  num:1,
                  bg:"/static/icon/nav-bg-07.png"
               },
               {
                  title:"投诉举报",
                  num:1,
                  bg:"/static/icon/nav-bg-09.png"
               }
            ]
         }
      }
   }
</script>
@@ -58,10 +118,34 @@
         margin-bottom: 20rpx;
      }
   }
   .menu{
   .menu {
      padding: 20rpx 0;
      .menu-item{
      .menu-item {
         padding: 20rpx 0;
      }
   }
   .block{
      padding:20rpx 0;
      .block-caption{
         padding:20rpx 0;
      }
      .grid-item{
         padding:30px 0;
      }
   }
   .report-item{
      position: relative;
   }
   .report-item,.report-item-bg,.report-item-inner{
      width:168rpx;
      height:190rpx;
      border-radius: 10rpx;
   }
   .report-item-inner{
      position: absolute;
      top:0;
      left:0;
   }
</style>