From 153afffabb0bcfa994032565e5d218eed2fe10ec Mon Sep 17 00:00:00 2001
From: yujialong <479214531@qq.com>
Date: Fri, 20 Dec 2024 11:23:20 +0800
Subject: [PATCH] =?UTF-8?q?=E6=95=99=E5=AD=A6=E4=B8=AD=E5=BF=83=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=E6=88=91=E7=9A=84=E8=AF=BE=E7=A8=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/index.js                    |   2 +
 src/pages/station/list/index.vue    | 185 +++++++++++++++++++++-------
 src/pages/station/preview/index.vue |  47 ++++---
 3 files changed, 163 insertions(+), 71 deletions(-)

diff --git a/src/api/index.js b/src/api/index.js
index 6b98c82..2f3539b 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -95,6 +95,7 @@ export default {
 
   // 实验记录
   schoolCourse: `nakadai/nakadai/curriculum/schoolCourse`, // 获取学校购买订单后的课程
+  selfBuildCourse: `nakadai/nakadai/curriculum/selfBuildCourse`,
   curriculumListForBeforeLogin: `nakadai/nakadai/curriculum/curriculumListForBeforeLogin`,
   experimentOverview: `occupationlab/occupationlab/achievement/experimentOverview`, //实验概览
   queryAssessmentByStudent: `occupationlab/occupationlab/achievement/queryAssessmentByStudent`, //学生端考核成绩
@@ -131,6 +132,7 @@ export default {
   getSubsection: `occupationlab/occupationlab/theoreticalCourseSubsection/getSubsection`,
   recentUse: `nakadai/nakadai/curriculum/recentUse`,
   recordRecentUsage: `nakadai/nakadai/curriculum/recordRecentUsage`,
+  selfBuildCourse: `nakadai/nakadai/curriculum/selfBuildCourse`,
 
   // 资讯
   queryAllColumns: `occupationlab/occupationlab/information/column/queryAllColumns`, // 栏目树
diff --git a/src/pages/station/list/index.vue b/src/pages/station/list/index.vue
index 52f6f24..df78a59 100644
--- a/src/pages/station/list/index.vue
+++ b/src/pages/station/list/index.vue
@@ -1,6 +1,6 @@
 <template>
   <!--  实验台  -->
-  <div class="wrap index">
+  <div class="wrap index" v-loading="loading">
     <div class="search">
       <h6>创新实验，智能教学</h6>
       <div class="input">
@@ -11,9 +11,18 @@
     <div class="station">
       <div class="inner">
         <div class="tabs">
-          <a class="item" v-for="(item, i) in tabs" :key="i" :class="{ active: item.classificationId === active }"
-            @click="tabChange(item)">{{ item.classificationName }}</a>
+          <a class="item" v-for="(item, i) in types" :key="i" :class="{ active: item.id === typeActive }"
+            @click="tabChange(item)">{{ item.name }}</a>
         </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">
           <template v-if="products.length">
             <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 class="bottom">
                 <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>
               </div>
             </div>
@@ -61,10 +70,34 @@ export default {
       isZj: location.host === '10.60.32.76', // 浙江万里
       isSq: Setting.isSq,
       keyword: this.$route.query.keyword || '',
-      active: +this.$route.query.active || 0,
+      typeActive: +this.$route.query.typeActive || 0,
+      active: +this.$route.query.active || '',
       searchTimer: null,
+      types: [
+        {
+          id: 0,
+          name: '校本课程'
+        },
+        {
+          id: 1,
+          name: '我的课程'
+        },
+      ],
+      defaultTypes: [],
+      selfBuildCourseType: [],
+      defaultTabs: [
+        {
+          classificationId: '',
+          classificationName: '全部',
+        },
+        {
+          classificationId: -1,
+          classificationName: '最近使用',
+        },
+      ],
       tabs: [],
       products: [],
+      loading: false,
 
       linkVisible: false,
       links: [],
@@ -83,36 +116,44 @@ export default {
   methods: {
     // 获取tab
     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 = [
-        {
-          classificationId: 0,
-          classificationName: '最近使用',
-        },
-        {
-          classificationId: -1,
-          classificationName: '全部',
-        },
-        ...data,
+        ...this.defaultTabs,
+        ...res.data,
       ]
       this.getList()
     },
     // 获取课程列表
     async getList () {
+      this.loading = true
       // 最近使用
-      if (this.active === 0) {
-        const { page } = await this.$post(this.api.recentUse, {
-          pageNum: 1,
-          pageSize: 100,
+      if (this.active === -1) {
+        const { list } = await this.$post(this.api.recentUse, {
+          courseType: this.typeActive,
           goodsName: this.keyword,
         })
-        this.products = page.records
+        this.products = list
+        this.loading = false
       } else {
-        const { data } = await this.$get(this.api.schoolCourse, {
-          authority: this.active === -1 ? '' : this.active,
-          goodsName: this.keyword,
-        })
-        this.products = data
+        if (this.typeActive) {
+          // 我的课程
+          const res = await this.$post(this.api.selfBuildCourse, {
+            curriculumType: this.active,
+            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}`)
     },
     toProduct (item) {
-      const links = item.nonAssociatedLinks
-      // 已过期 / 没有cid并且没有链接，则跳转到产品详情
-      if (!item.isInEffect) {
-        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}`)
+      const params = `&keyword=${this.keyword}&active=${this.active}&typeActive=${this.typeActive}`
+      if (this.typeActive) {
+        this.$router.push(`/station/preview?courseId=${item.cid || ''}&curriculumName=${encodeURIComponent(item.goodsName || item.curriculumName)}&mallId=${item.mallId || ''}${params}`)
       } else {
-        // 有链接
-        if (links && links.length) {
-          if (links.length === 1) {
-            this.addRecord(item.mallId)
-            window.open(links[0].url)
+        const links = item.nonAssociatedLinks
+        // 已过期 / 没有cid并且没有链接，则跳转到产品详情
+        if (!item.isInEffect) {
+          if (Setting.isPro) {
+            this.qrcodeVisible = true
           } else {
-            this.addRecord(item.mallId)
-            this.linkVisible = true
-            this.links = item.nonAssociatedLinks
+            Util.errorMsg('课程已到期，请联系课程负责老师！')
           }
+        } else if (item.isInEffect && !item.cid && !links) {
+          this.addRecord(item.mallId)
+          this.$router.push(`product?id=${item.mallId}`)
         } 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切换
-    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.getList()
     },
@@ -205,7 +261,7 @@ export default {
     font-size: 17px;
     text-align: center;
     color: #333;
-    line-height: 50px;
+    line-height: 44px;
     border-bottom: 3px solid transparent;
     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 {
   min-height: calc(100vh - 520px);
   background: url(../../../assets/img/station1.png) (top left) / auto no-repeat,
diff --git a/src/pages/station/preview/index.vue b/src/pages/station/preview/index.vue
index 4b35909..cc071c3 100644
--- a/src/pages/station/preview/index.vue
+++ b/src/pages/station/preview/index.vue
@@ -45,7 +45,7 @@
       </div>
       <div class="catalog">
         <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="practicePracticeProject" class="entry" @click="entry(0)">进入实训</a>
         </div>
@@ -421,10 +421,10 @@ export default {
       immediate: true
     },
     noteKeyword: function (val) {
-      clearTimeout(this.searchTimer);
+      clearTimeout(this.searchTimer)
       this.searchTimer = setTimeout(() => {
-        this.getNote();
-      }, 500);
+        this.getNote()
+      }, 500)
     }
   },
   mounted () {
@@ -439,31 +439,28 @@ export default {
     }).then(({ data }) => { }).catch(res => { })
   },
   methods: {
-    goBack () {
-      this.$router.push('/station')
-    },
     init () {
-      this.insertScript();
-      this.getData();
+      this.insertScript()
+      this.getData()
       this.addRecord()
     },
     async getData () {
       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 = [
           {
             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
           }
         ]
 
-        this.courseName = data.curriculumName;
-        this.briefIntroduction = data.briefIntroduction;
-        this.teachingObjectives = data.teachingObjectives;
-        this.assessmentList = data.assessmentConfig;
+        this.courseName = data.curriculumName
+        this.briefIntroduction = data.briefIntroduction
+        this.teachingObjectives = data.teachingObjectives
+        this.assessmentList = data.assessmentConfig
         this.systemIds = data.systemIds
         this.practicePracticeProject = data.practicePracticeProject
         this.practiceTheoreticalPaper = data.practiceTheoreticalPaper
@@ -473,18 +470,20 @@ export default {
     },
     // 记录最近使用
     async addRecord () {
-      await this.$post(`${this.api.recordRecentUsage}?mallId=${this.mallId}`)
+      await this.$post(`${this.api.recordRecentUsage}?mallId=${this.mallId}&cid=${this.courseId}`)
     },
     // 查询是否过期
     getStatus () {
-      this.$get(this.api.whetherToRenewTheFee, {
-        mallId: this.mallId
-      }).then(({ isRenew }) => {
-        // 1正常显示资源，0显示续费，-1试用
-        this.overdue = isRenew
-        this.getChapter()
-        this.getProgress()
-      }).catch(res => { })
+      if (this.mallId) {
+        this.$get(this.api.whetherToRenewTheFee, {
+          mallId: this.mallId
+        }).then(({ isRenew }) => {
+          // 1正常显示资源，0显示续费，-1试用
+          this.overdue = isRenew
+        }).catch(res => { })
+      }
+      this.getProgress()
+      this.getChapter()
     },
     // 获取章节小节
     async getChapter () {