huoran
/
FE_occupationlab_client
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 14 Wiki Activity

教学中心增加我的课程

Browse Source
dev_202412
yujialong 2 months ago
parent 54844099c6
commit 153afffabb
3 changed files with 163 additions and 71 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/api/index.js
  2. 185
      src/pages/station/list/index.vue
  3. 47
      src/pages/station/preview/index.vue

2
src/api/index.js
Unescape View File

@ -95,6 +95,7 @@ export default {
// 实验记录 // 实验记录
schoolCourse: `nakadai/nakadai/curriculum/schoolCourse`, // 获取学校购买订单后的课程 schoolCourse: `nakadai/nakadai/curriculum/schoolCourse`, // 获取学校购买订单后的课程
selfBuildCourse: `nakadai/nakadai/curriculum/selfBuildCourse`,
curriculumListForBeforeLogin: `nakadai/nakadai/curriculum/curriculumListForBeforeLogin`, curriculumListForBeforeLogin: `nakadai/nakadai/curriculum/curriculumListForBeforeLogin`,
experimentOverview: `occupationlab/occupationlab/achievement/experimentOverview`, //实验概览 experimentOverview: `occupationlab/occupationlab/achievement/experimentOverview`, //实验概览
queryAssessmentByStudent: `occupationlab/occupationlab/achievement/queryAssessmentByStudent`, //学生端考核成绩 queryAssessmentByStudent: `occupationlab/occupationlab/achievement/queryAssessmentByStudent`, //学生端考核成绩
@ -131,6 +132,7 @@ export default {
getSubsection: `occupationlab/occupationlab/theoreticalCourseSubsection/getSubsection`, getSubsection: `occupationlab/occupationlab/theoreticalCourseSubsection/getSubsection`,
recentUse: `nakadai/nakadai/curriculum/recentUse`, recentUse: `nakadai/nakadai/curriculum/recentUse`,
recordRecentUsage: `nakadai/nakadai/curriculum/recordRecentUsage`, recordRecentUsage: `nakadai/nakadai/curriculum/recordRecentUsage`,
selfBuildCourse: `nakadai/nakadai/curriculum/selfBuildCourse`,
// 资讯 // 资讯
queryAllColumns: `occupationlab/occupationlab/information/column/queryAllColumns`, // 栏目树 queryAllColumns: `occupationlab/occupationlab/information/column/queryAllColumns`, // 栏目树

185
src/pages/station/list/index.vue
Unescape View File

@ -1,6 +1,6 @@
<template> <template>
<!-- 实验台 --> <!-- 实验台 -->
<div class="wrap index"> <div class="wrap index" v-loading="loading">
<div class="search"> <div class="search">
<h6>创新实验，智能教学</h6> <h6>创新实验，智能教学</h6>
<div class="input"> <div class="input">
@ -11,9 +11,18 @@
<div class="station"> <div class="station">
<div class="inner"> <div class="inner">
<div class="tabs"> <div class="tabs">
<a class="item" v-for="(item, i) in tabs" :key="i" :class="{ active: item.classificationId === active }" <a class="item" v-for="(item, i) in types" :key="i" :class="{ active: item.id === typeActive }"
@click="tabChange(item)">{{ item.classificationName }}</a> @click="tabChange(item)">{{ item.name }}</a>
</div> </div>
<div class="tab-wrap">
<span class="label">课程类型</span>
<div class="tabs1">
<a class="item" v-for="(item, i) in tabs" :key="i" :class="{ active: item.classificationId === active }"
@click="tab1Change(item)">{{ item.classificationName }}</a>
</div>
</div>
<div class="curs"> <div class="curs">
<template v-if="products.length"> <template v-if="products.length">
<div v-for="(item, i) in products" class="item" :title="item.goodsName" @click="toProduct(item)" :key="i"> <div v-for="(item, i) in products" class="item" :title="item.goodsName" @click="toProduct(item)" :key="i">
@ -21,7 +30,7 @@
<div v-else class="cover" :style="{ backgroundImage: 'url(' + item.coverUrl + ')' }"></div> <div v-else class="cover" :style="{ backgroundImage: 'url(' + item.coverUrl + ')' }"></div>
<div class="bottom"> <div class="bottom">
<p class="text"><span>{{ item.goodsName || item.curriculumName }}</span></p> <p class="text"><span>{{ item.goodsName || item.curriculumName }}</span></p>
<a v-if="!item.isInEffect">续费</a> <a v-if="!typeActive && !item.isInEffect">续费</a>
<a v-else>进入实验</a> <a v-else>进入实验</a>
</div> </div>
</div> </div>
@ -61,10 +70,34 @@ export default {
isZj: location.host === '10.60.32.76', // 浙江万里 isZj: location.host === '10.60.32.76', // 浙江万里
isSq: Setting.isSq, isSq: Setting.isSq,
keyword: this.$route.query.keyword || '', keyword: this.$route.query.keyword || '',
active: +this.$route.query.active || 0, typeActive: +this.$route.query.typeActive || 0,
active: +this.$route.query.active || '',
searchTimer: null, searchTimer: null,
types: [
{
id: 0,
name: '校本课程'
},
{
id: 1,
name: '我的课程'
},
],
defaultTypes: [],
selfBuildCourseType: [],
defaultTabs: [
{
classificationId: '',
classificationName: '全部',
},
{
classificationId: -1,
classificationName: '最近使用',
},
],
tabs: [], tabs: [],
products: [], products: [],
loading: false,
linkVisible: false, linkVisible: false,
links: [], links: [],
@ -83,36 +116,44 @@ export default {
methods: { methods: {
// 获取tab // 获取tab
async getTab () { async getTab () {
const { data } = await this.$get(this.api.getSchoolCourseAuthority) const res = await this.$get(this.api.getSchoolCourseAuthority)
this.defaultTypes = res.data
this.selfBuildCourseType = res.selfBuildCourseType
this.tabs = [ this.tabs = [
{ ...this.defaultTabs,
classificationId: 0, ...res.data,
classificationName: '最近使用',
},
{
classificationId: -1,
classificationName: '全部',
},
...data,
] ]
this.getList() this.getList()
}, },
// 获取课程列表 // 获取课程列表
async getList () { async getList () {
this.loading = true
// 最近使用 // 最近使用
if (this.active === 0) { if (this.active === -1) {
const { page } = await this.$post(this.api.recentUse, { const { list } = await this.$post(this.api.recentUse, {
pageNum: 1, courseType: this.typeActive,
pageSize: 100,
goodsName: this.keyword, goodsName: this.keyword,
}) })
this.products = page.records this.products = list
this.loading = false
} else { } else {
const { data } = await this.$get(this.api.schoolCourse, { if (this.typeActive) {
authority: this.active === -1 ? '' : this.active, // 我的课程
goodsName: this.keyword, const res = await this.$post(this.api.selfBuildCourse, {
}) curriculumType: this.active,
this.products = data curriculumName: this.keyword,
})
this.products = res.courses
this.loading = false
} else {
// 校本课程
const { data } = await this.$get(this.api.schoolCourse, {
authority: this.active,
goodsName: this.keyword,
})
this.products = data
this.loading = false
}
} }
}, },
// 记录最近使用 // 记录最近使用
@ -120,35 +161,50 @@ export default {
await this.$post(`${this.api.recordRecentUsage}?mallId=${mallId}`) await this.$post(`${this.api.recordRecentUsage}?mallId=${mallId}`)
}, },
toProduct (item) { toProduct (item) {
const links = item.nonAssociatedLinks const params = `&keyword=${this.keyword}&active=${this.active}&typeActive=${this.typeActive}`
// 已过期 / 没有cid并且没有链接，则跳转到产品详情 if (this.typeActive) {
if (!item.isInEffect) { this.$router.push(`/station/preview?courseId=${item.cid || ''}&curriculumName=${encodeURIComponent(item.goodsName || item.curriculumName)}&mallId=${item.mallId || ''}${params}`)
if (Setting.isPro) {
this.qrcodeVisible = true
} else {
Util.errorMsg('课程已到期，请联系课程负责老师！')
}
} else if (item.isInEffect && !item.cid && !links) {
this.addRecord(item.mallId)
this.$router.push(`product?id=${item.mallId}`)
} else { } else {
// 有链接 const links = item.nonAssociatedLinks
if (links && links.length) { // 已过期 / 没有cid并且没有链接，则跳转到产品详情
if (links.length === 1) { if (!item.isInEffect) {
this.addRecord(item.mallId) if (Setting.isPro) {
window.open(links[0].url) this.qrcodeVisible = true
} else { } else {
this.addRecord(item.mallId) Util.errorMsg('课程已到期，请联系课程负责老师！')
this.linkVisible = true
this.links = item.nonAssociatedLinks
} }
} else if (item.isInEffect && !item.cid && !links) {
this.addRecord(item.mallId)
this.$router.push(`product?id=${item.mallId}`)
} else { } else {
this.$router.push(`/station/preview?courseId=${item.cid || ''}&curriculumName=${encodeURIComponent(item.goodsName)}&mallId=${item.mallId || ''}&keyword=${this.keyword}&active=${this.active}`) // 有链接
if (links && links.length) {
if (links.length === 1) {
this.addRecord(item.mallId)
window.open(links[0].url)
} else {
this.addRecord(item.mallId)
this.linkVisible = true
this.links = item.nonAssociatedLinks
}
} else {
this.$router.push(`/station/preview?courseId=${item.cid || ''}&curriculumName=${encodeURIComponent(item.goodsName || item.curriculumName)}&mallId=${item.mallId || ''}${params}`)
}
} }
} }
}, },
// tab切换 // tab切换
tabChange (item) { tabChange ({ id }) {
this.typeActive = id
this.tabs = [
...this.defaultTabs,
...this[id ? 'selfBuildCourseType' : 'defaultTypes'],
]
if (this.active !== '' && this.active !== -1) this.active = ''
this.getList()
},
// tab切换
tab1Change (item) {
this.active = item.classificationId this.active = item.classificationId
this.getList() this.getList()
}, },
@ -205,7 +261,7 @@ export default {
font-size: 17px; font-size: 17px;
text-align: center; text-align: center;
color: #333; color: #333;
line-height: 50px; line-height: 44px;
border-bottom: 3px solid transparent; border-bottom: 3px solid transparent;
cursor: pointer; cursor: pointer;
@ -216,6 +272,41 @@ export default {
} }
} }
.tab-wrap {
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
.label {
margin-right: 20px;
font-size: 16px;
font-weight: 600;
}
.tabs1 {
display: flex;
justify-content: center;
align-items: center;
.item {
padding: 0 15px;
margin-right: 16px;
font-size: 16px;
text-align: center;
color: #333;
line-height: 40px;
border-radius: 2px;
cursor: pointer;
&.active {
color: #fff;
background-color: #007eff;
}
}
}
}
.station { .station {
min-height: calc(100vh - 520px); min-height: calc(100vh - 520px);
background: url(../../../assets/img/station1.png) (top left) / auto no-repeat, background: url(../../../assets/img/station1.png) (top left) / auto no-repeat,

47
src/pages/station/preview/index.vue
Unescape View File

@ -45,7 +45,7 @@
</div> </div>
<div class="catalog"> <div class="catalog">
<div class="entry-wrap"> <div class="entry-wrap">
<el-button v-if="!overdue" class="renew" type="primary" size="small" @click="showBuy">续费</el-button> <el-button v-if="mallId && !overdue" class="renew" type="primary" size="small" @click="showBuy">续费</el-button>
<a v-if="practiceTheoreticalPaper" class="entry" @click="entry(1)">进入理论</a> <a v-if="practiceTheoreticalPaper" class="entry" @click="entry(1)">进入理论</a>
<a v-if="practicePracticeProject" class="entry" @click="entry(0)">进入实训</a> <a v-if="practicePracticeProject" class="entry" @click="entry(0)">进入实训</a>
</div> </div>
@ -421,10 +421,10 @@ export default {
immediate: true immediate: true
}, },
noteKeyword: function (val) { noteKeyword: function (val) {
clearTimeout(this.searchTimer); clearTimeout(this.searchTimer)
this.searchTimer = setTimeout(() => { this.searchTimer = setTimeout(() => {
this.getNote(); this.getNote()
}, 500); }, 500)
} }
}, },
mounted () { mounted () {
@ -439,31 +439,28 @@ export default {
}).then(({ data }) => { }).catch(res => { }) }).then(({ data }) => { }).catch(res => { })
}, },
methods: { methods: {
goBack () {
this.$router.push('/station')
},
init () { init () {
this.insertScript(); this.insertScript()
this.getData(); this.getData()
this.addRecord() this.addRecord()
}, },
async getData () { async getData () {
if (this.courseId) { if (this.courseId) {
const { data } = await this.$post(`${this.api.curriculumDetail}?cid=${this.courseId}&mallId=${this.mallId}`); const { data } = await this.$post(`${this.api.curriculumDetail}?cid=${this.courseId}&mallId=${this.mallId}`)
this.routes = [ this.routes = [
{ {
name: '实验台', name: '实验台',
path: `list?keyword=${this.$route.query.keyword || ''}&active=${this.$route.query.active || 0}` path: `list?keyword=${this.$route.query.keyword || ''}&active=${this.$route.query.active || 0}&typeActive=${this.$route.query.typeActive || 0}`
}, },
{ {
name: this.curriculumName name: this.curriculumName
} }
] ]
this.courseName = data.curriculumName; this.courseName = data.curriculumName
this.briefIntroduction = data.briefIntroduction; this.briefIntroduction = data.briefIntroduction
this.teachingObjectives = data.teachingObjectives; this.teachingObjectives = data.teachingObjectives
this.assessmentList = data.assessmentConfig; this.assessmentList = data.assessmentConfig
this.systemIds = data.systemIds this.systemIds = data.systemIds
this.practicePracticeProject = data.practicePracticeProject this.practicePracticeProject = data.practicePracticeProject
this.practiceTheoreticalPaper = data.practiceTheoreticalPaper this.practiceTheoreticalPaper = data.practiceTheoreticalPaper
@ -473,18 +470,20 @@ export default {
}, },
// 记录最近使用 // 记录最近使用
async addRecord () { async addRecord () {
await this.$post(`${this.api.recordRecentUsage}?mallId=${this.mallId}`) await this.$post(`${this.api.recordRecentUsage}?mallId=${this.mallId}&cid=${this.courseId}`)
}, },
// 查询是否过期 // 查询是否过期
getStatus () { getStatus () {
this.$get(this.api.whetherToRenewTheFee, { if (this.mallId) {
mallId: this.mallId this.$get(this.api.whetherToRenewTheFee, {
}).then(({ isRenew }) => { mallId: this.mallId
// 1正常显示资源，0显示续费，-1试用 }).then(({ isRenew }) => {
this.overdue = isRenew // 1正常显示资源，0显示续费，-1试用
this.getChapter() this.overdue = isRenew
this.getProgress() }).catch(res => { })
}).catch(res => { }) }
this.getProgress()
this.getChapter()
}, },
// 获取章节小节 // 获取章节小节
async getChapter () { async getChapter () {

Write Preview
Loading…
Cancel
Save