330 lines
9.5 KiB
Vue
330 lines
9.5 KiB
Vue
<template>
|
||
<view class="page">
|
||
<u-navbar class="u-navbar" :title="pageTitle" placeholder @leftClick="leftClick" leftIconColor="#fff" bgColor="#00337A" rightIcon="list" @rightClick="rightClick" :titleStyle="{ color: '#FFF', fontSize: '32rpx' }">
|
||
<view class="u-nav-slot" slot="right">
|
||
<image src="../../../../static/realName/safety_tips.png" style="width: 48rpx;height: 48rpx;" mode="" ></image>
|
||
</view>
|
||
</u-navbar>
|
||
|
||
<scroll-view class="scroll-view" scroll-x="true">
|
||
<view class="scroll-view-item" :class="hIndex == 1 ? 'active' : ''" @click="hIndex = 1">
|
||
安全规范
|
||
<view class="activeLine" v-if="hIndex == 1"></view>
|
||
</view>
|
||
<view class="scroll-view-item" :class="hIndex == 2 ? 'active' : ''" @click="hIndex = 2">
|
||
实操培训
|
||
<view class="activeLine" v-if="hIndex == 2"></view>
|
||
</view>
|
||
<view class="scroll-view-item" :class="hIndex == 3 ? 'active' : ''" @click="hIndex = 3">
|
||
理论培训
|
||
<view class="activeLine" v-if="hIndex == 3"></view>
|
||
</view>
|
||
<view class="scroll-view-item" :class="hIndex == 4 ? 'active' : ''" @click="hIndex = 4">
|
||
准军事化
|
||
<view class="activeLine" v-if="hIndex == 4"></view>
|
||
</view>
|
||
</scroll-view>
|
||
<scroll-view class="content" scroll-y="true">
|
||
<view class="view-box">
|
||
<view class="title-view">
|
||
培训
|
||
</view>
|
||
<view class="exam-view">
|
||
<view class="exam-item" v-for="(item,index) in trainBean" :key="index">
|
||
<view style="width: 70%;display: flex;align-items: center;word-break: break-all;">
|
||
<view style="margin-right: 20rpx;">
|
||
<image src="../../../../static/realName/pdf_icon.png" style="width: 48rpx;height: 48rpx;" mode="" ></image>
|
||
</view>
|
||
<view>
|
||
<view style="font-weight: bold;">{{item.trainFileName}}</view>
|
||
<view style="color: #06E7A3;font-weight: bold;" v-if="!item.isFinish">未开始</view>
|
||
<view style="color: #06E7A3;font-weight: bold;" v-if="item.isFinish==1">完成</view>
|
||
<view style="color: #06E7A3;font-weight: bold;" v-if="item.isFinish==0">进行中</view>
|
||
</view>
|
||
</view>
|
||
<view class="exam-button" v-if="!item.isFinish" @click="goStudy(item)">开始学习</view>
|
||
<view class="exam-button" v-if="item.isFinish==1" @click="goStudy(item)">学习</view>
|
||
<view class="exam-button" v-if="item.isFinish==0" @click="goStudy(item)">继续学习</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="view-box">
|
||
<view class="title-view">
|
||
考试
|
||
</view>
|
||
<view class="exam-view">
|
||
<view class="exam-item" v-if="examBean.name&&examBean.name!=''">
|
||
<view style="width: 62%;display: flex;align-items: center;word-break: break-all;">
|
||
<view style="margin-right: 20rpx;">
|
||
<image src="../../../../static/realName/exam_icon.png" style="width: 48rpx;height: 48rpx;" mode="" ></image>
|
||
</view>
|
||
<view >
|
||
<view style="font-weight: bold;">{{examBean.name}}</view>
|
||
<view style="color: #06E7A3;font-weight: bold;" v-if="!examBean.examResult">未开始({{examBean.examScore||0}})</view>
|
||
<view style="color: red;font-weight: bold;" v-if="examBean.examResult==0">未通过({{examBean.examScore||0}})</view>
|
||
<view style="color: #06E7A3;font-weight: bold;" v-if="examBean.examResult==1">已通过({{examBean.examScore||0}})</view>
|
||
|
||
</view>
|
||
</view>
|
||
<view style="width: 38%;display: flex;align-items: center;justify-content: end;">
|
||
<view class="exam-button" v-if="examBean.examResult==0||examBean.examResult==1" @click="goExamDetail(examBean)">详情</view>
|
||
<view class="exam-button" v-if="!examBean.examResult" @click="goExam(examBean)">开始考试</view>
|
||
<view class="exam-button" v-if="examBean.examResult==0" @click="goExam(examBean)">重新考试</view>
|
||
<view class="exam-button" v-if="examBean.examResult==1" @click="goExam(examBean)">再次考试</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
|
||
|
||
<!-- 弹窗 -->
|
||
<u-popup :show="showPopup" mode="center" @close="closePopup">
|
||
<view style="width:650rpx;height: 100%;position: relative;background-color: #fff;">
|
||
<view class="popup-header">
|
||
<view style="width: 5%;height: 80rpx;"></view>
|
||
<view style="width: 85%;height: 80rpx;line-height: 80rpx;font-weight: bold;font-size: 32rpx;text-align: center;">提示</view>
|
||
<u-icon style="width: 10%;" name="close" color="#000" size="24" @click="closePopup"></u-icon>
|
||
</view>
|
||
<scroll-view class="popup-content" scroll-y="true">
|
||
<view>1.人员出场更换工程后需重新培训考试全部内容；</view>
|
||
<view>2.培训考试结果有效期为1年；</view>
|
||
<view>3.保命教育、准军事化可以在在场的情况下长期培训、考试，更新数据；</view>
|
||
<view>4.需要在系统先入场绑定工程后开始培训及考试。</view>
|
||
</scroll-view>
|
||
</view>
|
||
</u-popup>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import config from '@/config'
|
||
export default {
|
||
data() {
|
||
return {
|
||
idNumber:uni.getStorageSync('realNameUser').idNumber,
|
||
pageTitle:'安全教育培训',
|
||
trainInfo:{},
|
||
hIndex:1,
|
||
types:"安全考试",
|
||
foreignId:"",
|
||
trainBean:[],
|
||
examBean:{},
|
||
showPopup:false
|
||
}
|
||
},
|
||
watch: {
|
||
hIndex: function(newVal, oldVal) {
|
||
if(newVal == 1) {
|
||
this.types="安全考试";
|
||
this.foreignId=this.trainInfo.examWorkTypeId;
|
||
this.getTrainList()
|
||
}else if(newVal == 2) {
|
||
this.types="保命教育-实操";
|
||
this.foreignId=this.trainInfo.examProTypeId;
|
||
this.getTrainList()
|
||
}else if(newVal == 3) {
|
||
this.types="保命教育";
|
||
this.foreignId=this.trainInfo.examProTypeId;
|
||
this.getTrainList()
|
||
}else if(newVal == 4) {
|
||
this.types="准军事化(专业)";
|
||
this.foreignId=this.trainInfo.examProTypeId;
|
||
this.getTrainList()
|
||
}
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
this.trainInfo=JSON.parse(option.trainInfo);
|
||
this.foreignId=this.trainInfo.examWorkTypeId;
|
||
this.types="安全考试";
|
||
console.log('?? ~ realNameUser:',this.trainInfo)
|
||
this.getTrainList()
|
||
},
|
||
onShow() {
|
||
this.getTrainList()
|
||
},
|
||
methods: {
|
||
getTrainList(){
|
||
let param={
|
||
idNumber:this.idNumber,
|
||
foreignId:this.foreignId,
|
||
type:this.types,
|
||
proId:this.trainInfo.proId,
|
||
einTime:this.trainInfo.einTime
|
||
}
|
||
console.log(param)
|
||
uni.request({
|
||
url: config.realExamUrl+'/mergeTrainExam/selectTrainExamList',
|
||
method: 'post',
|
||
data: param,
|
||
header: {
|
||
'Content-Type': 'application/json',
|
||
Authorization: uni.getStorageSync('realNameToken')
|
||
},
|
||
success: res => {
|
||
console.log(res)
|
||
res = res.data;
|
||
if(res.code==200){
|
||
this.trainBean=res.data.trainBean||[];
|
||
this.examBean=res.data.examBean||{};
|
||
}
|
||
console.log(this.examBean)
|
||
},
|
||
fail: err => {
|
||
console.log(err)
|
||
}
|
||
})
|
||
},
|
||
goStudy(item){
|
||
console.log(item)
|
||
let index=item.trainFileName.lastIndexOf(".");
|
||
let ext=item.trainFileName.substr(index+1);
|
||
console.log(ext)
|
||
if(ext=='mp4'){
|
||
uni.navigateTo({
|
||
url: `/pages/realName/workbench/exam/trainVideo?pdfInfo=${JSON.stringify(item)}&trainInfo=${JSON.stringify(this.trainInfo)}&types=${this.types}&foreignId=${this.foreignId}`
|
||
})
|
||
}else{
|
||
uni.navigateTo({
|
||
url: `/pages/realName/workbench/exam/trainPdf?pdfInfo=${JSON.stringify(item)}&trainInfo=${JSON.stringify(this.trainInfo)}&types=${this.types}&foreignId=${this.foreignId}`
|
||
})
|
||
}
|
||
|
||
},
|
||
goExam(item){
|
||
console.log(item)
|
||
uni.navigateTo({
|
||
url: `/pages/realName/workbench/exam/examInfo?examInfo=${JSON.stringify(item)}&trainInfo=${JSON.stringify(this.trainInfo)}&types=${this.types}&foreignId=${this.foreignId}`
|
||
})
|
||
},
|
||
goExamDetail(item){
|
||
console.log(item)
|
||
uni.navigateTo({
|
||
url: `/pages/realName/workbench/exam/examDetail?examInfo=${JSON.stringify(item)}&trainInfo=${JSON.stringify(this.trainInfo)}&types=${this.types}&foreignId=${this.foreignId}&isView=true`
|
||
})
|
||
},
|
||
|
||
rightClick(){
|
||
this.showPopup=true;
|
||
},
|
||
closePopup(){
|
||
this.showPopup=false;
|
||
},
|
||
// 返回
|
||
leftClick() {
|
||
console.log('返回')
|
||
uni.navigateBack({
|
||
delta: 1 // 返回
|
||
});
|
||
}
|
||
},
|
||
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
|
||
/deep/ .uni-stat__select {
|
||
width:420rpx !important;
|
||
.uni-select__input-text {
|
||
width: 420rpx !important;
|
||
}
|
||
}
|
||
.scroll-view {
|
||
white-space: nowrap;
|
||
width: 100%;
|
||
background: #FFF;
|
||
}
|
||
|
||
.scroll-view-item {
|
||
display: inline-block;
|
||
width: 160rpx;
|
||
height: 100rpx;
|
||
line-height: 100rpx;
|
||
text-align: center;
|
||
|
||
.activeLine{
|
||
background: #00337A;
|
||
border-radius: 10upx;
|
||
width: 160rpx;
|
||
height: 6upx;
|
||
}
|
||
}
|
||
.active {
|
||
color: #333;
|
||
font-weight: bolder;
|
||
font-size: 32rpx;
|
||
}
|
||
.popup-header{
|
||
width: 100%;
|
||
height: 80rpx;
|
||
margin: 0 auto;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
background-color: #fff;
|
||
}
|
||
.popup-content{
|
||
width: 92%;
|
||
padding: 0 20rpx;
|
||
height: 16vh;
|
||
font-weight: 600;
|
||
background-color: #fff;
|
||
}
|
||
.page {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
background-color: #EFEFEF;
|
||
box-sizing: border-box;
|
||
.content{
|
||
width: 100%;
|
||
height: 86vh;
|
||
margin-top: 20rpx;
|
||
padding-bottom: 80rpx;
|
||
background: #EFEFEF;
|
||
|
||
.view-box{
|
||
width: 94%;
|
||
height: auto;
|
||
margin: 20rpx auto;
|
||
background-color: #FFF;
|
||
border-radius: 10rpx;
|
||
padding-top: 20rpx;
|
||
.title-view{
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
margin-left: 20rpx;
|
||
}
|
||
.exam-view{
|
||
width: 94%;
|
||
margin: 10rpx auto;
|
||
height: auto;
|
||
padding-bottom: 20rpx;
|
||
.exam-item{
|
||
width: 96%;
|
||
margin: 10rpx auto;
|
||
height: auto;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 10rpx 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
.exam-button{
|
||
background-color:#0078FB;
|
||
color: #FFF;
|
||
height: 36rpx;
|
||
line-height: 36rpx;
|
||
padding:10rpx 10rpx;
|
||
border-radius: 10rpx;
|
||
margin-left: 10rpx;
|
||
}
|
||
}
|
||
</style>
|