Browse Source

feat(member): 添加学员请假功能- 在 member.js 中新增 askForLeave 方法,用于发送请假申请- 在 info.vue 中添加请假相关UI和逻辑

- 实现了请假申请和取消请假的功能
master
liutong 2 years ago
parent
commit
6afca6bef8
  1. 9
      api/member.js
  2. 145
      pages/student/timetable/info.vue

9
api/member.js

@ -100,6 +100,15 @@ export default {
},
//发送请假申请
askForLeave(data) {
let url = '/member/ask_for_leave'
return http.post(url, data).then(res => {
return res;
})
},

145
pages/student/timetable/info.vue

@ -42,12 +42,34 @@
<view class="content">{{infoData.hour}}个课时</view>
</view>
<!--1未上课 2已上课-->
<view class="state_box" v-if="infoData.status == 2">
<view>已上</view>
</view>
<view class="state_box_btn" v-if="infoData.status != 2">
<!--sign_status字段| 0未签到 1已签到 2请假-->
<view v-if="!['1','2'].includes(String(infoData.sign_status))" @click="askForLeave(1)">请假</view>
<view v-else @click="askForLeave(2)">取消请假</view>
</view>
</view>
</view>
</view>
<!-- 请假模态框-->
<fui-modal class="leave_section" :buttons="[{text: '取消',plain: true}, {text: '保存'}]" width="600" :show="leaveShow" @cancel="closeLeaveModal" @click="closeLeaveModal">
<text class="fui-title" style="font-size: 30rpx;padding: 15rpx">请假申请</text>
<view class="form_box" style="width: 100%;padding: 20rpx">
<view class="input_box" style="border: 1px solid #888888;font-size: 28rpx;">
<fui-input style="font-size: 28rpx;height: 60rpx;line-height: 60rpx;padding-left: 15rpx" :borderBottom="false" placeholder="请输入请假原因" v-model="leaveFormData.reason"></fui-input>
</view>
</view>
</fui-modal>
<!--取消请假-->
<fui-dialog :show="cancelLeaveShow" content="确定取消吗?" maskClosable @click="submitCancelLeave" @close="cancelLeaveShow=false"></fui-dialog>
</view>
</template>
@ -67,10 +89,25 @@ export default {
filteredData: {
id: '',//课程id
},
leaveShow:false,//请假模态框显示状态
//请假表单
leaveFormData:{
schedules_id: '',//详情 id
courses_id: '',//课程id
reason: '',//请假原因
file_url: '',//附件
},
//取消请相关
cancelLeaveShow:false,//取消请假模态框显示状态
}
},
onLoad(options) {
this.filteredData.id = options.id//课程id
this.leaveFormData.courses_id = options.id//课程id
},
onShow(){
this.init()
@ -103,6 +140,92 @@ export default {
url: '/pages/coach/course/info'
})
},
//请假/取消请假 type|1=请求,2=取消请假
askForLeave(type){
if(type == 1){
//打开请假模态框
this.leaveShow = true
}else{
//取消请假
this.cancelLeaveShow = true
}
},
//打开请假模态框
openLeaveModal(){
this.leaveShow = true
},
//关闭请假模态框
closeLeaveModal(e){
if(e.index == 0){
//点击了取消
this.leaveFormData.reason = ''
}else{
//点击了确定
if (!this.leaveFormData.reason){
uni.showToast({
title: '请输入请假原因',
icon: 'none'
})
return
}
this.submitLeave()//发送请假请求
}
this.leaveShow = false
},
//发送请假申请
async submitLeave(){
let data = {...this.leaveFormData}
let res = await memberApi.askForLeave(data)
if(res.code != 1){
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
uni.showToast({
title: res.msg,
icon: 'success'
})
//延迟1s执行
setTimeout(() => {
this.init()
}, 1000)
},
//发送取消请假申请
async submitCancelLeave(e){
if(e.index == 0){
//点击了取消按钮
return
}
uni.showToast({
title: '需要取消请假接口',
icon: 'none'
})
return
//取消请假
let data = {...this.leaveFormData}
let res = await memberApi.askForLeave(data)
if(res.code != 1){
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
uni.showToast({
title: res.msg,
icon: 'success'
})
//延迟1s执行
setTimeout(() => {
this.init()
}, 1000)
},
}
}
</script>
@ -182,8 +305,30 @@ export default {
transform: rotate(-35deg); /* 旋转 */
}
}
.state_box_btn{
position: absolute;
bottom: 50rpx;
right: 10rpx;
view{
width: 160rpx;
height: 60rpx;
line-height: 60rpx;
background-color: #00BE8C;
border-radius: 8rpx;
color: #fff;
font-size: 28rpx;
text-align: center;
}
}
}
}
//请假模态框
.leave_section {
}
}

Loading…
Cancel
Save