task#14196，kpi明细表格调整

src/views/kpi/kpiIndex.vue

@@ -79,12 +79,12 @@
       </div>
       <div v-if="isMobile" style="padding: 30px"></div>
     </div>
-    <div class="contentWrap active2" v-if="active===1">
+    <div class="contentWrap monthTotal" v-if="active===1">
       <div class="tabWrap">
         <div v-for="(item,index) in list" :class="activeIndex===index ? 'active' : ''" :key="index" @click="changeTab(index)">{{item.name}}</div>
       </div>
       <div>
-        <div class="chartWrap" id="chartWrap" style="width: 100%;height:300px" ></div>
+        <div v-if="active===1" class="chartWrap" id="chartWrap" style="width: 100%;height:300px" ></div>
         <div class="comTab">
           <noFit-table :table-data="detailList" :label-list="labelList"></noFit-table>
         </div>
@@ -154,7 +154,6 @@
 <script>
 import * as echarts from 'echarts';
 import dayjs from "dayjs";
-// ,getDriverStatisticsKpi
 import {getKpiDetailsData,getStatisticsKpiByMonth,getStatisticsKpi,getDriverStatisticsKpi} from "@/api/kpi.js"
 import {myMixins} from "@/utils/myMixins"
 import CircleChar from "@/views/kpi/components/circleChar.vue";
@@ -166,14 +165,14 @@ export default {
   mixins: [myMixins],
   data() {
     return {
-      active: 0,
+      active: 1,
       activeIndex: 0,
       tabArr: [
         {name: '总览'}, {name: '月/总'}, {name: '日/总'}, {name: '月/师傅'}, {name: '日/师傅'}, {name: '拒单明细'},
         {name: '超时明细'}, {name: '投诉明细'}, {name: '不使用APP案件明细'}, {name: '车辆在线情况'}
       ],
       list: [{name: '接单指标'}, {name: '客户评价'}, {name: 'APP使用'}, {name: ' 时效 '}],
-      driverList: [{name: '师傅接单情况'}, {name: '师傅服务评价'}, {name: '师傅APP使用情况'}, {name: '师傅时效 '}],
+      driverList: [{name: '接单情况'}, {name: '服务评价'}, {name: 'APP使用情况'}, {name: '时效 '}],
       startTime:'',
       endTime:'',
       indexData:{},
@@ -204,8 +203,8 @@ export default {
   created() {
     this.checkMobile();
     // 获取当前 URL
-    const urlParams = new URLSearchParams(window.location.search);
+  /*  const urlParams = new URLSearchParams(window.location.search);
-    this.isZd=urlParams?.get('isZd') || ''
+    this.isZd=urlParams?.get('isZd') || ''*/
   },
   async activated() {
   },
@@ -471,12 +470,13 @@ export default {
             startTime: this.startTime + ' 00:00:00',
             endTime: this.endTime + ' 23:59:59',
             statisticsType: this.active===3 ? 1 : 2,
-            supplierId:1128,
+            driverId:68517,
           })
+          console.log("res===",res)
           if(this.active===3){//师傅月数据
             this.detailList = res.data
             this.loading=false;
-            if (this.activeIndex === 0) {//
+            if (this.activeIndex === 0) {
               this.labelList = [
                 {label: '师傅姓名', prop: 'driverName'},
                 {label: '承接案件量', prop: 'receiveOrderCount'},
@@ -491,7 +491,7 @@ export default {
                 {label: '承接案件量', prop: 'receiveOrderCount'},
                 {label: '投诉量', prop: 'complainOrderCount'},
                 {label: '投诉率', prop: 'complainOrderRate'},
-                {label: '客户满意度', prop: 'customerEvaluateRate'},
+                {label: '客户满意度', prop: 'customerSatisfaction'},
                 {label: '客户评价率', prop: 'customerEvaluateRate'},
                 {label: '催促率', prop: 'urgeRate'},
               ]
@@ -505,7 +505,7 @@ export default {
                 {label: '中华聚合成功率', prop: 'zhonghuaPolymerizationSuccessRate'},
                 {label: '中道聚合成功率', prop: 'zdPolymerizationSuccessRate'},
                 {label: '总聚合成功率', prop: 'polymerizationSuccessRate'},
-                {label: '日均在线时长', prop: 'polymerizationSuccessRate'},
+                {label: '日均在线时长', prop: 'onlineDuration'},
               ]
             }else if(this.activeIndex === 3){
               this.labelList = [
@@ -537,7 +537,7 @@ export default {
                 {label: '日', prop: 'date'},
                 {label: '投诉量', prop: 'complainOrderCount'},
                 {label: '投诉率', prop: 'complainOrderRate'},
-                {label: '客户满意度', prop: ''},
+                {label: '客户满意度', prop: 'customerSatisfaction'},
                 {label: '客户评价率', prop: 'customerEvaluateRate'},
                 {label: '催促率', prop: 'urgeRate'},
               ]
@@ -550,7 +550,7 @@ export default {
                 {label: '中华聚合成功率', prop: 'zhonghuaPolymerizationSuccessRate'},
                 {label: '中道聚合成功率', prop: 'zdPolymerizationSuccessRate'},
                 {label: '总聚合成功率', prop: 'polymerizationSuccessRate'},
-                {label: '日均在线时长', prop: 'polymerizationSuccessRate'},
+                {label: '日均在线时长', prop: 'onlineDuration'},
               ]
             }else if(this.activeIndex === 3){
               this.labelList = [
@@ -574,7 +574,10 @@ export default {
             pageNum: 1,
             pageSize: 1000
           });
-          this.detailList = result.data
+          this.detailList = result.data?.map(item => {
+            let formatVal = dayjs(item.createTime).format('DD');
+            return {...item,date: formatVal };
+          });
           this.loading=false
           if (this.active === 5) {//拒单明细
             this.labelList = [
@@ -615,7 +618,7 @@ export default {
             ]
           } else if (this.active === 9) {//车辆在线情况
             this.labelList = [
-              {label: '日期', prop: 'vehicleCount'},
+              {label: '日期', prop: 'date'},
               {label: '在线车辆数量', prop: 'vehicleCount'},
             ]
           }
@@ -653,18 +656,6 @@ export default {
 </script>
 <style scoped lang="scss">
 @import "@/styles/mixin.scss";
-table {
-  width: 100%;
-  border-collapse: collapse;
-}
-th, td {
-  border: 1px solid #ddd;
-  padding: 8px 10px;
-  text-align: center;
-}
-th{
-  background-color: #f2f2f2;
-}
 @import "@/styles/common.scss";
 @import "@/styles/mixin.scss";
 .wrap{
@@ -813,19 +804,6 @@ th{
 .webcontentWrap{
   @include wh(100%,calc(100% - 86px));
 }
-.active2{
-  background: #FFFFFF;
-  td:first-child {
-    padding: 0px !important;
-  }
-  tr:nth-child(odd) td:first-child{
-    font-weight: bold;
-  }
-  tr:nth-child(even) td:first-child {
-    background-color: #f2f2f2; /* 偶数行第一个单元格为白色 */
-    font-weight: bold;
-  }
-}
 .tabWrap{
   @include wh(100%,22px);
   @include flexColAround;
@@ -885,5 +863,14 @@ th{
 }
 .comTab{
   width: 100%;
+  height: 100%;
+
+}
+::v-deep .el-table{
+  font-size:11px;
+  height: 100%;
+}
+::v-deep .el-table--scrollable-x .el-table__body-wrapper{
+  height: 100% !important;
 }
 </style>