318 lines
8.6 KiB
Vue
318 lines
8.6 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<view class="nav-bar"></view>
|
|||
|
|
<view class="upper-cont">
|
|||
|
|
<timeline>
|
|||
|
|
<timelineItem leftTime='公告主题'>
|
|||
|
|
<view class="tripItem">
|
|||
|
|
<view class="title">{{ theme }}</view>
|
|||
|
|
</view>
|
|||
|
|
</timelineItem>
|
|||
|
|
<timelineItem leftTime='公告内容'>
|
|||
|
|
<view class="tripItem">
|
|||
|
|
<view class="title">{{ content }}</view>
|
|||
|
|
</view>
|
|||
|
|
</timelineItem>
|
|||
|
|
<timelineItem leftTime='公告开始时间'>
|
|||
|
|
<view class="tripItem">
|
|||
|
|
<view class="title">{{ startTime }}</view>
|
|||
|
|
</view>
|
|||
|
|
</timelineItem>
|
|||
|
|
<timelineItem leftTime='公告结束时间'>
|
|||
|
|
<view class="tripItem">
|
|||
|
|
<view class="title">{{ endTime }}</view>
|
|||
|
|
</view>
|
|||
|
|
</timelineItem>
|
|||
|
|
<timelineItem leftTime='工时'>
|
|||
|
|
<view class="tripItem">
|
|||
|
|
<view class="title">{{ workTime }}</view>
|
|||
|
|
</view>
|
|||
|
|
</timelineItem>
|
|||
|
|
<timelineItem leftTime='公告类型'>
|
|||
|
|
<view class="tripItem">
|
|||
|
|
<view class="title">{{ type }}</view>
|
|||
|
|
</view>
|
|||
|
|
</timelineItem>
|
|||
|
|
</timeline>
|
|||
|
|
</view>
|
|||
|
|
<view class="btn-area">
|
|||
|
|
<button v-show="type == '考试'" @click="jumpExam">进入考试</button>
|
|||
|
|
<button v-show="type == '培训'" @click="jumpEdu">进入培训</button>
|
|||
|
|
<button :disabled="signBtnDisabled" @click="clickSign">{{ signContent }}</button>
|
|||
|
|
</view>
|
|||
|
|
<uni-popup ref="popup" type="bottom">
|
|||
|
|
<view class="btm-popup">
|
|||
|
|
<h5>提示：签名完成后请点击下方的“保存”按钮</h5>
|
|||
|
|
<l-signature disableScroll ref="signatureRef" :penColor="penColor" :penSize="penSize" :openSmooth="openSmooth" ></l-signature>
|
|||
|
|
</view>
|
|||
|
|
<view class="btns" style="display: flex; justify-content: space-around; background-color: #fff;">
|
|||
|
|
<view @click="fixSign('clear')">清空</view>
|
|||
|
|
<view @click="fixSign('undo')">撤消</view>
|
|||
|
|
<view @click="fixSign('save')">保存</view>
|
|||
|
|
</view>
|
|||
|
|
</uni-popup>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { publicPath } from '../../public';
|
|||
|
|
import timeline from '../../components/chenbin-timeline/timeLine.vue'
|
|||
|
|
import timelineItem from '../../components/chenbin-timeline/timelineItem.vue'
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
noticeId: '',
|
|||
|
|
theme: '',
|
|||
|
|
content: '',
|
|||
|
|
startTime: '',
|
|||
|
|
endTime: '',
|
|||
|
|
workTime: '',
|
|||
|
|
type: '',
|
|||
|
|
signContent: '',
|
|||
|
|
timeStatus: '',
|
|||
|
|
signStatus: '',
|
|||
|
|
signBtnDisabled: false,
|
|||
|
|
penColor: 'black',
|
|||
|
|
penSize: 5,
|
|||
|
|
signUrl: '',
|
|||
|
|
picUrl: '',
|
|||
|
|
openSmooth: true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
components: {
|
|||
|
|
timeline,
|
|||
|
|
timelineItem
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
fixSign (type) {
|
|||
|
|
let that = this
|
|||
|
|
if(type == 'openSmooth') {
|
|||
|
|
that.openSmooth = !that.openSmooth
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (type == 'save') {
|
|||
|
|
that.$refs.signatureRef.canvasToTempFilePath({
|
|||
|
|
success: (res) => {
|
|||
|
|
// 是否为空画板 无签名
|
|||
|
|
console.log(res.isEmpty)
|
|||
|
|
// 生成图片的临时路径
|
|||
|
|
// H5 生成的是base64
|
|||
|
|
that.signUrl = res.tempFilePath
|
|||
|
|
uni.request({
|
|||
|
|
url: publicPath + '/backstage/app/uploadPhoto',
|
|||
|
|
method: 'POST',
|
|||
|
|
header: {
|
|||
|
|
'content-type':'application/x-www-form-urlencoded; charset=UTF-8'
|
|||
|
|
},
|
|||
|
|
data: {
|
|||
|
|
base: that.signUrl
|
|||
|
|
},
|
|||
|
|
success: (picRes) => {
|
|||
|
|
console.log(picRes);
|
|||
|
|
if (picRes.statusCode == 200) {
|
|||
|
|
that.picUrl = picRes.data[0]
|
|||
|
|
// 上传图片url
|
|||
|
|
uni.request({
|
|||
|
|
url: publicPath + '/backstage/app/signNoticeById',
|
|||
|
|
method: 'POST',
|
|||
|
|
header: {
|
|||
|
|
'content-type':'application/x-www-form-urlencoded; charset=UTF-8'
|
|||
|
|
},
|
|||
|
|
data: {
|
|||
|
|
userId: uni.getStorageSync('id'),
|
|||
|
|
id: this.noticeId,
|
|||
|
|
signUrl: that.picUrl
|
|||
|
|
},
|
|||
|
|
success: (signRes) => {
|
|||
|
|
console.log(signRes);
|
|||
|
|
if (signRes.data.code == 200) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: '签到成功！',
|
|||
|
|
success: () => {
|
|||
|
|
that.$refs.popup.close()
|
|||
|
|
that.signBtnDisabled = true
|
|||
|
|
that.signContent = '已签到'
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.$refs.signatureRef)
|
|||
|
|
this.$refs.signatureRef[type]()
|
|||
|
|
},
|
|||
|
|
jumpExam () {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/pages/exam/exam'
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
jumpEdu () {
|
|||
|
|
console.log(new Date(this.startTime).getTime(), new Date(this.endTime).getTime(), new Date().getTime());
|
|||
|
|
if (new Date().getTime() < new Date(this.startTime).getTime()) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: '未到培训开始时间！'
|
|||
|
|
})
|
|||
|
|
} else if (new Date().getTime() > new Date(this.endTime).getTime()) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: '已过培训结束时间！'
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: `/pages/eduPage/eduPage?noticeId=${this.noticeId}`
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
clickSign () {
|
|||
|
|
let that = this
|
|||
|
|
console.log(1);
|
|||
|
|
this.$refs.popup.open()
|
|||
|
|
/* uni.request({
|
|||
|
|
url: publicPath + '/backstage/app/signNoticeById',
|
|||
|
|
method: 'POST',
|
|||
|
|
header: {
|
|||
|
|
'content-type':'application/x-www-form-urlencoded; charset=UTF-8'
|
|||
|
|
},
|
|||
|
|
data: {
|
|||
|
|
userId: uni.getStorageSync('id'),
|
|||
|
|
id: this.noticeId
|
|||
|
|
},
|
|||
|
|
success: (signRes) => {
|
|||
|
|
console.log(signRes);
|
|||
|
|
if (signRes.data.code == 200) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: '签到成功！',
|
|||
|
|
success: () => {
|
|||
|
|
that.signBtnDisabled = true
|
|||
|
|
that.signContent = '已签到'
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}) */
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(params) {
|
|||
|
|
let that = this
|
|||
|
|
console.log(params);
|
|||
|
|
this.noticeId = params.id
|
|||
|
|
this.theme = params.theme
|
|||
|
|
this.content = params.cont
|
|||
|
|
this.startTime = params.sTime
|
|||
|
|
this.endTime = params.eTime
|
|||
|
|
this.workTime = params.workTime
|
|||
|
|
if (params.type == 1) {
|
|||
|
|
this.type = '考试'
|
|||
|
|
} else if (params.type == 2) {
|
|||
|
|
this.type = '培训'
|
|||
|
|
}
|
|||
|
|
// signInfo 0 未到签到时间 1 正在签到 2 已过签到时间
|
|||
|
|
// ifSign 0 未签到 1 已签到
|
|||
|
|
uni.request({
|
|||
|
|
url: publicPath + '/backstage/app/getSignInfoStatus',
|
|||
|
|
method: 'POST',
|
|||
|
|
header: {
|
|||
|
|
'content-type':'application/x-www-form-urlencoded; charset=UTF-8'
|
|||
|
|
},
|
|||
|
|
data: {
|
|||
|
|
userId: uni.getStorageSync('id'),
|
|||
|
|
id: params.id
|
|||
|
|
},
|
|||
|
|
success: (receiveRes) => {
|
|||
|
|
console.log(receiveRes);
|
|||
|
|
if (receiveRes.data.code == 200) {
|
|||
|
|
that.timeStatus = receiveRes.data.data.signInfo
|
|||
|
|
that.signStatus = receiveRes.data.data.ifSign
|
|||
|
|
// 签到按钮状态
|
|||
|
|
if (that.timeStatus == 0) {
|
|||
|
|
that.signBtnDisabled = true
|
|||
|
|
that.signContent = '未到签到时间'
|
|||
|
|
} else if (that.timeStatus == 1) {
|
|||
|
|
if (that.signStatus == 0) {
|
|||
|
|
that.signContent = '点击签到'
|
|||
|
|
} else if (that.signStatus == 1) {
|
|||
|
|
that.signBtnDisabled = true
|
|||
|
|
that.signContent = '已签到'
|
|||
|
|
}
|
|||
|
|
} else if (that.timeStatus == 2) {
|
|||
|
|
that.signBtnDisabled = true
|
|||
|
|
that.signContent = '已过签到时间'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
.nav-bar{
|
|||
|
|
width: 100%;
|
|||
|
|
height: var(--status-bar-height);
|
|||
|
|
padding-top: var(--status-bar-height);
|
|||
|
|
}
|
|||
|
|
.upper-cont{
|
|||
|
|
width: 90%;
|
|||
|
|
margin: 50rpx auto;
|
|||
|
|
font-size: 16px;
|
|||
|
|
.tripItem {
|
|||
|
|
padding: 20rpx 30rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
background:rgba(255,255,255,1);
|
|||
|
|
box-shadow:0px 0px 20px 0px rgba(0,0,0,0.08);
|
|||
|
|
border-radius:10px;
|
|||
|
|
margin-bottom: 30rpx;
|
|||
|
|
.title {
|
|||
|
|
font-size:28rpx;
|
|||
|
|
font-family:PingFangSC-Medium,PingFang SC;
|
|||
|
|
font-weight:500;
|
|||
|
|
color:rgba(51,51,51,1);
|
|||
|
|
}
|
|||
|
|
.tips {
|
|||
|
|
font-size:22rpx;
|
|||
|
|
font-family:PingFangSC-Regular,PingFang SC;
|
|||
|
|
font-weight:400;
|
|||
|
|
color:rgba(153,153,153,1);
|
|||
|
|
margin-top: 20rpx;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.btn-area{
|
|||
|
|
width: 80%;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
margin-top: 180rpx;
|
|||
|
|
button{
|
|||
|
|
margin-bottom: 15rpx;
|
|||
|
|
background-color: #169BD5;
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.btm-popup{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 25vh;
|
|||
|
|
background-color: #fff;
|
|||
|
|
border-radius: 20rpx 20rpx 0 0;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 15rpx;
|
|||
|
|
}
|
|||
|
|
.btns{
|
|||
|
|
view{
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 10rpx 30rpx;
|
|||
|
|
border-radius: 15rpx;
|
|||
|
|
background-color: #043e71;
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|