修改显示方式

This commit is contained in:
zhangsir
2024-07-10 16:08:51 +08:00
parent 761340fd6e
commit d1061455f6
3 changed files with 769 additions and 14 deletions

View File

@@ -6,6 +6,10 @@
<u-search :clearabled="true" @search="loadBoeData(true)" @clear="loadBoeData(true)"
placeholder="搜索关键字" v-model="loadkeyword" :showAction="false" shape="square" bgColor="##F2F5F7">
</u-search>
<view class="textbtns" @click="()=>{showSearch = true;firstType = 0;endType = 0;boeStatus = '';typeListData=''}">
<text>筛选</text>
<!-- <u-icon style="margin-left: 18upx;" name="arrow-down"></u-icon> -->
</view>
</view>
<view class="searchView" v-show="tabIndex===1">
<u-search :clearabled="true" @search="searchData()" @clear="searchData()"
@@ -15,18 +19,18 @@
</view>
<view class="tabbar" style="position: relative;padding-bottom: 20upx;">
<view class="tabbar-item" style="text-align: right;margin-right: 26upx;margin-left: 42upx;" @click="clicktab(0)" :class="{'active':tabIndex===0}">
<u-badge :type="type" max="99" :value="value" class="tabber-co"></u-badge>学习任务
<u-badge :type="type" max="99" :value="value" class="tabber-co"></u-badge>我的必修
<view class="border-bottom-one"></view>
</view>
<view class="tabbar-item" style="text-align: left;margin-left: 26upx;" @click="clicktab(1)" :class="{'active':tabIndex===1}">
报名<view class="border-bottom-two"></view>
我的选修<view class="border-bottom-two"></view>
</view>
<view class="tabbar-item" style="text-align: left;margin-left: 52upx;" @click="clicktab(2)" :class="{'active':tabIndex===2}">
<!-- <view class="tabbar-item" style="text-align: left;margin-left: 52upx;" @click="clicktab(2)" :class="{'active':tabIndex===2}">
成长路径<view class="border-bottom-two"></view>
</view>
</view> -->
</view>
<!-- 筛选状态 -->
<view class="addition" v-show="tabIndex===0">
<!-- <view class="addition" v-show="tabIndex===0">
<view class="textbtn" style="color:#666;font-size: 28upx;" @click="statusSelectShow = !statusSelectShow">
<text>筛选</text>
<u-icon style="margin-left: 18upx;" name="arrow-down"></u-icon>
@@ -36,7 +40,7 @@
{{status.name}}
</view>
</view>
</view>
</view> -->
<view class="addition" v-show="tabIndex===1">
<view class="textbtn" style="color:#666;font-size: 28upx;" @click="statusSelectShow = !statusSelectShow">
<text>筛选</text>
@@ -126,7 +130,7 @@
<uni-load-more :status="studyLoadStatus"></uni-load-more>
</view>
</view>
<view class="learn" v-show="tabIndex===2" v-if="Object.keys(detailData).length">
<!-- <view class="learn" v-show="tabIndex===2" v-if="Object.keys(detailData).length">
<view class="learn_header">
<view class="learn_left">
<text class="text">我的成长路径</text>
@@ -149,7 +153,7 @@
<view class="text_name">{{detailData.organizationName || ''}}</view>
<text> 学习状态<text :style="{color: ['#FFD500','#9FFF84','#FFFFFF '][detailData.studyStatus]}">{{detailData.studyStatus==0?'未开始':detailData.studyStatus==1?'已完成':'进行中'}}</text></text>
</view>
<!-- <view class="plan_item">
<view class="plan_item">
<image class="image" src="../../static/images/learnpath/file.png" mode=""></image>
<text class="text" @click="planDown = true">共享文档</text>
<view class="plan_down" v-show="planDown">
@@ -167,7 +171,7 @@
</view>
</view>
</view>
</view> -->
</view>
</view>
<view class="body_item" v-if="detailData.remark">
<view class="body_top">
@@ -197,11 +201,11 @@
</view>
</view>
<view class="plan_right">
<!-- <view>总进度</view>
<view>总进度</view>
<view>{{Number(((detailData.overallCompletionRate || 0)*100).toFixed(2))}}%</view>
<view class="line">
<u-line-progress :percentage="Number(((detailData.overallCompletionRate || 0)*100).toFixed(2))" activeColor="#387DF7"></u-line-progress>
</view> -->
</view>
<view class="semi-circle-progress">
<view class="progress-bar">
<view class="item">
@@ -218,15 +222,15 @@
{{detailData.overallCompletionRate==0?'开始学习':detailData.overallCompletionRate==1?'回顾':'继续学习'}}
</view>
</view>
</view>
<view class="learn" v-show="tabIndex===2" v-else>
</view> -->
<!-- <view class="learn" v-show="tabIndex===2" v-else>
<u-empty
mode="data"
icon="http://cdn.uviewui.com/uview/empty/data.png"
style="height: 75vh;"
>
</u-empty>
</view>
</view> -->
<u-modal :show="studyResetShow" :showCancelButton="true" @cancel="cancelResetStudy" @confirm="resetStudy" ref="uModal" :asyncClose="true">
您确定要重新学习吗
</u-modal>
@@ -294,6 +298,40 @@
</view>
</view>
</u-modal>
<u-popup :show="showSearch" mode="top" @close="close" @open="open">
<view class="popup_item">
<u-icon @click="showSearch = false" style="width: 30rpx;height: 30rpx;position: absolute;left: 20rpx;top: 40rpx;" name="arrow-left"></u-icon>
<view class="searchView" style="margin-left: 70rpx;" v-show="tabIndex===0">
<u-search :clearabled="true" @search="loadBoeData(true)" @clear="loadBoeData(true)"
placeholder="搜索关键字" v-model="loadkeyword" :showAction="false" shape="square" bgColor="##F2F5F7">
</u-search>
</view>
<view class="item">
<view class="title">类型</view>
<view class="list">
<view :class="firstType == index? 'active_btn': ''" @click="activeItem(item)" class="btn" v-for="(item,index) in typeData" :key="index">
{{item.name}}
</view>
</view>
</view>
<view class="item">
<view class="title">状态</view>
<view class="list">
<view :class="endType == index? 'active_btn': ''" @click="activeItemTwo(item)" class="btn" v-for="(item,index) in statusData" :key="index">
{{item.name}}
</view>
</view>
</view>
<view class="footer">
<view class="btn left" @click="showSearch = false">
取消
</view>
<view class="btn right" @click="loadBoeData(true)">
确定
</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
@@ -311,6 +349,23 @@
},
data() {
return {
firstType: 0,
endType: 0,
typeListData: '',
typeData: [
{name: '全部',value: 1},
{name: '领导力必修',value: 2},
{name: '专业力必修',value: 3},
{name: '定制化学习',value: 4},
// {name: '通用力学习',value: 5},
],
statusData: [
{name: '全部',value: 1},
{name: '未开始',value: 2},
{name: '进行中',value: 3},
{name: '已完成',value: 4},
],
showSearch: false,
detailData: {},
planDown: false,
upContent: false,
@@ -420,6 +475,18 @@
}
}
});
getList(this.userInfo.aid).then(res=>{
if(res.code == 200 ){
this.detailData = res.data
if(Object.keys(this.detailData).length){
if(res.data.studyStatus == 1){
this.detailData.studyStatus = 2
}else if(res.data.studyStatus == 2){
this.detailData.studyStatus = 1
}
}
}
})
},
onPullDownRefresh() {
this.onReachBottom();
@@ -450,6 +517,14 @@
}
},
methods: {
activeItem(item){
this.firstType = item.value - 1
this.typeListData = item.value - 2
},
activeItemTwo(item){
this.endType = item.value - 1
this.boeStatus = item.value - 2
},
goLearn() {
uni.navigateTo({
url: '/pages/learnPath/learnPath?growId='+this.detailData.growId+'&name='+this.detailData.growName + '&isAllPath=' + true
@@ -645,6 +720,12 @@
},
// 学习任务跳转详情
loaddetail(task) {
if('growId' in task){
uni.navigateTo({
url:'/pages/learnPath/growPage'
})
return
}
// uni.navigateTo({
// url: '/pages/study/loaddetail?id=' + task.cmtask_id
// });
@@ -673,6 +754,10 @@
},
loadBoeData(flag) {
if(this.boeStatus == -1){
this.boeStatus = ''
}
this.showSearch = false
if (flag) {
this.taskPageIndex = 1; //回到首页
this.couresList = [];
@@ -683,10 +768,23 @@
pageSize: this.taskPageSize,
cmtask_user_status: this.boeStatus,
cmtask_name: this.loadkeyword,
type: this.typeListData
}
if (this.cmtask_name) {
params.cmtask_name = this.keyWord;
}
if(this.typeListData == 1){
if(Object.keys(this.detailData).length){
if(this.boeStatus === '' || this.boeStatus == this.detailData.studyStatus){
this.detailData.cmtask_name = this.detailData.growName
this.detailData.cmtask_user_status = this.detailData.studyStatus
this.couresList.push(this.detailData)
}
}
this.taskHasMore = true;
this.loadStatus='noMore';
return
}
apiManage.userTaskList(params).then(res => {
if(res.code==200){
@@ -924,6 +1022,57 @@
padding: 33px 25px 33px 25px;
background: linear-gradient( 180deg, #E8ECFF 0%, #FFFFFF 100%);
}
.popup_item{
padding-top: 20rpx;
.item{
margin-top: 60rpx;
.title{
margin-bottom: 30rpx;
margin-left: 30rpx;
}
.list{
display: flex;
margin: 0 20rpx 0 20rpx ;
justify-content: space-between;
align-items: center;
.btn{
width: 130rpx;
height: 60rpx;
font-size: 10px;
text-align: center;
line-height: 60rpx;
border-radius: 5px;
background-color: #F9F9F9;
color: #A7ACBA;
}
.active_btn{
background-color: #3162FA;
color: #ffffff;
}
}
}
.footer{
width: 100%;
margin-top: 100rpx;
display: flex;
.btn{
width: 50%;
height: 60rpx;
line-height: 60rpx;
text-align: center;
}
.left{
color: #000000;
background-color: #fff;
border-top: 1px solid #A7ACBA;
}
.right{
color: #ffffff;
background-color: #3161FA;
border-top: 1px solid #3161FA;
}
}
}
.item_modal{
.item_title{
@@ -1371,6 +1520,7 @@
}
}
.searchView {
position: relative;
margin-left: 32upx;
line-height: 62upx;
height: 72upx;
@@ -1382,6 +1532,10 @@
width: 195px;
border-radius: 76upx !important;
}
.textbtns{
position: absolute;
right: -42px;
}
}
.course-aut{
font-size: 24upx;
@@ -1678,6 +1832,7 @@
height: 50px;
line-height: 50px;
display: flex;
justify-content: center;
color: #666;
font-size: 32upx;
.tabbar-item {