437 lines
12 KiB
Vue
437 lines
12 KiB
Vue
|
<template>
|
|||
|
|
<view class="technician-time-manage">
|
|||
|
|
<view class="fill-base pd-lg flex-between">
|
|||
|
|
<view class="flex-1 flex-y-baseline f-title c-title">白天出租出行免车费设置
|
|||
|
|
({{timeFrom.day_time ? timeFrom.day_time : '00:00~00:00'}} )
|
|||
|
|
<!-- <view class="f-paragraph ml-sm"
|
|||
|
|
:style="{color:form.is_work==1?primaryColor:'#999'}">
|
|||
|
|
{{form.is_work==1?'接单':'休息'}}
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
<view @tap.stop="toShowTime('day')">
|
|||
|
|
<!-- <i class="iconfont icon-time c-caption ml-sm"
|
|||
|
|
:style="{ color: form.is_work==1 ? primaryColor : ''}"></i> -->
|
|||
|
|
<view class="f-paragraph ml-sm" :style="{color:primaryColor}">
|
|||
|
|
设置时间
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="b-1px-b item1">
|
|||
|
|
<view class="pd-lg" @click="selectDistanceOptions('dayVal',item)" v-for="(item,index) in distance_options"
|
|||
|
|
:key="index"
|
|||
|
|
:style="{ background: dayVal.distance == item ? '#25c376' : '#ffffff',color:dayVal.distance == item ? 'white' : '#999'}">
|
|||
|
|
{{item}}公里
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="fill-base pd-lg flex-between">
|
|||
|
|
<view class="flex-1 flex-y-baseline f-title c-title">夜晚出租出行免车费设置
|
|||
|
|
({{timeFrom.night_time ? timeFrom.night_time : '00:00~00:00'}})
|
|||
|
|
<!-- <view class="f-paragraph ml-sm"
|
|||
|
|
:style="{color:form.is_work==1?primaryColor:'#999'}">
|
|||
|
|
{{form.is_work==1?'接单':'休息'}}
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
<view @tap.stop="toShowTime('night')">
|
|||
|
|
<!-- <i class="iconfont icon-time c-caption ml-sm"
|
|||
|
|
:style="{ color: form.is_work==1 ? primaryColor : ''}"></i> -->
|
|||
|
|
<view class="f-paragraph ml-sm" :style="{color:primaryColor}">
|
|||
|
|
设置时间
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view @tap.stop="toChangeItem">
|
|||
|
|
<i class="iconfont icon-switch c-caption ml-sm" :class="[{'icon-switch-on':form.is_work==1}]"
|
|||
|
|
:style="{ color: form.is_work==1 ? primaryColor : ''}"></i>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
<view class="b-1px-b item1">
|
|||
|
|
<view class="pd-lg" @click="selectDistanceOptions('nightVal',item)" v-for="(item,index) in distance_options"
|
|||
|
|
:key="index"
|
|||
|
|
:style="{ background: nightVal.distance == item ? '#25c376' : '#ffffff',color:nightVal.distance == item ? 'white' : '#999'}">
|
|||
|
|
{{item}}公里
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<view class="fill-base mt-md b-1px-b">
|
|||
|
|
<view class="f-title c-title pd-lg">温馨提示</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="fill-base pb-lg ">
|
|||
|
|
<view class="pd-lg">
|
|||
|
|
1.此处设置的免车费公里数是客户距离你的直线距离，直线距离
|
|||
|
|
和车行距离在地理位置特殊性上可能有一定误差，望大家设置
|
|||
|
|
距离时知晓。
|
|||
|
|
2.设置的免出行费只针对出租车
|
|||
|
|
3.设置后请点击下方[确定] 按钮生效
|
|||
|
|
4、全国默认1公里免车费，可自行调整公里数
|
|||
|
|
</view>
|
|||
|
|
<!-- <view @tap.stop="toShowTime('start_time')" class="item-time flex-center flex-column">
|
|||
|
|
<view>开始时间</view>
|
|||
|
|
<view class="mt-sm" :style="{color:form.start_time ? primaryColor : '#999'}">
|
|||
|
|
{{form.start_time || '选择时间'}}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view @tap.stop="toShowTime('end_time')" class="item-time flex-center flex-column b-1px-l">
|
|||
|
|
<view>结束时间</view>
|
|||
|
|
<view class="mt-sm" :style="{color:form.end_time ? primaryColor : '#999'}">
|
|||
|
|
{{form | handleStartEndTime(toDay)}}{{form.end_time || '选择时间'}}
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="fill-base pb-lg" style="border-bottom-left-radius: 32rpx;border-bottom-right-radius: 32rpx;">
|
|||
|
|
<view class="flex pl-md pr-md pt-lg pb-lg">
|
|||
|
|
<view class="f-mini-title">设置不可接单时间</view>
|
|||
|
|
<view class="f-paragraph c-disable">（只能设置近{{dayList.length}}天的时间）</view>
|
|||
|
|
</view>
|
|||
|
|
<tab @change="handerTabChange" :list="dayList" :activeIndex="dayCurrent*1" :activeColor="primaryColor"
|
|||
|
|
width="150rpx" height="80rpx"></tab>
|
|||
|
|
</view>
|
|||
|
|
<view class="date-list flex pt-md" v-if="dayList.length > 0">
|
|||
|
|
<view class="date-item radius-16 flex-center ml-md mt-md" @tap="getDateTime(index)"
|
|||
|
|
:style="{ background : form.coach_status != 3 && item.status == 0 && item.is_order==0 && !isTimes(item.time_str) ? primaryColor : '' , color:item.status == 0 && item.is_order==0 && !isTimes(item.time_str) ? '#fff' : ''}"
|
|||
|
|
:class="isTimes(item.time_str) || item.is_order==1 || form.coach_status == 3 ? 'date-item-prohibit c-disable' : 'fill-base c-5A677E'"
|
|||
|
|
v-for="(item,index) in dayList[dayCurrent].sub" :key="index">
|
|||
|
|
<view class="text-center">
|
|||
|
|
<view class="f-mini-title">{{item.time_text}}</view>
|
|||
|
|
<view class="f-caption">{{isTimes(item.time_str) || item.status == 0 ? '不可预约' : '可预约'}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
<view class="space-max-footer"></view>
|
|||
|
|
<!-- <w-picker :visible.sync="showTime" mode="time" :value="toDayTime" :current="false" :second="false"
|
|||
|
|
:themeColor="primaryColor" @confirm="onConfirm" ref="time"></w-picker> -->
|
|||
|
|
|
|||
|
|
<time-picker-popup ref="time" :value="toDayTime" @confirm="onConfirm"
|
|||
|
|
:title="showKey=='day'?dayVal.title:nightVal.title" segmentation='--'></time-picker-popup>
|
|||
|
|
|
|||
|
|
<fix-bottom-button @confirm="submit" :text="[{text:'保存',type:'confirm',isAuth:true}]" bgColor="#fff"
|
|||
|
|
v-if="form.coach_status !=3 "></fix-bottom-button>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
mapState,
|
|||
|
|
mapMutations,
|
|||
|
|
mapActions
|
|||
|
|
} from "vuex"
|
|||
|
|
import $util from "@/utils/index.js"
|
|||
|
|
import wPicker from "@/components/w-picker/w-picker.vue";
|
|||
|
|
import tab from "@/components/tab.vue"
|
|||
|
|
import TimePickerPopup from '@/components/time-picker-popup/time-picker-popup.vue'
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
wPicker,
|
|||
|
|
tab,
|
|||
|
|
TimePickerPopup
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
distance_options: ['0.5', '1', '3', '5', '7'],
|
|||
|
|
dayVal: {
|
|||
|
|
distance: '0.5',
|
|||
|
|
toDayTime: ['00', '00', '00', '00'],
|
|||
|
|
title: '白天设置'
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
nightVal: {
|
|||
|
|
distance: '0.5',
|
|||
|
|
toDayTime: ['00', '00', '00', '00'],
|
|||
|
|
title: '晚间设置'
|
|||
|
|
},
|
|||
|
|
toDay: '',
|
|||
|
|
toDayTime: ['00', '00', '00', '00'],
|
|||
|
|
showKey: '',
|
|||
|
|
showTime: false,
|
|||
|
|
form: {
|
|||
|
|
id: 0,
|
|||
|
|
is_work: 0,
|
|||
|
|
start_time: '',
|
|||
|
|
end_time: '',
|
|||
|
|
coach_status: 0,
|
|||
|
|
time_unit: '',
|
|||
|
|
},
|
|||
|
|
timeFrom: {
|
|||
|
|
day_time: '',
|
|||
|
|
day_free_distance: '',
|
|||
|
|
night_time: '',
|
|||
|
|
night_free_distance: '',
|
|||
|
|
},
|
|||
|
|
dayList: [],
|
|||
|
|
dayCurrent: 0,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
computed: mapState({
|
|||
|
|
primaryColor: state => state.config.configInfo.primaryColor,
|
|||
|
|
subColor: state => state.config.configInfo.subColor,
|
|||
|
|
userInfo: state => state.user.userInfo,
|
|||
|
|
coachInfo: state => state.user.coachInfo,
|
|||
|
|
}),
|
|||
|
|
onLoad() {
|
|||
|
|
this.initIndex();
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
...mapActions(['getCoachInfo']),
|
|||
|
|
...mapMutations(['updateTechnicianItem'] ),
|
|||
|
|
async initIndex() {
|
|||
|
|
// #ifdef H5
|
|||
|
|
if (this.$jweixin.isWechat()) {
|
|||
|
|
await this.$jweixin.initJssdk();
|
|||
|
|
this.$jweixin.wxReady(() => {
|
|||
|
|
this.$jweixin.hideOptionMenu()
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
// #endif
|
|||
|
|
let cur_time = new Date(Math.ceil(new Date().getTime()))
|
|||
|
|
this.toDay = this.$util.formatTime(cur_time, 'YY-M-D')
|
|||
|
|
// this.toDayTime = this.$util.formatTime(cur_time, 'h:m');
|
|||
|
|
let data = await this.$api.technician.timeConfig()
|
|||
|
|
for (let key in this.form) {
|
|||
|
|
this.form[key] = data[key]
|
|||
|
|
}
|
|||
|
|
data.day_list.forEach((item, index) => {
|
|||
|
|
item.title = index == 0 ? '今天' : item.dat_text
|
|||
|
|
item.sub = []
|
|||
|
|
})
|
|||
|
|
this.form.time_unit = data.time_unit
|
|||
|
|
this.dayList = data.day_list
|
|||
|
|
this.$util.setNavigationBarColor({
|
|||
|
|
bg: this.primaryColor
|
|||
|
|
})
|
|||
|
|
this.toCount();
|
|||
|
|
|
|||
|
|
// 技师白天夜间免费出行距离
|
|||
|
|
for (let timeFromKey in this.timeFrom) {
|
|||
|
|
this.timeFrom[timeFromKey] = this.coachInfo[timeFromKey];
|
|||
|
|
if (timeFromKey == 'day_free_distance') {
|
|||
|
|
this.dayVal.distance = Number(this.coachInfo[timeFromKey]);
|
|||
|
|
}
|
|||
|
|
if (timeFromKey == 'night_free_distance') {
|
|||
|
|
this.nightVal.distance = Number(this.coachInfo[timeFromKey]);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
toChangeItem() {
|
|||
|
|
if (this.form.coach_status == 3) return
|
|||
|
|
this.form.is_work = this.form.is_work == 1 ? 0 : 1
|
|||
|
|
},
|
|||
|
|
toShowTime(key) {
|
|||
|
|
this.showKey = key
|
|||
|
|
this.$refs.time.open()
|
|||
|
|
// if (this.form.coach_status == 3) return
|
|||
|
|
// this.showKey = key
|
|||
|
|
// this.showTime = true
|
|||
|
|
},
|
|||
|
|
onConfirm(val) {
|
|||
|
|
// console.log(val)
|
|||
|
|
this.timeFrom[this.showKey == 'day' ? 'day_time' : 'night_time'] =
|
|||
|
|
`${val[0]}:${val[1]}~${val[2]}:${val[3]}`;
|
|||
|
|
this.toCount()
|
|||
|
|
},
|
|||
|
|
selectDistanceOptions(key, item) {
|
|||
|
|
this[key].distance = item;
|
|||
|
|
this.timeFrom[key == 'dayVal' ? 'day_free_distance' : 'night_free_distance'] = item;
|
|||
|
|
},
|
|||
|
|
toCount() {
|
|||
|
|
let {
|
|||
|
|
toDay = ''
|
|||
|
|
} = this
|
|||
|
|
let {
|
|||
|
|
start_time = '',
|
|||
|
|
end_time = ''
|
|||
|
|
} = this.form
|
|||
|
|
if (toDay && start_time && end_time) {
|
|||
|
|
this.dayList.forEach(item => {
|
|||
|
|
item.sub = []
|
|||
|
|
})
|
|||
|
|
this.getTimeCall()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
async getTimeCall() {
|
|||
|
|
this.$util.showLoading()
|
|||
|
|
let {
|
|||
|
|
start_time = '',
|
|||
|
|
end_time = ''
|
|||
|
|
} = this.form
|
|||
|
|
let {
|
|||
|
|
dayCurrent,
|
|||
|
|
dayList
|
|||
|
|
} = this
|
|||
|
|
let data = await this.$api.technician.getTime({
|
|||
|
|
start_time,
|
|||
|
|
end_time,
|
|||
|
|
dat_str: dayList[dayCurrent].dat_str
|
|||
|
|
})
|
|||
|
|
this.dayList[dayCurrent].sub = data
|
|||
|
|
this.$util.hideAll()
|
|||
|
|
},
|
|||
|
|
setDate(index) {
|
|||
|
|
this.dayCurrent = index
|
|||
|
|
},
|
|||
|
|
getDateTime(index) {
|
|||
|
|
if (this.form.coach_status == 3) return
|
|||
|
|
let {
|
|||
|
|
dayCurrent
|
|||
|
|
} = this
|
|||
|
|
let {
|
|||
|
|
sub = []
|
|||
|
|
} = this.dayList[dayCurrent]
|
|||
|
|
let {
|
|||
|
|
is_click,
|
|||
|
|
is_order,
|
|||
|
|
status
|
|||
|
|
} = sub[index]
|
|||
|
|
if (sub && is_order == 1) return
|
|||
|
|
this.dayList[dayCurrent].sub[index].is_click = is_click == 0 ? 1 : 0
|
|||
|
|
this.dayList[dayCurrent].sub[index].status = status == 0 ? 1 : 0
|
|||
|
|
},
|
|||
|
|
handerTabChange(index) {
|
|||
|
|
if (this.form.coach_status == 3) return
|
|||
|
|
this.dayCurrent = index
|
|||
|
|
if (this.dayList[index].sub && this.dayList[index].sub.length) return
|
|||
|
|
this.getTimeCall()
|
|||
|
|
},
|
|||
|
|
isTimes(value) {
|
|||
|
|
let date = new Date()
|
|||
|
|
return date.getTime() / 1000 > value
|
|||
|
|
},
|
|||
|
|
async submit() {
|
|||
|
|
let timeParam = this.$util.deepCopy(this.timeFrom);
|
|||
|
|
if (!timeParam.day_time || !timeParam.night_time) {
|
|||
|
|
this.$util.showToast({
|
|||
|
|
title: !timeParam.day_time ? `请选择白天免车费时间` : `请选择夜间免车费时间`
|
|||
|
|
})
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.$util.showLoading()
|
|||
|
|
await this.updateCoachRidingForfree();
|
|||
|
|
await this.getCoachInfo();
|
|||
|
|
this.$util.hideAll()
|
|||
|
|
this.$util.showToast({
|
|||
|
|
title: `保存成功`
|
|||
|
|
});
|
|||
|
|
setTimeout(() => {
|
|||
|
|
this.$util.back()
|
|||
|
|
this.$util.goUrl({
|
|||
|
|
url: 1,
|
|||
|
|
openType: `navigateBack`
|
|||
|
|
})
|
|||
|
|
}, 1000)
|
|||
|
|
return
|
|||
|
|
let param = this.$util.deepCopy(this.form);
|
|||
|
|
if (!param.start_time || !param.end_time) {
|
|||
|
|
this.$util.showToast({
|
|||
|
|
title: !param.start_time ? `请选择开始时间` : `请选择结束时间`
|
|||
|
|
})
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
delete param.coach_status
|
|||
|
|
let dayList = this.$util.deepCopy(this.dayList)
|
|||
|
|
param.time_text = dayList
|
|||
|
|
this.$util.showLoading()
|
|||
|
|
await this.$api.technician.setTimeConfig(param)
|
|||
|
|
this.$util.hideAll()
|
|||
|
|
this.$util.showToast({
|
|||
|
|
title: `保存成功`
|
|||
|
|
});
|
|||
|
|
this.updateTechnicianItem({
|
|||
|
|
key: 'haveOperItem',
|
|||
|
|
val: true
|
|||
|
|
})
|
|||
|
|
setTimeout(() => {
|
|||
|
|
this.$util.back()
|
|||
|
|
this.$util.goUrl({
|
|||
|
|
url: 1,
|
|||
|
|
openType: `navigateBack`
|
|||
|
|
})
|
|||
|
|
}, 1000)
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
// 修改技师白天夜间免费出行距离
|
|||
|
|
async updateCoachRidingForfree() {
|
|||
|
|
await this.$api.technician.updateCoachRidingForfree(this.timeFrom);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
filters: {
|
|||
|
|
handleStartEndTime(val, toDay) {
|
|||
|
|
let text = ''
|
|||
|
|
let {
|
|||
|
|
start_time,
|
|||
|
|
end_time
|
|||
|
|
} = val
|
|||
|
|
let start = `${toDay} ${start_time}`
|
|||
|
|
let end = `${toDay} ${end_time}`
|
|||
|
|
if (start_time && end_time && $util.DateToUnix(start) >= $util.DateToUnix(end)) {
|
|||
|
|
text = '次日'
|
|||
|
|
}
|
|||
|
|
return text
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
.technician-time-manage {
|
|||
|
|
/deep/ .uni-popup {
|
|||
|
|
z-index: 999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.iconfont {
|
|||
|
|
font-size: 80rpx;
|
|||
|
|
line-height: 34rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.c-title {
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item1 {
|
|||
|
|
display: grid;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
grid-template-columns: repeat(3, auto);
|
|||
|
|
gap: 10px 10px;
|
|||
|
|
padding: 30rpx 30rpx;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: white;
|
|||
|
|
|
|||
|
|
.pd-lg {
|
|||
|
|
text-align: center;
|
|||
|
|
background: #25c376;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item-time {
|
|||
|
|
width: 50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.date-title {
|
|||
|
|
padding-bottom: 60rpx;
|
|||
|
|
|
|||
|
|
text {
|
|||
|
|
border-bottom: 3px solid transparent;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.date-list {
|
|||
|
|
word-break: break-all;
|
|||
|
|
flex-flow: wrap;
|
|||
|
|
|
|||
|
|
.date-item {
|
|||
|
|
width: 163rpx;
|
|||
|
|
height: 110rpx;
|
|||
|
|
border: 1px solid #E5E5E5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.date-item-prohibit {
|
|||
|
|
background: #F6F7F7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.c-5A677E {
|
|||
|
|
color: #5A677E;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|