sadjv3_jishi/pages/my/mangshi2.vue

391 lines
9.3 KiB
Vue

<template>
<view>
<view class="timeView">
<view class="timeView-top">
<span class="dx_title">是否接单 <!-- <text class="switchTxt">{{switchTxt=='true'?'接单':'不接单'}}</text> --></span>
<switch :checked='isTrue' style="transform:scale(0.7)" @change="switch1Change"/>
</view>
<view class="selectTimt">
<view class="dx_title">选择接单时问</view>
<view class="selectTimt-bottom">
<hTimePicker class="selectTimt-time" dayNum='0' sTime="0" cTime="23" interval="30" @changeTime="bindTimeChange">
<view slot="pCon" class="changeTime">
<view class="selectTimt-time-title">开始时间</view>
<view class="uni-input">{{starTime}}</view>
</view>
</hTimePicker>
<hTimePickerEnd class="selectTimt-time" dayNum='0' sTime="0" cTime="23" interval="30" @changeTime="bindTimeChangeEndTime">
<view slot="pCon" class="changeTime">
<view class="selectTimt-time-title">结束时间</view>
<view class="uni-input">
<span style="margin-right: 5px;">次日</span>
<span>{{endTime}}</span>
</view>
</view>
</hTimePickerEnd>
</view>
</view>
<times selectedTabColor="#28BA92" selectedItemColor="#28BA92" @change="getTime" :timeInterval="0.5" :appointTime="msList"
:isMultiple="true" :disableTimeSlot = "disableTimeSlot"></times>
<view class="dx_view margin-bottom-sm" v-if="msList.length > 0">
<view class="dx_title">不可接单时间</view>
<view class="flex align-center flex-wrap ">
<view v-for="(item,index) in msList" :key="index" class="btn flex align-center margin-top">
<view>{{item}}</view>
<view class="margin-left-sm" @tap.stop="bindupdata(index,item)">x</view>
</view>
</view>
</view>
<view class="sub" @click="sub()" v-if="switchTxt==true">保存选择1</view>
<view class="sub" @click="sub()" v-if="switchTxt==false">保存选择2</view>
</view>
</view>
</template>
<script>
import hTimePicker from "@/components/h-timePicker/h-timePicker.vue";
import hTimePickerEnd from "@/components/h-timePicker/h-timePickerEnd.vue";
import {
currentTime,
initData,
tomorrow
} from '../../utils/date.js'
import times from '@/components/pretty-times/pretty-times.vue'
export default {
components: {
times,
hTimePicker,
hTimePickerEnd
},
data() {
return {
multiSelector: '',
isTrue: true,
starTime:'00:00',
endTime: '00:00',
appointTime:[],
disableTimeSlot:[],
newmsList: [],
msList: [],
startTime: '',
yearsDate: '',
switchTxt:'',
timeCurrent:'',
tomorrowTime:''
}
},
onLoad() {
if(this.timeCurrent==''){
this.timeCurrent=tomorrow().tomorrow+' '+this.endTime;
}
// this.tomorrowTime=currentTime().date+' '+currentTime().times;
this.getMsTime(currentTime().date);
},
methods: {
bindTimeChange: function(e) {// 当天接单开始时间
this.starTime = e;
this.tomorrowTime=currentTime().date+' '+this.starTime;
},
bindTimeChangeEndTime(e){//次日接单结束时间
this.endTime = e;
this.timeCurrent=tomorrow().tomorrow+' '+this.endTime;
},
switch1Change: function (e) {
this.switchTxt=e.detail.value
var time=''
if(this.switchTxt==true){
time='1'
}else{
time='2'
}
this.sfJdan(time)
},
sfJdan(time){//是否接单
var data={
flag:time,
artificerId:uni.getStorageSync('artificerId')
}
this.$Request.postT('/app/artificerTime/setArtificerAccept',data).then(res => {
if (res.code == 0) {
this.$queue.showToast('设置成功!')
this.getMsTime(currentTime().date)
} else {
this.$queue.showToast(res.msg);
}
});
},
getTime(time){
this.msList=time;
},
sub() {
this.saveMangShi();
// if (this.msList.length == 0) {
// if(this.yearsDate === ''){
// this.$queue.showToast('请先添加待选时间!');
// return;
// }
// uni.showModal({
// title: '温馨提示',
// content: '是否将待选区的时间设置为忙时?',
// showCancel: true,
// cancelText: '取消',
// confirmText: '确认',
// success: res => {
// if (res.confirm) {
// this.saveMangShi();
// }
// }
// });
},
//删除规格
bindupdata(index1, item) {
let over = false;
for (var i = 0; i < this.newmsList.length; i++) {
if (this.newmsList[i].artificerTime === item) {
if (this.newmsList[i].classify == 1) {
over = true;
break;
}
}
}
if (!over) {
this.msList.splice(index1, 1)
} else {
this.$queue.showToast('当前时间已被用户下单,禁止删除!')
}
},
saveMangShi() {
var data={
idleTime:this.tomorrowTime+','+this.timeCurrent,
busyTime:this.msList.toString(),
artificerId:uni.getStorageSync('artificerId')
}
this.$Request.postT('/app/artificerTime/setArtificerTime',data).then(res => {
if (res.code == 0) {
this.$queue.showToast('设置成功!')
this.getMsTime(currentTime().date)
} else {
this.$queue.showToast(res.msg);
}
});
},
getMsTime(artificerDate) {
// this.yearsDate = artificerDate;
this.$Request.getT('/app/artificerTime/selectArtificerTimeByArtificerId?artificerId=' + uni.getStorageSync('artificerId') + '&artificerDate=' + artificerDate).then(res => {
if (res && res.code == 0 && res.data) {
if (res.acceptOrders == 1) {
this.isTrue = true
} else if (res.acceptOrders == 2) {
this.isTrue = false
}
if(res.startTime){
this.starTime=res.startTime.slice(11,18);
this.tomorrowTime=currentTime().date+' '+this.starTime;
}else{
// 获取当前时间
const now = new Date();
// 格式化时间为时分
const hours = now.getHours();
const minutes = now.getMinutes();
// 将分钟划分为半小时
let halfHour = false;
if (minutes >= 30) {
halfHour = true;
}
// 格式化输出
this.starTime = `${hours.toString().padStart(2, '0')}:${halfHour ? '30' : '00'}`;
this.tomorrowTime=currentTime().date+' '+this.starTime;
}
this.endTime=res.endTime.slice(11,18);
this.msList = [];
this.newmsList = res.data;
this.msList = res.data.map((item)=> item.createTime);
this.disableTimeSlot=this.msList
// uni.$emit("sendChildMsList",this.msList);
}else {
this.isTrue = false
}
});
},
}
}
</script>
<style lang="scss">
.selectTimt-time-title{
text-align: center;
margin-bottom: 5px;
}
/deep/.uni-input{
text-align: center;
color: #28BA92;
}
.selectTimt-time{
display: flex;
flex-direction: column;
align-items: center;
}
.selectTimt-bottom{
margin-top:10px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
width: 100%;
}
.selectTimt{
display: flex;
flex-direction: column;
width: 100%;
padding: 10px 5px;
background: #fff;
margin: 10px auto;
}
.dx_title{
font-size: 14px;
font-weight: bold;
}
.switchTxt{
font-size: 13px;
font-weight: 400;
margin-left: 5px;
color: #28BA92;
}
.timeView-top{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
width: 100%;
padding: 10px 5px;
background: #fff;
margin: 10px auto;
}
page {
background: #f7f7f7;
}
.dx_view {
background: #FFFFFF;
border-radius: 8rpx;
padding: 20rpx 20rpx 40rpx;
width: 710rpx;
margin-top: 20rpx;
.dx_title {
font-size: 30rpx;
font-weight: bold;
}
}
.timeView {
display: flex;
width: 750rpx;
flex-wrap: wrap;
.timeview_item {
background: #F7F7F7;
border-radius: 15rpx;
width: 120rpx;
height: 140rpx;
text-align: center;
padding-top: 14rpx;
margin: 20rpx 20rpx 20rpx 6rpx;
}
.timeview_acitem {
width: 120rpx;
height: 140rpx;
text-align: center;
background: #E8F9EF;
border: 1px solid #00B88F;
color: #00B88F;
border-radius: 15rpx;
padding-top: 14rpx;
margin: 20rpx 20rpx 20rpx 6rpx;
}
.item_text {
width: 120rpx;
font-size: 22rpx;
font-family: PingFang SC;
font-weight: 500;
margin-top: 6rpx;
}
}
.btn {
border: 1upx solid #CCCCCC;
border-radius: 28px;
padding: 15rpx 30rpx;
margin-right: 25rpx;
}
.btns {
border: 1upx dashed #333333;
border-radius: 28px;
padding: 10rpx 30rpx;
margin-right: 25rpx;
}
.active {
/* background: #FCD202; */
/* border: none; */
}
.topView {
width: 750rpx;
height: 180rpx;
background: #FFFFFF;
.topview_item {
width: 160rpx;
height: 120rpx;
text-align: center;
padding-top: 14rpx;
margin: 0rpx 10rpx;
}
.topview_acitem {
width: 160rpx;
height: 120rpx;
text-align: center;
background: #E8F9EF;
border: 1px solid #00B88F;
color: #00B88F;
border-radius: 20rpx;
padding-top: 14rpx;
margin: 0rpx 10rpx;
}
.item_text {
width: 160rpx;
font-size: 20rpx;
font-family: PingFang SC;
font-weight: bold;
margin-top: 6rpx;
}
}
.sub {
display: flex;
justify-content: center;
align-items: center;
width: 696rpx;
height: 80rpx;
line-height: 80rpx;
border-radius: 50rpx;
margin: 30rpx 10rpx;
color: #FFFFFF;
font-size: 30rpx;
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
}
</style>