Skip to content

E
educationStu
Commit 036fc508 authored by zhengke's avatar zhengke
Browse files
Options

修改

parent ba23f732
Hide whitespace changes
Inline Side-by-side
Showing with 113 additions and 103 deletions
src/pages/study/courseList.vue
View file @ 036fc508
<style scoped> <style scoped>
.studyCourse { .studyCourse {
/* width: 100%; */ /* width: 100%; */
/* height: 100vh; */ min-height: 100vh;
background: #F5F5F5; background: #F5F5F5;
padding: 32rpx; padding: 32rpx;
box-sizing: border-box; box-sizing: border-box;
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
.Course_List { .Course_List {
width: 100%; width: 100%;
height: auto; height: auto;
border-bottom:1px solid #F5F5F5; border-bottom: 1px solid #F5F5F5;
} }
.CourseList_One { .CourseList_One {
...@@ -42,7 +42,7 @@ ...@@ -42,7 +42,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
background-color: #FFFFFF; background-color: #FFFFFF;
padding:0 30rpx; padding: 0 30rpx;
} }
.Course_Name { .Course_Name {
...@@ -61,95 +61,103 @@ ...@@ -61,95 +61,103 @@
font-size: 22rpx; font-size: 22rpx;
margin-top: 28rpx; margin-top: 28rpx;
} }
.Course_SeName{
width:50%; .Course_SeName {
margin:0 20rpx; width: 50%;
margin: 0 20rpx;
} }
.Course_Two{
.Course_Two {
background-color: #EBEBEB; background-color: #EBEBEB;
height:200rpx; height: 200rpx;
width:100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.Course_Two>view{
flex:0 0 33.3%; .Course_Two>view {
flex: 0 0 33.3%;
text-align: center; text-align: center;
} }
.Course_Two img{
width:90rpx; .Course_Two img {
height:90rpx; width: 90rpx;
height: 90rpx;
} }
.Course_Opera{
.Course_Opera {
color: #666666; color: #666666;
font-size:22rpx; font-size: 22rpx;
text-align: center; text-align: center;
margin-top:5rpx; margin-top: 5rpx;
} }
.loading { .loading {
position: fixed; position: fixed;
z-index: 9999; z-index: 9999;
left:0; left: 0;
top:0; top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
</style> </style>
<template> <template>
<view class="studyCourse"> <view class="studyCourse">
<view class="Course_Top"> <template v-if="ChapterList.length>0">
<view class="CourseBan">《{{CourseName}}》</view> <view class="Course_Top">
<view class="CourseTotal" v-if="TotalHours>0">共 {{TotalHours}}课</view> <view class="CourseBan">《{{CourseName}}》</view>
</view> <view class="CourseTotal" v-if="TotalHours>0">共 {{TotalHours}}课</view>
<div class="loading" v-if="isShowLoad"> </view>
<van-loading type="spinner" color="#fff" /> <div class="loading" v-if="isShowLoad">
</div> <van-loading type="spinner" color="#fff" />
<view class="Course_Bottom" v-if="ChapterList.length>0"> </div>
<view class="Course_List" v-for="(item,index) in ChapterList" :key="index"> <view class="Course_Bottom">
<view class="CourseList_One" @click="getReview(index)"> <view class="Course_List" v-for="(item,index) in ChapterList" :key="index">
<view> <view class="CourseList_One" @click="getReview(index)">
<van-circle :value="item.StudyProgress" layer-color="#E4E5FB" :size="75" color="#4C50E7" :rate="100" :speed="100" :text="getSpeed(item.StudyProgress)" />
</view>
<view class="Course_SeName">
<view class="Course_Name">{{item.ChapterTree.ChapterName}}</view>
<view class="Course_Index">第{{item.ChapterTree.ChapterNo}}课</view>
</view>
<view>
<van-rate :value="item.Score" :size="20" readonly color="#FAC217"
void-color="#EBEBEB" void-icon="star" icon="star" :count="3" />
</view>
</view>
<view class="Course_Two" v-if="item.isShow" @click="goWordStudy(item,1)">
<view>
<view> <view>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/review.png" alt="" /> <van-circle :value="item.StudyProgress" layer-color="#E4E5FB" :size="75" color="#4C50E7"
:rate="100" :speed="100" :text="getSpeed(item.StudyProgress)" />
</view>
<view class="Course_SeName">
<view class="Course_Name">{{item.ChapterTree.ChapterName}}</view>
<view class="Course_Index">第{{item.ChapterTree.ChapterNo}}课</view>
</view> </view>
<view class="Course_Opera">课程回顾</view>
</view>
<view @click="goWordStudy(item,2)">
<view> <view>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/fuxi.png" alt="" /> <van-rate :value="item.Score" :size="20" readonly color="#FAC217" void-color="#EBEBEB"
void-icon="star" icon="star" :count="3" />
</view> </view>
<view class="Course_Opera">单词</view>
</view> </view>
<view> <view class="Course_Two" v-if="item.isShow" @click="goWordStudy(item,1)">
<view @click="jumpPage(`/pages/word/test?CourseId=0`)"> <view>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/ceshi.png" alt="" /> <view>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/review.png"
alt="" />
</view>
<view class="Course_Opera">课程回顾</view>
</view>
<view @click="goWordStudy(item,2)">
<view>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/fuxi.png"
alt="" />
</view>
<view class="Course_Opera">单词</view>
</view>
<view>
<view @click="jumpPage(`/pages/word/test?CourseId=0`)">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/ceshi.png"
alt="" />
</view>
<view class="Course_Opera">练习</view>
</view> </view>
<view class="Course_Opera">练习</view>
</view> </view>
</view> </view>
</view> </view>
</view> </template>
<van-empty v-else <van-empty description="暂无数据" v-else />
class="custom-image"
image="https://img01.yzcdn.cn/vant/custom-empty-image.png"
description="暂无数据"
/>
</view> </view>
</template> </template>
...@@ -171,75 +179,77 @@ ...@@ -171,75 +179,77 @@
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
title: "所有单词", title: "所有单词",
}); });
if(options.ClassId&&options.CourseId){ if (options.ClassId && options.CourseId) {
this.msg.ClassId = options.ClassId; this.msg.ClassId = options.ClassId;
this.msg.CourseId = options.CourseId this.msg.CourseId = options.CourseId
this.getChapterList(); this.getChapterList();
} }
if(options.CourseName){ if (options.CourseName) {
this.CourseName = options.CourseName this.CourseName = options.CourseName
} }
if(options.TotalHours){ if (options.TotalHours) {
this.TotalHours = options.TotalHours this.TotalHours = options.TotalHours
} }
}, },
setup(props) { setup(props) {
let { proxy } = getCurrentInstance(); let {
proxy
} = getCurrentInstance();
let data = reactive({ let data = reactive({
ChapterList: [], //课程列表 ChapterList: [], //课程列表
msg:{ msg: {
ClassId:0, ClassId: 0,
CourseId:0 CourseId: 0
}, },
CourseName:'', CourseName: '',
TotalHours:0, TotalHours: 0,
isShowLoad:false isShowLoad: false
}) })
let methods = { let methods = {
async getChapterList() { async getChapterList() {
data.isShowLoad=true; data.isShowLoad = true;
proxy.$request("/AppletIndex/GetMyStudyCourseChapterList", data.msg).then((res) => { proxy.$request("/AppletIndex/GetMyStudyCourseChapterList", data.msg).then((res) => {
data.isShowLoad=false; data.isShowLoad = false;
if(res.Code==1){ if (res.Code == 1) {
data.ChapterList = res.Data; data.ChapterList = res.Data;
data.ChapterList.forEach(x=>{ data.ChapterList.forEach(x => {
x.isShow=false x.isShow = false
}) })
} }
}); });
}, },
getSpeed(score){ getSpeed(score) {
if(score<100){ if (score < 100) {
return score+'%' return score + '%'
}else{ } else {
return '已学完' return '已学完'
} }
}, },
//点击展开 //点击展开
getReview(index){ getReview(index) {
data.ChapterList.forEach((x,i)=>{ data.ChapterList.forEach((x, i) => {
if(index!=i){ if (index != i) {
x.isShow=false; x.isShow = false;
} }
}) })
data.ChapterList[index].isShow=!data.ChapterList[index].isShow; data.ChapterList[index].isShow = !data.ChapterList[index].isShow;
}, },
jumpPage(url) { jumpPage(url) {
uni.navigateTo({ uni.navigateTo({
url: url, url: url,
}); });
}, },
goWordStudy(obj,Type){ goWordStudy(obj, Type) {
if(obj){ if (obj) {
let url = `/pages/word/wordStudy?CourseId=${obj.ChapterTree.CourseId}&&ChapterId=${obj.ChapterTree.ChapterId}&&ReviewChapterId=0&&Type=${Type}` let url =
`/pages/word/wordStudy?CourseId=${obj.ChapterTree.CourseId}&&ChapterId=${obj.ChapterTree.ChapterId}&&ReviewChapterId=0&&Type=${Type}`
uni.navigateTo({ uni.navigateTo({
url: url url: url
}); });
} }
} }
} }
onMounted(() => { onMounted(() => {})
})
let that = methods; let that = methods;
return { return {
...toRefs(data), ...toRefs(data),
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment