Compare commits
8 Commits
prod-24-11
...
prod-24-12
Author | SHA1 | Date | |
---|---|---|---|
ce53b4f124 | |||
745c21341a | |||
2ab75039b9 | |||
304a1457dc | |||
422d1ce2ec | |||
147e10b342 | |||
055876c0a2 | |||
ca52f0793f |
@ -23,7 +23,8 @@
|
||||
"vue-router": "^3.0.7",
|
||||
"vuex": "^3.6.2",
|
||||
"element-ui": "^2.15.9",
|
||||
"dayjs": "^1.8.14"
|
||||
"dayjs": "^1.8.14",
|
||||
"decimal.js": "^10.4.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.12.16",
|
||||
|
@ -15,7 +15,7 @@ let token = urlParams.get('token') ;
|
||||
localStorage.setItem('token', token);
|
||||
service.interceptors.request.use(
|
||||
config => {
|
||||
// let reqUrl=config.url
|
||||
let reqUrl=config.url
|
||||
// console.log("reqUrl",reqUrl)
|
||||
config.data = config.contentType ? config.data : qs.stringify(config.data)
|
||||
if (config.testFlag) {
|
||||
@ -25,9 +25,12 @@ service.interceptors.request.use(
|
||||
let token = localStorage.getItem('token');
|
||||
// let token='4099761587129c46b03c9316c9e866c9'
|
||||
// let token='eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJzb25nIiwiYXVkIjpbInN1cHBsaWVyLWFwcCJdLCJuYmYiOjE3MTI0NTQ5NTMsInVzZXJfaW5mbyI6eyJ1c2VySWQiOjU0NjU0LCJwaG9uZSI6IjE3NjMwMDM1NjU4IiwibmFtZSI6InNvbmciLCJzdXBwbGllck5hbWUiOiJDLeS4iua1t-a1i-ivleacjeWKoeWVhiIsInN1cHBsaWVySWQiOjMzMDQxLCJzdXBwbGllclR5cGUiOjIsInVzZXJuYW1lIjoic29uZyIsInVzZXJUeXBlIjoicmVzY3VlQXBwIiwiZGV2aWNlSWQiOiIyMmI0OWNhMjBmOWI4MzMwZDk4NzIxNzNmMzllYTY4YmMiLCJhdXRob3JpdGllcyI6W119LCJzY29wZSI6WyJhbGwiXSwiaXNzIjoiaHR0cHM6Ly9zaW5vYXNzaXN0LmNvbSIsImV4cCI6MTcxMjU0MTM1MywiaWF0IjoxNzEyNDU0OTUzfQ.sPU9_OD_TOWcTwqmlawEGyo4mCPrEaRYw2R02gnvYJw'
|
||||
config.headers['token'] = `${token}`;
|
||||
config.headers['Authorization'] = `${token}`;
|
||||
/*if (reqUrl.includes("/driverApp")) {
|
||||
if(!(reqUrl=='/supplier/supplierTraining/trainingTask' || reqUrl=='/supplier/supplierTraining/normalList' || reqUrl=='/supplier/supplierTraining/trainingList')){
|
||||
config.headers['Authorization'] = `${token}`;
|
||||
config.headers['token'] = `${token}`;
|
||||
}
|
||||
|
||||
/* if (reqUrl.includes("/driverApp")) {
|
||||
// console.log("司机app")
|
||||
config.headers['token'] = `${token}`;
|
||||
} else if(reqUrl.includes("/supplierApp") || reqUrl.includes("/supplierKPI") || reqUrl.includes('/supplier/select') || reqUrl.includes('/order') || reqUrl.includes('/order/taskInvoiceBatch') || reqUrl.includes('/supplier') ){
|
||||
|
@ -101,6 +101,7 @@ export default {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
this.driverId = urlParams.get('driverId');
|
||||
this.time=timeFormat(Date.now())
|
||||
this.keyword=urlParams.get('keyWord') || ''
|
||||
this.getTrainingList();
|
||||
document.addEventListener('visibilitychange', async ( ) => {
|
||||
let state = document.visibilityState
|
||||
|
@ -103,6 +103,9 @@ export default {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
this.supplierId = urlParams.get('supplierId');
|
||||
this.driverId = urlParams.get('driverId');
|
||||
if(this.driverId){
|
||||
this.keyword=urlParams.get('keyWord') || ''
|
||||
}
|
||||
this.getNormalList()
|
||||
},
|
||||
methods:{
|
||||
|
@ -86,6 +86,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Decimal } from 'decimal.js';
|
||||
import {myMixins} from "@/utils/myMixins"
|
||||
import {notifyInvoiceList} from "@/api/mine"
|
||||
export default {
|
||||
@ -110,12 +111,23 @@ export default {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
totalCount () {
|
||||
/* totalCount () {
|
||||
let total = 0;
|
||||
this.checkList.map(item => {
|
||||
total += item.invoiceMoney
|
||||
})
|
||||
return total
|
||||
},*/
|
||||
totalCount() {
|
||||
// 使用 Decimal 来计算总金额
|
||||
let total = new Decimal(0);
|
||||
|
||||
this.checkList.forEach(item => {
|
||||
total = total.plus(new Decimal(item.invoiceMoney));
|
||||
});
|
||||
|
||||
// 返回总金额,保留两位小数
|
||||
return total.toNumber()
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
|
@ -2,14 +2,21 @@
|
||||
<div class="wrap">
|
||||
<div v-if="isMobile" class="headWrap">
|
||||
<div class="title">KPI.数据看板</div>
|
||||
<div class="titleName">{{ current }}月-{{supplierName}}</div>
|
||||
<div class="titleName">{{ current }}-{{supplierName}}</div>
|
||||
</div>
|
||||
<div v-else class="webHeadWrap" :style="'justify-content:'+(isZd==1 ? 'space-between':'center')">
|
||||
<div class="empty" v-if="isZd==1"></div>
|
||||
<div class="title">KPI.数据看板<span v-if="isZd==1">--中道救援</span><span v-if="isZd!=1">--{{ current }}月</span></div>
|
||||
<div class="title">KPI.数据看板<span v-if="isZd==1">--中道救援</span><span v-if="isZd!=1">--{{ current }}</span></div>
|
||||
<!-- 只有中道账号才显示搜索框 -->
|
||||
<div class="searchWrap" v-if="isZd==1">
|
||||
<span class="month">{{ current }}月</span>
|
||||
<el-date-picker
|
||||
v-model="current"
|
||||
type="month"
|
||||
:clearable="false"
|
||||
class="month custom-date-picker"
|
||||
@change="monthChangeHandle"
|
||||
placeholder="选择月">
|
||||
</el-date-picker>
|
||||
<el-select
|
||||
v-model="supplierId"
|
||||
filterable
|
||||
@ -18,7 +25,7 @@
|
||||
clearable
|
||||
placeholder="请输入后选择"
|
||||
:remote-method="remoteMethod"
|
||||
@change="selectSupplierNameHanldle"
|
||||
@change="selectSupplierNameHandle"
|
||||
:loading="selectLoading">
|
||||
<el-option
|
||||
v-for="item in selectOption"
|
||||
@ -29,7 +36,7 @@
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<van-tabs v-model="active" sticky @click="onClick">
|
||||
<van-tabs v-model="active" sticky @click="tabClickHandle">
|
||||
<van-tab v-for="(item,index) in tabArr" :key="index" :title="item.name"></van-tab>
|
||||
<div v-if="isMobile && !([0,1,2,3].includes(active))" class="tipArrow left">{{ leftArr }}</div>
|
||||
<div v-if="isMobile && !([8,9].includes(active))" class="tipArrow right">>>></div>
|
||||
@ -103,8 +110,8 @@
|
||||
<i class="el-icon-question" @click.prevent="showScoreChart = !showScoreChart"></i>
|
||||
</div>
|
||||
<div class="storeWrap" v-if="indexData">
|
||||
<circle-char v-if="showScoreChart" ref="Doughnut7" :data="indexData && indexData.score" :bg-color="'#00D273'" :is-store="true"></circle-char>
|
||||
<div v-else class="detailScore">
|
||||
<circle-char v-show="showScoreChart" ref="Doughnut7" :data="indexData && indexData.score" :bg-color="'#00D273'" :is-store="true"></circle-char>
|
||||
<div v-show="!showScoreChart" class="detailScore">
|
||||
<div class="left">
|
||||
<div>
|
||||
<span class="defen">接单得分:</span>
|
||||
@ -242,15 +249,6 @@
|
||||
<noFit-table :active='active' :is-mobile='isMobile' :table-data="detailList" :label-list="labelList"
|
||||
></noFit-table>
|
||||
</div>
|
||||
<!-- <el-pagination
|
||||
small
|
||||
:current-page.sync="pageNum"
|
||||
:page-size.sync="pageSize"
|
||||
@current-change="getKpiData"
|
||||
@size-change="getKpiData"
|
||||
layout="prev, pager, next"
|
||||
:total="total">
|
||||
</el-pagination>-->
|
||||
<el-pagination
|
||||
v-if="active !== 9"
|
||||
small
|
||||
@ -316,7 +314,8 @@ export default {
|
||||
xAxisArr: [],
|
||||
isMobile: false,
|
||||
isZd: '',
|
||||
current: dayjs(new Date()).format('M'),
|
||||
current:'',
|
||||
// current: dayjs(new Date()).format('M'),
|
||||
supplierName:'',
|
||||
value: '1',
|
||||
options: [
|
||||
@ -350,15 +349,13 @@ export default {
|
||||
async mounted() {
|
||||
await this.checkMobile();
|
||||
await this.initDate();
|
||||
await this.getData();
|
||||
// await this.allDataChart()
|
||||
await this.selectSupplierNameHandle();
|
||||
},
|
||||
methods: {
|
||||
applicateHandle() {
|
||||
if (window.parent) {
|
||||
const hasListener = window.parent.dispatchEvent(new Event('checkCloseDialog'));
|
||||
if (hasListener) {
|
||||
console.log("this.supplierId",this.supplierId)
|
||||
const data = {
|
||||
action: 'closeDialog',
|
||||
message: this.supplierId,
|
||||
@ -371,17 +368,38 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
async selectSupplierNameHanldle(){
|
||||
monthChangeHandle(value){
|
||||
if (value) {
|
||||
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 = `${year}-${this.padZero(month)}-01 00:00:00`;
|
||||
const lastDay = new Date(year, month, 0).getDate(); // 获取该月的最后一天
|
||||
this.endTime = `${year}-${this.padZero(month)}-${this.padZero(lastDay)} 23:59:59`;
|
||||
this.startMonthTime=this.getStartTimeFromEndTime(this.endTime)
|
||||
console.log(" this.startMonthTime", this.startMonthTime)
|
||||
this.selectSupplierNameHandle();
|
||||
if(this.active===1){
|
||||
this.tabClickHandle()
|
||||
}
|
||||
}
|
||||
},
|
||||
padZero(num) {
|
||||
return num < 10 ? `0${num}` : num;
|
||||
},
|
||||
async selectSupplierNameHandle(){
|
||||
await this.getData()
|
||||
setTimeout(()=>{
|
||||
this.$refs.Doughnut1.initCircle()
|
||||
this.$refs.Doughnut2.initCircle()
|
||||
this.$refs.Doughnut3.initCircle()
|
||||
this.$refs.Doughnut4.initCircle()
|
||||
this.$refs.Doughnut5.initCircle()
|
||||
this.$refs.Doughnut6.initCircle()
|
||||
this.$refs.Doughnut7.initCircle()
|
||||
},1500)
|
||||
if(this.active !== 0){
|
||||
return
|
||||
}
|
||||
this.$refs.Doughnut1.initCircle()
|
||||
this.$refs.Doughnut2.initCircle()
|
||||
this.$refs.Doughnut3.initCircle()
|
||||
this.$refs.Doughnut4.initCircle()
|
||||
this.$refs.Doughnut5.initCircle()
|
||||
this.$refs.Doughnut6.initCircle()
|
||||
this.$refs.Doughnut7.initCircle()
|
||||
},
|
||||
async remoteMethod(query) {
|
||||
if (query !== '') {
|
||||
@ -449,21 +467,21 @@ export default {
|
||||
async clickJumpHandle(type) {
|
||||
this.loading = true
|
||||
this.active = type;
|
||||
await this.onClick();
|
||||
await this.tabClickHandle();
|
||||
},
|
||||
onClick() {
|
||||
tabClickHandle() {
|
||||
this.activeIndex = 0;
|
||||
this.detailList = [];
|
||||
this.labelList = [];
|
||||
this.driverName=''
|
||||
this.getData();
|
||||
this.selectSupplierNameHandle();
|
||||
if (this.active === 1) {
|
||||
setTimeout(() => {
|
||||
this.drawLine()
|
||||
if (!this.isMobile && this.activeIndex === 3) {
|
||||
this.drawLine1()
|
||||
}
|
||||
}, 500)
|
||||
}, 1000)
|
||||
}
|
||||
},
|
||||
drawLine() { // 基于准备好的dom,初始化echarts实例
|
||||
@ -872,14 +890,15 @@ export default {
|
||||
driverId: this.driverId,
|
||||
driverName:this.driverName,
|
||||
});
|
||||
console.log("res",res)
|
||||
this.continueMonthKpi=res.data;
|
||||
let v1=[]
|
||||
let v2=[]
|
||||
// 初始化 v1 ,v2数组,长度为 12,初始值为 0
|
||||
let v1 = new Array(12).fill(0);
|
||||
let v2 = new Array(12).fill(0);
|
||||
if( this.continueMonthKpi.length>0){
|
||||
this.continueMonthKpi.forEach(item=>{
|
||||
v1.push(item.dispatchOrderCount)
|
||||
v2.push(item.orderScore)
|
||||
let month = parseInt(item.statisticsDate?.split('-')[1], 10) - 1; // 获取月份,并转换为数组索引
|
||||
v1[month] = item.dispatchOrderCount;
|
||||
v2[month] = item.orderScore;
|
||||
})
|
||||
}
|
||||
let myChart = echarts.init(document.getElementById('allDataChart'))
|
||||
@ -936,6 +955,14 @@ export default {
|
||||
};
|
||||
option && myChart.setOption(option, true);
|
||||
},
|
||||
// 通用函数,用于处理百分比数据
|
||||
processPercentage(value) {
|
||||
value *= 100;
|
||||
if (value % 1 !== 0) {
|
||||
value = value.toFixed(2);
|
||||
}
|
||||
return value;
|
||||
},
|
||||
async getKpiData() {
|
||||
try {
|
||||
this.loading = true
|
||||
@ -952,37 +979,21 @@ export default {
|
||||
}
|
||||
this.indexData = res.data;
|
||||
this.supplierName=res.data?.supplierName
|
||||
this.indexData.refuseOrderRate=this.indexData.refuseOrderRate*100
|
||||
if (this.indexData.refuseOrderRate % 1 !== 0) {
|
||||
this.indexData.refuseOrderRate = this.indexData.refuseOrderRate.toFixed(2);
|
||||
}
|
||||
this.indexData.timeoutOrderRate=this.indexData.timeoutOrderRate*100
|
||||
if (this.indexData.timeoutOrderRate % 1 !== 0) {
|
||||
this.indexData.timeoutOrderRate = this.indexData.timeoutOrderRate.toFixed(2);
|
||||
}
|
||||
this.indexData.complainOrderRate=this.indexData.complainOrderRate*100
|
||||
if (this.indexData.complainOrderRate % 1 !== 0) {
|
||||
this.indexData.complainOrderRate = this.indexData.complainOrderRate.toFixed(2);
|
||||
}
|
||||
this.indexData.customerSatisfaction=this.indexData.customerSatisfaction*100
|
||||
if (this.indexData.customerSatisfaction % 1 !== 0) {
|
||||
this.indexData.customerSatisfaction = this.indexData.customerSatisfaction.toFixed(2);
|
||||
}
|
||||
this.indexData.threeMinutesContactRate=this.indexData.threeMinutesContactRate*100
|
||||
if (this.indexData.threeMinutesContactRate % 1 !== 0) {
|
||||
this.indexData.threeMinutesContactRate = this.indexData.threeMinutesContactRate.toFixed(2);
|
||||
}
|
||||
this.indexData.urgeRate=this.indexData.urgeRate*100
|
||||
if (this.indexData.urgeRate % 1 !== 0) {
|
||||
this.indexData.urgeRate = this.indexData.urgeRate.toFixed(2);
|
||||
}
|
||||
this.indexData.appRate=this.indexData.appRate*100
|
||||
if (this.indexData.appRate % 1 !== 0) {
|
||||
this.indexData.appRate = this.indexData.appRate.toFixed(2);
|
||||
}
|
||||
this.indexData.polymerizationSuccessRate=this.indexData.polymerizationSuccessRate*100
|
||||
if (this.indexData.polymerizationSuccessRate % 1 !== 0) {
|
||||
this.indexData.polymerizationSuccessRate = this.indexData.polymerizationSuccessRate.toFixed(2);
|
||||
// 需要处理的属性名数组
|
||||
const propertiesToProcess = [
|
||||
'refuseOrderRate',
|
||||
'timeoutOrderRate',
|
||||
'complainOrderRate',
|
||||
'customerSatisfaction',
|
||||
'threeMinutesContactRate',
|
||||
'urgeRate',
|
||||
'appRate',
|
||||
'polymerizationSuccessRate'
|
||||
];
|
||||
for (let key in this.indexData){
|
||||
if (propertiesToProcess.includes(key)) {
|
||||
this.indexData[key] = this.processPercentage(this.indexData[key]);
|
||||
}
|
||||
}
|
||||
} else if ([1, 2].includes(this.active)) {
|
||||
let res = await getStatisticsKpi({
|
||||
@ -1011,13 +1022,16 @@ export default {
|
||||
item.minorFortyMinutesArrivalRate=this.formatPercentage(item.minorFortyMinutesArrivalRate) ;
|
||||
let formatVal = dayjs(item.statisticsDate).format('DD');
|
||||
let formatVal1 = dayjs(item.statisticsDate).format('M');
|
||||
return {...item, date: formatVal, month: (formatVal1 == this.current) ? '本月' : (formatVal1 + '月')};
|
||||
// console.log("formatVal1",formatVal1)
|
||||
// return {...item, date: formatVal, month: (formatVal1 == this.current) ? '本月' : (formatVal1 + '月')};
|
||||
return {...item, date: formatVal, month: formatVal1 + '月'};
|
||||
});
|
||||
this.loading = false
|
||||
this.detailList?.map(item => {
|
||||
this.xAxisArr.push(item.month)
|
||||
})
|
||||
this.xAxisArr[this.xAxisArr.length - 1] = '本月'
|
||||
// console.log(" this.xAxisArr", this.xAxisArr)
|
||||
// this.xAxisArr[this.xAxisArr.length - 1] = '本月'
|
||||
await this.twoTabHanldeData()
|
||||
} else if ([3, 4].includes(this.active)) {
|
||||
let res = await getDriverStatisticsKpi({
|
||||
@ -1030,13 +1044,11 @@ export default {
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize
|
||||
})
|
||||
// this.detailList = res.data
|
||||
this.total = res.total
|
||||
this.detailList = res.data?.map(item => {
|
||||
item.refuseOrderRate=this.formatPercentage(item.refuseOrderRate) ;
|
||||
item.timeoutOrderRate=this.formatPercentage(item.timeoutOrderRate) ;
|
||||
item.cancelRate=this.formatPercentage(item.cancelRate) ;
|
||||
// item.urgeRate=this.formatPercentage(item.urgeRate) ;
|
||||
item.complainOrderRate=this.formatPercentage(item.complainOrderRate) ;
|
||||
item.customerEvaluateRate=this.formatPercentage(item.customerEvaluateRate) ;
|
||||
item.appRate=this.formatPercentage(item.appRate) ;
|
||||
@ -1051,7 +1063,6 @@ export default {
|
||||
let formatVal = dayjs(item.statisticsDate).format('DD');
|
||||
return {...item, date: formatVal};
|
||||
});
|
||||
console.log("this.detailList",this.detailList)
|
||||
this.loading = false;
|
||||
if(this.active===4 && !this.driverName){
|
||||
this.detailList=[]
|
||||
@ -1138,15 +1149,23 @@ export default {
|
||||
return result.toFixed(2) + '%';
|
||||
}
|
||||
},
|
||||
checkMobile() {
|
||||
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
|
||||
this.isMobile = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(userAgent);
|
||||
},
|
||||
// 初始化获取当月日期
|
||||
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'
|
||||
this.startMonthTime=this.getStartTimeFromEndTime(this.endTime)
|
||||
console.log(" this.startMonthTime", this.startMonthTime,this.startTime)
|
||||
},
|
||||
// 获取当月天数
|
||||
getDayLen() {
|
||||
@ -1386,7 +1405,6 @@ export default {
|
||||
}
|
||||
} else if (this.active === 3) {
|
||||
if (this.activeIndex === 0) {
|
||||
|
||||
this.labelList = [
|
||||
{label: '师傅姓名', prop: 'driverName'},
|
||||
{label: '总分', prop: 'score'},
|
||||
@ -1504,6 +1522,10 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
checkMobile() {
|
||||
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
|
||||
this.isMobile = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(userAgent);
|
||||
},
|
||||
setType(type) {
|
||||
switch (type) {
|
||||
case 5:
|
||||
@ -1582,7 +1604,7 @@ export default {
|
||||
align-items: center;
|
||||
position: relative;
|
||||
|
||||
.month {
|
||||
/* .month {
|
||||
display: inline-block;
|
||||
width: 45px;
|
||||
height: 30px;
|
||||
@ -1592,7 +1614,7 @@ export default {
|
||||
border: 1px solid #4C81F5;
|
||||
font-size: 14px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}*/
|
||||
|
||||
.el-icon-search {
|
||||
font-size: 15px;
|
||||
@ -1938,4 +1960,47 @@ export default {
|
||||
::v-deep .el-switch__label * {
|
||||
font-size: 12px;
|
||||
}
|
||||
/* 自定义样式 */
|
||||
.custom-date-picker ::v-deep .el-input__prefix{
|
||||
display: none;
|
||||
}
|
||||
.month {
|
||||
display: inline-block;
|
||||
width: 75px;
|
||||
//height: 30px;
|
||||
//line-height: 30px;
|
||||
text-align: center;
|
||||
border-radius: 20px 0px 0px 20px;
|
||||
//border-radius: 0px 20px 20px 0px;
|
||||
//border: 1px solid #4C81F5;
|
||||
font-size: 14px;
|
||||
color: #FFFFFF;
|
||||
::v-deep .el-input--suffix .el-input__inner{
|
||||
|
||||
}
|
||||
::v-deep .el-input__inner{
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
border-radius: 20px 0px 0px 20px !important;
|
||||
text-align: center !important;
|
||||
font-size: 14px !important;
|
||||
color: #FFFFFF !important;
|
||||
border: 1px solid #4C81F5 !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
/* 自定义清除按钮样式 */
|
||||
.custom-date-picker ::v-deep .el-input__suffix {
|
||||
right: 0 !important;
|
||||
padding-right: 10px !important;
|
||||
}
|
||||
|
||||
.custom-date-picker ::v-deep .el-input__suffix-inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.custom-date-picker ::v-deep .el-input__icon {
|
||||
line-height: 1 !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -73,51 +73,51 @@
|
||||
<div class="titleContent">
|
||||
<div class="flex-between" v-show="abState">
|
||||
<div> 到事发地距离:</div>
|
||||
<div class="halfOpcity"><input @input="validateIntegerInput" type="number" v-model="form.supplierSettleMileageAb"/>公里</div>
|
||||
<div class="halfOpcity"><input @input="validateIntegerInput" class="ipt" type="number" v-model="form.supplierSettleMileageAb"/>公里</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="bcState">
|
||||
<div> 拖车里程:</div>
|
||||
<div class="halfOpcity"><input type="number" v-model="form.supplierSettleMileageBc"/>公里</div>
|
||||
<div class="halfOpcity"><input class="ipt" type="number" v-model="form.supplierSettleMileageBc"/>公里</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="caState">
|
||||
<div>返程里程:</div>
|
||||
<div class="halfOpcity"><input type="number" v-model="form.supplierSettleMileageCa"/>公里</div>
|
||||
<div class="halfOpcity"><input class="ipt" type="number" v-model="form.supplierSettleMileageCa"/>公里</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="bridgeAbState">
|
||||
<div>ab路桥费:</div>
|
||||
<div class="halfOpcity"><input @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.supplierBridgeAmountAb"/>元</div>
|
||||
<div class="halfOpcity"><input class="ipt" @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.supplierBridgeAmountAb"/>元</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="bridgeBcState">
|
||||
<div>bc路桥费:</div>
|
||||
<div class="halfOpcity"><input @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.supplierBridgeAmountBc"/>元</div>
|
||||
<div class="halfOpcity"><input class="ipt" @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.supplierBridgeAmountBc"/>元</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="bridgeCaState">
|
||||
<div>ca路桥费:</div>
|
||||
<div class="halfOpcity"><input @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.supplierBridgeAmountCa"/>元</div>
|
||||
<div class="halfOpcity"><input class="ipt" @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.supplierBridgeAmountCa"/>元</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="waitAmountState">
|
||||
<div>等候费:</div>
|
||||
<div class="halfOpcity inputContent"><input @input="validateIntegerInput" type="number" v-model="form.supplierWaitAmount"/>元</div>
|
||||
<div class="halfOpcity inputContent"><input class="ipt" @input="validateIntegerInput" type="number" v-model="form.supplierWaitAmount"/>元</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="tyreAmountState">
|
||||
<div>小轮个数:</div>
|
||||
<div class="halfOpcity inputContent"><input @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.tyreNumber"/>个</div>
|
||||
<div class="halfOpcity inputContent"><input class="ipt" @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.tyreNumber"/>个</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="tyreAmountState">
|
||||
<div>小轮费:</div>
|
||||
<div class="halfOpcity inputContent"><input @input="validateIntegerInput" :disabled="isUnsuccessfulSettle" type="number" v-model="form.supplierTyreAmount"/>元</div>
|
||||
<div class="halfOpcity inputContent"><input @input="validateIntegerInput" disabled type="number" v-model="form.supplierTyreAmount"/>元</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="dilemmaAmountState && basePriceDisabled">
|
||||
<div>困境费:</div>
|
||||
<div class="halfOpcity inputContent"><input @input="validateIntegerInput" type="number" v-model="form.supplierDilemmaAmount"/>元</div>
|
||||
<div class="halfOpcity inputContent"><input class="ipt" @input="validateIntegerInput" type="number" v-model="form.supplierDilemmaAmount"/>元</div>
|
||||
</div>
|
||||
<div class="flex-between" v-show="basementFeeState">
|
||||
<div>地库费:</div>
|
||||
<div class="halfOpcity inputContent"><input @input="validateIntegerInput" type="number" v-model="form.supplierBasementFee" :disabled="!isBasementSettle || isUnsuccessfulSettle" />元</div>
|
||||
<div class="halfOpcity inputContent"><input @input="validateIntegerInput" class="ipt" type="number" v-model="form.supplierBasementFee" :disabled="!isBasementSettle || isUnsuccessfulSettle" />元</div>
|
||||
</div>
|
||||
<div class="flex-between">
|
||||
<div>收取客户金额:</div>
|
||||
<div class="halfOpcity inputContent"><input type="number" v-model="form.supplierCustomerAmount"/>元</div>
|
||||
<div class="halfOpcity inputContent"><input type="number" class="ipt" v-model="form.supplierCustomerAmount"/>元</div>
|
||||
</div>
|
||||
<div class="flex-between bgDisable" :class=" { 'flex-between': true, 'bgDisable' : basePriceDisabled } ">
|
||||
<div>基本费用:</div>
|
||||
@ -973,6 +973,9 @@ img {
|
||||
|
||||
.halfOpcity {
|
||||
opacity: .5;
|
||||
.ipt{
|
||||
border: 1px solid #cccccc !important;
|
||||
}
|
||||
}
|
||||
|
||||
.inputContent {
|
||||
|
@ -82,7 +82,7 @@
|
||||
<span class="content">{{orderInfo.bridgeAmountBc + ' 元' }}</span>
|
||||
</div>
|
||||
<div class="item" v-show="bridgeCaState">
|
||||
<span class="titleLeft">va路桥费:</span>
|
||||
<span class="titleLeft">ca路桥费:</span>
|
||||
<span class="content">{{orderInfo.bridgeAmountCa + ' 元' }}</span>
|
||||
</div>
|
||||
<div class="item" v-show="tyreAmountState">
|
||||
|
Reference in New Issue
Block a user