|
|
|
@ -21,19 +21,30 @@ |
|
|
|
<image mode="aspectFit" src="/static/images/triangle_c33.png"></image> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
<picker :range="timeList" range-key="_time" @change="timeChange"> |
|
|
|
<view class="i-view"> |
|
|
|
<input placeholder="请选择换班时间" disabled /> |
|
|
|
<!-- <picker :range="timeList" range-key="_time" @change="timeChange"> --> |
|
|
|
<view class="i-view" @click="showTimeModal"> |
|
|
|
<input placeholder="请选择换班时间" disabled v-model="selectedTimeTxt" /> |
|
|
|
<image mode="aspectFit" src="/static/images/triangle_c33.png"></image> |
|
|
|
</view> |
|
|
|
</picker> |
|
|
|
<!-- </picker> --> |
|
|
|
</view> |
|
|
|
<view class="a-tip"> |
|
|
|
<view>换班需要换班教练的时间为空闲。</view> |
|
|
|
<view>换班后您的时间为空闲，记得前往我的时间。</view> |
|
|
|
<view>管理您的时间哦。</view> |
|
|
|
</view> |
|
|
|
<view class="fixed-bot-btn"><view hover-class="hover-active">提交换班申请</view></view> |
|
|
|
<view class="a-mask" v-if="isShowTimeModal"> |
|
|
|
<view class="m-content"> |
|
|
|
<scroll-view class="c-list" scroll-y=""> |
|
|
|
<view v-for="(e, i) in timeList" :key="i" :class="['l-item', tempSelectTimeID.includes(e.id)?'active':'']" @click="timeSelect(e)">{{e._time || '-'}}</view> |
|
|
|
</scroll-view> |
|
|
|
<view class="c-btns"> |
|
|
|
<view hover-class="hover-active" @click="isShowTimeModal = false">取消</view> |
|
|
|
<view hover-class="hover-active" @click="confirmTimeSelected">确定</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="fixed-bot-btn"><view hover-class="hover-active" @click="submitBtn">提交换班申请</view></view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -45,6 +56,11 @@ import util from '../../../utils/util'; |
|
|
|
export default { |
|
|
|
computed: { |
|
|
|
...mapState([ 'storeInfo' ]), |
|
|
|
selectedTimeTxt(){ |
|
|
|
let { selectTimeIDS, timeList } = this; |
|
|
|
let txtArr = timeList.filter(e=>selectTimeIDS.includes(e.id)).map(e=>e._time); |
|
|
|
return txtArr.join(',') || ''; |
|
|
|
} |
|
|
|
}, |
|
|
|
data(){ |
|
|
|
return { |
|
|
|
@ -52,6 +68,9 @@ export default { |
|
|
|
classList: [], // 班级列表 |
|
|
|
coachList: [], // 教练列表 |
|
|
|
timeList: [], // 时间列表 |
|
|
|
selectTimeIDS: [], // 已选时间 |
|
|
|
tempSelectTimeID: [], // 临时选中 |
|
|
|
isShowTimeModal: false, |
|
|
|
selectInfo: { |
|
|
|
courseInfo: { |
|
|
|
name: '' |
|
|
|
@ -72,25 +91,115 @@ export default { |
|
|
|
this.getCourseList({}); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
timeChange(e){ |
|
|
|
submitBtn: util.debounce(function(){ |
|
|
|
let { courseInfo, classInfo, coachInfo, dateInfo } = this.selectInfo; |
|
|
|
let { selectTimeIDS } = this; |
|
|
|
if(!courseInfo.id || !classInfo.id || !coachInfo.id || selectTimeIDS.length<=0 )return util.showNone('请选择完整！'); |
|
|
|
util.showLoad(); |
|
|
|
servers.post({ |
|
|
|
url: API.addShiftWorkRecord, |
|
|
|
data: { |
|
|
|
course_id: courseInfo.id, |
|
|
|
class_id: classInfo.id, |
|
|
|
accept_coach_id: coachInfo.id, |
|
|
|
course_duration_ids: selectTimeIDS, |
|
|
|
}, |
|
|
|
isDefaultGet: false, |
|
|
|
}) |
|
|
|
.then(res=>{ |
|
|
|
util.hideLoad(); |
|
|
|
if(res.data.code == 0){ |
|
|
|
util.showModal({ |
|
|
|
title: '提示', |
|
|
|
content: res.data.message || '操作成功！', |
|
|
|
success: ele=>{ |
|
|
|
if(ele.confirm)util.routeTo(`/pages/shift/record/record`, 'nT') |
|
|
|
} |
|
|
|
}) |
|
|
|
}else{ |
|
|
|
util.showModal({ |
|
|
|
title: '提示', |
|
|
|
content: res.data.message || '操作失败！' |
|
|
|
}) |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch(util.hideLoad) |
|
|
|
|
|
|
|
|
|
|
|
}, 300, 300), |
|
|
|
showTimeModal(){ |
|
|
|
this.isShowTimeModal = true; |
|
|
|
this.tempSelectTimeID = [...this.selectTimeIDS]; |
|
|
|
}, |
|
|
|
timeSelect(e){ |
|
|
|
let { tempSelectTimeID } = this; |
|
|
|
this.tempSelectTimeID = tempSelectTimeID.includes(e.id) ? |
|
|
|
tempSelectTimeID.filter(el=>el!=e.id) : |
|
|
|
[...tempSelectTimeID, e.id]; |
|
|
|
}, |
|
|
|
confirmTimeSelected(){ |
|
|
|
this.selectTimeIDS = [...this.tempSelectTimeID]; |
|
|
|
this.isShowTimeModal = false; |
|
|
|
}, |
|
|
|
// 日期切换 |
|
|
|
timeChange(e){ |
|
|
|
console.warn(e) |
|
|
|
let { timeList, selectInfo } = this; |
|
|
|
if(!selectInfo.coachInfo.id)return util.showNone('请选择教练！'); |
|
|
|
let _timeInfo = timeList[e.detail.value] || {}; |
|
|
|
this.selectInfo = { |
|
|
|
...selectInfo, |
|
|
|
dateInfo: _timeInfo |
|
|
|
}; |
|
|
|
}, |
|
|
|
// 教练切换 |
|
|
|
coachChange(e){ |
|
|
|
let { coachList, selectInfo } = this; |
|
|
|
if(!selectInfo.classInfo.id)return util.showNone('请选择班级！'); |
|
|
|
let _coachInfo = coachList[e.detail.value] || {}; |
|
|
|
this.selectInfo.coachInfo = _coachInfo; |
|
|
|
this.selectInfo = { |
|
|
|
...selectInfo, |
|
|
|
coachInfo: _coachInfo, |
|
|
|
dateInfo: { |
|
|
|
_time: '' |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
this.getShiftWorkClassTimes(selectInfo.courseInfo.id); |
|
|
|
}, |
|
|
|
// 班级切换 |
|
|
|
classChange(e){ |
|
|
|
let { classList } = this; |
|
|
|
let { classList, selectInfo } = this; |
|
|
|
if(!selectInfo.courseInfo.id)return util.showNone('请选择课程！'); |
|
|
|
let _classInfo = classList[e.detail.value] || {}; |
|
|
|
this.selectInfo.classInfo = _classInfo; |
|
|
|
this.selectInfo = { |
|
|
|
...selectInfo, |
|
|
|
classInfo: _classInfo, |
|
|
|
coachInfo: { |
|
|
|
name: '' |
|
|
|
}, |
|
|
|
dateInfo: { |
|
|
|
_time: '' |
|
|
|
} |
|
|
|
}; |
|
|
|
this.getCoachList(); |
|
|
|
}, |
|
|
|
// 课程切换 |
|
|
|
courseChange(e){ |
|
|
|
let { courseList } = this; |
|
|
|
let _courseInfo = courseList[e.detail.value] || {}; |
|
|
|
this.selectInfo.courseInfo = _courseInfo; |
|
|
|
this.selectInfo = { |
|
|
|
courseInfo: _courseInfo, |
|
|
|
classInfo: { |
|
|
|
class_name: '' |
|
|
|
}, |
|
|
|
coachInfo: { |
|
|
|
name: '' |
|
|
|
}, |
|
|
|
dateInfo: { |
|
|
|
_time: '' |
|
|
|
} |
|
|
|
}; |
|
|
|
this.getClassList( _courseInfo.id ); |
|
|
|
|
|
|
|
}, |
|
|
|
@ -113,7 +222,6 @@ export default { |
|
|
|
_time: `${e.date} ${e.start_duration}` |
|
|
|
} |
|
|
|
}); |
|
|
|
console.warn(_list) |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 教练列表 |
|
|
|
@ -174,6 +282,64 @@ export default { |
|
|
|
|
|
|
|
<style lang="scss"> |
|
|
|
@import "~style/public.scss"; |
|
|
|
.a-mask{ |
|
|
|
position: fixed; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
top: 0; |
|
|
|
bottom: 0; |
|
|
|
z-index: 10; |
|
|
|
background-color: rgba($color: #000000, $alpha: .5); |
|
|
|
.m-content{ |
|
|
|
position: absolute; |
|
|
|
left: 50%; |
|
|
|
top: 50%; |
|
|
|
transform: translate(-50%, -50%); |
|
|
|
width: 80%; |
|
|
|
height: 800upx; |
|
|
|
border-radius: 10upx; |
|
|
|
background-color: #fff; |
|
|
|
padding: 24upx; |
|
|
|
.c-list{ |
|
|
|
margin-bottom: 24upx; |
|
|
|
height: 600upx; |
|
|
|
.l-item{ |
|
|
|
margin-bottom: 12upx; |
|
|
|
height: 80upx; |
|
|
|
border: 2upx solid #d8d8d8; |
|
|
|
color: #333; |
|
|
|
line-height: 76upx; |
|
|
|
text-align: center; |
|
|
|
font-size: 36upx; |
|
|
|
|
|
|
|
border-radius: 10upx; |
|
|
|
&.active{ |
|
|
|
border-color: $themeColor; |
|
|
|
color: $themeColor; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.c-btns{ |
|
|
|
@include centerFlex(center); |
|
|
|
>view{ |
|
|
|
margin: 0 24upx; |
|
|
|
width: 200upx; |
|
|
|
height: 88upx; |
|
|
|
line-height: 88upx; |
|
|
|
text-align: center; |
|
|
|
border-radius: 44upx; |
|
|
|
background-color: $themeColor; |
|
|
|
font-size: 32upx; |
|
|
|
color: #fff; |
|
|
|
border: 2upx solid $themeColor; |
|
|
|
&:first-child{ |
|
|
|
color: $themeColor; |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
page{ |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
@ -234,4 +400,5 @@ export default { |
|
|
|
.fixed-bot-btn{ |
|
|
|
border-top: 2upx solid #D8D8D8; |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
