This commit is contained in:
Pengxiansen
2025-02-17 10:28:12 +08:00
parent 685bc58c2e
commit 911ff98491
28 changed files with 249 additions and 186 deletions

View File

@@ -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" : {}

View File

@@ -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

Binary file not shown.

After

Width:  |  Height:  |  Size: 462 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 390 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 528 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.9 KiB

View File

@@ -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>

Binary file not shown.

After

Width:  |  Height:  |  Size: 462 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 390 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 528 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 462 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long