更新

src/views/home/model/bkcz.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="comom-title">
     <div class="title">
-      <span class="mr12 pointer nowrap" :style="{fontSize:activeIndex == idx ? '22px':'18px'} " v-for="(it,idx) in btns" :key="idx" @click="activeIndex = idx">{{ it }}</span>
+      <span class="mr12 pointer nowrap" :style="{fontSize:activeIndex == idx ? '22px':'18px'} " v-for="(it,idx) in btns" :key="idx" @click="changeActive(idx)">{{ it }}</span>
     </div>
   </div>
   <div class="comom-cnt" id="qcbk">
     <MyTable @changePage="changePage" customClass="zdy_bkcz_table" :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" >
         <template #tp="{row}">
-            <img width="30" src="@/assets/images/icon100.png" alt="">
+          <img width="30" src="@/assets/images/icon100.png" alt="">
         </template>
         <template #czzt="{row}">
             <span style="color:#FDBC3A">{{ row.czzt }}</span>
@@ -73,11 +73,6 @@ const pageData = reactive({
     showIndex: false,
     stripe:true
   },
-  total: 0,
-  pageConfiger: {
-    pageSize: 20,
-    pageNum: 1
-  }, //分页
   tableColumn: [
     { label: "照片", prop: "tp", showSolt: true },
     { label: "姓名", prop: "xm", showOverflowTooltip: true },
@@ -89,20 +84,50 @@ const pageData = reactive({
     { label: "处置状态", prop: "czzt",showOverflowTooltip: true,showSolt: true  },
   ]
 });
+const page = ref(1);
+const total = ref(0);
 
 onMounted(() => {
   tabHeightFn();
 });
 
+const changeActive = (idx) =>{
+  activeIndex.value = idx;
+  page.value = 0;
+  total.value = 0;
+  switch(idx){
+    case 0:
+      break;
+    case 1:
+      break;
+  }
+  pageData.keyCount++;
+  changePage(idx)
+}
 const changePage = () => {
+  pageData.tableConfiger.loading = true;
+  let url = activeIndex.value == 0 ? '/mosty-gsxt/tbGsxtZdry/selectPage':'';
+  let data = { pageSize:10,pageNum:page.value };
+  qcckGet(data, url).then((res) => {
+    pageData.tableData = res.records || [];
+    total.value = res.total;
+    pageData.tableConfiger.loading = false;
+  }).catch(() => {
+    pageData.tableConfiger.loading = false;
+  });
   console.log('触底加载==========');
 };
 
+// 获取数据
+const getData = () =>{
+
+}
+
 const tabHeightFn = () => {
   pageData.tableHeight =  document.getElementById('qcbk').offsetHeight - 12;
-    window.onresize = function () {
+  window.onresize = function () {
-      tabHeightFn();
+    tabHeightFn();
-    };
+  };
 };
 
 </script>

src/views/home/model/qbfkCount.vue

@@ -12,12 +12,7 @@
 import pieEcharts from "@/views/home/echarts/pieEcharts.vue";
 import { qcckPost } from "@/api/qcckApi.js";
 import { ref, onMounted } from 'vue';
-const countData = ref([
+const countData = ref([])
-  { label:'实反馈',value:0,color:['#FF6B9A','#FF4B7A']},
-  { label:'超时反馈',value:0,color:['#FFAA33','#FF8A00']},
-  { label:'处置下发',value:0,color:['#FFE699','#FFD666']},
-  { label:'未反馈',value:0,color:['#66B5FF','#3AA1FF']},
-])
 
 onMounted(() => {
   getCount();
@@ -26,8 +21,11 @@ onMounted(() => {
 const getCount = () =>{
   // 获取处置状态统计 
   qcckPost({cjLx:0}, '/mosty-gsxt/qbcj/getXscjTjByCzzt').then(res => {
-    console.log(res,'=====');
+    let color = [['#FF6B9A','#FF4B7A'],['#FFAA33','#FF8A00'],['#FFE699','#FFD666'],['#66B5FF','#3AA1FF']]
-    
+    let arr = res || [];
+    countData.value = arr.map((item,idx)=>{
+      return { label:item.zdmc, value:item.count,color:color[idx] }
+    })
   });
 }