task#15950,服务商kpi,服务商管理添加kpi,可查看

src/api/kpi.js

@@ -36,6 +36,24 @@ export function getKpiDetailsData(data){
     data
   })
 }
+// 获取近12个月的服务商数据
+export function queryRecentSupplierStatisticsKpi(data){
+  return request({
+    url: '/supplier/supplierKPI/queryRecentSupplierStatisticsKpi',
+    method:'POST',
+    // contentType: 'application/json',
+    data
+  })
+}
+// 司机分数详情
+export function driverScoreDetail(data){
+  return request({
+    url: '/supplier/supplierKPI/querySupplierDriverStatisticsScore',
+    method:'POST',
+    // contentType: 'application/json',
+    data
+  })
+}
 // 关键词搜索服务商名称
 export function getSupplierId(key) {
   return request({

src/views/kpi/kpiIndex.vue

@@ -27,7 +27,6 @@
               :value="item.id">
           </el-option>
         </el-select>
-<!--        <i class="el-icon-search" @click="searchHandle"></i>-->
       </div>
     </div>
     <van-tabs v-model="active" sticky @click="onClick">
@@ -141,6 +140,17 @@
         </div>
       </div>
       <div>
+        <div :class="{'reciceOrder':true,'webCom':!isMobile,'appUse':isMobile}">、
+          <div class="reciceOrderIWrap" v-if="indexData">
+            <circle-char  ref="Doughnut4" :data="indexData && indexData.appRate" :title-text="'使用率'" :bg-color="'#3AA1FF'"
+                          :is-store="false"
+                          @clickUse="clickJumpHandle(8)"></circle-char>
+            <circle-char  ref="Doughnut5" :data="indexData && indexData.threeMinutesContactRate" :title-text="'3′联系客户率'"
+                          :bg-color="'#5D7FD7'"></circle-char>
+            <circle-char  ref="Doughnut6" :data="indexData && indexData.polymerizationSuccessRate" :title-text="'总聚合成功率'"
+                          :bg-color="'#4ECB73'"></circle-char>
+          </div>
+        </div>
 
       </div>
       <div v-if="isMobile" style="padding: 20px"></div>
@@ -335,20 +345,16 @@ export default {
       showScoreChart:true
     }
   },
-  async mounted() {
-    await this.checkMobile();
-    await this.initDate();
-    await this.getData();
-  },
   created() {
     this.checkMobile();
     const urlParams = new URLSearchParams(window.location.search);
     this.isZd = urlParams?.get('isZd') || ''
-   /* if(!this.isMobile && this.isZd && this.isZd==1){
+    this.supplierId = urlParams?.get('supplierId') || ''
-      this.supplierId='1127'
-    }*/
   },
-  async activated() {
+  async mounted() {
+    await this.checkMobile();
+    await this.initDate();
+    await this.getData();
   },
   methods: {
     async selectSupplierNameHanldle(){
@@ -394,9 +400,6 @@ export default {
         this.driverselectOption = [];
       }
     },
-    async searchHandle() {//web端服务商搜索操作
-      console.log("搜索按钮")
-    },
     async changeHandle() {
       this.v1=[]
       this.v2=[]
@@ -855,6 +858,9 @@ export default {
             statisticsType: 1,
             supplierId: this.supplierId,
           });
+          if(!res.data){
+            return
+          }
           this.indexData = res.data;
           this.supplierName=res.data?.supplierName
           this.indexData.refuseOrderRate=this.indexData.refuseOrderRate*100
@@ -1010,7 +1016,6 @@ export default {
               {label: '投诉类型', prop: 'complainTypeString'},
             ]
           } else if (this.active === 8) {//不使用App案件明细
-            // console.log("不使用App案件明细")
             this.labelList = [
               {label: '案件编号', prop: 'orderCode'},
               {label: '服务内容', prop: 'serviceName'},
@@ -1052,7 +1057,6 @@ export default {
       this.startTime = dayjs(new Date()).format('YYYY-MM') + '-01 00:00:00'
       this.endTime = dayjs(new Date()).format('YYYY-MM') + '-' + this.getDayLen()+' 23:59:59'
       this.startMonthTime=this.getStartTimeFromEndTime(this.endTime)
-      console.log(this.startTime,this.endTime,this.startMonthTime)
     },
     // 获取当月天数
     getDayLen() {
@@ -1200,13 +1204,11 @@ export default {
                 this.v2.push(item.threeMinutesReceivingRate.replace('%', ''))
               })
             } else {
-              console.log(" this.detailList师傅接单时效", this.detailList)
               this.detailList?.map(item => {
                 this.v1.push(item.arriving)
                 this.v2.push(item.polymerizationSuccessArriving)
                 this.v3.push(item.fortyMinutesArrivalRate.replace('%', ''))
               })
-              console.log("this.v1",this.v1,this.v2,this.v3)
             }
             this.detailList?.map((item,index) => {
               const columnObj = {}