工匠基地
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

505 lines
14 KiB

<template>
<view class="min-height">
<!-- <scroll-view class="tab-box" scroll-x="true">-->
<!-- <view :class="['tab-item',{active:tabIndex === index}]" v-for="(item,index) in tabList" :key="index"-->
<!-- @click="handTab(index)">-->
<!-- {{ item.name }}-->
<!-- </view>-->
<!-- </scroll-view>-->
<view class="layout layout-train">
<view class="title-box">
<view class="title">培训任务</view>
<view class="link"></view>
</view>
<view class="train-box">
<view v-for="(item,index) in trainList" :key="index" class="mb-25"
@click="$jump(`/pages/promote/learn?courseId=${item.courseId}&trainId=${item.id}`)">
<view class="train-item" v-if="item.cover">
<view class="img">
<uv-image :src="item.cover" radius="20rpx" width="700rpx"
height="280rpx"></uv-image>
</view>
<view class="name">
<uv-text :text="item.title" size="28rpx" lineHeight="40rpx" :lines="1"
align="center" bold
color="#000"></uv-text>
<uv-text v-if="item.endDate" :text="`结束日期:${item.endDate}`" size="24rpx"
lineHeight="40rpx" :lines="1"
align="center"
color="#AAA"></uv-text>
<uv-text :text="`已学:${(item.learnSec / 3600).toFixed(2)}个学时`" size="24rpx"
lineHeight="40rpx" :lines="1"
align="center"
color="#AAA"></uv-text>
</view>
<view class="text">
<uv-line-progress :percentage="item.progress" activeColor="#00d61d"></uv-line-progress>
</view>
</view>
</view>
<uv-empty v-if="!trainList.length" text="暂无培训任务"/>
</view>
</view>
<uv-gap height="30rpx" bgColor="#f4f4f4"></uv-gap>
<view class="layout layout-plan">
<view class="title-box" @click="taskLink">
<view class="title">考试任务</view>
<view class="link"></view>
</view>
<view class="exam-box">
<view class="exam-item" v-for="(item,index) in examList"
:key="index"
@click="resultLink(item)">
<view class="info info-1">
<view class="name">
<uv-text :text="item.paper.title" size="24rpx" lineHeight="40rpx" :lines="1" bold></uv-text>
</view>
<view class="fen">考试类型: {{ ['线上', '线下'][item.type] }}</view>
<template v-if="item.type === 1 && item.trainExamPeopleInRoom">
<view v-if="item.trainExamPeopleInRoom.roomConfig" class="fen">考场:
{{ item.trainExamPeopleInRoom.roomConfig.position }}
</view>
<view v-if="item.trainExamPeopleInRoom.examSession" class="fen">考试时间:
{{ item.trainExamPeopleInRoom.examSession.startTime }} ~
{{ item.trainExamPeopleInRoom.examSession.endTime }}
</view>
</template>
<view class="fen" v-if="item.type === 0">考试截止日期: {{ item.examDate }}</view>
<view class="fen" v-if="item.workTypeLists && item.workTypeLists.length > 0">考试科目:
{{
item.workTypeLists[0].course.title
}}({{
['初级', '中级', '高级', '技师', '高级技师'][item.workTypeLists[0].course.level]
}})
</view>
<view class="fen" v-if="!item.trainExamPeopleInfo">总分 {{ item.paper.totalPoint }} 合格分
{{ item.paper.passPoint }}
</view>
<view class="fen" v-else>
<template v-if="item.text === '已完成' && item.trainExamPeopleInfo.realScore">
<view v-if="item.type === 0">
<text>考试得分 {{ item.trainExamPeopleInfo.score }}</text>
<text class="ml-15" v-if="item.trainExamPeopleInfo.inWhiteList === 0">平时分
{{ item.trainExamPeopleInfo.normalScore }}
</text>
<text class="ml-15">总分
{{ item.trainExamPeopleInfo.normalScore + item.trainExamPeopleInfo.score }}
</text>
<text class="ml-15">实际得分
{{ item.trainExamPeopleInfo.realScore }}
</text>
</view>
<view v-else>
<text>考试得分 {{ item.trainExamPeopleInfo.score }}</text>
<text class="ml-15">实操得分 {{ item.trainExamPeopleInfo.operateScore }}</text>
<text class="ml-15">总分
{{ item.trainExamPeopleInfo.realScore }}
</text>
</view>
<view class="mt-15"
:class="[item.trainExamPeopleInfo.totalScore >= 60 ? 'text-green' : 'text-red']"
v-if="item.showResult">{{
item.trainExamPeopleInfo.totalScore >= 60 ? '合格' : '不合格'
}}
</view>
</template>
</view>
<view class="fen"
v-if="item.trainExamPeopleInfo && item.trainExamPeopleInfo.highLevelStatus > 0">
<text>专家评审结果:</text>
<text class="ml-15"
:class="[item.trainExamPeopleInfo.highLevelStatus === 1 ? 'text-green' : 'text-red']">
{{ ['待审核', '已通过', '未通过'][item.trainExamPeopleInfo.highLevelStatus] }}
</text>
</view>
</view>
<mprogress
:progress="item.progress"
:activeColor="item.color"
:valueColor="item.color"
:valueFontSize="12"
:valueText="item.text"
:width="50"
:borderWidth="4"
></mprogress>
</view>
<uv-empty v-if="!examList.length" text="暂无考试任务"/>
</view>
</view>
<uv-gap height="30rpx" bgColor="#f4f4f4"></uv-gap>
<!-- 竞赛任务 -->
<view class="layout layout-plan">
<view class="title-box" @click="$jump('/pages/match/match')">
<view class="title">竞赛任务</view>
<view class="link"></view>
</view>
<view class="exam-box">
<view class="exam-item" v-for="(item,index) in matchList" :key="index">
<view class="info info-1">
<view class="name">
<uv-text :text="item.title" size="24rpx" lineHeight="40rpx" :lines="1" bold></uv-text>
</view>
<view class="between">
<view class="ren">{{ item.peopleNum }}</view>
<view class="progress">
<uv-line-progress :percentage="item.progress"
:activeColor="item.color"></uv-line-progress>
</view>
</view>
</view>
<mprogress
:progress="item.progress"
:activeColor="item.color"
:valueColor="item.color"
:valueFontSize="12"
:valueText="item.text"
:width="50"
:borderWidth="4"
></mprogress>
</view>
<uv-empty v-if="!matchList.length" text="暂无竞赛任务"/>
</view>
</view>
</view>
</template>
<script setup>
import {ref} from "vue";
import mprogress from "@/components/m-progress/mprogress.vue";
import {trainExamListReq, trainInfoUserListReq} from "@/api/trainInfo";
import dayjs from "dayjs";
import {onLoad} from "@dcloudio/uni-app";
import {userTrainListReq} from "@/api/train";
import {toast} from "@/uni_modules/uv-ui-tools/libs/function";
import {matchListReq} from "@/api/match";
const tabIndex = ref(3)
const tabList = [
{id: 1, name: '技能大师工作室'},
{id: 2, name: '企业级团队'},
{id: 3, name: '部门级团队'},
{id: 4, name: '班组级团队'},
]
const handTab = (index) => {
tabIndex.value = index
}
const trainInfoList = ref([])
const getTrainInfoList = async () => {
const res = await trainInfoUserListReq({})
trainInfoList.value = []
if (res) {
trainInfoList.value = res.data
if (trainInfoList.value.length > 0) {
await getExamList(trainInfoList.value[0].trainId)
}
}
}
const examList = ref([])
const getExamList = async () => {
const res = await trainExamListReq({})
examList.value = []
if (res) {
examList.value = res.data.filter(item => {
return (item.paper && item.trainExamPeopleInfo)
}).map(item => {
let progress = 0, text = '未完成', color = '#cacaca'
if (dayjs(item.examDate).isSame(dayjs())) {
progress = 50
color = '#57d801'
text = '进行中'
} else if ((item.type === 0 && item.hasResult) || (item.type === 1 && item.trainExamPeopleInfo && item.trainExamPeopleInfo.score > 0)) {
progress = 100
color = '#f29900'
text = '已完成'
}
item.progress = progress
item.color = color
item.text = text
// item.showResult = dayjs(item.examDate).isSameOrBefore(dayjs())
item.showResult = true
return item
})
}
}
const trainList = ref([])
const getTrainList = async () => {
const {data} = await userTrainListReq({
withProgress: true,
page: 1,
limit: 9999,
groupType: tabList.value[tabIndex.value].id
})
trainList.value = data.list
}
const taskLink = () => {
uni.navigateTo({
url: `/pages/promote/task?trainId=${this.trainInfoList[0].trainId}`
})
}
const matchList = ref([])
const getMatchList = async () => {
const {data} = await matchListReq({deleted: 0})
matchList.value = data.map(item => {
item.process = 50
item.color = '#57d801'
item.text = '进行中'
return item
})
}
const resultLink = ({
id,
type,
examId,
hasResult,
paper,
examDate,
needFinishAdventure,
hasFinishAdventure,
needFinishNormal,
hasFinishNormal
}) => {
if (type === 1) return
let url
if (needFinishAdventure === 1 && !hasFinishAdventure) return toast('请先完成游戏学')
if (needFinishNormal === 1 && !hasFinishNormal) return toast('请先完成常规学')
// url = `/pages/exam/exam?paperId=${examId}&title=${paper.title}&examType=0&examId=${id}`
url = `/pages/promote/exam?paperId=${examId}&title=${paper.title}&examType=0&examId=${id}`
// }
uni.navigateTo({url})
}
onLoad
(() => {
getTrainInfoList()
getTrainList()
getExamList()
getMatchList()
})
</script>
<style scoped lang="scss">
.title-box {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10rpx 0;
.title {
font-size: 32rpx;
font-weight: 600;
line-height: 40rpx;
color: $black-color;
}
.link {
position: relative;
padding-right: 30rpx;
font-size: 24rpx;
line-height: 32rpx;
color: $grey-color;
&::after {
position: absolute;
right: 10rpx;
top: 50%;
z-index: 90;
display: block;
margin-top: -6rpx;
transform: rotate(45deg);
content: '';
width: 12rpx;
height: 12rpx;
border-top: 1px solid $grey-color;
border-right: 1px solid $grey-color;
}
}
}
.tab-box {
white-space: nowrap;
padding: 10rpx 0rpx;
.tab-item {
position: relative;
z-index: 9;
display: inline-block;
margin-right: 20rpx;
padding: 10rpx 4rpx;
font-size: 24rpx;
line-height: 40rpx;
color: $dark-color;
&:last-child {
margin-right: 0;
}
}
.active {
font-weight: 600;
color: $black-color;
&::after {
position: absolute;
left: 0;
bottom: 10rpx;
z-index: -1;
content: '';
width: 100%;
height: 12rpx;
background: $blue-color;
}
}
}
.layout {
padding: 20rpx 30rpx;
}
.train-box {
padding: 20rpx 0 30rpx;
}
.swiper-train {
width: 100%;
height: 460rpx;
}
.train-item {
width: 700rpx;
height: auto;
.name {
padding: 20rpx 0;
}
}
.exam-box {
padding: 10rpx 0 20rpx;
.exam-item {
display: flex;
align-items: center;
margin-top: 24rpx;
padding: 24rpx 24rpx;
border-radius: 16rpx;
border: 1px solid #6c6c6c;
overflow: hidden;
}
.info {
position: relative;
flex: 1;
margin-right: 20rpx;
.fen {
margin-top: 8rpx;
font-size: 24rpx;
line-height: 32rpx;
color: #bababa;
}
}
.info-1 {
min-height: 80rpx;
&::after {
position: absolute;
right: 0%;
top: 50%;
z-index: 9;
margin-top: -25rpx;
content: '';
width: 1px;
height: 50rpx;
background: #f3f3f3;
}
}
.look {
display: inline-block;
width: 110rpx;
height: 44rpx;
font-size: 24rpx;
line-height: 44rpx;
color: #fff;
text-align: center;
border-radius: 22rpx;
background: #00abf4;
}
.between {
display: flex;
align-items: center;
.ren {
width: 100rpx;
font-size: 24rpx;
line-height: 40rpx;
color: $grey-color;
}
.progress {
flex: 1;
margin-right: 20rpx;
}
}
}
.shen-box {
padding: 20rpx 0;
.shen-item {
padding: 10rpx 0;
font-size: 30rpx;
line-height: 40rpx;
color: $dark-color;
}
}
.record-item {
display: flex;
align-items: center;
margin-top: 24rpx;
padding: 40rpx 30rpx;
border-radius: 16rpx;
border: 1px solid $grey-color;
overflow: hidden;
.text {
flex: 1;
margin-right: 20rpx;
font-size: 28rpx;
font-weight: 600;
line-height: 40rpx;
color: $black-color;
}
.time {
font-size: 28rpx;
line-height: 40rpx;
font-weight: 600;
color: $green-color;
}
.round {
display: flex;
justify-content: center;
align-items: center;
width: 100rpx;
height: 100rpx;
border: 1px solid $grey-color;
border-radius: 50%;
font-size: 24rpx;
color: $grey-color;
}
}
</style>