apps/supplier-dispatch-h5
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

story#7149,服务商KPI模块界面调整

Browse Source
This commit is contained in:
zhouxueli
2025-09-05 11:14:12 +08:00
parent 06191163a2
commit 6bc55d7b89
1 changed files with 116 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

246
src/views/kpi/kpiIndex.vue
View File

@ -200,8 +200,8 @@
<noFit-table v-else :active='active' :is-mobile='isMobile' :table-data="detailList" :label-list="labelList"></noFit-table>
</div>
</div>
<div v-loading="loadingData" class="contentWrap monthTotal" v-if="[2,4,5].includes(active)">
<div class="searchDriverName" v-if="[5,4].includes(active)">
<div v-loading="loadingData" class="contentWrap monthTotal" v-if="[2,3,4].includes(active)">
<div class="searchDriverName" v-if="[3,4].includes(active)">
<el-select
v-model="driverName"
filterable
@ -223,12 +223,12 @@
</el-select>
</div>
<div :class="{'tabWrap':true,'webTabWrap':!isMobile,'mobileTab':isMobile}">
<div v-for="(item,index) in (active===4 ? driverList : list)" :class="activeIndex===index ? 'active' : ''"
<div v-for="(item,index) in (active===3 ? driverList : list)" :class="activeIndex===index ? 'active' : ''"
:key="index"
@click="changeTab(index)">{{ item.name }}
</div>
</div>
<div :class="{'comTab':active !== 4,'comTabActive3':active === 4}">
<div :class="{'comTab':active !== 3,'comTabActive3':active === 3}">
<noFit-table :active='active' :is-mobile='isMobile' :table-data="detailList" :label-list="labelList"></noFit-table>
</div>
<el-pagination
@ -243,7 +243,7 @@
:total="total">
</el-pagination>
</div>
<div v-loading="loadingData" class="contentWrap monthTotal" v-if="[3,6,7,8,9,10, 11].includes(active)">
<div v-loading="loadingData" class="contentWrap monthTotal" v-if="[5,6,7,8,9,10, 11].includes(active)">
<div :class="{'comTab':true,'detailTable':isMobile}">
<noFit-table :active='active' :is-mobile='isMobile' :table-data="detailList" :label-list="labelList"
></noFit-table>
@ -272,8 +272,9 @@ import {
getStatisticsKpi,
getSupplierId,
getDriverName,getDriverStatisticsKpi,
getRecentSupplierKpi, querySupplierDriverStatisticsScore
getRecentSupplierKpi,
} from "@/api/kpi.js"
// querySupplierDriverStatisticsScore
import {myMixins} from "@/utils/myMixins"
import CircleChar from "@/views/kpi/components/circleChar.vue";
import NoFitTable from "@/views/kpi/components/noFit-table.vue";
@ -289,11 +290,13 @@ export default {
activeIndex: 0,
//
tabArr: [
{name: '总览'}, {name: '月/总'}, {name: '日/总'},{name: '师傅满意度'},{name: '月/师傅'}, {name: '日/师傅'}, {name: '拒单明细'},
{name: '超时明细'}, {name: '投诉明细'}, {name: '不使用APP案件明细'}, {name: '车辆在线情况'} , {name: '聚合失败案件明细'}
{name: '总览',value:0}, {name: '月/总'}, {name: '日/总'},{name: '月/师傅'}, {name: '日/师傅'}, {name: '拒单明细'},
{name: '超时明细'}, {name: '催促明细'},{name: '投诉明细'}, {name: '不使用APP案件明细'}, {name: '车辆在线情况'} , {name: '聚合失败案件明细'}
],
list: [{name: '接单指标'}, {name: '客户评价'}, {name: 'APP使用'}, {name: ' 时效 '}],
driverList: [{name: '得分总览'},{name: '接单情况'}, {name: '服务评价'}, {name: 'APP使用情况'}, {name: '时效 '}],
// driverList: [{name: '得分总览'},{name: '接单情况'}, {name: '服务评价'}, {name: 'APP使用情况'}, {name: '时效 '}],
driverList: [{name: '接单情况'}, {name: '服务评价'}, {name: 'APP使用情况'}, {name: '时效 '}],//story#7149,要求暂时隐藏得分总览
startMonthTime: '',
startTime: '',
endTime: '',
@ -316,7 +319,6 @@ export default {
isMobile: false,
isZd: '',
current:'2024-10',
// current: dayjs(new Date()).format('M'),
supplierName:'',
value: '1',
options: [
@ -370,21 +372,13 @@ export default {
}
},
monthChangeHandle(value){
console.log('valuevaluevalue', dayjs(new Date(value)).format('YYYY-MM-DD'))
if (value) {
this.current = dayjs(new Date(value)).format('YYYY-MM')
const _tempDate = dayjs(new Date(value)).format('YYYY-MM-DD')
const lastDay = dayjs(_tempDate).endOf('month');
/*const year = value.getFullYear();
const month = value.getMonth() + 1; // 月份从 0 开始，需要加 1
const yearAndMonth = year + '-' + (month > 9 ? month : '0' + month);
this.current = dayjs(new Date(yearAndMonth)).format('YYYY-MM')*/
this.startTime = `${this.current}-01 00:00:00`;
// const lastDay = new Date(year, month, 0).getDate(); // 获取该月的最后一天
this.endTime = `${this.current}-${this.padZero(lastDay.date())} 23:59:59`;
this.startMonthTime=this.getStartTimeFromEndTime(this.endTime)
console.log(" this.startMonthTime", this.startMonthTime)
this.selectSupplierNameHandle();
if(this.active===1){
this.tabClickHandle()
@ -985,7 +979,7 @@ export default {
async getKpiData() {
try {
this.loading = true
if (this.active === 0) {
if (this.active === 0) {//总览
await this.allDataChart()
let res = await getStatisticsKpiByMonth({
startTime: this.startTime,
@ -1014,7 +1008,7 @@ export default {
this.indexData[key] = this.processPercentage(this.indexData[key]);
}
}
} else if ([1, 2].includes(this.active)) {
} else if ([1, 2].includes(this.active)) {//月总 日总
let res = await getStatisticsKpi({
startTime: this.active === 1 ? this.startMonthTime : this.startTime,
endTime: this.endTime,
@ -1045,8 +1039,6 @@ export default {
item.minorFortyMinutesArrivalRate=this.formatPercentage(item.minorFortyMinutesArrivalRate) ;
let formatVal = dayjs(item.statisticsDate).format('DD');
let formatVal1 = dayjs(item.statisticsDate).format('M');
// console.log("formatVal1",formatVal1)
// return {...item, date: formatVal, month: (formatVal1 == this.current) ? '本月' : (formatVal1 + '月')};
return {...item, date: formatVal, month: formatVal1 + '月'};
});
this.loading = false
@ -1054,33 +1046,8 @@ export default {
this.xAxisArr.push(item.month)
this.xAxisArr = [...new Set(this.xAxisArr)]; // 去重
})
console.log(" this.xAxisArr", this.xAxisArr)
// this.xAxisArr[this.xAxisArr.length - 1] = '本月'
await this.twoTabHanldeData()
}else if (this.active === 3) {
let res = await querySupplierDriverStatisticsScore({
startTime: this.startTime ,
endTime: this.endTime,
statisticsType: 1,
supplierId: this.supplierId,
driverId: this.driverId,
driverName:this.driverName,
pageNum: this.pageNum,
pageSize: this.pageSize
})
this.total = res.total
this.detailList = res.data?.map(item => {
let formatVal = dayjs(item.statisticsDate).format('DD');
return {...item, date: formatVal};
});
this.labelList = [
{label: '师傅姓名', prop: 'driverName'},
{label: '案件总量', prop: 'orderCount'},
{label: '满意度得分 ', prop: 'driverSatisfaction'},
]
this.loading = false;
}
else if ([4,5].includes(this.active)) {
} else if ([3,4].includes(this.active)) {//月师傅 日师傅
let res = await getDriverStatisticsKpi({
startTime: this.startTime ,
endTime: this.endTime,
@ -1111,13 +1078,32 @@ export default {
return {...item, date: formatVal};
});
this.loading = false;
if(this.active===5 && !this.driverName){
/* if(this.active===5 && !this.driverName){
this.detailList=[]
this.total=0
}
}*/
await this.twoTabHanldeData();
}
else if ([ 6, 7, 8,9,10, 11].includes(this.active)) {
/* else if (this.active ===7) {
let res = await querySupplierDriverStatisticsScore({
startTime: this.startTime ,
endTime: this.endTime,
statisticsType: 1,
supplierId: this.supplierId,
driverId: this.driverId,
driverName:this.driverName,
pageNum: this.pageNum,
pageSize: this.pageSize
})
this.total = res.total
this.detailList = res.data?.map(item => {
let formatVal = dayjs(item.statisticsDate).format('DD');
return {...item, date: formatVal};
});
this.loading = false;
} */
else if ([ 5,6,7, 8,9,10,11].includes(this.active)) {
this.detailList = []
this.labelList = []
let result = await getKpiDetailsData({
@ -1134,7 +1120,7 @@ export default {
return {...item, date: formatVal};
});
this.loading = false
if (this.active === 6) {//拒单明细
if (this.active === 5) {//拒单明细
this.labelList = [
{label: '案件编号', prop: 'orderCode'},
{label: '服务内容', prop: 'serviceName'},
@ -1144,7 +1130,7 @@ export default {
{label: '拒绝时间', prop: 'time'},
{label: '拒单原因', prop: 'reason'},
]
} else if (this.active === 7) {//超时明细
} else if (this.active === 6) {//超时明细
this.labelList = [
{label: '案件编号', prop: 'orderCode'},
{label: '服务内容', prop: 'serviceName'},
@ -1154,6 +1140,23 @@ export default {
{label: '超时时间', prop: 'time'},
{label: '超时原因', prop: 'reason'},
]
} else if (this.active === 7) {//催促明细
this.labelList = [
{label: '案件编号', prop: 'orderCode'},
{label: '二级合同名称', prop: 'contractName'},
{label: '案件创建时间', prop: 'orderCreateTime'},
{label: '催促创建时间 ', prop: 'urgeTime'},
{label: '服务商接单时间 ', prop: 'taskAcceptTime'},
{label: '备注内容(催促内容) ', prop: 'urgeRemark'},
// {label: '催促次数 ', prop: ''},无催促次数，催促一次生成一条新的
{label: '服务商名称 ', prop: 'supplierName'},
{label: '服务车辆 ', prop: 'vehicleName'},
{label: '服务完成状况 ', prop: 'orderStatusString'},
{label: '案件完成时间 ', prop: 'finishTime'},
{label: '省(B)', prop: 'bProvince'},
{label: '市(B)', prop: 'bCity'},
{label: '区(B)', prop: 'area'},
]
} else if (this.active === 8) {//投诉明细
this.labelList = [
{label: '案件编号', prop: 'orderCode'},
@ -1174,15 +1177,14 @@ export default {
]
} else if (this.active === 10) {//车辆在线情况
this.labelList = [
{label: '日期', prop: 'date'},
{label: '0点在线车辆数量', prop: 'zeroClockVehicleCount'},
{label: '8点在线车辆数量', prop: 'eightClockVehicleCount'},
{label: '12点在线车辆数量', prop: 'twelveClockVehicleCount'},
{label: '16点在线车辆数量', prop: 'sixteenClockVehicleCount'},
{label: '20点在线车辆数量', prop: 'twentyClockVehicleCount'},
{label: '22点在线车辆数量', prop: 'twentyTwoClockVehicleCount'},
// {label: '总车辆数', prop: 'totalCount'},
{label: '在线车辆数(取每日的12点)', prop: 'twelveClockVehicleCount'},
{label: '在线拖车数(12点)', prop: 'trailCount'},
{label: '在线小修车数(12点)', prop: 'minorCount'},
{label: '在线率(在线车辆数/总车辆数)', prop: 'onlineRate'},
// {label: '车辆平均在线时长', prop: ''},
]
} else if (this.active === 11) {//车辆在线情况
} else if (this.active === 11) {//聚合失败案件明细
this.labelList = [
{label: '案件编号', prop: 'orderCode'},
{label: '服务内容', prop: 'serviceName'},
@ -1206,22 +1208,6 @@ export default {
},
// 初始化获取当月日期
initDate() {
/*let year=''
let month=''
if( this.current ) {
year = new Date(this.current).getFullYear();
month = new Date(this.current).getMonth() + 1;
} else {
year = new Date().getFullYear();
month = new Date().getMonth() + 1;
}
let yearAndMonth = year + '-' + (month > 9 ? month : '0' + month);
this.current = dayjs(new Date(yearAndMonth)).format('YYYY-MM')
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'*/
// test
// let _testDate = new Date('2024-11-01 00:00:01')
const today = dayjs(); // 获取当前日期
const currentDay = today.date(); // 获取今天是几号（1-31）
let targetMonth = today; // 默认目标月份是当前月
@ -1238,7 +1224,6 @@ export default {
}
this.endTime = endTime.format('YYYY-MM-DD HH:mm:ss');
this.startMonthTime=this.getStartTimeFromEndTime(this.endTime)
console.log(" this.startMonthTime", this.startMonthTime,this.startTime)
},
// 获取当月天数
getDayLen() {
@ -1293,7 +1278,7 @@ export default {
twoTabHanldeData() {
this.etlDetailList=[]
this.etlLabelList=[]
if (this.active === 1) {
if (this.active === 1) {//月总
const columnObj = {} //创建标题数组中第一个对象
columnObj.label = 'KPI' //第一个标题名称
columnObj.prop = 'month' //第一个标题名称对应的字段
@ -1336,7 +1321,6 @@ export default {
]
} else if (this.activeIndex === 1) {
this.etlDetailList=[{ 'month': '投诉量' },{ 'month': '投诉率(%)' },{ 'month': '平安好评量' }, { 'month': '平安好评率' }]
console.log('detailList', this.detailList)
let props = 'prop' //自定义字段名称
this.detailList?.map((item,index) => {
this.v1.push(item.complainOrderCount)
@ -1445,7 +1429,7 @@ export default {
{label: '平安聚合成功到达时效', prop: 'pinganJuheSuccessArriving'},
]
}
} else if (this.active === 2) {
} else if (this.active === 2) {//日总
if (this.activeIndex === 0) {//接单指标
this.labelList = [
{label: '日', prop: 'date'},
@ -1489,12 +1473,8 @@ export default {
{label: '平安聚合成功到达时效(分)', prop: 'pinganJuheSuccessArriving'},
]
}
}
/* else if(this.active === 3){
} */
else if (this.active === 4) {
if (this.activeIndex === 0) {
} else if (this.active === 3) {//月师傅
/* if (this.activeIndex === 0) {
this.labelList = [
{label: '师傅姓名', prop: 'driverName'},
{label: '总分', prop: 'score'},
@ -1522,60 +1502,65 @@ export default {
{label: '新手入列得分', prop: 'listedScore'},
{label: '星级评分', prop: 'starRank'},
]
}if (this.activeIndex === 1) {
}else*/
if (this.activeIndex === 0) {
this.labelList = [
{label: '师傅姓名', prop: 'driverName'},
{label: '承接案件量', prop: 'receiveOrderCount'},
{label: '派单量', prop: 'dispatchOrderCount'},
{label: '接单量', prop: 'receiveOrderCount'},
{label: '拒单量', prop: 'refuseOrderCount'},
{label: '拒单率(%)', prop: 'refuseOrderRate'},
{label: '超时接单量', prop: 'timeoutOrderCount'},
{label: '超时量', prop: 'timeoutOrderCount'},
{label: '超时率(%)', prop: 'timeoutOrderRate'},
]
} else if (this.activeIndex === 1) {
this.labelList = [
{label: '师傅姓名', prop: 'driverName'},
// {label: '承接案件量', prop: 'receiveOrderCount'},
{label: '投诉量', prop: 'complainOrderCount'},
{label: '投诉率(%)', prop: 'complainOrderRate'},
{label: '平安评价量', prop: 'pinganEvaluateCount'},
{label: '平安评价率(%)', prop: 'pinganEvaluateRate'},
{label: '平安好评量', prop: 'pinganFavorableCount'},
{label: '平安好评率(%)', prop: 'pinganFavorableRate'},
// {label: '催促率(%)', prop: 'urgeRate'},
]
} else if (this.activeIndex === 2) {
this.labelList = [
{label: '师傅姓名', prop: 'driverName'},
{label: '承接案件量', prop: 'receiveOrderCount'},
{label: '投诉量', prop: 'complainOrderCount'},
{label: '投诉率(%)', prop: 'complainOrderRate'},
{label: '客户满意度(%)', prop: 'customerSatisfaction'},
{label: '客户评价率(%)', prop: 'customerEvaluateRate'},
{label: '催促率(%)', prop: 'urgeRate'},
{label: 'App使用量', prop: 'appUseCount'},
{label: 'App使用率(%)', prop: 'appRate'},
// {label: '3′联系客户率(%)', prop: 'threeMinutesContactRate'},
{label: '平安聚合成功量', prop: 'pinganPolymerizationSuccessCount'},
{label: '平安聚合成功率(%)', prop: 'pinganPolymerizationSuccessRate'},
{label: '中华联合聚合成功量', prop: 'zhonghuaPolymerizationSuccessCount'},
{label: '中华联合聚合成功率(%)', prop: 'zhonghuaPolymerizationSuccessRate'},
// {label: '中道聚合成功率(%)', prop: 'zdPolymerizationSuccessRate'},
{label: '整体聚合成功量', prop: 'wholeJuheSuccessCount'},
{label: '整体聚合成功率(%)', prop: 'wholeJuheSuccessRate'},
// {label: '日均在线时长(h)', prop: 'onlineDuration'},
]
} else if (this.activeIndex === 3) {
this.labelList = [
{label: '师傅姓名', prop: 'driverName'},
{label: '承接案件量', prop: 'receiveOrderCount'},
{label: 'App使用率(%)', prop: 'appRate'},
{label: '3′联系客户率(%)', prop: 'threeMinutesContactRate'},
{label: '平安聚合成功率(%)', prop: 'pinganPolymerizationSuccessRate'},
{label: '中华聚合成功率(%)', prop: 'zhonghuaPolymerizationSuccessRate'},
{label: '中道聚合成功率(%)', prop: 'zdPolymerizationSuccessRate'},
{label: '总聚合成功率(%)', prop: 'polymerizationSuccessRate'},
{label: '日均在线时长(h)', prop: 'onlineDuration'},
]
} else if (this.activeIndex === 4) {
this.labelList = [
{label: '师傅姓名', prop: 'driverName'},
{label: '接单时效(分)', prop: 'receiving'},
{label: '3′接单率(%)', prop: 'threeMinutesReceivingRate'},
{label: '3′联系客户率(%)', prop: 'threeMinutesReceivingRate'},
{label: '到达时效(分)', prop: 'arriving'},
{label: '40′到达率(%)', prop: 'fortyMinutesArrivalRate'},
{label: '聚合成功到达时效(分)', prop: 'polymerizationSuccessArriving'},
// {label: '40′到达率(%)', prop: 'fortyMinutesArrivalRate'},
{label: '平安聚合成功到达时效(分)', prop: 'pinganJuheSuccessArriving'},
]
}
} else if (this.active === 5) {
} else if (this.active === 4) {//日师傅
if (this.activeIndex === 0) {//接单指标
this.labelList = [
{label: '日', prop: 'date'},
{label: '师傅姓名', prop: 'driverName'},
{label: '派遣案件量', prop: 'dispatchOrderCount'},
{label: '承接案件量', prop: 'receiveOrderCount'},
{label: '完成量', prop: 'finishOrderCount'},
{label: '派单量', prop: 'dispatchOrderCount'},
{label: '接单量', prop: 'receiveOrderCount'},
{label: '拒单量', prop: 'refuseOrderCount'},
{label: '拒单率(%)', prop: 'refuseOrderRate'},
{label: '超时接单量', prop: 'timeoutOrderCount'},
{label: '超时量', prop: 'timeoutOrderCount'},
{label: '超时率(%)', prop: 'timeoutOrderRate'},
{label: '客户取消率(%)', prop: 'cancelRate'},
]
} else if (this.activeIndex === 1) {
this.labelList = [
@ -1583,31 +1568,32 @@ export default {
{label: '师傅姓名', prop: 'driverName'},
{label: '投诉量', prop: 'complainOrderCount'},
{label: '投诉率(%)', prop: 'complainOrderRate'},
{label: '客户满意度(%)', prop: 'customerSatisfaction'},
{label: '客户评价率(%)', prop: 'customerEvaluateRate'},
{label: '催促率(%)', prop: 'urgeRate'},
{label: '平安评价量', prop: 'pinganEvaluateCount'},
{label: '平安评价率(%)', prop: 'pinganEvaluateRate'},
{label: '平安好评量', prop: 'pinganFavorableCount'},
{label: '平安好评率(%)', prop: 'pinganFavorableRate'},
]
} else if (this.activeIndex === 2) {
this.labelList = [
{label: '日', prop: 'date'},
{label: '师傅姓名', prop: 'driverName'},
{label: '使用率(%)', prop: 'appRate'},
{label: '3′联系客户率(%)', prop: 'threeMinutesContactRate'},
{label: 'App使用量', prop: 'appUseCount'},
{label: 'App使用率(%)', prop: 'appRate'},
{label: '平安聚合成功量', prop: 'pinganPolymerizationSuccessCount'},
{label: '平安聚合成功率(%)', prop: 'pinganPolymerizationSuccessRate'},
{label: '中华聚合成功率(%)', prop: 'zhonghuaPolymerizationSuccessRate'},
{label: '中道聚合成功率(%)', prop: 'zdPolymerizationSuccessRate'},
{label: '总聚合成功率(%)', prop: 'polymerizationSuccessRate'},
{label: '日均在线时长(h)', prop: 'onlineDuration'},
{label: '中华联合聚合成功量', prop: 'zhonghuaPolymerizationSuccessCount'},
{label: '中华联合聚合成功率(%)', prop: 'zhonghuaPolymerizationSuccessRate'},
{label: '整体聚合成功量', prop: 'wholeJuheSuccessCount'},
{label: '整体聚合成功率(%)', prop: 'wholeJuheSuccessRate'},
]
} else if (this.activeIndex === 3) {
this.labelList = [
{label: '日', prop: 'date'},
{label: '师傅姓名', prop: 'driverName'},
{label: '接单时效(分)', prop: 'receiving'},
{label: '3′接单率(%)', prop: 'threeMinutesReceivingRate'},
{label: '3′联系客户率(%)', prop: 'threeMinutesReceivingRate'},
{label: '到达时效(分)', prop: 'arriving'},
{label: '40′到达率(%)', prop: 'fortyMinutesArrivalRate'},
{label: '聚合成功到达时效(分)', prop: 'polymerizationSuccessArriving'},
{label: '平安聚合成功到达时效(分)', prop: 'pinganJuheSuccessArriving'},
]
}
}
@ -1622,7 +1608,7 @@ export default {
case 6:
return 1;
case 7:
return 2;
return 7;
case 8:
return 3;
case 9: