提交
@@ -73,9 +73,16 @@
|
|||||||
"devServer" : {
|
"devServer" : {
|
||||||
"https" : false,
|
"https" : false,
|
||||||
"proxy" : {
|
"proxy" : {
|
||||||
"/professional" : {
|
// "/professional" : {
|
||||||
|
// // "target" : "https://u.boe.com",
|
||||||
|
// "target" : " http://192.168.150.97:32002",
|
||||||
|
// "changeOrigin" : true,
|
||||||
|
// "secure" : false,
|
||||||
|
// "pathRewrite" : {}
|
||||||
|
// },
|
||||||
|
"/growth" : {
|
||||||
|
"target" : "https://u-pre.boe.com",
|
||||||
// "target" : "https://u.boe.com",
|
// "target" : "https://u.boe.com",
|
||||||
"target" : " http://192.168.150.97:32002",
|
|
||||||
"changeOrigin" : true,
|
"changeOrigin" : true,
|
||||||
"secure" : false,
|
"secure" : false,
|
||||||
"pathRewrite" : {}
|
"pathRewrite" : {}
|
||||||
|
|||||||
@@ -1,100 +1,138 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="growth">
|
<view class="growth">
|
||||||
<page-title :showBack="true">专业力必修</page-title>
|
<u-navbar
|
||||||
<view class="title">
|
title="专业力必修"
|
||||||
<view class="title-text" @click="openTip">
|
bgColor="rgba(0,0,0,0)"
|
||||||
<view style="margin-right: 8rpx">专业力必修</view>
|
:safeAreaInsetTop="true"
|
||||||
<u-icon name="question-circle-fill" color="#686868" size="20"></u-icon>
|
placeholder
|
||||||
</view>
|
leftIconColor="#fff"
|
||||||
<view v-if="selectData" class="select" @click="show = true">
|
autoBack
|
||||||
<image src="../../static/images/icon/qiehuan.jpg"></image>
|
fixed
|
||||||
<view>切换</view>
|
titleStyle="color:#fff"
|
||||||
</view>
|
>
|
||||||
</view>
|
<template slot="right">
|
||||||
|
<view class="select-growth" @click="show = true">
|
||||||
|
<u-image
|
||||||
|
width="30rpx"
|
||||||
|
height="30rpx"
|
||||||
|
src="@/static/images/growth/qiehuan.png"
|
||||||
|
></u-image>
|
||||||
|
<div style="margin-left: 4px">切换岗位</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</u-navbar>
|
||||||
|
|
||||||
<!-- 有数据 -->
|
<!-- 有数据 -->
|
||||||
<template v-if="selectData">
|
<template v-if="selectData">
|
||||||
<view class="container">
|
<view class="growth-name">
|
||||||
<view class="growth-name">{{ selectData.growthName }}</view>
|
{{ selectData.growthName }}
|
||||||
<view class="growth-state">
|
</view>
|
||||||
<view>学习状态:</view>
|
<view class="growth-state">
|
||||||
<view
|
<view
|
||||||
:style="{
|
:style="{
|
||||||
color:
|
color:
|
||||||
selectData.learningState === 0
|
|
||||||
? '#fe9400'
|
|
||||||
: selectData.learningState === 1
|
|
||||||
? '#6ba158'
|
|
||||||
: '#0079ee',
|
|
||||||
}"
|
|
||||||
>{{
|
|
||||||
selectData.learningState === 0
|
selectData.learningState === 0
|
||||||
? "未开始"
|
? '#fe9400'
|
||||||
: selectData.learningState === 1
|
: selectData.learningState === 1
|
||||||
? "已完成"
|
? '#6ba158'
|
||||||
: "进行中"
|
: '#ff8726',
|
||||||
}}</view
|
}"
|
||||||
|
>{{
|
||||||
|
selectData.learningState === 0
|
||||||
|
? "学习未开始"
|
||||||
|
: selectData.learningState === 1
|
||||||
|
? "学习已完成"
|
||||||
|
: "学习进行中"
|
||||||
|
}}</view
|
||||||
|
>
|
||||||
|
</view>
|
||||||
|
<view class="growth-tip">
|
||||||
|
<view class="growth-tip-content">
|
||||||
|
<view class="tip-title"> 说明 </view>
|
||||||
|
<view class="tip-content">
|
||||||
|
{{ selectData.description || "暂无说明" }}</view
|
||||||
>
|
>
|
||||||
</view>
|
</view>
|
||||||
<view class="growth-tip">
|
</view>
|
||||||
<view class="tip-title">
|
<view class="growth-progress">
|
||||||
<image src="../../static/images/shuoming.jpg" />
|
<view class="progress-title">
|
||||||
<view>说明</view>
|
<view class="line"></view>
|
||||||
</view>
|
<view class="text">{{ `学习进度` }}</view>
|
||||||
<view class="tip-text">
|
<view class="line"></view>
|
||||||
{{ selectData.description || "暂无说明" }}
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="growth-progress">
|
<view class="progress-total">
|
||||||
<view class="progress-title">
|
{{ `总任务:${selectData.totalTaskNum} 个` }}
|
||||||
<image src="../../static/images/jindu.jpg" />
|
</view>
|
||||||
<view>学习进度</view>
|
<view class="progress-card">
|
||||||
|
<view class="progress-card-item">
|
||||||
|
<view
|
||||||
|
style="
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<view class="label">必修进度</view>
|
||||||
|
<view class="rate">{{ requiredTaskCompletionRate }}%</view>
|
||||||
|
</view>
|
||||||
|
<view class="progress">
|
||||||
|
<u-line-progress
|
||||||
|
active-color="#0077EC"
|
||||||
|
:showText="false"
|
||||||
|
inactive-color="#E5E7EB"
|
||||||
|
:percentage="requiredTaskCompletionRate"
|
||||||
|
height="3"
|
||||||
|
></u-line-progress>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="progress-text">
|
<view class="progress-card-item">
|
||||||
<view class="total">总任务:{{ selectData.totalTaskNum }}个</view>
|
<view
|
||||||
<view class="progress-item">
|
style="
|
||||||
<view class="label"> 必修进度</view>
|
display: flex;
|
||||||
<view class="value">
|
justify-content: space-between;
|
||||||
<u-line-progress
|
align-items: center;
|
||||||
active-color="#2979ff"
|
"
|
||||||
:showText="false"
|
>
|
||||||
inactive-color="#a6d0f9"
|
<view class="label">选修进度</view>
|
||||||
:percentage="requiredTaskCompletionRate"
|
<view class="rate">{{ electiveTaskCompletionRate }}%</view>
|
||||||
height="20rpx"
|
|
||||||
></u-line-progress>
|
|
||||||
</view>
|
|
||||||
<view class="text">{{ requiredTaskCompletionRate }}%</view>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="progress-item">
|
<view class="progress">
|
||||||
<view class="label"> 选修进度</view>
|
<u-line-progress
|
||||||
<view class="value">
|
active-color="#0077EC"
|
||||||
<u-line-progress
|
:showText="false"
|
||||||
active-color="#2979ff"
|
inactive-color="#E5E7EB"
|
||||||
:showText="false"
|
:percentage="electiveTaskCompletionRate"
|
||||||
inactive-color="#a6d0f9"
|
height="3"
|
||||||
:percentage="electiveTaskCompletionRate"
|
></u-line-progress>
|
||||||
height="20rpx"
|
|
||||||
></u-line-progress>
|
|
||||||
</view>
|
|
||||||
<view class="text">{{ electiveTaskCompletionRate }}%</view>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="progress-item">
|
</view>
|
||||||
<view class="label"> 总进度</view>
|
<view class="progress-card-item">
|
||||||
<view class="value">
|
<view
|
||||||
<u-line-progress
|
style="
|
||||||
active-color="#2979ff"
|
display: flex;
|
||||||
:showText="false"
|
justify-content: space-between;
|
||||||
inactive-color="#a6d0f9"
|
align-items: center;
|
||||||
:percentage="totalTaskCompletionRate"
|
"
|
||||||
height="20rpx"
|
>
|
||||||
></u-line-progress>
|
<view class="label">总进度</view>
|
||||||
</view>
|
<view class="rate">{{ totalTaskCompletionRate }}%</view>
|
||||||
<view class="text">{{ totalTaskCompletionRate }}%</view>
|
</view>
|
||||||
|
<view class="progress">
|
||||||
|
<u-line-progress
|
||||||
|
active-color="#0077EC"
|
||||||
|
:showText="false"
|
||||||
|
inactive-color="#E5E7EB"
|
||||||
|
:percentage="totalTaskCompletionRate"
|
||||||
|
height="3"
|
||||||
|
></u-line-progress>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="confirm" @click="loaddetail">
|
</view>
|
||||||
<view>学习</view>
|
<view class="confirm" @click="loaddetail">
|
||||||
</view>
|
<view>{{
|
||||||
|
selectData.learningState == 2 ? "继续学习" : "开始学习"
|
||||||
|
}}</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
<!-- 无数据 -->
|
<!-- 无数据 -->
|
||||||
@@ -180,18 +218,14 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
toBack() {
|
||||||
|
uni.navigateBack();
|
||||||
|
},
|
||||||
// 切换任务
|
// 切换任务
|
||||||
select({ value }) {
|
select({ value }) {
|
||||||
this.selectData = value[0];
|
this.selectData = value[0];
|
||||||
this.show = false;
|
this.show = false;
|
||||||
},
|
},
|
||||||
openTip() {
|
|
||||||
uni.showModal({
|
|
||||||
showCancel: false,
|
|
||||||
content:
|
|
||||||
"根据您所在的组织、标准岗位、任职资格等级,已为您匹配专业力必修任务,抓紧时间学习吧~",
|
|
||||||
});
|
|
||||||
},
|
|
||||||
// 学习任务跳转详情
|
// 学习任务跳转详情
|
||||||
loaddetail(task) {
|
loaddetail(task) {
|
||||||
let taskUrl = "";
|
let taskUrl = "";
|
||||||
@@ -215,110 +249,131 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
page {
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
.growth {
|
.growth {
|
||||||
.container {
|
background-image: url(@/static/images/growth/bg.png);
|
||||||
margin: 0 20rpx;
|
background-size: 100% 100%;
|
||||||
background-image: linear-gradient(to bottom, #e2eefd 0rpx, #fff 200rpx);
|
background-repeat: no-repeat;
|
||||||
border: 1rpx solid #e2eefd;
|
min-height: 100vh;
|
||||||
border-radius: 20rpx 20rpx 0 0;
|
font-family: PingFang SC;
|
||||||
padding: 16rpx 28rpx;
|
.select-growth {
|
||||||
.confirm {
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 188rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
background: rgba(255, 255, 255, 0.2);
|
||||||
|
border-radius: 30rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.confirm {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 114rpx;
|
||||||
|
view {
|
||||||
|
width: 560rpx;
|
||||||
|
height: 88rpx;
|
||||||
|
line-height: 88rpx;
|
||||||
|
text-align: center;
|
||||||
|
background: linear-gradient(0deg, #266eff 0%, #528bff 100%);
|
||||||
|
box-shadow: 0px 5rpx 15rpx 0rpx rgba(42, 112, 255, 0.5);
|
||||||
|
border-radius: 44rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.growth-progress {
|
||||||
|
margin-top: 35rpx;
|
||||||
|
.progress-card {
|
||||||
|
background: #ffffff;
|
||||||
|
padding: 30rpx 27rpx 21rpx 27rpx;
|
||||||
|
margin: 42rpx 50rpx 0 50rpx;
|
||||||
|
box-shadow: 0px 10px 15px 0px rgba(44, 106, 231, 0.2);
|
||||||
|
border-radius: 16rpx;
|
||||||
|
.progress-card-item {
|
||||||
|
.label {
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.rate {
|
||||||
|
font-weight: 700;
|
||||||
|
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #0077ec;
|
||||||
|
}
|
||||||
|
.progress {
|
||||||
|
margin-top: 17rpx;
|
||||||
|
margin-bottom: 44rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.progress-total {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
margin-top: 14rpx;
|
||||||
|
}
|
||||||
|
.progress-title {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
padding: 45rpx 0 30rpx 0;
|
|
||||||
view {
|
|
||||||
width: 190rpx;
|
|
||||||
height: 64rpx;
|
|
||||||
border-radius: 10rpx;
|
|
||||||
background-color: #0079ee;
|
|
||||||
box-sizing: border-box;
|
|
||||||
color: #ffffff;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.progress-item {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-bottom: 28rpx;
|
.line {
|
||||||
.label {
|
width: 40rpx;
|
||||||
width: 160rpx;
|
height: 6rpx;
|
||||||
}
|
background: #ffffff;
|
||||||
.value {
|
border-radius: 3rpx;
|
||||||
flex: 1;
|
opacity: 0.8;
|
||||||
|
margin: 0 32rpx;
|
||||||
}
|
}
|
||||||
.text {
|
.text {
|
||||||
color: #0079ee;
|
font-size: 36rpx;
|
||||||
margin-left: 8rpx;
|
color: #ffffff;
|
||||||
|
opacity: 0.8;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.progress-title {
|
}
|
||||||
margin-top: 34rpx;
|
.growth-tip {
|
||||||
}
|
background-image: url(@/static/images/growth/card-top.png);
|
||||||
.progress-text {
|
background-size: 100%;
|
||||||
padding-left: 14rpx;
|
background-repeat: no-repeat;
|
||||||
.total {
|
margin: 38rpx 26rpx 0 26rpx;
|
||||||
margin: 64rpx 0 56rpx 0;
|
padding: 45rpx 24rpx 0 24rpx;
|
||||||
|
.growth-tip-content {
|
||||||
|
background: linear-gradient(0deg, #dfe9ff 0%, #ffffff 100%);
|
||||||
|
border-radius: 0px 0px 16px 16px;
|
||||||
|
word-wrap: break-word;
|
||||||
|
.tip-title {
|
||||||
|
margin-left: 38rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #2f3f5a;
|
||||||
}
|
}
|
||||||
}
|
.tip-content {
|
||||||
.tip-title,
|
margin: 0 37rpx 0 46rpx;
|
||||||
.progress-title {
|
padding-bottom: 37rpx;
|
||||||
display: flex;
|
font-size: 28rpx;
|
||||||
align-items: center;
|
|
||||||
image {
|
|
||||||
width: 44rpx;
|
|
||||||
height: 44rpx;
|
|
||||||
}
|
|
||||||
view {
|
|
||||||
font-weight: 650;
|
|
||||||
color: #333333;
|
color: #333333;
|
||||||
margin-left: 10rpx;
|
line-height: 42px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.tip-text {
|
|
||||||
margin-top: 28rpx;
|
|
||||||
color: #333333;
|
|
||||||
line-height: 60rpx;
|
|
||||||
}
|
|
||||||
.growth-name {
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: #0079ee;
|
|
||||||
white-space: nowrap; /* 防止文本换行 */
|
|
||||||
overflow: hidden; /* 隐藏溢出的内容 */
|
|
||||||
text-overflow: ellipsis; /* 显示省略符号来代表被修剪的文本 */
|
|
||||||
}
|
|
||||||
.growth-state {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 28rpx;
|
|
||||||
justify-content: end;
|
|
||||||
margin-top: 40rpx;
|
|
||||||
color: #333333;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
.growth-name {
|
||||||
.title {
|
font-size: 30rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin: 24rpx 98rpx 24rpx 47rpx;
|
||||||
|
}
|
||||||
|
.growth-state {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: flex-end;
|
||||||
padding: 20rpx 40rpx;
|
font-size: 28rpx;
|
||||||
}
|
justify-content: end;
|
||||||
.title-text {
|
view {
|
||||||
display: flex;
|
padding: 16rpx 26rpx;
|
||||||
align-items: center;
|
background: #ffffff;
|
||||||
}
|
border-radius: 50rpx 0px 0px 50rpx;
|
||||||
.select {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
font-size: 20rpx;
|
|
||||||
align-items: center;
|
|
||||||
image {
|
|
||||||
width: 30rpx;
|
|
||||||
height: 30rpx;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
BIN
static/images/growth/bg.png
Normal file
|
After Width: | Height: | Size: 462 KiB |
BIN
static/images/growth/card-top.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
static/images/growth/qiehuan.png
Normal file
|
After Width: | Height: | Size: 390 B |
|
Before Width: | Height: | Size: 528 B |
|
Before Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 2.9 KiB |
2
unpackage/dist/build/h5/index.html
vendored
@@ -19,4 +19,4 @@
|
|||||||
hm.src = "https://hm.baidu.com/hm.js?ea89f02dca369037a73c5e3907e2c14a";
|
hm.src = "https://hm.baidu.com/hm.js?ea89f02dca369037a73c5e3907e2c14a";
|
||||||
var s = document.getElementsByTagName("script")[0];
|
var s = document.getElementsByTagName("script")[0];
|
||||||
s.parentNode.insertBefore(hm, s);
|
s.parentNode.insertBefore(hm, s);
|
||||||
})();</script></head><body><div id=app></div><script src=/mobile/static/js/chunk-vendors.bb72ee6e.js></script><script src=/mobile/static/js/index.1cafccca.js></script></body></html>
|
})();</script></head><body><div id=app></div><script src=/mobile/static/js/chunk-vendors.bb72ee6e.js></script><script src=/mobile/static/js/index.f2b4d384.js></script></body></html>
|
||||||
BIN
unpackage/dist/build/h5/static/images/growth/bg.png
vendored
Normal file
|
After Width: | Height: | Size: 462 KiB |
BIN
unpackage/dist/build/h5/static/images/growth/card-top.png
vendored
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
unpackage/dist/build/h5/static/images/growth/qiehuan.png
vendored
Normal file
|
After Width: | Height: | Size: 390 B |
|
Before Width: | Height: | Size: 528 B |
BIN
unpackage/dist/build/h5/static/images/jindu.jpg
vendored
|
Before Width: | Height: | Size: 2.9 KiB |
BIN
unpackage/dist/build/h5/static/images/shuoming.jpg
vendored
|
Before Width: | Height: | Size: 2.9 KiB |
BIN
unpackage/dist/build/h5/static/img/bg.35d83674.png
vendored
Normal file
|
After Width: | Height: | Size: 462 KiB |
BIN
unpackage/dist/build/h5/static/img/card-top.f54b4779.png
vendored
Normal file
|
After Width: | Height: | Size: 16 KiB |