功能调整 学习中心优化

src/apis/bank.js

@@ -1,14 +1,14 @@
 import request from '@/axios'
 export default {
-  listGoodsUserQuestion(data) {
+	listGoodsUserQuestion(data) {
 		return request({
 			url: '/bank/question/listGoodsUserQuestion',
-			params:data,
+			params: data,
 			method: 'get'
 		})
 	},
 
-  
+
 	goodsBank(data) {
 		return request({
 			url: '/goods/bank/list',
@@ -17,63 +17,63 @@ export default {
 		})
 	},
 
-  
+
 	goodsBankQuestionNum(data) {
 		return request({
-			url: '/goods/bank/questionNum/'+data,
+			url: '/goods/bank/questionNum/' + data,
 			method: 'get',
 		})
 	},
 
-  examRecordGroupList(data) {
+	examRecordGroupList(data) {
 		return request({
 			url: '/exam/record/group_list',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  goodsBankDolist(data) {
+	goodsBankDolist(data) {
 		return request({
 			url: '/goods/bank/dolist',
 			method: 'get',
-			params:data
+			params: data
 		})
 	},
 
 
-  bankRecordDoNum(data) {
+	bankRecordDoNum(data) {
 		return request({
 			url: '/bank/record/doNum',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  bankExam(data) {
+	bankExam(data) {
 		return request({
-			url: '/bank/exam/'+data,
+			url: '/bank/exam/' + data,
 			method: 'get',
 		})
 	},
 
-  bankRecord(data) {
+	bankRecord(data) {
 		return request({
 			url: '/bank/record',
-			data:data,
+			data: data,
 			method: 'POST',
 		})
 	},
 
-  bankRecordEdit(data) {
+	bankRecordEdit(data) {
 		return request({
 			url: '/bank/record/edit',
-			data:data,
+			data: data,
 			method: 'POST'
 		})
 	},
 
-  
+
 	studyExamPhotoRecord(data) {
 		return request({
 			url: '/bank/record/addPhoto',
@@ -82,7 +82,7 @@ export default {
 		})
 	},
 
-  bankExamExamList(data) {
+	bankExamExamList(data) {
 		return request({
 			url: '/bank/exam/exam/list',
 			method: 'get',
@@ -90,192 +90,207 @@ export default {
 		})
 	},
 
-  examRecordCount(data) {
+	examRecordCount(data) {
 		return request({
 			url: '/exam/record/count',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  getExamDetail(data) {
+	getExamDetail(data) {
 		return request({
-			url: '/bank/exam/'+data,
+			url: '/bank/exam/' + data,
 			method: 'get',
 		})
 	},
 
-  examRecord(data) {
+	examRecord(data) {
 		return request({
 			url: '/exam/record',
-			data:data,
+			data: data,
 			method: 'POST',
 		})
 	},
 
-  examRecordEdit(data) {
+	examRecordEdit(data) {
 		return request({
 			url: '/exam/record/edit',
-			data:data,
+			data: data,
 			method: 'POST',
 		})
 	},
 
-  examWrongRecord(data) {
+	examWrongRecord(data) {
 		return request({
 			url: '/exam/wwrong/record',
-			data:data,
+			data: data,
 			method: 'POST',
 		})
 	},
 
-  examWrongRecordWrongNum(data) {
+	examWrongRecordWrongNum(data) {
 		return request({
-			url:`/exam/wwrong/record/wrongNum/${data}`,
+			url: `/exam/wwrong/record/wrongNum/${data}`,
 			method: 'get'
 		})
 	},
 
-  bankExamNextExam(data) {
+	bankExamNextExam(data) {
 		return request({
 			url: '/bank/exam/nextExam',
-			params:data,
+			params: data,
 			method: 'get',
 		})
 	},
 
-  examReport(data) {
+	examReport(data) {
 		return request({
-			url: '/exam/record/'+data,
+			url: '/exam/record/' + data,
 			method: 'get',
 		})
 	},
 
-  examaperList(data) {
+	examaperList(data) {
 		return request({
 			url: '/exam/paper/list',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  goodsCollectExamList(data) {
+	goodsCollectExamList(data) {
 		return request({
 			url: '/collect/question/exam_list',
 			method: 'get',
-			params:data
+			params: data
 		})
 	},
 
-  collectQuestionTypeList(data) {
+	collectQuestionTypeList(data) {
 		return request({
 			url: '/collect/question/type_list',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  wrongRecordTypeList(data) {
+	wrongRecordTypeList(data) {
 		return request({
 			url: '/exam/wwrong/record/type_list',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  wrongRecordList(data) {
+	wrongRecordList(data) {
 		return request({
 			url: '/exam/wwrong/record/list',
 			method: 'get',
-			params:data
+			params: data
 		})
 	},
 
-  wrongRecordTypeQuestionList(data) {
+	wrongRecordTypeQuestionList(data) {
 		return request({
 			url: '/exam/wwrong/record/type_question_list',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  wrongRecordDelete(data) {
+	wrongRecordDelete(data) {
 		return request({
 			url: '/exam/wwrong/record/delete/question',
 			method: 'post',
-			data:data
+			data: data
 		})
 	},
 
-  wrongRecordExamQuestionList(data) {
+	wrongRecordExamQuestionList(data) {
 		return request({
 			url: '/exam/wwrong/record/exam_question_list',
 			method: 'get',
-			params:data,
+			params: data,
 		})
 	},
 
-  goodsCollectList(data) {
+	goodsCollectList(data) {
 		return request({
 			url: '/collect/question/list',
 			method: 'get',
-			params:data
+			params: data
 		})
 	},
 
-  collectQuestionExamQuestionList(data) {
+	collectQuestionExamQuestionList(data) {
 		return request({
-			url:`/collect/question/exam_question_list`,
+			url: `/collect/question/exam_question_list`,
 			method: 'get',
-			params:data
+			params: data
 		})
 	},
 
-  goodsChapterDolist(data) {
+	goodsChapterDolist(data) {
 		return request({
 			url: '/goods/chapter/dolist',
 			method: 'get',
-			params:data
+			params: data
 		})
 	},
 
-  goodsExamDolist(data) {
+	goodsExamDolist(data) {
 		return request({
 			url: '/goods/exam/dolist',
 			method: 'get',
-			params:data
+			params: data
 		})
 	},
 
-  examRecordRightList(data) {
+	examRecordRightList(data) {
 		return request({
 			url: '/exam/record/right_list',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
-	
+
 	examRecordWrongList(data) {
 		return request({
 			url: '/exam/record/wrong_list',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  examRecordList(data) {
+	examRecordList(data) {
 		return request({
 			url: '/exam/record/list',
-			params:data,
+			params: data,
 			method: 'GET',
 		})
 	},
 
-  bankQuestionListFreeGoodsList(data) {
+	bankQuestionListFreeGoodsList(data) {
 		return request({
 			url: '/bank/question/listFreeGoodsList',
 			method: 'get',
 			params: data
 		})
-	}
+	},
+	exampapergoodsExamPaper(data) {
+		return request({
+			url: '/exam/paper/goodsExamPaper/' + data,
+			method: 'get',
+		})
+	},
+	bankexamgetPaperExamList(data) {
+		return request({
+			url: '/bank/exam/getPaperExamList',
+			method: 'get',
+			params: data
+		})
+	},
+
+
 }

src/apis/user.js

@@ -356,4 +356,20 @@ export default {
        params:data,
      })
    },
+   //查询用户最后一次看的录播的信息
+   studyrecordgetUserWatchLast(data) {
+      return request({
+        url: '/study/record/getUserWatchLast',
+        method: 'get',
+        params:data,
+      })
+    },
+    //获取用户最后一次做的题库试卷信息
+    examrecordgetUserDoLast(data) {
+       return request({
+         url: '/exam/record/getUserDoLast',
+         method: 'get',
+         params:data,
+       })
+     },
 }

src/axios.js

@@ -2,8 +2,8 @@ import axios from 'axios'
 import store from './store'
 // export const BASE_URL = 'https://api.xyyxt.net'   //release
 // export const BASE_URL = 'http://42.192.164.187:19005'    //test
-export const BASE_URL = 'https://test.xyyxt.net'   //预发布
-// export const BASE_URL = 'http://192.168.1.222:5055'    //dev
+// export const BASE_URL = 'https://test.xyyxt.net'   //预发布
+export const BASE_URL = 'http://192.168.1.222:5055'    //dev
 export const tenantId = '867735392558919680'
 
 

src/pages/course-detail/index.vue

@@ -17,6 +17,18 @@
           <div class="container">
             <div class="course-info">
               <div class="course-info__header clearfix">
+                <div class="title">
+                  <span>{{ changeName(courseId) }}</span>
+                  <el-button
+                    size="mini"
+                    type="primary"
+                    plain
+                    icon="el-icon-sort"
+                    style="margin-left: 14px"
+                    @click="openChangeCourseBoxs"
+                    >切换科目</el-button
+                  >
+                </div>
                 <div
                   class="left-box"
                   :style="{
@@ -44,20 +56,6 @@
                 </div>
                 <div class="right-box">
                   <div class="right-box__header">
-                    <div class="title">
-                      <el-select
-                        class="select"
-                        v-model="courseId"
-                        @change="courseChange"
-                      >
-                        <el-option
-                          :label="item.courseName"
-                          :value="item.courseId"
-                          v-for="(item, index) in courseList"
-                          :key="index"
-                        ></el-option>
-                      </el-select>
-                    </div>
                     <div class="tabs">
                       <el-tabs v-model="courseTabIndex">
                         <el-tab-pane
@@ -1208,6 +1206,368 @@
                               </div>
                             </div>
                           </template>
+                          <template v-if="tab.name == '3'">
+                            <div class="answer-question">
+                              <div class="answer-question__header clearfix">
+                                <div class="textarea-wrap">
+                                  <el-input
+                                    class="textarea"
+                                    resize="none"
+                                    v-model="textarea"
+                                    rows="3"
+                                    type="textarea"
+                                    placeholder="请输入"
+                                    maxlength="1000"
+                                    show-word-limit
+                                  ></el-input>
+                                </div>
+                                <el-button
+                                  type="primary"
+                                  class="submit"
+                                  @click="addAnswer"
+                                  >提出疑问</el-button
+                                >
+                              </div>
+                              <div class="answer-question__body">
+                                <div class="question-list">
+                                  <div
+                                    v-if="answerList.length == 0"
+                                    style="
+                                      text-align: center;
+                                      color: #cccccc;
+                                      margin-top: 14px;
+                                    "
+                                  >
+                                    暂无记录
+                                  </div>
+                                  <div
+                                    class="question-list__item"
+                                    v-for="(item, index) in answerList"
+                                    :key="index"
+                                  >
+                                    <div class="question-list__item__avatar">
+                                      <img
+                                        v-if="item.assignRealname"
+                                        :src="
+                                          $tools.splitImgHost(item.assignAvatar)
+                                        "
+                                        alt=""
+                                      />
+                                      <img
+                                        v-else
+                                        :src="$tools.splitImgHost(item.avatar)"
+                                        alt=""
+                                      />
+                                    </div>
+                                    <div class="question-list__item__content">
+                                      <div class="nickname">
+                                        {{ item.realname }}
+                                      </div>
+                                      <div class="desc">
+                                        {{ item.answerText }}
+                                      </div>
+                                      <div class="time">
+                                        {{
+                                          $tools.timestampToTime(
+                                            item.createTime,
+                                            false
+                                          )
+                                        }}
+
+                                        <div
+                                          class="del"
+                                          v-if="item.userId !== userInfo.userId"
+                                          @click="answerBack(item)"
+                                        >
+                                          <el-button type="text"
+                                            >回复</el-button
+                                          >
+                                        </div>
+                                        <div
+                                          class="del"
+                                          @click="del(item)"
+                                          v-if="item.userId === userInfo.userId"
+                                        >
+                                          删除
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="reply-list"
+                                        v-if="
+                                          item.newArraysAnswerList &&
+                                          item.newArraysAnswerList.length
+                                        "
+                                      >
+                                        <div
+                                          class="reply-list__item"
+                                          v-for="(
+                                            items, indexs
+                                          ) in item.newArraysAnswerList"
+                                          :key="indexs"
+                                        >
+                                          <div class="reply-list__item__avatar">
+                                            <img
+                                              :src="
+                                                $tools.splitImgHost(
+                                                  items.avatar
+                                                )
+                                              "
+                                              alt=""
+                                            />
+                                          </div>
+                                          <div
+                                            class="reply-list__item__content"
+                                          >
+                                            <div class="nickname">
+                                              {{ items.realname }}
+                                            </div>
+                                            <div class="desc">
+                                              回复
+                                              <span
+                                                style="
+                                                  margin: 0px 4px;
+                                                  color: #409eff;
+                                                "
+                                                >@{{
+                                                  items.assignRealname
+                                                }}</span
+                                              >
+                                              {{ items.answerText }}
+                                            </div>
+                                            <div class="time">
+                                              {{
+                                                $tools.timestampToTime(
+                                                  items.createTime,
+                                                  false
+                                                )
+                                              }}
+                                              <div
+                                                class="del"
+                                                @click="del(items)"
+                                                v-if="
+                                                  items.userId ===
+                                                  userInfo.userId
+                                                "
+                                              >
+                                                删除
+                                              </div>
+                                              <div
+                                                class="reply"
+                                                v-if="
+                                                  items.userId !==
+                                                  userInfo.userId
+                                                "
+                                                @click="answerBack(items)"
+                                              >
+                                                回复
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </template>
+                          <template v-if="tab.name == '4'">
+                            <div class="lecture-notes">
+                              <div class="lecture-notes__content clearfix">
+                                <div class="left-boxs">
+                                  <div
+                                    class="textarea clearfix"
+                                    v-if="!(isPlayRebuild > 0) && !vidzb"
+                                  >
+                                    <el-input
+                                      resize="none"
+                                      rows="3"
+                                      v-model="textareaNote"
+                                      type="textarea"
+                                      maxlength="1000"
+                                      show-word-limit
+                                      placeholder="觉得重要的就记下来吧~"
+                                    ></el-input>
+                                    <el-button
+                                      type="primary"
+                                      class="submit"
+                                      @click="noteSubmit"
+                                    >
+                                      提交笔记
+                                    </el-button>
+                                  </div>
+
+                                  <div class="note-list">
+                                    <div
+                                      v-if="noteList.length == 0"
+                                      style="
+                                        text-align: center;
+                                        color: #cccccc;
+                                        margin-top: 14px;
+                                      "
+                                    >
+                                      暂无笔记
+                                    </div>
+
+                                    <div
+                                      class="note-list__content"
+                                      v-for="(item, index) in noteList"
+                                      :key="index"
+                                    >
+                                      <div
+                                        v-for="(note, index) in item.userNotes"
+                                        :key="index"
+                                        class="user_notes"
+                                      >
+                                        <p class="p1">
+                                          <i
+                                            class="el-icon-video-camera"
+                                            style="margin-right: 8px"
+                                          ></i
+                                          >{{
+                                            $tools.secondToDate(note.noteSecond)
+                                          }}
+                                          <span>{{
+                                            $tools.timestampToTime(
+                                              note.createTime,
+                                              false,
+                                              false
+                                            )
+                                          }}</span>
+                                        </p>
+                                        <p class="p2">{{ note.noteText }}</p>
+                                      </div>
+                                    </div>
+                                  </div>
+                                  <!-- <div class="pagination">
+                                    <el-pagination
+                                      background
+                                      layout="prev, pager, next"
+                                      :total="noteTotal"
+                                      :page-size="noteParams.pageSize"
+                                    >
+                                    </el-pagination>
+                                  </div> -->
+                                </div>
+                                <div
+                                  class="right-box"
+                                  v-if="courseHandoutsData"
+                                >
+                                  <div class="lecture-list">
+                                    <div class="lecture-list__header">
+                                      讲义
+
+                                      <div
+                                        class="slide-btn"
+                                        @click="lectureShow = !lectureShow"
+                                      >
+                                        收起
+                                      </div>
+                                    </div>
+                                    <div
+                                      class="lecture-list__body"
+                                      v-if="lectureShow"
+                                    >
+                                      <div class="list">
+                                        <div class="list__item">
+                                          <div class="title">
+                                            {{
+                                              courseHandoutsData.handoutsName
+                                            }}
+                                          </div>
+                                          <div class="btns">
+                                            <div
+                                              class="btn"
+                                              @click="
+                                                previvew(
+                                                  $tools.splitImgHost(
+                                                    courseHandoutsData.handoutsUrl
+                                                  )
+                                                )
+                                              "
+                                            >
+                                              预览
+                                            </div>
+                                            <div
+                                              v-if="
+                                                courseHandoutsData.canDownload ==
+                                                1
+                                                  ? true
+                                                  : false
+                                              "
+                                              class="btn"
+                                              @click="
+                                                printView(
+                                                  $tools.splitImgHost(
+                                                    courseHandoutsData.handoutsUrl
+                                                  )
+                                                )
+                                              "
+                                            >
+                                              打印
+                                            </div>
+                                            <div
+                                              v-if="
+                                                courseHandoutsData.canDownload ==
+                                                1
+                                                  ? true
+                                                  : false
+                                              "
+                                              class="btn"
+                                              @click="
+                                                download(
+                                                  $tools.splitImgHost(
+                                                    courseHandoutsData.handoutsUrl
+                                                  ),
+                                                  courseHandoutsData.urlName
+                                                )
+                                              "
+                                            >
+                                              下载
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                  <div
+                                    class="lecture-list__footer"
+                                    v-if="showPdf"
+                                  >
+                                    <div class="lecture-scan">
+                                      <div class="lecture-scan__header">
+                                        {{ courseHandoutsData.urlName }}
+                                      </div>
+                                      <div class="lecture-scan__body">
+                                        <pdf
+                                          class="iframe"
+                                          :src="
+                                            $tools.splitImgHost(
+                                              courseHandoutsData.handoutsUrl
+                                            )
+                                          "
+                                          v-for="i in numPages"
+                                          :key="i"
+                                          :page="i"
+                                          ref="pdf"
+                                        ></pdf>
+                                        <iframe
+                                          id="printIframe"
+                                          :src="
+                                            $tools.splitImgHost(
+                                              courseHandoutsData.handoutsUrl
+                                            )
+                                          "
+                                          frameborder="0"
+                                          style="display: none"
+                                        ></iframe>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </template>
                         </el-tab-pane>
                       </el-tabs>
                     </div>
@@ -2258,7 +2618,20 @@
         >
       </span>
     </el-dialog>
-
+    <el-dialog title="切换科目" :visible.sync="dialogVisible" width="500px">
+      <el-radio-group v-model="activeRadio">
+        <el-radio
+          v-for="(item, index) in courseList"
+          :key="index"
+          :label="item.courseId"
+          >{{ item.courseName }}</el-radio
+        >
+      </el-radio-group>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="activeFunc">确 定</el-button>
+      </span>
+    </el-dialog>
     <div id="printTable"></div>
     <!-- <ToolBar></ToolBar> -->
     <Footer></Footer>
@@ -2286,6 +2659,8 @@ export default {
   },
   data() {
     return {
+      activeRadio: "", //当前选中课程Id
+      dialogVisible: false, //选择课程弹窗
       liveDuration: 0,
       numPages: 0,
       showPdf: false,
@@ -2405,6 +2780,7 @@ export default {
         commitment_electr_signature: "",
         commitment_seal: "",
       },
+      needOpenNew: true,
       recommendList: [],
       rules: {
         name: [
@@ -2628,6 +3004,23 @@ export default {
         return ary;
       };
     },
+    changeName: function () {
+      return function (id) {
+        var aryName = "";
+        for (let i = 0; i < this.courseList.length; i++) {
+          if (this.courseList[i].courseId == id) {
+            if (this.courseList[i].subjectName) {
+              aryName =
+                `【${this.courseList[i].subjectName}】 ` +
+                this.courseList[i].courseName;
+            } else {
+              aryName = this.courseList[i].courseName;
+            }
+          }
+        }
+        return aryName;
+      };
+    },
   },
   async mounted() {
     this.courseId = +this.$route.query.courseId || "";
@@ -2701,6 +3094,7 @@ export default {
 
       await this.courseCourseList();
       if (this.sectionItem.recordingUrl) {
+        return;
         let noteSecond = this.$route.query.noteSecond;
         if (noteSecond > 0) {
           let item = {
@@ -2763,6 +3157,15 @@ export default {
   methods: {
     ...mapMutations(["getCartCount"]),
     ...mapActions(["getUserInfo"]),
+    openChangeCourseBoxs() {
+      this.activeRadio = this.courseId;
+      this.dialogVisible = true;
+    },
+    activeFunc() {
+      this.courseId = this.activeRadio;
+      this.courseChange();
+      this.dialogVisible = false;
+    },
     isLast(item) {
       if (this.liveLast) {
         let sectionASame =
@@ -4394,7 +4797,7 @@ export default {
      */
     courseChange() {
       return new Promise((resolve) => {
-        this.needOpen = true
+        this.needOpen = true;
         this.noteParams = {
           pageNum: 1,
           // pageSize: 4,
@@ -4635,15 +5038,15 @@ export default {
           if (this.goodsData.buyNote) {
             this.tabList = [
               { name: "1", label: "学员须知" },
-              { name: "2", label: "课程答疑" },
-              { name: "3", label: "笔记讲义" },
+              // { name: "2", label: "课程答疑" },
+              // { name: "3", label: "笔记讲义" },
             ];
             console.log(res, "res111");
             this.getRecommend();
           } else {
             this.tabList = [
-              { name: "1", label: "课程答疑" },
-              { name: "2", label: "笔记讲义" },
+              // { name: "1", label: "课程答疑" },
+              // { name: "2", label: "笔记讲义" },
             ];
           }
           this.courseBusiness();
@@ -5819,6 +6222,14 @@ export default {
                     name: "1",
                     label: "章节目录",
                   },
+                  {
+                    name: "3",
+                    label: "答疑",
+                  },
+                  {
+                    name: "4",
+                    label: "笔记讲义",
+                  },
                 ];
                 this.courseTabIndex = "1";
                 self.reMenuList = [];
@@ -5916,6 +6327,14 @@ export default {
                     name: "1",
                     label: "章节目录",
                   },
+                  {
+                    name: "3",
+                    label: "答疑",
+                  },
+                  {
+                    name: "4",
+                    label: "笔记讲义",
+                  },
                 ];
                 this.courseTabIndex = "1";
                 self.reMenuList = [];
@@ -6029,6 +6448,14 @@ export default {
                     name: "1",
                     label: "章节目录",
                   },
+                  {
+                    name: "3",
+                    label: "答疑",
+                  },
+                  {
+                    name: "4",
+                    label: "笔记讲义",
+                  },
                 ];
                 this.courseTabIndex = "1";
                 self.reMenuList = [];
@@ -6064,8 +6491,8 @@ export default {
         courseId: this.courseId,
         gradeId: this.gradeId,
         goodsId: this.goodsId,
-        pageNum: this.noteParams.pageNum,
-        pageSize: this.noteParams.pageSize,
+        // pageNum: this.noteParams.pageNum,
+        // pageSize: this.noteParams.pageSize,
       };
       if (this.playSectionId > 0) {
         data.sectionId = this.playSectionId;
@@ -6125,8 +6552,26 @@ export default {
             item.parent = this.menuList;
           }
           self.menuList = res.rows;
-          const changeStatus = await this.studyRecordQueryLiveLast();
-          if (changeStatus) {
+          if (this.sectionItem.recordingUrl && this.needOpenNew) {
+            this.needOpenNew = false;
+            if (this.sectionItem.sectionType == 1) {
+              //录播
+              this.chapterId = this.sectionItem.chapterId;
+              this.moduleId = this.sectionItem.moduleId;
+              this.playSectionId = this.sectionItem.sectionId;
+              this.vid = this.sectionItem.recordingUrl;
+              this.playVideo(this.sectionItem);
+            } else if (this.sectionItem.sectionType == 2) {
+              //直播
+              this.studyRecordGetLastLive();
+            } else if (this.sectionItem.sectionType == 3) {
+              //回放
+              this.chapterId = this.sectionItem.chapterId;
+              this.moduleId = this.sectionItem.moduleId;
+              this.playSectionId = this.sectionItem.sectionId;
+              this.vid = this.sectionItem.recordingUrl;
+              this.playVideo(this.sectionItem);
+            }
             for (let i = 0; i < res.rows.length; i++) {
               if (
                 res.rows[i].type == 1 &&
@@ -6138,8 +6583,9 @@ export default {
               } else if (
                 res.rows[i].type == 2 &&
                 res.rows[i].menuId == this.sectionItem.chapterId &&
-                !this.sectionItem.moduleId
+                (!this.sectionItem.moduleId || this.sectionItem.moduleId == 0)
               ) {
+                console.log("噢噢噢")
                 this.menuIndex = [i];
                 // this.needOpen = false;
                 this.openChapter(this.menuList[i]);
@@ -6147,29 +6593,53 @@ export default {
               }
             }
           } else {
-            //展开第一个
-            if (this.needOpen) {
+            console.log("我走了");
+            const changeStatus = await this.studyRecordQueryLiveLast();
+            if (changeStatus) {
               for (let i = 0; i < res.rows.length; i++) {
-                if (res.rows[i].type == 1) {
+                if (
+                  res.rows[i].type == 1 &&
+                  res.rows[i].menuId == this.sectionItem.moduleId
+                ) {
                   this.menuIndex = [i];
-                  this.openModule(this.menuList[i]);
+                  this.openModule(this.menuList[i], true);
                   break;
-                } else if (res.rows[i].type == 2) {
+                } else if (
+                  res.rows[i].type == 2 &&
+                  res.rows[i].menuId == this.sectionItem.chapterId &&
+                  !this.sectionItem.moduleId
+                ) {
                   this.menuIndex = [i];
                   // this.needOpen = false;
                   this.openChapter(this.menuList[i]);
                   break;
                 }
               }
+            } else {
+              //展开第一个
+              if (this.needOpen) {
+                for (let i = 0; i < res.rows.length; i++) {
+                  if (res.rows[i].type == 1) {
+                    this.menuIndex = [i];
+                    this.openModule(this.menuList[i]);
+                    break;
+                  } else if (res.rows[i].type == 2) {
+                    this.menuIndex = [i];
+                    // this.needOpen = false;
+                    this.openChapter(this.menuList[i]);
+                    break;
+                  }
+                }
 
-              //第一个是节，直接播放
-              if (self.menuList.length) {
-                if (
-                  self.menuList[0].type == 3 &&
-                  !this.sectionItem.recordingUrl &&
-                  self.menuList[0].sectionType != 2
-                ) {
-                  // this.getResource(self.menuList[0]);
+                //第一个是节，直接播放
+                if (self.menuList.length) {
+                  if (
+                    self.menuList[0].type == 3 &&
+                    !this.sectionItem.recordingUrl &&
+                    self.menuList[0].sectionType != 2
+                  ) {
+                    // this.getResource(self.menuList[0]);
+                  }
                 }
               }
             }
@@ -6207,6 +6677,14 @@ export default {
                 name: "2",
                 label: "重修目录",
               },
+              {
+                name: "3",
+                label: "答疑",
+              },
+              {
+                name: "4",
+                label: "笔记讲义",
+              },
             ];
 
             if (this.courseTabIndex == "2") {
@@ -6219,6 +6697,14 @@ export default {
                 name: "1",
                 label: "章节目录",
               },
+              {
+                name: "3",
+                label: "答疑",
+              },
+              {
+                name: "4",
+                label: "笔记讲义",
+              },
             ];
             this.courseTabIndex = "1";
           }
@@ -6355,6 +6841,7 @@ export default {
             }
           });
           self.answerList = data1.reverse();
+          console.log(self.answerList, "answerList");
         });
     },
     courseCourseList() {
@@ -6362,6 +6849,7 @@ export default {
         this.param.goodsId = this.goodsId;
         this.param.gradeId = this.gradeId;
         this.$request.courseCourseList(this.param).then(async (res) => {
+          console.log(res.rows, "resresresres");
           this.courseList.push(...res.rows);
           if (!this.courseId) {
             this.courseId = this.courseList[0].courseId;
@@ -6540,6 +7028,31 @@ export default {
     &__body {
       .course-info {
         &__header {
+          .title {
+            height: 40px;
+            border-bottom: 1px solid #999;
+            // color: #fff;
+
+            .select {
+              // width: 100%;
+            }
+
+            /deep/ .el-input__icon {
+              width: 20px;
+              height: 20px;
+              border: 1px solid #eee;
+              border-radius: 4px;
+              margin-top: 10px;
+              line-height: 20px;
+            }
+
+            /deep/ .el-input__inner {
+              // color: #fff;
+              font-size: 16px;
+              background: none;
+              border: 0;
+            }
+          }
           .left-box {
             width: 810px;
             height: 455px;
@@ -6570,7 +7083,7 @@ export default {
           .right-box {
             width: 462px;
             height: 455px;
-            background: #060e1a;
+            background: #3f4449;
             border-radius: 0px;
             float: right;
 
@@ -6768,7 +7281,8 @@ export default {
               height: 374px;
               overflow-y: scroll;
               &::-webkit-scrollbar {
-                width: 6px;
+                // width: 6px;
+                display: none;
               }
               &::-webkit-scrollbar-track {
                 background-color: #060e1a;
@@ -7380,4 +7894,406 @@ export default {
     }
   }
 }
+.answer-question {
+  max-height: 416px;
+  overflow-y: auto;
+  padding: 16px;
+  background: rgb(63, 68, 73);
+  &::-webkit-scrollbar {
+    display: none;
+  }
+  &__header {
+    border-bottom: 1px solid #555;
+    .textarea-wrap {
+      // background: #65696D;
+      border: 1px solid #555;
+      border-radius: 8px;
+
+      .textarea {
+        height: 100%;
+        &::placeholder {
+          color: red;
+        }
+      }
+    }
+
+    .submit {
+      padding: 10px 20px;
+      border-radius: 2px;
+      text-align: center;
+      font-size: 16px;
+      margin: 10px 0;
+      float: right;
+    }
+  }
+
+  &__body {
+    .question-list {
+      &__item {
+        padding: 20px 0;
+        display: flex;
+
+        &__avatar {
+          width: 40px;
+          height: 40px;
+          display: table-cell;
+          border-radius: 50%;
+          text-align: center;
+          overflow: hidden;
+
+          img {
+            display: inline-block;
+            vertical-align: middle;
+            max-width: 100%;
+            max-height: 100%;
+          }
+        }
+
+        &__content {
+          flex: 1;
+          border-bottom: 1px solid #555555;
+          margin-left: 10px;
+
+          .nickname {
+            font-size: 14px;
+            font-family: Microsoft YaHei;
+            font-weight: bold;
+            color: #f5f5f5;
+            line-height: 24px;
+          }
+
+          .desc {
+            font-size: 14px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #cccccc;
+            line-height: 24px;
+          }
+
+          .time {
+            font-size: 14px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #999999;
+            line-height: 24px;
+
+            .replay {
+              float: right;
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #3f8dfd;
+              line-height: 24px;
+              margin-right: 20px;
+            }
+
+            .del {
+              float: right;
+              cursor: pointer;
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #fa8c16;
+              line-height: 24px;
+              margin-right: 20px;
+            }
+          }
+
+          .reply-list {
+            margin: 20px 0;
+            width: 100%;
+            background-color: #2f3236;
+            border-radius: 8px;
+            padding: 0 0 0 20px;
+
+            &__item {
+              padding: 20px 0;
+              display: flex;
+              border-bottom: 1px solid #555555;
+              &:nth-last-of-type(1) {
+                border: 0;
+              }
+
+              &__avatar {
+                width: 40px;
+                height: 40px;
+                display: table-cell;
+                border-radius: 50%;
+                text-align: center;
+
+                img {
+                  display: inline-block;
+                  vertical-align: middle;
+                  max-width: 100%;
+                  max-height: 100%;
+                }
+              }
+
+              &__content {
+                border-radius: 8px;
+                flex: 1;
+                margin-left: 10px;
+
+                .nickname {
+                  font-size: 14px;
+                  font-family: Microsoft YaHei;
+                  font-weight: bold;
+                  color: #333333;
+                  line-height: 24px;
+                }
+
+                .desc {
+                  font-size: 14px;
+                  font-family: Microsoft YaHei;
+                  font-weight: 400;
+                  color: #666666;
+                  line-height: 24px;
+                }
+
+                .time {
+                  font-size: 14px;
+                  font-family: Microsoft YaHei;
+                  font-weight: 400;
+                  color: #999999;
+                  line-height: 24px;
+
+                  .reply {
+                    float: right;
+                    font-size: 14px;
+                    font-family: Microsoft YaHei;
+                    font-weight: 400;
+                    color: #3f8dfd;
+                    line-height: 24px;
+                    margin-right: 20px;
+                    cursor: pointer;
+                    user-select: none;
+                  }
+
+                  .del {
+                    cursor: pointer;
+                    margin-right: 20px;
+                    float: right;
+                    font-size: 14px;
+                    font-family: Microsoft YaHei;
+                    font-weight: 400;
+                    color: #ff3b30;
+                    line-height: 24px;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+.lecture-notes {
+  &::-webkit-scrollbar {
+    display: none;
+  }
+  max-height: 416px;
+  overflow-y: auto;
+  padding: 16px;
+  background: rgb(63, 68, 73);
+  &__content {
+    .left-boxs {
+      // float: left;
+      // width: 462px;
+
+      .textarea {
+        border-bottom: 1px solid #555555;
+        .submit {
+          padding: 10px 20px;
+          border-radius: 2px;
+          text-align: center;
+          font-size: 16px;
+          margin: 10px 0;
+          float: right;
+        }
+      }
+
+      .note-list {
+        &__content {
+          border-bottom: 1px solid #555555;
+          &__title {
+            width: 216px;
+            height: 24px;
+            background: #ccc;
+            border-radius: 24px;
+            font-size: 14px;
+            color: #666666;
+            text-align: center;
+            line-height: 24px;
+            margin: 20px 0;
+          }
+        }
+        &__item {
+          display: flex;
+          padding: 15px;
+          .el-icon-video-play {
+            cursor: pointer;
+            font-size: 20px;
+            color: #3f8dfd;
+          }
+
+          &__content {
+            flex: 1;
+            margin-left: 10px;
+
+            .title {
+              cursor: pointer;
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: bold;
+              color: #3f8dfd;
+              line-height: 24px;
+            }
+
+            .desc {
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #666666;
+              line-height: 24px;
+            }
+
+            .time {
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #999999;
+              line-height: 24px;
+            }
+          }
+        }
+      }
+
+      .pagination {
+        margin-top: 30px;
+        text-align: center;
+      }
+    }
+
+    .right-box {
+      width: 786px;
+      float: right;
+
+      .lecture-list {
+        background: #f5f7fa;
+        border-radius: 8px;
+        &__header {
+          padding: 0 16px;
+          height: 40px;
+          line-height: 40px;
+          font-size: 18px;
+          font-family: Microsoft YaHei;
+          font-weight: bold;
+          color: #333333;
+
+          .slide-btn {
+            cursor: pointer;
+            float: right;
+            font-size: 14px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #999999;
+          }
+        }
+
+        &__body {
+          .list {
+            &__item {
+              border-top: 1px solid #fff;
+              padding: 0 8px 0 16px;
+              height: 56px;
+              line-height: 55px;
+              display: flex;
+              align-items: center;
+              .title {
+                flex: 1;
+                font-size: 16px;
+                font-family: Microsoft YaHei;
+                font-weight: 400;
+                color: #333333;
+              }
+
+              .btns {
+                .btn {
+                  cursor: pointer;
+                  display: inline-block;
+                  vertical-align: middle;
+                  width: 80px;
+                  height: 32px;
+                  background: #ffffff;
+                  border: 1px solid #3f8dfd;
+                  border-radius: 16px;
+                  text-align: center;
+                  line-height: 30px;
+                  color: #3f8dfd;
+                  margin: 0 8px;
+                }
+              }
+            }
+          }
+        }
+
+        &__footer {
+          margin-top: 24px;
+          .lecture-scan {
+            background: #f5f7fa;
+            border-radius: 8px;
+            overflow: hidden;
+            &__header {
+              height: 40px;
+              line-height: 40px;
+              padding: 0 16px;
+              font-size: 16px;
+              font-family: Microsoft YaHei;
+              font-weight: bold;
+              color: #333333;
+            }
+
+            &__body {
+              height: 800px;
+              text-align: center;
+              overflow-y: scroll;
+
+              .iframe {
+                width: 100%;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+.user_notes {
+  border-bottom: 1px solid #555;
+  .p1 {
+    margin: 8px 0px;
+    color: #3f8dfd;
+    font-size: 14px;
+    span {
+      float: right;
+      color: #999;
+      font-size: 12px;
+    }
+  }
+  .p2 {
+    margin-bottom: 8px;
+    font-size: 14px;
+    color: #ccc;
+  }
+}
+/deep/ textarea {
+  background: #65696d;
+  color: #c7c7c7;
+  border-color: transparent;
+}
+/deep/ .el-input__count {
+  color: #999;
+  background: transparent;
+}
 </style>

src/pages/person-center/index.vue

@@ -84,7 +84,7 @@
               <div class="title">我的题库</div>
               <div class="list">
                 <router-link to="/person-center/my-bank">
-                  <div class="item">自购题卷</div>
+                  <div class="item">开始做题</div>
                 </router-link>
                 <router-link to="/person-center/free-bank">
                   <div class="item">赠送题卷</div>

src/pages/person-center/my-bank/bank-detailCopy/index.vue

@@ -0,0 +1,1667 @@
+<template>
+  <div id="bankDetailCopy" class="bank-detail">
+    <section class="section">
+      <div class="section__body">
+        <div class="left-box">
+          <el-tabs v-model="activeName" @tab-click="tabChange">
+            <el-tab-pane label="全部" name="0">
+              <div class="goods-menu">
+                <div class="goods-menu__body">
+                  <div
+                    class="item"
+                    v-for="(item, index) in bankList"
+                    :key="index"
+                  >
+                    <template v-if="item.type == 1">
+                      <div class="item__title" @click="moduleExam(item)">
+                        {{ item.name }}
+                      </div>
+                      <div class="item__content" v-if="item.showList">
+                        <div class="bank-chapter">
+                          <div
+                            class="bank-chapter__item"
+                            v-for="(chapter, chapterIndex) in item.list"
+                            :key="chapterIndex"
+                          >
+                            <div
+                              class="bank-chapter__item__text"
+                              @click="chapterExam(chapter, item.majorId)"
+                            >
+                              <span
+                                style="
+                                  margin-left: 21px;
+                                  margin-right: 8px;
+                                  color: #a7b0b8;
+                                "
+                                ><span v-if="chapterIndex + 1 < 10"
+                                  >0{{ chapterIndex + 1 }}</span
+                                ><span v-else>
+                                  {{ chapterIndex + 1 }}
+                                </span></span
+                              >{{ chapter.name }}
+                            </div>
+
+                            <div class="bank-section" v-if="chapter.showList">
+                              <div
+                                class="bank-section__item"
+                                v-for="(section, sectionIndex) in chapter.list"
+                                :key="sectionIndex"
+                              >
+                                <div class="bank-section__item__text">
+                                  <span
+                                    style="margin-right: 8px; color: #a7b0b8"
+                                    >●</span
+                                  >
+                                  {{ section.examName }}
+                                </div>
+                                <div class="btn_div">
+                                  <!-- 正确率
+                                  <span style="color: rgb(52, 216, 71)"
+                                    >{{
+                                      computedNums(
+                                        section.doQuestionNum,
+                                        section.questionNum
+                                      )
+                                    }}%</span
+                                  > -->
+                                  <span style="margin-left: 6px">题目数： </span
+                                  ><span style="color: blue">{{
+                                    section.doQuestionNum || 0
+                                  }}</span>
+                                  /
+                                  {{ section.questionNum || 0 }}
+                                </div>
+                                <el-button
+                                  v-if="section.recordStatus == -1"
+                                  type="primary"
+                                  @click="
+                                    toDo(
+                                      section,
+                                      chapter.chapterExamId,
+                                      item.majorId
+                                    )
+                                  "
+                                  class="btn"
+                                  >开始做题</el-button
+                                >
+                                <el-button
+                                  v-if="
+                                    section.recordStatus == 0 &&
+                                    section.doType == 1
+                                  "
+                                  type="primary"
+                                  @click="
+                                    continueDo(
+                                      section,
+                                      chapter.chapterExamId,
+                                      item.majorId
+                                    )
+                                  "
+                                  class="btn"
+                                  >继续做题</el-button
+                                >
+
+                                <el-button
+                                  v-if="
+                                    section.recordStatus == 1 ||
+                                    (section.recordStatus == 0 &&
+                                      section.doType == 2)
+                                  "
+                                  :disabled="
+                                    section.answerNum > 0 &&
+                                    section.doNum >= section.answerNum
+                                  "
+                                  type="primary"
+                                  @click="
+                                    doRepeat(
+                                      section,
+                                      chapter.chapterExamId,
+                                      item.majorId
+                                    )
+                                  "
+                                  class="btn"
+                                  >重新做题</el-button
+                                >
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </template>
+
+                    <template v-if="item.type == 2">
+                      <div class="item__content">
+                        <div class="bank-chapter">
+                          <div class="bank-chapter__item">
+                            <div
+                              class="bank-chapter__item__text"
+                              @click="chapterExam(item, 0)"
+                            >
+                              <span
+                                style="
+                                  margin-left: 21px;
+                                  margin-right: 8px;
+                                  color: #a7b0b8;
+                                "
+                                ><span v-if="index + 1 < 10"
+                                  >0{{ index + 1 }}</span
+                                ><span v-else>
+                                  {{ index + 1 }}
+                                </span></span
+                              >{{ item.name }}
+                            </div>
+
+                            <div class="bank-section" v-if="item.showList">
+                              <div
+                                class="bank-section__item"
+                                v-for="(section, sectionIndex) in item.list"
+                                :key="sectionIndex"
+                              >
+                                <div class="bank-section__item__text">
+                                  <span
+                                    style="margin-right: 8px; color: #a7b0b8"
+                                    >●</span
+                                  >
+                                  {{ section.examName }}
+                                </div>
+                                <div
+                                  style="width: auto; padding: 0px 14px"
+                                  class="btn_div"
+                                >
+                                  <!-- 正确率
+                                  <span style="color: rgb(52, 216, 71)"
+                                    >{{
+                                      computedNums(
+                                        section.doQuestionNum,
+                                        section.questionNum
+                                      )
+                                    }}%</span
+                                  > -->
+                                  <span style="margin-left: 6px">题目数： </span
+                                  ><span style="color: blue">{{
+                                    section.doQuestionNum || 0
+                                  }}</span>
+                                  /
+                                  {{ section.questionNum || 0 }}
+                                </div>
+                                <el-button
+                                  v-if="section.recordStatus == -1"
+                                  type="primary"
+                                  @click="toDo(section, item.majorId, 0)"
+                                  class="btn"
+                                  >开始做题</el-button
+                                >
+                                <el-button
+                                  v-if="
+                                    section.recordStatus == 0 &&
+                                    section.doType == 1
+                                  "
+                                  type="primary"
+                                  @click="continueDo(section, item.majorId, 0)"
+                                  class="btn"
+                                  >继续做题</el-button
+                                >
+
+                                <el-button
+                                  v-if="
+                                    section.recordStatus == 1 ||
+                                    (section.recordStatus == 0 &&
+                                      section.doType == 2)
+                                  "
+                                  :disabled="
+                                    section.answerNum > 0 &&
+                                    section.doNum >= section.answerNum
+                                  "
+                                  type="primary"
+                                  @click="doRepeat(section, item.majorId, 0)"
+                                  class="btn"
+                                  >重新做题</el-button
+                                >
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </template>
+
+                    <template v-if="item.type == 3">
+                      <div class="item__content">
+                        <div class="bank-section">
+                          <div class="bank-section__item">
+                            <div class="bank-section__item__text">
+                              <span style="margin-right: 8px; color: #a7b0b8"
+                                >●</span
+                              >
+                              {{ item.name }}
+                            </div>
+                            <div
+                              style="width: auto; padding: 0px 14px"
+                              class="btn_div"
+                            >
+                              <!-- 正确率
+                              <span style="color: rgb(52, 216, 71)"
+                                >{{
+                                  computedNums(
+                                    item.doQuestionNum,
+                                    item.questionNum
+                                  )
+                                }}%</span
+                              > -->
+                              <span style="margin-left: 6px">题目数： </span
+                              ><span style="color: blue">{{
+                                item.doQuestionNum || 0
+                              }}</span>
+                              / {{ item.questionNum || 0 }}
+                            </div>
+                            <el-button
+                              v-if="item.recordStatus == -1"
+                              type="primary"
+                              @click="toDo(item, 0, 0)"
+                              class="btn"
+                              >开始做题</el-button
+                            >
+                            <el-button
+                              v-if="item.recordStatus == 0 && item.doType == 1"
+                              type="primary"
+                              @click="continueDo(item, 0, 0)"
+                              class="btn"
+                              >继续做题</el-button
+                            >
+
+                            <el-button
+                              v-if="
+                                item.recordStatus == 1 ||
+                                (item.recordStatus == 0 && item.doType == 2)
+                              "
+                              :disabled="
+                                item.answerNum > 0 &&
+                                item.doNum >= item.answerNum
+                              "
+                              type="primary"
+                              @click="doRepeat(item, 0, 0)"
+                              class="btn"
+                              >重新做题</el-button
+                            >
+                          </div>
+                        </div>
+                      </div>
+                    </template>
+                  </div>
+                </div>
+              </div>
+            </el-tab-pane>
+            <el-tab-pane
+              v-for="(items, indexs) in newList"
+              :key="indexs"
+              :label="items.paperName"
+              :name="items.paperId + ''"
+            >
+              <div
+                v-for="(item, index) in examListNew"
+                :key="index"
+                class="_content"
+              >
+                <div class="bank-section">
+                  <div class="bank-section__item">
+                    <div class="bank-section__item__text">
+                      <span style="margin-right: 8px; color: #a7b0b8">●</span>
+                      {{ item.examName }}
+                    </div>
+                    <div style="width: auto; padding: 0px 14px" class="btn_div">
+                      <!-- 正确率
+                              <span style="color: rgb(52, 216, 71)"
+                                >{{
+                                  computedNums(
+                                    item.doQuestionNum,
+                                    item.questionNum
+                                  )
+                                }}%</span
+                              > -->
+                      <span style="margin-left: 6px">题目数： </span
+                      ><span style="color: blue">{{
+                        item.doQuestionNum || 0
+                      }}</span>
+                      / {{ item.questionNum || 0 }}
+                    </div>
+                    <el-button
+                      v-if="item.recordStatus == -1"
+                      type="primary"
+                      @click="toDo(item, 0, 0)"
+                      class="btn"
+                      >开始做题</el-button
+                    >
+                    <el-button
+                      v-if="item.recordStatus == 0 && item.doType == 1"
+                      type="primary"
+                      @click="continueDo(item, 0, 0)"
+                      class="btn"
+                      >继续做题</el-button
+                    >
+
+                    <el-button
+                      v-if="
+                        item.recordStatus == 1 ||
+                        (item.recordStatus == 0 && item.doType == 2)
+                      "
+                      :disabled="
+                        item.answerNum > 0 && item.doNum >= item.answerNum
+                      "
+                      type="primary"
+                      @click="doRepeat(item, 0, 0)"
+                      class="btn"
+                      >重新做题</el-button
+                    >
+                  </div>
+                </div>
+              </div>
+            </el-tab-pane>
+            <el-tab-pane label="收藏题集" name="-1">
+              <div class="goods-collect">
+                <div class="goods-collect__header">
+                  <div class="selects">
+                    <div class="selects__item">
+                      <el-select
+                        placeholder="请选择"
+                        v-model="collectSelect"
+                        @change="getCollectData"
+                        clearable
+                        @clear="getWrongData"
+                      >
+                        <el-option
+                          v-for="(item, index) in selectList"
+                          :key="index"
+                          :label="item.paperName"
+                          :value="item.paperId"
+                        ></el-option>
+                      </el-select>
+                    </div>
+                  </div>
+
+                  <div class="tabs">
+                    <el-tabs v-model="collectName" @tab-click="getCollectData">
+                      <el-tab-pane label="试卷归类" name="1"></el-tab-pane>
+                      <el-tab-pane label="题型归类" name="2"></el-tab-pane>
+                    </el-tabs>
+                  </div>
+                </div>
+
+                <div class="goods-collect__body">
+                  <div class="box">
+                    <div class="title">收藏统计</div>
+                    <div class="circle">
+                      <el-progress
+                        type="circle"
+                        :width="160"
+                        :stroke-width="12"
+                        color="#FFC53D"
+                        :format="() => collectTotal || '0'"
+                        :percentage="25"
+                      ></el-progress>
+                    </div>
+                  </div>
+                  <div class="list" v-if="collectName == '1'">
+                    <div
+                      class="list__item"
+                      v-for="(item, index) in collectExamList"
+                      :key="index"
+                    >
+                      <div class="title">
+                        {{ item.examName }}
+                      </div>
+                      <div class="content clearfix">
+                        <div class="left">
+                          收藏题<span class="red">{{ item.questionNum }}</span>
+                        </div>
+                        <div class="right">
+                          <el-button
+                            type="primary"
+                            @click="
+                              go('/subject/collect-bank/' + item.examId, {
+                                orderGoodsId: orderGoodsId,
+                              })
+                            "
+                            round
+                            plain
+                            class="btn"
+                            >重做</el-button
+                          >
+                          <el-button
+                            type="primary"
+                            @click="
+                              go('/subject/collect-bank/' + item.examId, {
+                                explain: 1,
+                                orderGoodsId: orderGoodsId,
+                              })
+                            "
+                            round
+                            plain
+                            class="btn"
+                            >解析</el-button
+                          >
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+
+                  <div class="list" v-if="collectName == '2'">
+                    <div
+                      class="list__item"
+                      v-for="(item, index) in collectTypeList"
+                      :key="index"
+                    >
+                      <div class="title">
+                        <template v-if="item.type == 1">单选题</template>
+                        <template v-if="item.type == 2">多选题</template>
+                        <template v-if="item.type == 3">判断题</template>
+                        <template v-if="item.type == 4">案例题</template>
+                        <template v-if="item.type == 5">简答题</template>
+                      </div>
+                      <div class="content clearfix">
+                        <div class="left">
+                          收藏题<span class="red">{{ item.num }}</span>
+                        </div>
+                        <div class="right">
+                          <el-button
+                            type="primary"
+                            @click="
+                              go('/subject/collect-type-bank/' + item.type, {
+                                orderGoodsId: orderGoodsId,
+                              })
+                            "
+                            round
+                            plain
+                            class="btn"
+                            >重做</el-button
+                          >
+                          <el-button
+                            type="primary"
+                            @click="
+                              go('/subject/collect-type-bank/' + item.type, {
+                                explain: 1,
+                                orderGoodsId: orderGoodsId,
+                              })
+                            "
+                            round
+                            plain
+                            class="btn"
+                            >解析</el-button
+                          >
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </el-tab-pane>
+            <el-tab-pane label="错题集" name="-2">
+              <div class="goods-collect">
+                <div class="goods-collect__header">
+                  <div class="selects">
+                    <div class="selects__item">
+                      <el-select
+                        placeholder="请选择试卷类型"
+                        v-model="wrongSelect"
+                        clearable
+                        @clear="getWrongData"
+                        @change="getWrongData"
+                      >
+                        <el-option
+                          v-for="(item, index) in selectList"
+                          :key="index"
+                          :label="item.paperName"
+                          :value="item.paperId"
+                        ></el-option>
+                      </el-select>
+                    </div>
+                  </div>
+
+                  <div class="tabs">
+                    <el-tabs v-model="wrongName" @tab-click="getWrongData">
+                      <el-tab-pane label="试卷归类" name="1"></el-tab-pane>
+                      <el-tab-pane label="题型归类" name="2"></el-tab-pane>
+                    </el-tabs>
+                  </div>
+                </div>
+
+                <div class="goods-collect__body">
+                  <div class="box">
+                    <div class="title">错题统计</div>
+                    <div class="circle">
+                      <el-progress
+                        type="circle"
+                        :width="160"
+                        :stroke-width="12"
+                        color="#F5222D"
+                        :format="() => wrongTotal || '0'"
+                        :percentage="25"
+                      ></el-progress>
+                    </div>
+                  </div>
+                  <div class="list" v-if="wrongName == '1'">
+                    <div
+                      class="list__item"
+                      v-for="(item, index) in wrongExamList"
+                      :key="index"
+                    >
+                      <div class="title">
+                        {{ item.examName }}
+                      </div>
+                      <div class="content clearfix">
+                        <div class="left">
+                          错题数<span class="red">{{
+                            item.wrongQuestionNum
+                          }}</span>
+                        </div>
+                        <div class="right">
+                          <el-button
+                            type="primary"
+                            round
+                            plain
+                            class="btn"
+                            @click="
+                              go('/subject/wrong-bank/' + item.examId, {
+                                orderGoodsId: orderGoodsId,
+                              })
+                            "
+                            >重做</el-button
+                          >
+                          <el-button
+                            type="primary"
+                            round
+                            plain
+                            class="btn"
+                            @click="
+                              go('/subject/wrong-bank/' + item.examId, {
+                                explain: 1,
+                                orderGoodsId: orderGoodsId,
+                              })
+                            "
+                            >解析</el-button
+                          >
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+
+                  <div class="list" v-if="wrongName == '2'">
+                    <div
+                      class="list__item"
+                      v-for="(item, index) in wrongTypeList"
+                      :key="index"
+                    >
+                      <div class="title">
+                        <template v-if="item.type == 1">单选题</template>
+                        <template v-if="item.type == 2">多选题</template>
+                        <template v-if="item.type == 3">判断题</template>
+                        <template v-if="item.type == 4">案例题</template>
+                        <template v-if="item.type == 5">简答题</template>
+                      </div>
+                      <div class="content clearfix">
+                        <div class="left">
+                          错题数<span class="red">{{ item.num }}</span>
+                        </div>
+                        <div class="right">
+                          <el-button
+                            type="primary"
+                            round
+                            plain
+                            class="btn"
+                            @click="
+                              go('/subject/wrong-type-bank/' + item.type, {
+                                orderGoodsId: orderGoodsId,
+                              })
+                            "
+                            >重做</el-button
+                          >
+                          <el-button
+                            type="primary"
+                            round
+                            plain
+                            class="btn"
+                            @click="
+                              go('/subject/wrong-type-bank/' + item.type, {
+                                explain: 1,
+                                orderGoodsId: orderGoodsId,
+                              })
+                            "
+                            >解析</el-button
+                          >
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </el-tab-pane>
+          </el-tabs>
+        </div>
+        <div v-if="false" class="right-box">
+          <div class="right-box__header">
+            <div class="title">
+              <div
+                @click="
+                  go('/person-center/my-bank/bank-statistics/' + goodsId, {
+                    orderGoodsId: orderGoodsId,
+                  })
+                "
+              >
+                做题统计>
+              </div>
+            </div>
+            <div class="content">
+              <div class="left">
+                <div class="title">总进度</div>
+                <div class="note">
+                  {{
+                    goodsCount.totalNum > 0
+                      ? (
+                          (goodsCount.doNum / goodsCount.totalNum) *
+                          100
+                        ).toFixed(
+                          (goodsCount.doNum / goodsCount.totalNum) * 100 == 100
+                            ? 0
+                            : 1
+                        )
+                      : 0
+                  }}%
+                </div>
+              </div>
+              <div class="right">
+                <div class="title"><span class="blue">已答题</span>/未答题</div>
+                <div class="note">
+                  <span class="blue">{{ goodsCount.doNum }}</span
+                  >/{{ goodsCount.totalNum - goodsCount.doNum }}
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="right-box__body"
+            v-if="recommendList.goodsList && recommendList.goodsList.length"
+          >
+            <div class="title">
+              推荐题库
+              <span class="more" @click="go('/bank-list')">更多></span>
+            </div>
+            <ul class="list">
+              <li
+                class="course-item"
+                v-for="(itemy, index) in compyRecommend(
+                  recommendList.goodsList
+                )"
+                :key="index"
+              >
+                <GoodsItem :item="itemy"></GoodsItem>
+                <!-- <div
+                  class="course-item__img"
+                  :style="`background-image:url(${$tools.splitImgHost(
+                    itemy.coverUrl,
+                    true
+                  )})`"
+                >
+                  <div class="note" v-if="itemy.year">{{ itemy.year }}</div>
+                </div>
+                <div class="course-item__title">
+                  {{ itemy.goodsName }}
+                </div>
+                <div class="course-item__desc">
+                  <div class="price">￥{{ itemy.standPrice }}</div>
+                  <a class="add" @click.stop="addCart(true, itemy.goodsId)"
+                    >加购物车</a
+                  >
+                </div> -->
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+</template>
+
+<script>
+import GoodsItem from "@/components/goodsItem/index";
+export default {
+  name: "BankDetailCopy",
+  components: {
+    GoodsItem,
+  },
+  data() {
+    return {
+      newList: [],
+      examListNew: [],
+      orderGoodsId: "",
+      activeName: "0",
+      collectName: "1",
+      wrongName: "1",
+      goodsId: "",
+      goodsDetail: {},
+      goodsCount: {},
+      bankList: [],
+      selectList: [],
+      collectSelect: "",
+      wrongSelect: "",
+      hasClickList: [],
+      collectTypeList: [],
+      collectExamList: [],
+      wrongTypeList: [],
+      wrongExamList: [],
+      collectTotal: 0,
+      wrongTotal: 0,
+      recommendList: [],
+      needOpen: true, //是否需要打开第一章节
+    };
+  },
+  mounted() {},
+  computed: {
+    compyRecommend: function () {
+      return function (array) {
+        let ary = [];
+        if (array) {
+          for (let i = 0; i < array.length; i++) {
+            if (i >= 5) {
+              break;
+            } else {
+              ary.push(array[i]);
+            }
+          }
+        }
+        return ary;
+      };
+    },
+    computedNums: function () {
+      return function (doNum, totalNum) {
+        let ary = 0;
+        ary = parseInt(doNum ? doNum : 0) / parseInt(totalNum ? totalNum : 0);
+        return (ary * 100).toFixed(0);
+      };
+    },
+  },
+  methods: {
+    async initData(data) {
+      this.orderGoodsId = data.orderGoodsId;
+      this.goodsId = data.goodsId;
+      await this.getExamType(data.goodsId);
+      this.goodsBankQuestionNum();
+      this.goodsBank();
+      this.getDetail();
+      this.examaperList();
+    },
+    getExamType(id) {
+      return new Promise((resolve, reject) => {
+        this.$request.exampapergoodsExamPaper(id).then((res) => {
+          this.newList = res.data;
+          if(parseInt(this.activeName) > 0){
+            this.tabChange({name:this.activeName})
+          }
+          resolve();
+        });
+      });
+    },
+    /**
+     * 跳转
+     */
+    toGoodsDetail(item) {
+      this.$router.push({
+        path: "/bank-detail/" + item.goodsId,
+        query: {
+          orderGoodsId: item.orderGoodsId,
+        },
+      });
+    },
+    addCart(status, goodsId) {
+      this.$request
+        .addCart({ goodsId: status ? goodsId : this.goodsId })
+        .then((res) => {
+          this.$message({
+            message: "加入购物车成功",
+            type: "success",
+          });
+        })
+        .catch((err) => {
+          if (err.code == 500) {
+            this.$message({
+              message: err.msg,
+              type: "warning",
+            });
+          }
+        });
+    },
+    /**
+     * 
+     获取推荐列表
+     */
+    getRecommend() {
+      this.$request
+        .appCommonActivityRecommendList({
+          businessId: this.goodsDetail.businessId,
+          type: 2,
+        })
+        .then((res) => {
+          if (res.rows.length) {
+            this.recommendList = res.rows[0];
+          }
+        });
+    },
+    go(path, query = {}) {
+      console.log(path, query);
+      this.$router.push({
+        path,
+        query,
+      });
+    },
+    examaperList() {
+      this.$request.examaperList().then((res) => {
+        this.selectList = res.rows;
+      });
+    },
+
+    /**
+     * 获取用户商品统计数据
+     */
+    goodsBankQuestionNum() {
+      this.$request.goodsBankQuestionNum(this.orderGoodsId).then((res) => {
+        this.goodsCount = res.data;
+      });
+    },
+
+    getDetail() {
+      this.$request.commonGoodsDetail(this.goodsId).then((res) => {
+        this.goodsDetail = res.data;
+        this.getRecommend();
+      });
+    },
+
+    /**
+     * 获取课程目录
+     */
+    goodsBank() {
+      this.$request
+        .goodsBank({
+          orderGoodsId: this.orderGoodsId,
+          goodsId: this.goodsId,
+        })
+        .then((res) => {
+          res.data.forEach((item) => {
+            if (item.type == 2 || item.type == 1) {
+              item.showList = false;
+              item.list = [];
+            }
+          });
+          this.bankList = res.data;
+
+          for (let i = 0; i < this.bankList.length; i++) {
+            if (this.bankList[i].type == 1) {
+              this.moduleExam(this.bankList[i]);
+              break;
+            } else if (this.bankList[i].type == 2) {
+              this.needOpen = false;
+              this.chapterExam(this.bankList[i], 0);
+              break;
+            }
+          }
+        });
+    },
+
+    /**
+     * 展开模块卷
+     */
+    moduleExam(Module) {
+      if (Module.list.length) {
+        Module.showList = !Module.showList;
+        return;
+      }
+      this.$request
+        .goodsChapterList({
+          orderGoodsId: this.orderGoodsId,
+          moduleExamId: Module.majorId,
+          goodsId: this.goodsId,
+        })
+        .then((res) => {
+          res.data.forEach((item) => {
+            item.showList = false;
+            item.list = [];
+          });
+          Module.showList = !Module.showList;
+          Module.list = res.data;
+
+          if (this.needOpen) {
+            this.needOpen = false;
+            this.chapterExam(Module.list[0], Module.majorId);
+          }
+        });
+    },
+    /**
+     * 展开章卷
+     */
+    chapterExam(chapter, moduleId = 0) {
+      if (chapter.list.length) {
+        chapter.showList = !chapter.showList;
+        return;
+      }
+      this.$request
+        .bankExamExamList({
+          orderGoodsId: this.orderGoodsId,
+          moduleExamId: moduleId,
+          chapterExamId: chapter.chapterExamId || chapter.majorId,
+          goodsId: this.goodsId,
+        })
+        .then((res) => {
+          console.log(res,"res")
+          chapter.showList = !chapter.showList;
+          chapter.list = res.data;
+        });
+    },
+
+    /**
+     * 去做题
+     */
+    async toDo(section, chapterId, moduleId) {
+      let count = await this.examRecordCount(section.examId || section.majorId);
+      let answerNum = await this.getExamDetail(
+        section.examId || section.majorId
+      );
+      //超过答题次数
+
+      if (answerNum > 0 && count >= answerNum) {
+        this.$message({
+          type: "warning",
+          message: "该试卷只能答题" + answerNum + "次!",
+        });
+        return;
+      }
+
+      this.$router.push({
+        path: "/bank-exam/" + this.goodsId,
+        query: {
+          examId: section.examId || section.majorId,
+          moduleId: moduleId || 0,
+          chapterId: chapterId || 0,
+          orderGoodsId: this.orderGoodsId,
+        },
+      });
+    },
+
+    /**
+     * 继续做题
+     */
+    continueDo(section, chapterId, moduleId) {
+      console.log(section);
+      this.$router.push({
+        path: "/bank-exam-continue/" + this.goodsId,
+        query: {
+          recordId: section.recordId,
+          examId: section.examId || section.majorId,
+          chapterId: chapterId,
+          moduleId: moduleId,
+          orderGoodsId: this.orderGoodsId,
+        },
+      });
+    },
+
+    /**
+     * 重做
+     * @param {Object} recordId
+     * @param {Object} examId
+     * @param {Object} goodsId
+     * @param {Object} chapterExamId
+     */
+    async doRepeat(section, chapterId = 0, moduleId = 0) {
+      let count = await this.examRecordCount(section.examId || section.majorId);
+      let answerNum = await this.getExamDetail(
+        section.examId || section.majorId
+      );
+      //超过答题次数
+      if (answerNum > 0 && count >= answerNum) {
+        this.$message({
+          type: "warning",
+          message: "该试卷只能答题" + answerNum + "次!",
+        });
+        return;
+      }
+
+      this.$confirm(`是否清空答案重做？`, "提示", {
+        confirmButtonText: "重做",
+        cancelButtonText: "查看上次",
+        closeOnClickModal: false,
+        closeOnPressEscape: false,
+        distinguishCancelAndClose: false,
+        showClose: false,
+      })
+        .then((_) => {
+          this.$router.push({
+            path: "/bank-exam/" + this.goodsId,
+            query: {
+              examId: section.examId || section.majorId,
+              moduleId: moduleId || 0,
+              chapterId: chapterId || 0,
+              orderGoodsId: this.orderGoodsId,
+            },
+          });
+        })
+        .catch((_) => {
+          this.$router.push({
+            path: "/bank-exam-all-explain/" + section.recordId,
+            query: {
+              examId: section.examId || section.majorId,
+              moduleId: moduleId || 0,
+              chapterId: chapterId || 0,
+              goodsId: this.goodsId,
+              orderGoodsId: this.orderGoodsId,
+            },
+          });
+        });
+    },
+
+    /**
+     * 查询试卷历史做题次数
+     */
+    examRecordCount(examId) {
+      return new Promise((resolve) => {
+        this.$request
+          .examRecordCount({
+            examId: examId,
+            orderGoodsId: this.orderGoodsId,
+          })
+          .then((res) => {
+            resolve(res.data);
+          });
+      });
+    },
+    /**
+     * @param {Object} exam_id
+     * 获取试卷可以做的次数
+     */
+    getExamDetail(exam_id) {
+      return new Promise((resolve) => {
+        this.$request.getExamDetail(exam_id).then((res) => {
+          resolve(res.data.answerNum);
+        });
+      });
+    },
+
+    getWrongData() {
+      if (this.wrongName == "1") {
+        //试卷归类
+        this.wrongRecordList();
+      } else if (this.wrongName == "2") {
+        //题型归类
+        this.wrongRecordTypeList();
+      }
+    },
+
+    wrongRecordList() {
+      this.$request
+        .wrongRecordList({
+          paperId: this.wrongSelect,
+          goodsId: this.goodsId,
+        })
+        .then((res) => {
+          this.wrongExamList = res.rows;
+          let total = 0;
+          res.rows.forEach((item) => {
+            total += item.wrongQuestionNum;
+          });
+
+          this.wrongTotal = total;
+        });
+    },
+    wrongRecordTypeList() {
+      this.$request
+        .wrongRecordTypeList({
+          paperId: this.wrongSelect,
+          goodsId: this.goodsId,
+        })
+        .then((res) => {
+          this.wrongTypeList = res.rows;
+
+          let total = 0;
+          res.rows.forEach((item) => {
+            total += item.num;
+          });
+
+          this.wrongTotal = total;
+        });
+    },
+
+    getCollectData() {
+      if (this.collectName == "1") {
+        //试卷归类
+        this.goodsCollectExamList();
+      } else if (this.collectName == "2") {
+        //题型归类
+        this.collectQuestionTypeList();
+      }
+    },
+
+    /**
+     * 收藏按试卷分类
+     */
+    goodsCollectExamList() {
+      this.$request
+        .goodsCollectExamList({
+          paperId: this.collectSelect,
+          goodsId: this.goodsId,
+        })
+        .then((res) => {
+          this.collectExamList = res.rows;
+          let total = 0;
+          res.rows.forEach((item) => {
+            total += item.questionNum;
+          });
+
+          this.collectTotal = total;
+        });
+    },
+
+    /**
+     * 收藏按题型分类
+     */
+    collectQuestionTypeList() {
+      this.$request
+        .collectQuestionTypeList({
+          paperId: this.wrongSelect,
+          goodsId: this.goodsId,
+        })
+        .then((res) => {
+          this.collectTypeList = res.rows;
+          let total = 0;
+          res.rows.forEach((item) => {
+            total += item.num;
+          });
+
+          this.collectTotal = total;
+        });
+    },
+
+    tabChange(e) {
+      if (parseInt(e.name) > 0) {
+        this.$request
+          .bankexamgetPaperExamList({ goodsId: this.goodsId, paperId: e.name,orderGoodsId:this.orderGoodsId })
+          .then((res) => {
+            console.log(res, "resssssss");
+            this.examListNew = res.data;
+          });
+      }
+      if (this.hasClickList.indexOf(e.name) != -1) {
+        return;
+      }
+
+      this.hasClickList.push(e.name);
+
+      if (e.name == "2") {
+        //收藏集
+        this.getCollectData();
+      } else if (e.name == "3") {
+        //错题集
+        this.getWrongData();
+      }
+    },
+  },
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="scss">
+.btn_div {
+  user-select: none;
+  color: #666666;
+  margin-right: 10px;
+  padding: 0px 14px;
+  height: 32px;
+  line-height: 32px;
+}
+.bank-detail {
+  .section {
+    &__header {
+      height: 40px;
+      display: flex;
+      align-items: center;
+      padding: 0 20px;
+    }
+
+    &__body {
+      .left-box {
+        // float: left;
+        // width: 768px;
+
+        /deep/.el-tabs__item {
+          height: 98px;
+          line-height: 98px;
+        }
+        .goods-menu {
+          // padding: 0 16px 16px;
+          // border-radius: 10px;
+          // background: #f5f7fa;
+
+          &__header {
+            display: flex;
+            padding-right: 8px;
+            align-items: center;
+            .title {
+              padding: 10px 0;
+              font-size: 16px;
+              font-family: Microsoft YaHei;
+              font-weight: bold;
+              color: #333333;
+              flex: 1;
+            }
+
+            .question-num {
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #999999;
+              text-align: center;
+              display: inline-block;
+              width: 80px;
+            }
+
+            .question-do {
+              width: 88px;
+            }
+          }
+
+          &__body {
+            .item {
+              overflow: hidden;
+              background: #fff;
+              // padding: 0 10px;
+
+              &__title {
+                padding: 20px 21px;
+                cursor: pointer;
+                font-size: 16px;
+                font-family: Microsoft YaHei;
+                font-weight: bold;
+                color: #333333;
+                background-color: #f8f8f9;
+
+                .note {
+                  display: inline-block;
+                  margin-left: 20px;
+                  width: 40px;
+                  height: 24px;
+                  border: 1px solid #ff3b30;
+                  border-radius: 8px;
+                  line-height: 22px;
+                  color: #ff3b30;
+                  text-align: center;
+                }
+              }
+
+              &__content {
+                margin-top: 12px;
+                background: #fff;
+
+                .bank-chapter {
+                  margin-left: 4px;
+
+                  &__item {
+                    font-size: 16px;
+
+                    &__text {
+                      padding-top: 20px;
+                      padding-bottom: 20px;
+                      border-bottom: 1px solid #eeeeee;
+                      cursor: pointer;
+                      flex: 1;
+                    }
+                  }
+                }
+
+                .bank-section {
+                  margin-left: 25px;
+                  color: #99a0a7;
+                  &__item {
+                    padding-top: 20px;
+                    padding-bottom: 20px;
+                    // border-bottom: 1px solid #eeeeee;
+                    font-size: 16px;
+                    display: flex;
+
+                    &__text {
+                      flex: 1;
+                    }
+
+                    .btn {
+                      margin-right: 20px;
+                      width: 88px;
+                      height: 32px;
+                      padding: 0;
+                      border-radius: 16px;
+                      line-height: 32px;
+                      text-align: center;
+                      cursor: pointer;
+                    }
+                  }
+                }
+              }
+            }
+          }
+        }
+
+        .goods-collect {
+          &__header {
+            .selects {
+              display: flex;
+              justify-content: space-between;
+              &__item {
+                width: 360px;
+                height: 40px;
+                border-radius: 8px;
+
+                .el-select {
+                  width: 100%;
+                }
+
+                /deep/ .el-input__inner {
+                  background: #fafafa;
+                  border: 1px solid #d9d9d9;
+                }
+              }
+            }
+          }
+
+          &__body {
+            .box {
+              width: 300px;
+              height: 240px;
+              background: #ffffff;
+              border: 1px solid #d9d9d9;
+              border-radius: 8px;
+              padding: 16px;
+
+              .title {
+                font-size: 14px;
+                font-family: Microsoft YaHei;
+                font-weight: 400;
+                color: #333333;
+              }
+
+              .circle {
+                width: 160px;
+                height: 160px;
+                margin: 10px auto 0;
+              }
+            }
+
+            .list {
+              overflow: hidden;
+              &__item {
+                margin-top: 16px;
+                height: 98px;
+                background: #f7f9fc;
+                box-shadow: 0px 3px 6px 0px #e1e6ed;
+                border-radius: 8px;
+
+                .title {
+                  padding: 10px 16px;
+                  font-size: 16px;
+                  font-family: Microsoft YaHei;
+                  font-weight: bold;
+                  color: #333333;
+                }
+
+                .content {
+                  border-top: 1px solid #eee;
+                  .left {
+                    float: left;
+                    margin-left: 16px;
+                    margin-top: 10px;
+                    padding: 4px 12px;
+                    border: 1px solid #666666;
+                    border-radius: 4px;
+                    font-size: 14px;
+
+                    .red {
+                      margin-left: 12px;
+                      color: #f5222d;
+                      font-size: 14px;
+                    }
+                  }
+
+                  .right {
+                    float: right;
+                    margin-right: 16px;
+                    margin-top: 10px;
+                    .btn {
+                      width: 88px;
+                      height: 32px;
+                      border-radius: 16px;
+                      text-align: center;
+                      padding: 0;
+                      line-height: 32px;
+                    }
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+
+      .right-box {
+        width: 300px;
+        float: right;
+
+        &__header {
+          height: 98px;
+          border-bottom: 2px solid #e4e7ed;
+
+          .title {
+            cursor: pointer;
+            height: 32px;
+            font-size: 14px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #333333;
+            line-height: 32px;
+          }
+
+          .content {
+            height: 64px;
+            font-size: 0;
+            .left {
+              width: 50%;
+              display: inline-block;
+              border-right: 1px solid #e4e7ed;
+              .title {
+                font-size: 14px;
+                font-family: Microsoft YaHei;
+                font-weight: 400;
+                color: #999999;
+              }
+
+              .note {
+                font-size: 24px;
+                font-family: Microsoft YaHei;
+                font-weight: bold;
+                color: #3f8dfd;
+              }
+            }
+
+            .right {
+              text-align: center;
+              display: inline-block;
+              width: 50%;
+              .title {
+                font-size: 14px;
+                font-family: Microsoft YaHei;
+                font-weight: 400;
+                color: #999999;
+                .blue {
+                  color: #3f8dfd;
+                }
+              }
+
+              .note {
+                font-size: 24px;
+                font-family: Microsoft YaHei;
+                color: #999999;
+                .blue {
+                  font-size: 24px;
+                  color: #3f8dfd;
+                }
+              }
+            }
+          }
+        }
+
+        &__body {
+          .title {
+            margin-top: 15px;
+            font-size: 16px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #333333;
+            text-shadow: 0px 6px 6px rgba(85, 158, 255, 0.08);
+            position: relative;
+
+            .more {
+              cursor: pointer;
+              font-size: 16px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #999999;
+              position: absolute;
+              right: 0;
+            }
+          }
+
+          .list {
+            .course-item {
+              // margin: 110px 0 0;
+              // width: 300px;
+              // height: 178px;
+              // background: #ffffff;
+              // box-shadow: 0px 10px 13px 3px rgba(63, 141, 253, 0.1);
+              // border-radius: 10px;
+              // position: relative;
+              // background: #fff;
+              // padding-top: 100px;
+
+              // &__img {
+              //   width: 280px;
+              //   height: 178px;
+              //   background: #ffffff;
+              //   box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.08);
+              //   border-radius: 10px;
+              //   position: absolute;
+              //   left: 10px;
+              //   top: -78px;
+              //   background: rgba(122, 136, 246, 1);
+              //   overflow: hidden;
+              //   background: no-repeat center center;
+              //   background-size: 280px 178px;
+
+              //   .note {
+              //     width: 80px;
+              //     height: 24px;
+              //     background: #d94404;
+              //     box-shadow: 0px 1px 1px 0px rgba(248, 78, 5, 0.4);
+              //     border-radius: 10px 0px 20px 0px;
+              //     text-align: center;
+              //     line-height: 24px;
+              //     color: #fff;
+              //   }
+              // }
+
+              // &__title {
+              //   margin: 0 8px;
+              //   font-size: 14px;
+              //   font-family: Microsoft YaHei;
+              //   font-weight: 400;
+              //   color: #333333;
+              //   line-height: 24px;
+              // }
+
+              // &__desc {
+              //   height: 32px;
+              //   position: absolute;
+              //   left: 0;
+              //   right: 0;
+              //   bottom: 0;
+              //   margin-left: 8px;
+              //   display: flex;
+              //   justify-content: space-between;
+
+              //   .price {
+              //     font-size: 18px;
+              //     font-family: Microsoft YaHei;
+              //     font-weight: bold;
+              //     color: #ff2d55;
+              //     line-height: 32px;
+              //   }
+
+              //   .add {
+              //     display: block;
+              //     width: 118px;
+              //     height: 32px;
+              //     line-height: 30px;
+              //     background: #f2f4f7;
+              //     border-radius: 10px 0px 10px 0px;
+              //     font-size: 16px;
+              //     color: #3f8dfd;
+              //     text-align: center;
+
+              //     &:hover {
+              //       background: #3f8dfd;
+              //       color: #f2f4f7;
+              //     }
+              //   }
+              // }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+._content {
+  margin-top: 6px;
+  background: #fff;
+
+  .bank-chapter {
+    margin-left: 4px;
+
+    &__item {
+      font-size: 16px;
+
+      &__text {
+        padding-top: 20px;
+        padding-bottom: 20px;
+        border-bottom: 1px solid #eeeeee;
+        cursor: pointer;
+        flex: 1;
+      }
+    }
+  }
+
+  .bank-section {
+    margin-left: 25px;
+    color: #99a0a7;
+    &__item {
+      padding-bottom: 6px;
+      // border-bottom: 1px solid #eeeeee;
+      font-size: 16px;
+      display: flex;
+
+      &__text {
+        flex: 1;
+      }
+
+      .btn {
+        margin-right: 20px;
+        width: 88px;
+        height: 32px;
+        padding: 0;
+        border-radius: 16px;
+        line-height: 32px;
+        text-align: center;
+        cursor: pointer;
+      }
+    }
+  }
+}
+</style>

src/pages/person-center/my-bank/index/index.vue

@@ -1,322 +1,98 @@
 <template>
-  <div class="my-bank">
-    <div class="my-bank__header">
-      <el-tabs :value="activeName" @tab-click="tabChange">
-        <el-tab-pane
-          v-for="(tab, tabIndex) in tabList"
-          :key="tabIndex"
-          :label="tab.educationName"
-          :name="tab.id"
-        ></el-tab-pane>
-      </el-tabs>
-    </div>
-
-    <div class="my-bank__body">
-      <div class="no-data" v-if="list.length == 0">暂无可以学习的题库哦~</div>
-      <div class="list" v-else>
-        <div class="bank-item" v-for="(item, index) in list" :key="index">
-          <div class="bank-item__header">
-            {{ item.goodsName }}
-            <div
-              class="time"
-              v-if="item.serviceStartTime && item.serviceEndTime"
-            >
-              学习服务期：{{
-                $tools.timestampToTime(item.serviceStartTime, true, true)
-              }}-{{ $tools.timestampToTime(item.serviceEndTime, true, true) }}
-            </div>
-          </div>
-          <div class="bank-item__body clearfix">
-            <div class="img">
-              <img :src="$tools.splitImgHost(item.coverUrl, true)" alt="" />
-            </div>
-            <div class="text">
-              <!-- <div class="title">
-                <div class="note">60学时</div>
-              </div> -->
-              <div class="progress">
-                学习进度
-                <el-progress
-                  class="progress-line"
-                  :stroke-width="16"
-                  :format="progressText(item)"
-                  :percentage="
-                    item.totalNum != 0 ? (item.doNum / item.totalNum) * 100 : 0
-                  "
-                ></el-progress>
-              </div>
-            </div>
-            <div class="btns-wrap">
-              <div class="btns">
-                <el-button type="primary" class="btn" @click="goStudy(item)"
-                  >进入学习</el-button
-                >
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="pagination">
-        <el-pagination
-          @current-change="currentChange"
-          background
-          layout="prev, pager, next"
-          :total="total"
-          :pager-count="5"
-          :page-size="param.pageSize"
+  <div id="Mybank">
+    <div class="no-data" v-if="!bankData.goodsName">暂无可以学习的题库哦~</div>
+    <div v-else>
+      <h4 class="headerTitle">
+        <span v-if="bankData.subjectNames">【{{bankData.subjectNames}}】</span>{{ bankData.goodsName
+        }}<el-button
+          size="mini"
+          type="primary"
+          plain
+          icon="el-icon-sort"
+          style="margin-left: 14px"
+          @click="changeBank"
+          >切换题库</el-button
         >
-        </el-pagination>
-      </div>
+      </h4>
+      <bank-detail-copy ref="bankDetailCopy" />
     </div>
+    <el-dialog title="切换题库" :visible.sync="dialogVisible" width="500px">
+      <el-radio-group v-model="activeRadio">
+        <el-radio
+          v-for="(item, index) in list"
+          :key="index"
+          :label="item.goodsId"
+          >{{ item.goodsName }}</el-radio
+        >
+      </el-radio-group>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="activeFunc">确 定</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
 <script>
+import bankDetailCopy from "../bank-detailCopy/index.vue";
 export default {
   name: "Mybank",
+  components: { bankDetailCopy },
   data() {
     return {
-      param: {
-        pageNum: 1,
-        pageSize: 10,
-      },
-      tabList: [],
+      bankData: {},
+      dialogVisible: false,
       list: [],
-      activeName: "-1",
-      total: 0,
+      activeRadio: "",
     };
   },
-  async mounted() {
-    await this.orderUserEduList();
-    this.listGoodsUserQuestion();
+  mounted() {
+    this.getList();
   },
   methods: {
-    tabChange(e) {
-      if (this.activeName == e.name) {
-        return;
-      }
-
-      console.log(e.name);
-      this.activeName = e.name;
-      this.listGoodsUserQuestion();
-    },
-    orderUserEduList() {
-      return new Promise((resolve) => {
-        this.$request
-          .orderUserEduList({
-            goodsType: 2,
-          })
-          .then((res) => {
-            res.rows.forEach((row) => {
-              row.id = row.id + "";
+    getList() {
+      this.$request
+        .listGoodsUserQuestion({ pageNum: 1, pageSize: 1 })
+        .then((res) => {
+          if (res.rows.length > 0) {
+            this.bankData = res.rows[0];
+            this.$nextTick(() => {
+              this.$refs.bankDetailCopy.initData(this.bankData);
             });
-            this.tabList.push(
-              {
-                educationName: "全部题库",
-                id: "-1",
-              },
-              ...res.rows
-            );
-
-            resolve();
-          });
-      });
-    },
-    progressText(item) {
-      return () => {
-        return item.doNum + "/" + item.totalNum;
-      };
-    },
-    currentChange(e) {
-      this.param.pageNum = e;
-      this.listGoodsUserQuestion();
-    },
-    listGoodsUserQuestion() {
-      let param = JSON.parse(JSON.stringify(this.param));
-
-      if (this.activeName == "-1") {
-        param.educationTypeId = "";
-      } else {
-        param.educationTypeId = this.activeName;
-      }
-      this.$request.listGoodsUserQuestion(param).then((res) => {
-        res.rows.forEach((item) => {
-          console.log(`${item.goodsName}：${item.doNum}/${item.totalNum}`);
+          }
         });
-        this.list = res.rows;
-        this.total = res.total;
-      });
     },
-    studyIn(item, index) {
-      this.itemIndex = index;
-      uni.navigateTo({
-        url: "/pages2/bank/question_detail?id=" + item.goodsId,
-        query: {
-          orderGoodsId: item.orderGoodsId,
-        },
-      });
-    },
-
-    pay() {
-      this.$router.push({
-        path: "payment-success",
+    /**
+     * 切换题库
+     */
+    changeBank() {
+      this.activeRadio = this.bankData.goodsId || "";
+      this.$request.listGoodsUserQuestion().then((res) => {
+        this.list = res.rows;
+        this.dialogVisible = true;
       });
     },
-    goStudy(item) {
-      let sysTime = this.$tools.timest();
-      if (
-        item.serviceStartTime &&
-        item.serviceEndTime &&
-        (sysTime <= item.serviceStartTime || sysTime >= item.serviceEndTime)
-      ) {
-        this.$message.warning("不在学习服务期，不能进入学习");
-        return;
+    /**
+     * 确定选中
+     */
+    activeFunc() {
+      for (let i = 0; i < this.list.length; i++) {
+        if (this.list[i].goodsId == this.activeRadio) {
+          this.$refs.bankDetailCopy.initData(this.list[i]);
+          this.bankData = this.list[i];
+          this.dialogVisible = false;
+        }
       }
-      this.$router.push({
-        path: "/person-center/my-bank/bank-detail/" + item.goodsId,
-        query: {
-          orderGoodsId: item.orderGoodsId,
-        },
-      });
     },
   },
 };
 </script>
 
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped lang="scss">
-.my-bank {
-  &__header {
-    /deep/ .el-tabs__header {
-      margin-bottom: 0;
-    }
-  }
-  &__body {
-    .list {
-      .bank-item {
-        margin-top: 24px;
-        background: #fafbfc;
-        border-radius: 8px;
-        overflow: hidden;
-
-        &__header {
-          height: 40px;
-          line-height: 40px;
-          border-bottom: 1px solid #eee;
-          padding: 0 18px;
-          font-size: 16px;
-          font-family: Microsoft YaHei;
-          font-weight: bold;
-          color: #333333;
-
-          .time {
-            float: right;
-            line-height: 40px;
-            text-align: right;
-            font-size: 12px;
-            font-family: Microsoft YaHei;
-            font-weight: 400;
-            color: #666666;
-          }
-        }
-
-        &__body {
-          .img {
-            float: left;
-            width: 160px;
-            height: 90px;
-            display: table-cell;
-
-            img {
-              max-width: 100%;
-              max-height: 100%;
-              display: inline-block;
-              vertical-align: middle;
-            }
-          }
-
-          .text {
-            float: left;
-            margin-left: 12px;
-            .title {
-              margin-top: 10px;
-              font-size: 16px;
-              font-family: Microsoft YaHei;
-              font-weight: bold;
-              color: #333333;
-              .note {
-                display: inline-block;
-                vertical-align: middle;
-                border: 1px solid #333333;
-                border-radius: 4px;
-                font-size: 12px;
-                font-family: Microsoft YaHei;
-                font-weight: 400;
-                color: #333333;
-                padding: 2px 5px;
-              }
-            }
-
-            .progress {
-              margin-top: 30px;
-
-              font-size: 14px;
-              font-family: Microsoft YaHei;
-              font-weight: 400;
-              color: #333333;
-
-              &-line {
-                width: 220px;
-                display: inline-block;
-              }
-
-              /deep/ .el-progress-bar {
-                padding-right: 70px;
-                margin-right: -70px;
-              }
-            }
-          }
-
-          .btns-wrap {
-            display: table;
-            float: right;
-            height: 90px;
-            width: 130px;
-
-            .btns {
-              display: table-cell;
-              vertical-align: middle;
-              text-align: center;
-
-              .btn {
-                cursor: pointer;
-                margin: 2px 0;
-                width: 122px;
-                height: 32px;
-                border-radius: 16px;
-                display: inline-block;
-                text-align: center;
-                line-height: 32px;
-                padding: 0;
-              }
-            }
-          }
-        }
-      }
-    }
-
-    .no-data {
-      text-align: center;
-      padding: 50px 0;
-      color: #666;
-      font-size: 16px;
-    }
-
-    .pagination {
-      padding: 30px 0;
-      text-align: center;
-    }
-  }
+<style lang="scss" scoped>
+.headerTitle {
+  padding: 30px 0px;
+  font-size: 24px;
+  font-weight: bold;
+  color: #222;
 }
 </style>

src/pages/person-center/my-bank/indexCopy/index.vue

@@ -0,0 +1,322 @@
+<template>
+  <div class="my-bank">
+    <div class="my-bank__header">
+      <el-tabs :value="activeName" @tab-click="tabChange">
+        <el-tab-pane
+          v-for="(tab, tabIndex) in tabList"
+          :key="tabIndex"
+          :label="tab.educationName"
+          :name="tab.id"
+        ></el-tab-pane>
+      </el-tabs>
+    </div>
+
+    <div class="my-bank__body">
+      <div class="no-data" v-if="list.length == 0">暂无可以学习的题库哦~</div>
+      <div class="list" v-else>
+        <div class="bank-item" v-for="(item, index) in list" :key="index">
+          <div class="bank-item__header">
+            {{ item.goodsName }}
+            <div
+              class="time"
+              v-if="item.serviceStartTime && item.serviceEndTime"
+            >
+              学习服务期：{{
+                $tools.timestampToTime(item.serviceStartTime, true, true)
+              }}-{{ $tools.timestampToTime(item.serviceEndTime, true, true) }}
+            </div>
+          </div>
+          <div class="bank-item__body clearfix">
+            <div class="img">
+              <img :src="$tools.splitImgHost(item.coverUrl, true)" alt="" />
+            </div>
+            <div class="text">
+              <!-- <div class="title">
+                <div class="note">60学时</div>
+              </div> -->
+              <div class="progress">
+                学习进度
+                <el-progress
+                  class="progress-line"
+                  :stroke-width="16"
+                  :format="progressText(item)"
+                  :percentage="
+                    item.totalNum != 0 ? (item.doNum / item.totalNum) * 100 : 0
+                  "
+                ></el-progress>
+              </div>
+            </div>
+            <div class="btns-wrap">
+              <div class="btns">
+                <el-button type="primary" class="btn" @click="goStudy(item)"
+                  >进入学习</el-button
+                >
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div class="pagination">
+        <el-pagination
+          @current-change="currentChange"
+          background
+          layout="prev, pager, next"
+          :total="total"
+          :pager-count="5"
+          :page-size="param.pageSize"
+        >
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Mybanks",
+  data() {
+    return {
+      param: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      tabList: [],
+      list: [],
+      activeName: "-1",
+      total: 0,
+    };
+  },
+  async mounted() {
+    await this.orderUserEduList();
+    this.listGoodsUserQuestion();
+  },
+  methods: {
+    tabChange(e) {
+      if (this.activeName == e.name) {
+        return;
+      }
+
+      console.log(e.name);
+      this.activeName = e.name;
+      this.listGoodsUserQuestion();
+    },
+    orderUserEduList() {
+      return new Promise((resolve) => {
+        this.$request
+          .orderUserEduList({
+            goodsType: 2,
+          })
+          .then((res) => {
+            res.rows.forEach((row) => {
+              row.id = row.id + "";
+            });
+            this.tabList.push(
+              {
+                educationName: "全部题库",
+                id: "-1",
+              },
+              ...res.rows
+            );
+
+            resolve();
+          });
+      });
+    },
+    progressText(item) {
+      return () => {
+        return item.doNum + "/" + item.totalNum;
+      };
+    },
+    currentChange(e) {
+      this.param.pageNum = e;
+      this.listGoodsUserQuestion();
+    },
+    listGoodsUserQuestion() {
+      let param = JSON.parse(JSON.stringify(this.param));
+
+      if (this.activeName == "-1") {
+        param.educationTypeId = "";
+      } else {
+        param.educationTypeId = this.activeName;
+      }
+      this.$request.listGoodsUserQuestion(param).then((res) => {
+        res.rows.forEach((item) => {
+          console.log(`${item.goodsName}：${item.doNum}/${item.totalNum}`);
+        });
+        this.list = res.rows;
+        this.total = res.total;
+      });
+    },
+    studyIn(item, index) {
+      this.itemIndex = index;
+      uni.navigateTo({
+        url: "/pages2/bank/question_detail?id=" + item.goodsId,
+        query: {
+          orderGoodsId: item.orderGoodsId,
+        },
+      });
+    },
+
+    pay() {
+      this.$router.push({
+        path: "payment-success",
+      });
+    },
+    goStudy(item) {
+      let sysTime = this.$tools.timest();
+      if (
+        item.serviceStartTime &&
+        item.serviceEndTime &&
+        (sysTime <= item.serviceStartTime || sysTime >= item.serviceEndTime)
+      ) {
+        this.$message.warning("不在学习服务期，不能进入学习");
+        return;
+      }
+      this.$router.push({
+        path: "/person-center/my-bank/bank-detail/" + item.goodsId,
+        query: {
+          orderGoodsId: item.orderGoodsId,
+        },
+      });
+    },
+  },
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="scss">
+.my-bank {
+  &__header {
+    /deep/ .el-tabs__header {
+      margin-bottom: 0;
+    }
+  }
+  &__body {
+    .list {
+      .bank-item {
+        margin-top: 24px;
+        background: #fafbfc;
+        border-radius: 8px;
+        overflow: hidden;
+
+        &__header {
+          height: 40px;
+          line-height: 40px;
+          border-bottom: 1px solid #eee;
+          padding: 0 18px;
+          font-size: 16px;
+          font-family: Microsoft YaHei;
+          font-weight: bold;
+          color: #333333;
+
+          .time {
+            float: right;
+            line-height: 40px;
+            text-align: right;
+            font-size: 12px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #666666;
+          }
+        }
+
+        &__body {
+          .img {
+            float: left;
+            width: 160px;
+            height: 90px;
+            display: table-cell;
+
+            img {
+              max-width: 100%;
+              max-height: 100%;
+              display: inline-block;
+              vertical-align: middle;
+            }
+          }
+
+          .text {
+            float: left;
+            margin-left: 12px;
+            .title {
+              margin-top: 10px;
+              font-size: 16px;
+              font-family: Microsoft YaHei;
+              font-weight: bold;
+              color: #333333;
+              .note {
+                display: inline-block;
+                vertical-align: middle;
+                border: 1px solid #333333;
+                border-radius: 4px;
+                font-size: 12px;
+                font-family: Microsoft YaHei;
+                font-weight: 400;
+                color: #333333;
+                padding: 2px 5px;
+              }
+            }
+
+            .progress {
+              margin-top: 30px;
+
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #333333;
+
+              &-line {
+                width: 220px;
+                display: inline-block;
+              }
+
+              /deep/ .el-progress-bar {
+                padding-right: 70px;
+                margin-right: -70px;
+              }
+            }
+          }
+
+          .btns-wrap {
+            display: table;
+            float: right;
+            height: 90px;
+            width: 130px;
+
+            .btns {
+              display: table-cell;
+              vertical-align: middle;
+              text-align: center;
+
+              .btn {
+                cursor: pointer;
+                margin: 2px 0;
+                width: 122px;
+                height: 32px;
+                border-radius: 16px;
+                display: inline-block;
+                text-align: center;
+                line-height: 32px;
+                padding: 0;
+              }
+            }
+          }
+        }
+      }
+    }
+
+    .no-data {
+      text-align: center;
+      padding: 50px 0;
+      color: #666;
+      font-size: 16px;
+    }
+
+    .pagination {
+      padding: 30px 0;
+      text-align: center;
+    }
+  }
+}
+</style>

src/pages/person-center/my-course/courseData.vue

@@ -0,0 +1,1209 @@
+<template>
+  <div id="courseData">
+    <el-dialog title="切换科目" :visible.sync="dialogVisible" width="1100px">
+      <div class="my-course">
+        <div class="my-course__header">
+          <el-tabs :value="activeName" @tab-click="tabChange">
+            <el-tab-pane
+              v-for="(tab, tabIndex) in tabList"
+              :key="tabIndex"
+              :label="tab.educationName"
+              :name="tab.id"
+            ></el-tab-pane>
+          </el-tabs>
+        </div>
+
+        <div class="my-course__body">
+          <div class="list">
+            <div
+              class="course-item"
+              v-for="(item, index) in courseList"
+              :key="index"
+            >
+              <div class="course-item__header">
+                <div
+                  class="time"
+                  v-if="item.serviceStartTime && item.serviceEndTime"
+                >
+                  学习服务期：{{
+                    $tools.timestampToTime(item.serviceStartTime, false)
+                  }}
+                  至
+                  {{ $tools.timestampToTime(item.serviceEndTime, false) }}
+                </div>
+
+                <div class="state">
+                  <template
+                    v-if="
+                      item.serviceStartTime &&
+                      (sysTime < item.serviceStartTime ||
+                        sysTime > item.serviceEndTime)
+                    "
+                  >
+                    <div class="red">不在学习服务期，不可以学习了哦</div>
+                  </template>
+
+                  <template v-else>
+                    <template
+                      v-if="
+                        !(item.classEndTime && item.classEndTime < sysTime) &&
+                        !(item.classStartTime && item.classStartTime > sysTime)
+                      "
+                    >
+                      <template
+                        v-if="item.periodStatus == -1 || item.periodStatus == 2"
+                      >
+                        <template
+                          v-if="
+                            item.classStatus == 1 || item.classStatus === null
+                          "
+                        >
+                          <template
+                            v-if="
+                              sysTime >= item.serviceStartTime &&
+                              sysTime <= item.serviceEndTime
+                            "
+                          >
+                            学习状态：
+                            <div
+                              class="note"
+                              v-if="item.stuAllNum + item.recordNum == 0"
+                            >
+                              未学习
+                            </div>
+                            <div
+                              class="note note--yellow"
+                              v-else-if="
+                                item.stuAllNum + item.recordNum > 0 &&
+                                item.stuAllNum + item.recordNum <
+                                  item.secAllNum + item.examNum
+                              "
+                            >
+                              学习中
+                            </div>
+                            <div
+                              class="note note--green"
+                              v-else-if="
+                                item.stuAllNum + item.recordNum >=
+                                item.secAllNum + item.examNum
+                              "
+                            >
+                              已学完
+                            </div>
+                          </template>
+
+                          <template v-else>
+                            <span class="red" v-if="item.serviceStartTime">
+                              已过学习服务期，不可以学习了哦！</span
+                            >
+                          </template>
+                        </template>
+
+                        <!-- <template v-if="item.profileTpStatus == 1">
+                      资料审核状态：
+                      <div class="note" v-if="item.profileStatus == null">
+                        未提交资料
+                      </div>
+                      <div
+                        class="note note--green"
+                        v-else-if="item.profileStatus == 1"
+                      >
+                        已通过
+                      </div>
+                      <div
+                        class="note note--yellow"
+                        v-else-if="item.profileStatus == 2"
+                      >
+                        审核中
+                      </div>
+                      <div
+                        class="note note--yellow"
+                        v-else-if="item.profileStatus == 3"
+                      >
+                        待完善
+                      </div>
+                    </template> -->
+                      </template>
+
+                      <!-- 学时审核状态可以审核 -->
+                      <template v-if="item.periodStatus != -1">
+                        <template v-if="item.periodStatus == 0"
+                          >机构审核：
+                          <div class="note">学时审核不通过</div>
+                        </template>
+                        <!-- <template v-else-if="item.periodStatus == 2"
+                      >机构审核：
+                      <div class="note note--yellow">学时待审核</div></template
+                    > -->
+                        <template v-else-if="item.periodStatus == 1">
+                          <template v-if="item.periodPlush > 0"
+                            ><div class="note note--green">
+                              学时已上报注册中心
+                            </div></template
+                          >
+                          <template v-else
+                            >机构审核：
+                            <div class="note note--green">
+                              学时审核通过
+                            </div></template
+                          >
+                        </template>
+                        <template
+                          v-if="
+                            item.subscribeId != null && item.periodStatus == 1
+                          "
+                        >
+                          <template v-if="item.subExamStatus === null">
+                            待预约考试
+                          </template>
+
+                          <template
+                            v-else-if="
+                              item.subExamStatus === 0 &&
+                              sysTime <
+                                $tools.TimeTotimestamp(
+                                  $tools.timestampToTime(
+                                    item.subApplySiteExamTime,
+                                    true
+                                  ) +
+                                    ' ' +
+                                    item.subApplySiteStartTime
+                                )
+                            "
+                          >
+                            待考试，考试时间：{{
+                              $tools.timestampToTime(
+                                item.subApplySiteExamTime,
+                                true
+                              ) +
+                              " " +
+                              item.subApplySiteStartTime
+                            }}
+                            -
+                            {{
+                              $tools.timestampToTime(
+                                item.subApplySiteExamTime,
+                                true
+                              ) +
+                              " " +
+                              item.subApplySiteEndTime
+                            }}
+                          </template>
+                          <template v-else-if="item.subExamStatus === 0"
+                            >待出考试结果</template
+                          >
+                          <template v-else-if="item.subExamStatus === 1">
+                            <span v-if="item.subResult === null"
+                              >待出考试结果</span
+                            >
+                            <span v-if="item.subResult === 0"
+                              >考试结果：不通过，需补考</span
+                            >
+                            <span v-else-if="item.subResult === 1"
+                              >考试结果：通过，考试成绩为{{
+                                item.subPerformance
+                              }}</span
+                            >
+                          </template>
+                          <template v-else-if="item.subExamStatus === 2">
+                            缺考，无成绩，需补考
+                          </template>
+                          <template v-else-if="item.subExamStatus === 3">
+                            作弊，无成绩，需补考
+                          </template>
+                          <template v-else-if="item.subExamStatus === 4">
+                            替考，无成绩，需补考
+                          </template>
+                        </template>
+                      </template>
+                    </template>
+                  </template>
+                </div>
+              </div>
+              <div class="course-item__body clearfix">
+                <div class="img">
+                  <img :src="$tools.splitImgHost(item.coverUrl, true)" alt="" />
+                </div>
+                <div class="text">
+                  <div class="title">
+                    {{ item.goodsName }}
+                    <div class="note">
+                      {{ item.courseNum }}课程
+                      {{ item.secAllNum + item.examNum }}节
+                      {{ item.classHours }}学时
+                    </div>
+                  </div>
+                  <div class="progress">
+                    学习进度
+                    <el-progress
+                      class="progress-line"
+                      :stroke-width="16"
+                      :format="progressText(item)"
+                      :percentage="
+                        ((item.stuAllNum + item.recordNum) /
+                          (item.secAllNum + item.examNum) || 0) * 100
+                      "
+                    ></el-progress>
+                  </div>
+                </div>
+                <div class="btns-wrap">
+                  <div class="btns">
+                    <el-button
+                      type="primary"
+                      class="btn btn--normal"
+                      :class="{
+                        disabled:
+                          (item.serviceStartTime &&
+                            (sysTime <= item.serviceStartTime ||
+                              sysTime >= item.serviceEndTime)) ||
+                          (item.classStartTime &&
+                            sysTime <= item.classStartTime) ||
+                          (item.classEndTime && sysTime >= item.classEndTime) ||
+                          item.learningStatus == 2 ||
+                          item.classStatus == 0 ||
+                          (item.learningStatus == 3 &&
+                            sysTime < item.learningTimeStart),
+                      }"
+                      @click="goCourseDetail(item)"
+                      >进入学习</el-button
+                    >
+
+                    <el-button
+                      type="primary"
+                      class="btn"
+                      @click="appointment(item)"
+                      v-if="
+                        item.applyStatus === 1 &&
+                        !(
+                          sysTime <= item.serviceStartTime ||
+                          sysTime >= item.serviceEndTime ||
+                          (item.classStartTime &&
+                            sysTime <= item.classStartTime) ||
+                          (item.classEndTime && sysTime >= item.classEndTime) ||
+                          item.learningStatus == 2 ||
+                          item.classStatus == 0 ||
+                          (item.learningStatus == 3 &&
+                            sysTime < item.learningTimeStart)
+                        )
+                      "
+                      >预约考试</el-button
+                    >
+
+                    <el-button
+                      type="danger"
+                      class="btn btn--warm"
+                      @click="selectClass(item)"
+                      v-if="
+                        item.gradeStatus == 1 &&
+                        item.status == 1 &&
+                        item.serviceEndTime > sysTime &&
+                        item.serviceStartTime < sysTime &&
+                        item.classEndTime &&
+                        item.classEndTime < sysTime &&
+                        (item.periodStatus == 0 || item.periodStatus == -1) &&
+                        item.studyCount > 0
+                      "
+                    >
+                      选班重学
+                    </el-button>
+                    <el-button
+                      type="primary"
+                      class="btn"
+                      v-if="
+                        item.beforeStatus === 1 &&
+                        !(
+                          sysTime <= item.serviceStartTime ||
+                          sysTime >= item.serviceEndTime ||
+                          (item.classStartTime &&
+                            sysTime <= item.classStartTime) ||
+                          (item.classEndTime && sysTime >= item.classEndTime) ||
+                          item.learningStatus == 2 ||
+                          item.classStatus == 0 ||
+                          (item.learningStatus == 3 &&
+                            sysTime < item.learningTimeStart)
+                        )
+                      "
+                      @click="appBeforeAddress(item)"
+                      >进入刷题</el-button
+                    >
+                  </div>
+                </div>
+              </div>
+              <template
+                v-if="
+                  !(
+                    sysTime < item.serviceStartTime ||
+                    sysTime > item.serviceEndTime
+                  )
+                "
+              >
+                <div
+                  class="course-item__footer"
+                  v-if="item.classEndTime && item.classEndTime < sysTime"
+                >
+                  <span class="text"
+                    >班级有效期：{{
+                      $tools.timestampToTime(item.classStartTime, true, true)
+                    }}
+                    -
+                    {{
+                      $tools.timestampToTime(item.classEndTime, true, true)
+                    }}</span
+                  >
+                  <span class="text text--red"
+                    >班级状态：已过期，有疑问请联系020-87085982</span
+                  >
+                </div>
+
+                <div
+                  class="course-item__footer"
+                  v-else-if="
+                    item.classStartTime && item.classStartTime > sysTime
+                  "
+                >
+                  <span class="text"
+                    >班级有效期：{{
+                      $tools.timestampToTime(item.classStartTime, true, true)
+                    }}
+                    -
+                    {{
+                      $tools.timestampToTime(item.classEndTime, true, true)
+                    }}</span
+                  >
+                  <span class="text"
+                    >班级状态：未到学习时间，有疑问请联系 020-87085982</span
+                  >
+                </div>
+
+                <template v-else>
+                  <div
+                    class="course-item__footer"
+                    v-if="
+                      item.gradeId != 0 &&
+                      item.gradeStatus == 1 &&
+                      item.classStatus != null
+                    "
+                  >
+                    <span class="text"
+                      >班级状态：
+                      {{
+                        item.classStatus == 1
+                          ? "已开班"
+                          : item.classStatus == 0
+                          ? "未开班"
+                          : ""
+                      }}
+                    </span>
+                    <span class="text"
+                      >班级有效期：{{
+                        $tools.timestampToTime(item.classStartTime, true, true)
+                      }}-{{
+                        $tools.timestampToTime(item.classEndTime, true, true)
+                      }}</span
+                    >
+                  </div>
+                  <div class="course-item__footer" v-if="item.classStatus == 0">
+                    <span class="text">教务处正在为您开通班级，请耐心等待</span>
+                  </div>
+                </template>
+              </template>
+            </div>
+          </div>
+
+          <div class="pagination" v-if="total > 0">
+            <el-pagination
+              @current-change="currentChange"
+              background
+              layout="prev, pager, next"
+              :total="total"
+              :pager-count="5"
+              :page-size="param.pageSize"
+            >
+            </el-pagination>
+          </div>
+        </div>
+
+        <el-dialog
+          title="实名验证确认"
+          :visible.sync="showConfirm"
+          width="600px"
+          class="showconfirm"
+          :close-on-click-modal="false"
+          :close-on-press-escape="false"
+          :show-close="false"
+        >
+          <div class="showconfirm__content">
+            <div class="text">
+              为避免个人信息不正确导致您的学习时长无效，请认真核对以下信息是否正确，如信息有误请取消当前操作，立刻联系020-38946666
+            </div>
+            <el-descriptions :column="1">
+              <el-descriptions-item label="姓名">{{
+                userInfo && userInfo.realname
+              }}</el-descriptions-item>
+              <el-descriptions-item label="手机号">{{
+                userInfo && userInfo.telphone
+              }}</el-descriptions-item>
+              <el-descriptions-item label="身份证号">{{
+                userInfo && userInfo.idCard
+              }}</el-descriptions-item>
+            </el-descriptions>
+
+            <div class="">
+              <el-checkbox v-model="confirmChecked"
+                >确认个人信息无误</el-checkbox
+              >
+            </div>
+          </div>
+          <span slot="footer" class="dialog-footer">
+            <el-button @click="showConfirm = false">取 消</el-button>
+            <el-button
+              type="primary"
+              @click="confirmUser"
+              :disabled="confirmCount > 0"
+              :loading="confirmLoading"
+              >{{
+                confirmCount > 0 ? "确 定(" + confirmCount + ")" : "确 定"
+              }}</el-button
+            >
+          </span>
+        </el-dialog>
+
+        <el-dialog
+          title="预约考试"
+          :visible.sync="appointModal"
+          width="600px"
+          class="appoint-modal"
+          :close-on-click-modal="false"
+          :close-on-press-escape="false"
+        >
+          <div class="appoint-modal__content">
+            <el-radio
+              v-for="(
+                appointChild, appointIndex
+              ) in appointItem.examApplyGoodsList"
+              v-model="applyId"
+              :key="appointIndex"
+              :label="appointChild.applyId"
+              >{{ appointChild.applyName }}</el-radio
+            >
+          </div>
+          <span slot="footer" class="dialog-footer">
+            <el-button @click="appointModal = false">取 消</el-button>
+            <el-button type="primary" @click="confirmAppoint"
+              >立即预约</el-button
+            >
+          </span>
+        </el-dialog>
+
+        <SelectClassModal
+          ref="selectClassModal"
+          @selectClassOk="selectClassOk"
+        ></SelectClassModal>
+
+        <RebuildModal
+          ref="rebuildModal"
+          @rebuildSubmit="rebuildSubmit($event)"
+        ></RebuildModal>
+
+        <ExercisesModal ref="exercisesModal"></ExercisesModal>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+
+<script>
+import { mapGetters, mapActions } from "vuex";
+import SelectClassModal from "@/components/selectClassModal";
+import RebuildModal from "@/components/rebuildModal";
+import ExercisesModal from "@/components/exercisesModal";
+import * as baseUrls from "@/axios.js";
+export default {
+  name: "MyCourse",
+  components: {
+    SelectClassModal,
+    RebuildModal,
+    ExercisesModal,
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      appointItem: {},
+      applyId: "",
+      appointModal: false,
+      activeItem: {},
+      confirmChecked: false,
+      confirmTimer: null,
+      confirmLoading: false,
+      confirmCount: 10,
+      showConfirm: false,
+      tabList: [],
+      sysTime: 0,
+      activeName: "-1",
+      param: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+
+      total: 0,
+      courseList: [],
+      loading: null,
+      showExercisesModal: false,
+    };
+  },
+  computed: {
+    ...mapGetters(["userInfo"]),
+  },
+  async mounted() {
+    this.getUserInfo();
+    this.sysTime = this.$tools.timest();
+    // await this.orderUserEduList();
+    this.courseGoodsList();
+  },
+  methods: {
+    ...mapActions(["getUserInfo"]),
+    openBoxs(data) {
+        console.log(data)
+      this.dialogVisible = true;
+    },
+    activeFunc() {},
+    tabChange(e) {
+      if (this.activeName == e.name) {
+        return;
+      }
+
+      this.activeName = e.name;
+      this.courseGoodsList();
+    },
+    confirmUser() {
+      if (!this.confirmChecked) {
+        this.$message.warning("请勾选确认个人信息无误");
+        return;
+      }
+      this.confirmLoading = true;
+      let infoJson = {
+        realname: this.userInfo.realname,
+        idCard: this.userInfo.idCard,
+        telphone: this.userInfo.telphone,
+      };
+      this.$request
+        .userConfirminfo({
+          infoJson: JSON.stringify(infoJson),
+          orderGoodsId: this.activeItem.orderGoodsId,
+        })
+        .then((res) => {
+          if (res.data.pushInfo) {
+            this.$message.success("提交成功");
+          } else {
+            this.$confirm(
+              "开通信息推送不成功，无法进入学习，请联系020-87085982！",
+              "提示",
+              {
+                confirmButtonText: "确定",
+                closeOnClickModal: false,
+                closeOnPressEscape: false,
+                distinguishCancelAndClose: false,
+                showClose: false,
+                showCancelButton: false,
+              }
+            )
+              .then((_) => {})
+              .catch((_) => {});
+          }
+          this.showConfirm = false;
+          this.confirmLoading = false;
+        });
+    },
+    orderUserEduList() {
+      return new Promise((resolve) => {
+        this.$request
+          .orderUserEduList({
+            goodsType: 1,
+          })
+          .then((res) => {
+            res.rows.forEach((row) => {
+              row.id = row.id + "";
+            });
+            this.tabList.push(
+              {
+                educationName: "全部课程",
+                id: "-1",
+              },
+              ...res.rows
+            );
+
+            resolve();
+          });
+      });
+    },
+
+    currentChange(e) {
+      this.param.pageNum = e;
+      this.courseGoodsList();
+    },
+    async goCourseDetail(item) {
+      this.activeItem = item;
+      if (item.interfaceAccountId > 0) {
+        //学习账号已开通
+
+        if (item.learnStatus == 1) {
+          //跳转第三方h5
+
+          this.$router.push({
+            path: `/my-course-detail/${item.goodsId}`,
+            query: {
+              gradeId: item.gradeId,
+              orderGoodsId: item.orderGoodsId,
+              isOther: 1,
+            },
+          });
+          return;
+        } else {
+          this.$message({
+            type: "warning",
+            message:
+              "您的学习账号未开通，请稍后再尝试，有疑问，请联系020-87085982！",
+          });
+          return;
+        }
+      }
+
+      if (
+        (item.serviceStartTime && this.sysTime <= item.serviceStartTime) ||
+        (item.serviceEndTime && this.sysTime >= item.serviceEndTime)
+      ) {
+        this.$message({
+          type: "warning",
+          message: "不在学习服务期，不能进入学习",
+        });
+        return;
+      }
+
+      if (
+        (item.classStartTime && this.sysTime <= item.classStartTime) ||
+        (item.classEndTime && this.sysTime >= item.classEndTime)
+      ) {
+        this.$message({
+          type: "warning",
+          message: "不在班级有效期，不能进入学习",
+        });
+        return;
+      }
+
+      if (item.learningStatus == 2) {
+        this.$message({
+          type: "warning",
+          message: "开放学习时间待定，不能进入学习",
+        });
+        return;
+      }
+
+      if (item.classStatus == 0) {
+        this.$message({
+          type: "warning",
+          message: "尚未开班，不能进入学习",
+        });
+        return;
+      }
+      if (item.learningStatus == 3 && this.sysTime < item.learningTimeStart) {
+        this.$message({
+          type: "warning",
+          message: "不在开放学习时间,不能进入学习",
+        });
+        return;
+      }
+
+      var confirmDetail = true;
+      if (item.educationName == "继续教育") {
+        if (
+          item.officialName &&
+          item.businessName == "二级" &&
+          item.projectName == "建造师"
+        ) {
+          confirmDetail = await this.userConfirmInfoDetail();
+        }
+      }
+
+      // //内部系统
+      // if (item.interfacePushId > 0 && item.officialStatus != 1) {
+      //   this.$message({
+      //     type: "warning",
+      //     message: "机构正在为您报名中，请耐心等待，有疑问请联系020-87085982！",
+      //   });
+      //   return;
+      // }
+
+      if (!confirmDetail) {
+        return;
+      }
+
+      let rebuildStatus = await this.courseGoodsRebuildStatus(
+        item.goodsId,
+        item.gradeId
+      );
+
+      if (rebuildStatus == 0) {
+        this.$refs.rebuildModal.showModal(item);
+        return;
+      }
+
+      // if (item.educationName == "继续教育") {
+      this.$request
+        .lockLockStatus({
+          action: "jxjy",
+          uuid: sessionStorage.getItem("uuid"),
+        })
+        .then((res) => {
+          //有其他端在操作，不能学习
+          this.$message({
+            type: "warning",
+            message: res.msg,
+          });
+        })
+        .catch((err) => {
+          //可以学习
+          this.$request
+            .courseCourseList({
+              pageNum: 1,
+              pageSize: 1,
+              goodsId: item.goodsId,
+              gradeId: item.gradeId,
+            })
+            .then((res) => {
+              if (res.rows.length) {
+                // if (
+                //   item.officialName &&
+                //   item.businessName == "二级" &&
+                //   item.projectName == "建造师"
+                // ) {
+                //   this.userConfirmInfoDetail().then((res) => {
+                //     this.$router.push({
+                //       path: `/my-course-detail/${item.goodsId}`,
+                //       query: {
+                //         gradeId: item.gradeId,
+                //         orderGoodsId: item.orderGoodsId,
+                //         courseId: res.rows[0].courseId || "",
+                //       },
+                //     });
+                //   });
+                // } else {
+                    this.$emit("backData",item)
+                    this.dialogVisible = false
+                    return
+                this.$router.push({
+                  path: `/my-course-detail/${item.goodsId}`,
+                  query: {
+                    gradeId: item.gradeId,
+                    orderGoodsId: item.orderGoodsId,
+                    courseId: res.rows[0].courseId || "",
+                  },
+                });
+                // }
+              } else {
+                this.$message({
+                  type: "warning",
+                  message: "课程内暂无可以学习的科目",
+                });
+              }
+            });
+        });
+      // } else {
+      //   this.$request
+      //     .courseCourseList({
+      //       pageNum: 1,
+      //       pageSize: 1,
+      //       goodsId: item.goodsId,
+      //       gradeId: item.gradeId,
+      //     })
+      //     .then((res) => {
+      //       if (res.rows.length) {
+      //         this.$router.push({
+      //           path: `/my-course-detail/${item.goodsId}`,
+      //           query: {
+      //             gradeId: item.gradeId,
+      //             orderGoodsId: item.orderGoodsId,
+      //             courseId: res.rows[0].courseId || "",
+      //           },
+      //         });
+      //       } else {
+      //         this.$message({
+      //           type: "warning",
+      //           message: "课程内暂无可以学习的科目",
+      //         });
+      //       }
+      //     });
+      // }
+    },
+
+    userConfirmInfoDetail() {
+      return new Promise((resolve) => {
+        this.$request
+          .userConfirmInfoDetail({
+            orderGoodsId: this.activeItem.orderGoodsId,
+          })
+          .then((res) => {
+            if (!res.data) {
+              clearInterval(this.confirmTimer);
+              this.confirmCount = 10;
+              this.showConfirm = true;
+              this.confirmTimer = setInterval(() => {
+                if (this.confirmCount > 0) {
+                  this.confirmCount--;
+                } else {
+                  clearInterval(this.confirmTimer);
+                }
+              }, 1000);
+            } else {
+              if (res.data.pushInfo) {
+                resolve(true);
+              } else {
+                this.$confirm(
+                  "开通信息推送不成功，无法进入学习，请联系020-87085982！",
+                  "提示",
+                  {
+                    confirmButtonText: "确定",
+                    closeOnClickModal: false,
+                    closeOnPressEscape: false,
+                    distinguishCancelAndClose: false,
+                    showClose: false,
+                    showCancelButton: false,
+                  }
+                )
+                  .then((_) => {})
+                  .catch((_) => {});
+                resolve(false);
+              }
+            }
+          });
+      });
+    },
+
+    appBeforeAddress(item) {
+      this.$refs.exercisesModal.showModal(item);
+    },
+
+    rebuildSubmit(item) {
+      this.$router.push({
+        path: `/my-course-detail/${item.goodsId}`,
+        query: {
+          gradeId: item.gradeId,
+          orderGoodsId: item.orderGoodsId,
+          rebuild: 1,
+        },
+      });
+    },
+    selectClass(item) {
+      this.$refs.selectClassModal.showModal(item);
+    },
+
+    selectClassOk() {
+      this.courseGoodsList();
+    },
+    /**
+     * @param {Object} goodsId 商品id
+     * 查询商品重修状态
+     */
+    courseGoodsRebuildStatus(goodsId, gradeId) {
+      return new Promise((resolve) => {
+        this.$request
+          .courseGoodsRebuildStatus({
+            goodsId: goodsId,
+            gradeId: gradeId,
+          })
+          .then((res) => {
+            resolve(res.data);
+          });
+      });
+    },
+
+    courseGoodsList() {
+      let param = JSON.parse(JSON.stringify(this.param));
+
+      if (this.activeName == "-1") {
+        param.educationTypeId = "";
+      } else {
+        param.educationTypeId = this.activeName;
+      }
+      this.$request.courseGoodsList(param).then((res) => {
+        this.courseList = res.rows;
+        this.total = res.total;
+      });
+    },
+    progressText(item) {
+      return () => {
+        return (
+          item.stuAllNum +
+          item.recordNum +
+          "/" +
+          (item.secAllNum + item.examNum)
+        );
+      };
+    },
+
+    appointment(item) {
+      this.applyId = "";
+      this.appointItem = item;
+      this.appointModal = true;
+    },
+
+    confirmAppoint() {
+      if (!this.applyId) {
+        this.$message.warning("请选择要预约的考试");
+        return;
+      }
+      var data = {
+        goodsId: this.appointItem.goodsId,
+        gradeId: this.appointItem.gradeId,
+        applyId: this.applyId,
+        orderGoodsId: this.appointItem.orderGoodsId,
+      };
+      this.$request
+        .getApplysubscribe(data)
+        .then((res) => {
+          this.$router.push({
+            path: "/person-center/my-classhour/appointment",
+            query: {
+              goodsId: this.appointItem.goodsId,
+              gradeId: this.appointItem.gradeId,
+              orderGoodsId: this.appointItem.orderGoodsId,
+              applyId: this.applyId,
+            },
+          });
+        })
+        .catch((err) => {
+          this.$message({
+            type: "warning",
+            message: err.msg,
+          });
+        });
+    },
+  },
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="scss">
+/deep/ .el-dialog{
+    margin-top: 6vh!important;
+}
+.my-course {
+    max-height: 80vh;
+    overflow: auto;
+  &__header {
+    /deep/ .el-tabs__header {
+      margin-bottom: 0;
+    }
+  }
+  &__body {
+    .list {
+      .course-item {
+        margin-top: 24px;
+        background: #fafbfc;
+        border-radius: 8px;
+        overflow: hidden;
+
+        &__header {
+          height: 40px;
+          border-bottom: 1px solid #eee;
+          padding: 0 18px;
+
+          .state {
+            margin-top: 8px;
+            float: left;
+            font-size: 14px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #666666;
+
+            .red {
+              color: #ff3b30;
+            }
+
+            .note {
+              vertical-align: middle;
+              display: inline-block;
+              padding: 0 10px;
+              height: 24px;
+              background: #ffeceb;
+              border: 1px solid #ff3b30;
+              border-radius: 12px;
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #ff3b30;
+              text-align: center;
+              line-height: 24px;
+              margin-right: 10px;
+
+              &--yellow {
+                border-color: #ffb001;
+                color: #ffb001;
+                background: #fff8e8;
+              }
+
+              &--green {
+                border-color: #56dc68;
+                color: #56dc68;
+                background: #e6feea;
+              }
+            }
+          }
+
+          .time {
+            float: right;
+            line-height: 40px;
+            text-align: right;
+            font-size: 12px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #666666;
+
+            &--red {
+              color: #ff3b30;
+            }
+          }
+        }
+
+        &__body {
+          .img {
+            float: left;
+            width: 160px;
+            height: 90px;
+
+            img {
+              max-width: 100%;
+              max-height: 100%;
+            }
+          }
+
+          .text {
+            float: left;
+            margin-left: 12px;
+            .title {
+              margin-top: 10px;
+              font-size: 16px;
+              font-family: Microsoft YaHei;
+              font-weight: bold;
+              color: #333333;
+              .note {
+                display: inline-block;
+                vertical-align: middle;
+                border: 1px solid #333333;
+                border-radius: 4px;
+                font-size: 12px;
+                font-family: Microsoft YaHei;
+                font-weight: 400;
+                color: #333333;
+                padding: 2px 5px;
+                margin-left: 12px;
+              }
+            }
+
+            .progress {
+              margin-top: 30px;
+
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #333333;
+
+              &-line {
+                width: 220px;
+                display: inline-block;
+              }
+
+              /deep/ .el-progress-bar {
+                padding-right: 70px;
+                margin-right: -70px;
+              }
+            }
+          }
+
+          .btns-wrap {
+            display: table;
+            float: right;
+            height: 90px;
+            width: 130px;
+
+            .btns {
+              display: table-cell;
+              vertical-align: middle;
+              text-align: center;
+
+              .btn {
+                cursor: pointer;
+                margin: 2px 0;
+                width: 122px;
+                height: 32px;
+                padding: 0;
+                border-radius: 16px;
+                display: inline-block;
+                text-align: center;
+                line-height: 32px;
+                color: #fff;
+
+                &--normal {
+                  &.disabled {
+                    background: rgb(101, 164, 253);
+                    border-color: rgb(101, 164, 253);
+                  }
+                }
+
+                &--warm {
+                  background: #ff3b30;
+
+                  &:hover {
+                    background: #f56c6c;
+                  }
+                }
+              }
+            }
+          }
+        }
+
+        &__footer {
+          padding: 20px 18px;
+          font-size: 14px;
+          color: #333;
+
+          .text {
+            margin-right: 20px;
+
+            &--red {
+              color: #ff3b30;
+            }
+          }
+        }
+      }
+    }
+
+    .pagination {
+      padding: 30px 0;
+      text-align: center;
+    }
+  }
+
+  .exercises-modal {
+    &__content {
+      > div {
+        font-size: 16px;
+        line-height: 30px;
+        text-align: center;
+
+        img {
+          display: inline;
+        }
+      }
+    }
+  }
+
+  .appoint-modal {
+    &__content {
+      .el-radio {
+        display: block;
+        margin: 10px 30px 10px 0;
+      }
+    }
+  }
+}
+</style>

src/pages/person-center/my-course/index copy.vue

@@ -0,0 +1,1171 @@
+<template>
+  <div class="my-course">
+    <div class="my-course__header">
+      <el-tabs :value="activeName" @tab-click="tabChange">
+        <el-tab-pane
+          v-for="(tab, tabIndex) in tabList"
+          :key="tabIndex"
+          :label="tab.educationName"
+          :name="tab.id"
+        ></el-tab-pane>
+      </el-tabs>
+    </div>
+
+    <div class="my-course__body">
+      <div class="list">
+        <div
+          class="course-item"
+          v-for="(item, index) in courseList"
+          :key="index"
+        >
+          <div class="course-item__header">
+            <div
+              class="time"
+              v-if="item.serviceStartTime && item.serviceEndTime"
+            >
+              学习服务期：{{
+                $tools.timestampToTime(item.serviceStartTime, false)
+              }}
+              至
+              {{ $tools.timestampToTime(item.serviceEndTime, false) }}
+            </div>
+
+            <div class="state">
+              <template
+                v-if="
+                  item.serviceStartTime &&
+                  (sysTime < item.serviceStartTime ||
+                    sysTime > item.serviceEndTime)
+                "
+              >
+                <div class="red">不在学习服务期，不可以学习了哦</div>
+              </template>
+
+              <template v-else>
+                <template
+                  v-if="
+                    !(item.classEndTime && item.classEndTime < sysTime) &&
+                    !(item.classStartTime && item.classStartTime > sysTime)
+                  "
+                >
+                  <template
+                    v-if="item.periodStatus == -1 || item.periodStatus == 2"
+                  >
+                    <template
+                      v-if="item.classStatus == 1 || item.classStatus === null"
+                    >
+                      <template
+                        v-if="
+                          sysTime >= item.serviceStartTime &&
+                          sysTime <= item.serviceEndTime
+                        "
+                      >
+                        学习状态：
+                        <div
+                          class="note"
+                          v-if="item.stuAllNum + item.recordNum == 0"
+                        >
+                          未学习
+                        </div>
+                        <div
+                          class="note note--yellow"
+                          v-else-if="
+                            item.stuAllNum + item.recordNum > 0 &&
+                            item.stuAllNum + item.recordNum <
+                              item.secAllNum + item.examNum
+                          "
+                        >
+                          学习中
+                        </div>
+                        <div
+                          class="note note--green"
+                          v-else-if="
+                            item.stuAllNum + item.recordNum >=
+                            item.secAllNum + item.examNum
+                          "
+                        >
+                          已学完
+                        </div>
+                      </template>
+
+                      <template v-else>
+                        <span class="red" v-if="item.serviceStartTime">
+                          已过学习服务期，不可以学习了哦！</span
+                        >
+                      </template>
+                    </template>
+
+                    <!-- <template v-if="item.profileTpStatus == 1">
+                      资料审核状态：
+                      <div class="note" v-if="item.profileStatus == null">
+                        未提交资料
+                      </div>
+                      <div
+                        class="note note--green"
+                        v-else-if="item.profileStatus == 1"
+                      >
+                        已通过
+                      </div>
+                      <div
+                        class="note note--yellow"
+                        v-else-if="item.profileStatus == 2"
+                      >
+                        审核中
+                      </div>
+                      <div
+                        class="note note--yellow"
+                        v-else-if="item.profileStatus == 3"
+                      >
+                        待完善
+                      </div>
+                    </template> -->
+                  </template>
+
+                  <!-- 学时审核状态可以审核 -->
+                  <template v-if="item.periodStatus != -1">
+                    <template v-if="item.periodStatus == 0"
+                      >机构审核：
+                      <div class="note">学时审核不通过</div>
+                    </template>
+                    <!-- <template v-else-if="item.periodStatus == 2"
+                      >机构审核：
+                      <div class="note note--yellow">学时待审核</div></template
+                    > -->
+                    <template v-else-if="item.periodStatus == 1">
+                      <template v-if="item.periodPlush > 0"
+                        ><div class="note note--green">
+                          学时已上报注册中心
+                        </div></template
+                      >
+                      <template v-else
+                        >机构审核：
+                        <div class="note note--green">
+                          学时审核通过
+                        </div></template
+                      >
+                    </template>
+                    <template
+                      v-if="item.subscribeId != null && item.periodStatus == 1"
+                    >
+                      <template v-if="item.subExamStatus === null">
+                        待预约考试
+                      </template>
+
+                      <template
+                        v-else-if="
+                          item.subExamStatus === 0 &&
+                          sysTime <
+                            $tools.TimeTotimestamp(
+                              $tools.timestampToTime(
+                                item.subApplySiteExamTime,
+                                true
+                              ) +
+                                ' ' +
+                                item.subApplySiteStartTime
+                            )
+                        "
+                      >
+                        待考试，考试时间：{{
+                          $tools.timestampToTime(
+                            item.subApplySiteExamTime,
+                            true
+                          ) +
+                          " " +
+                          item.subApplySiteStartTime
+                        }}
+                        -
+                        {{
+                          $tools.timestampToTime(
+                            item.subApplySiteExamTime,
+                            true
+                          ) +
+                          " " +
+                          item.subApplySiteEndTime
+                        }}
+                      </template>
+                      <template v-else-if="item.subExamStatus === 0"
+                        >待出考试结果</template
+                      >
+                      <template v-else-if="item.subExamStatus === 1">
+                        <span v-if="item.subResult === null">待出考试结果</span>
+                        <span v-if="item.subResult === 0"
+                          >考试结果：不通过，需补考</span
+                        >
+                        <span v-else-if="item.subResult === 1"
+                          >考试结果：通过，考试成绩为{{
+                            item.subPerformance
+                          }}</span
+                        >
+                      </template>
+                      <template v-else-if="item.subExamStatus === 2">
+                        缺考，无成绩，需补考
+                      </template>
+                      <template v-else-if="item.subExamStatus === 3">
+                        作弊，无成绩，需补考
+                      </template>
+                      <template v-else-if="item.subExamStatus === 4">
+                        替考，无成绩，需补考
+                      </template>
+                    </template>
+                  </template>
+                </template>
+              </template>
+            </div>
+          </div>
+          <div class="course-item__body clearfix">
+            <div class="img">
+              <img :src="$tools.splitImgHost(item.coverUrl, true)" alt="" />
+            </div>
+            <div class="text">
+              <div class="title">
+                {{ item.goodsName }}
+                <div class="note">
+                  {{ item.courseNum }}课程 {{ item.secAllNum + item.examNum }}节
+                  {{ item.classHours }}学时
+                </div>
+              </div>
+              <div class="progress">
+                学习进度
+                <el-progress
+                  class="progress-line"
+                  :stroke-width="16"
+                  :format="progressText(item)"
+                  :percentage="
+                    ((item.stuAllNum + item.recordNum) /
+                      (item.secAllNum + item.examNum) || 0) * 100
+                  "
+                ></el-progress>
+              </div>
+            </div>
+            <div class="btns-wrap">
+              <div class="btns">
+                <el-button
+                  type="primary"
+                  class="btn btn--normal"
+                  :class="{
+                    disabled:
+                      (item.serviceStartTime &&
+                        (sysTime <= item.serviceStartTime ||
+                          sysTime >= item.serviceEndTime)) ||
+                      (item.classStartTime && sysTime <= item.classStartTime) ||
+                      (item.classEndTime && sysTime >= item.classEndTime) ||
+                      item.learningStatus == 2 ||
+                      item.classStatus == 0 ||
+                      (item.learningStatus == 3 &&
+                        sysTime < item.learningTimeStart),
+                  }"
+                  @click="goCourseDetail(item)"
+                  >进入学习</el-button
+                >
+
+                <el-button
+                  type="primary"
+                  class="btn"
+                  @click="appointment(item)"
+                  v-if="
+                    item.applyStatus === 1 &&
+                    !(
+                      sysTime <= item.serviceStartTime ||
+                      sysTime >= item.serviceEndTime ||
+                      (item.classStartTime && sysTime <= item.classStartTime) ||
+                      (item.classEndTime && sysTime >= item.classEndTime) ||
+                      item.learningStatus == 2 ||
+                      item.classStatus == 0 ||
+                      (item.learningStatus == 3 &&
+                        sysTime < item.learningTimeStart)
+                    )
+                  "
+                  >预约考试</el-button
+                >
+
+                <el-button
+                  type="danger"
+                  class="btn btn--warm"
+                  @click="selectClass(item)"
+                  v-if="
+                    item.gradeStatus == 1 &&
+                    item.status == 1 &&
+                    item.serviceEndTime > sysTime &&
+                    item.serviceStartTime < sysTime &&
+                    item.classEndTime &&
+                    item.classEndTime < sysTime &&
+                    (item.periodStatus == 0 || item.periodStatus == -1) &&
+                    item.studyCount > 0
+                  "
+                >
+                  选班重学
+                </el-button>
+                <el-button
+                  type="primary"
+                  class="btn"
+                  v-if="
+                    item.beforeStatus === 1 &&
+                    !(
+                      sysTime <= item.serviceStartTime ||
+                      sysTime >= item.serviceEndTime ||
+                      (item.classStartTime && sysTime <= item.classStartTime) ||
+                      (item.classEndTime && sysTime >= item.classEndTime) ||
+                      item.learningStatus == 2 ||
+                      item.classStatus == 0 ||
+                      (item.learningStatus == 3 &&
+                        sysTime < item.learningTimeStart)
+                    )
+                  "
+                  @click="appBeforeAddress(item)"
+                  >进入刷题</el-button
+                >
+              </div>
+            </div>
+          </div>
+          <template
+            v-if="
+              !(
+                sysTime < item.serviceStartTime || sysTime > item.serviceEndTime
+              )
+            "
+          >
+            <div
+              class="course-item__footer"
+              v-if="item.classEndTime && item.classEndTime < sysTime"
+            >
+              <span class="text"
+                >班级有效期：{{
+                  $tools.timestampToTime(item.classStartTime, true, true)
+                }}
+                -
+                {{
+                  $tools.timestampToTime(item.classEndTime, true, true)
+                }}</span
+              >
+              <span class="text text--red"
+                >班级状态：已过期，有疑问请联系020-87085982</span
+              >
+            </div>
+
+            <div
+              class="course-item__footer"
+              v-else-if="item.classStartTime && item.classStartTime > sysTime"
+            >
+              <span class="text"
+                >班级有效期：{{
+                  $tools.timestampToTime(item.classStartTime, true, true)
+                }}
+                -
+                {{
+                  $tools.timestampToTime(item.classEndTime, true, true)
+                }}</span
+              >
+              <span class="text"
+                >班级状态：未到学习时间，有疑问请联系 020-87085982</span
+              >
+            </div>
+
+            <template v-else>
+              <div
+                class="course-item__footer"
+                v-if="
+                  item.gradeId != 0 &&
+                  item.gradeStatus == 1 &&
+                  item.classStatus != null
+                "
+              >
+                <span class="text"
+                  >班级状态：
+                  {{
+                    item.classStatus == 1
+                      ? "已开班"
+                      : item.classStatus == 0
+                      ? "未开班"
+                      : ""
+                  }}
+                </span>
+                <span class="text"
+                  >班级有效期：{{
+                    $tools.timestampToTime(item.classStartTime, true, true)
+                  }}-{{
+                    $tools.timestampToTime(item.classEndTime, true, true)
+                  }}</span
+                >
+              </div>
+              <div class="course-item__footer" v-if="item.classStatus == 0">
+                <span class="text">教务处正在为您开通班级，请耐心等待</span>
+              </div>
+            </template>
+          </template>
+        </div>
+      </div>
+
+      <div class="pagination" v-if="total > 0">
+        <el-pagination
+          @current-change="currentChange"
+          background
+          layout="prev, pager, next"
+          :total="total"
+          :pager-count="5"
+          :page-size="param.pageSize"
+        >
+        </el-pagination>
+      </div>
+    </div>
+
+    <el-dialog
+      title="实名验证确认"
+      :visible.sync="showConfirm"
+      width="600px"
+      class="showconfirm"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :show-close="false"
+    >
+      <div class="showconfirm__content">
+        <div class="text">
+          为避免个人信息不正确导致您的学习时长无效，请认真核对以下信息是否正确，如信息有误请取消当前操作，立刻联系020-38946666
+        </div>
+        <el-descriptions :column="1">
+          <el-descriptions-item label="姓名">{{
+            userInfo && userInfo.realname
+          }}</el-descriptions-item>
+          <el-descriptions-item label="手机号">{{
+            userInfo && userInfo.telphone
+          }}</el-descriptions-item>
+          <el-descriptions-item label="身份证号">{{
+            userInfo && userInfo.idCard
+          }}</el-descriptions-item>
+        </el-descriptions>
+
+        <div class="">
+          <el-checkbox v-model="confirmChecked">确认个人信息无误</el-checkbox>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="showConfirm = false">取 消</el-button>
+        <el-button
+          type="primary"
+          @click="confirmUser"
+          :disabled="confirmCount > 0"
+          :loading="confirmLoading"
+          >{{
+            confirmCount > 0 ? "确 定(" + confirmCount + ")" : "确 定"
+          }}</el-button
+        >
+      </span>
+    </el-dialog>
+
+    <el-dialog
+      title="预约考试"
+      :visible.sync="appointModal"
+      width="600px"
+      class="appoint-modal"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+    >
+      <div class="appoint-modal__content">
+        <el-radio
+          v-for="(appointChild, appointIndex) in appointItem.examApplyGoodsList"
+          v-model="applyId"
+          :key="appointIndex"
+          :label="appointChild.applyId"
+          >{{ appointChild.applyName }}</el-radio
+        >
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="appointModal = false">取 消</el-button>
+        <el-button type="primary" @click="confirmAppoint">立即预约</el-button>
+      </span>
+    </el-dialog>
+
+    <SelectClassModal
+      ref="selectClassModal"
+      @selectClassOk="selectClassOk"
+    ></SelectClassModal>
+
+    <RebuildModal
+      ref="rebuildModal"
+      @rebuildSubmit="rebuildSubmit($event)"
+    ></RebuildModal>
+
+    <ExercisesModal ref="exercisesModal"></ExercisesModal>
+  </div>
+</template>
+
+<script>
+import { mapGetters, mapActions } from "vuex";
+import SelectClassModal from "@/components/selectClassModal";
+import RebuildModal from "@/components/rebuildModal";
+import ExercisesModal from "@/components/exercisesModal";
+import * as baseUrls from "@/axios.js";
+export default {
+  name: "MyCourse",
+  components: {
+    SelectClassModal,
+    RebuildModal,
+    ExercisesModal,
+  },
+  data() {
+    return {
+      appointItem: {},
+      applyId: "",
+      appointModal: false,
+      activeItem: {},
+      confirmChecked: false,
+      confirmTimer: null,
+      confirmLoading: false,
+      confirmCount: 10,
+      showConfirm: false,
+      tabList: [],
+      sysTime: 0,
+      activeName: "-1",
+      param: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+
+      total: 0,
+      courseList: [],
+      loading: null,
+      showExercisesModal: false,
+    };
+  },
+  computed: {
+    ...mapGetters(["userInfo"]),
+  },
+  async mounted() {
+    this.getUserInfo();
+    this.sysTime = this.$tools.timest();
+    // await this.orderUserEduList();
+    this.courseGoodsList();
+  },
+  methods: {
+    ...mapActions(["getUserInfo"]),
+    tabChange(e) {
+      if (this.activeName == e.name) {
+        return;
+      }
+
+      this.activeName = e.name;
+      this.courseGoodsList();
+    },
+    confirmUser() {
+      if (!this.confirmChecked) {
+        this.$message.warning("请勾选确认个人信息无误");
+        return;
+      }
+      this.confirmLoading = true;
+      let infoJson = {
+        realname: this.userInfo.realname,
+        idCard: this.userInfo.idCard,
+        telphone: this.userInfo.telphone,
+      };
+      this.$request
+        .userConfirminfo({
+          infoJson: JSON.stringify(infoJson),
+          orderGoodsId: this.activeItem.orderGoodsId,
+        })
+        .then((res) => {
+          if (res.data.pushInfo) {
+            this.$message.success("提交成功");
+          } else {
+            this.$confirm(
+              "开通信息推送不成功，无法进入学习，请联系020-87085982！",
+              "提示",
+              {
+                confirmButtonText: "确定",
+                closeOnClickModal: false,
+                closeOnPressEscape: false,
+                distinguishCancelAndClose: false,
+                showClose: false,
+                showCancelButton: false,
+              }
+            )
+              .then((_) => {})
+              .catch((_) => {});
+          }
+          this.showConfirm = false;
+          this.confirmLoading = false;
+        });
+    },
+    orderUserEduList() {
+      return new Promise((resolve) => {
+        this.$request
+          .orderUserEduList({
+            goodsType: 1,
+          })
+          .then((res) => {
+            res.rows.forEach((row) => {
+              row.id = row.id + "";
+            });
+            this.tabList.push(
+              {
+                educationName: "全部课程",
+                id: "-1",
+              },
+              ...res.rows
+            );
+
+            resolve();
+          });
+      });
+    },
+
+    currentChange(e) {
+      this.param.pageNum = e;
+      this.courseGoodsList();
+    },
+    async goCourseDetail(item) {
+      this.activeItem = item;
+      if (item.interfaceAccountId > 0) {
+        //学习账号已开通
+
+        if (item.learnStatus == 1) {
+          //跳转第三方h5
+
+          this.$router.push({
+            path: `/my-course-detail/${item.goodsId}`,
+            query: {
+              gradeId: item.gradeId,
+              orderGoodsId: item.orderGoodsId,
+              isOther: 1,
+            },
+          });
+          return;
+        } else {
+          this.$message({
+            type: "warning",
+            message:
+              "您的学习账号未开通，请稍后再尝试，有疑问，请联系020-87085982！",
+          });
+          return;
+        }
+      }
+
+      if (
+        (item.serviceStartTime && this.sysTime <= item.serviceStartTime) ||
+        (item.serviceEndTime && this.sysTime >= item.serviceEndTime)
+      ) {
+        this.$message({
+          type: "warning",
+          message: "不在学习服务期，不能进入学习",
+        });
+        return;
+      }
+
+      if (
+        (item.classStartTime && this.sysTime <= item.classStartTime) ||
+        (item.classEndTime && this.sysTime >= item.classEndTime)
+      ) {
+        this.$message({
+          type: "warning",
+          message: "不在班级有效期，不能进入学习",
+        });
+        return;
+      }
+
+      if (item.learningStatus == 2) {
+        this.$message({
+          type: "warning",
+          message: "开放学习时间待定，不能进入学习",
+        });
+        return;
+      }
+
+      if (item.classStatus == 0) {
+        this.$message({
+          type: "warning",
+          message: "尚未开班，不能进入学习",
+        });
+        return;
+      }
+      if (item.learningStatus == 3 && this.sysTime < item.learningTimeStart) {
+        this.$message({
+          type: "warning",
+          message: "不在开放学习时间,不能进入学习",
+        });
+        return;
+      }
+
+      var confirmDetail = true;
+      if (item.educationName == "继续教育") {
+        if (
+          item.officialName &&
+          item.businessName == "二级" &&
+          item.projectName == "建造师"
+        ) {
+          confirmDetail = await this.userConfirmInfoDetail();
+        }
+      }
+
+      // //内部系统
+      // if (item.interfacePushId > 0 && item.officialStatus != 1) {
+      //   this.$message({
+      //     type: "warning",
+      //     message: "机构正在为您报名中，请耐心等待，有疑问请联系020-87085982！",
+      //   });
+      //   return;
+      // }
+
+      if (!confirmDetail) {
+        return;
+      }
+
+      let rebuildStatus = await this.courseGoodsRebuildStatus(
+        item.goodsId,
+        item.gradeId
+      );
+
+      if (rebuildStatus == 0) {
+        this.$refs.rebuildModal.showModal(item);
+        return;
+      }
+
+      // if (item.educationName == "继续教育") {
+      this.$request
+        .lockLockStatus({
+          action: "jxjy",
+          uuid: sessionStorage.getItem("uuid"),
+        })
+        .then((res) => {
+          //有其他端在操作，不能学习
+          this.$message({
+            type: "warning",
+            message: res.msg,
+          });
+        })
+        .catch((err) => {
+          //可以学习
+          this.$request
+            .courseCourseList({
+              pageNum: 1,
+              pageSize: 1,
+              goodsId: item.goodsId,
+              gradeId: item.gradeId,
+            })
+            .then((res) => {
+              if (res.rows.length) {
+                // if (
+                //   item.officialName &&
+                //   item.businessName == "二级" &&
+                //   item.projectName == "建造师"
+                // ) {
+                //   this.userConfirmInfoDetail().then((res) => {
+                //     this.$router.push({
+                //       path: `/my-course-detail/${item.goodsId}`,
+                //       query: {
+                //         gradeId: item.gradeId,
+                //         orderGoodsId: item.orderGoodsId,
+                //         courseId: res.rows[0].courseId || "",
+                //       },
+                //     });
+                //   });
+                // } else {
+                this.$router.push({
+                  path: `/my-course-detail/${item.goodsId}`,
+                  query: {
+                    gradeId: item.gradeId,
+                    orderGoodsId: item.orderGoodsId,
+                    courseId: res.rows[0].courseId || "",
+                  },
+                });
+                // }
+              } else {
+                this.$message({
+                  type: "warning",
+                  message: "课程内暂无可以学习的科目",
+                });
+              }
+            });
+        });
+      // } else {
+      //   this.$request
+      //     .courseCourseList({
+      //       pageNum: 1,
+      //       pageSize: 1,
+      //       goodsId: item.goodsId,
+      //       gradeId: item.gradeId,
+      //     })
+      //     .then((res) => {
+      //       if (res.rows.length) {
+      //         this.$router.push({
+      //           path: `/my-course-detail/${item.goodsId}`,
+      //           query: {
+      //             gradeId: item.gradeId,
+      //             orderGoodsId: item.orderGoodsId,
+      //             courseId: res.rows[0].courseId || "",
+      //           },
+      //         });
+      //       } else {
+      //         this.$message({
+      //           type: "warning",
+      //           message: "课程内暂无可以学习的科目",
+      //         });
+      //       }
+      //     });
+      // }
+    },
+
+    userConfirmInfoDetail() {
+      return new Promise((resolve) => {
+        this.$request
+          .userConfirmInfoDetail({
+            orderGoodsId: this.activeItem.orderGoodsId,
+          })
+          .then((res) => {
+            if (!res.data) {
+              clearInterval(this.confirmTimer);
+              this.confirmCount = 10;
+              this.showConfirm = true;
+              this.confirmTimer = setInterval(() => {
+                if (this.confirmCount > 0) {
+                  this.confirmCount--;
+                } else {
+                  clearInterval(this.confirmTimer);
+                }
+              }, 1000);
+            } else {
+              if (res.data.pushInfo) {
+                resolve(true);
+              } else {
+                this.$confirm(
+                  "开通信息推送不成功，无法进入学习，请联系020-87085982！",
+                  "提示",
+                  {
+                    confirmButtonText: "确定",
+                    closeOnClickModal: false,
+                    closeOnPressEscape: false,
+                    distinguishCancelAndClose: false,
+                    showClose: false,
+                    showCancelButton: false,
+                  }
+                )
+                  .then((_) => {})
+                  .catch((_) => {});
+                resolve(false);
+              }
+            }
+          });
+      });
+    },
+
+    appBeforeAddress(item) {
+      this.$refs.exercisesModal.showModal(item);
+    },
+
+    rebuildSubmit(item) {
+      this.$router.push({
+        path: `/my-course-detail/${item.goodsId}`,
+        query: {
+          gradeId: item.gradeId,
+          orderGoodsId: item.orderGoodsId,
+          rebuild: 1,
+        },
+      });
+    },
+    selectClass(item) {
+      this.$refs.selectClassModal.showModal(item);
+    },
+
+    selectClassOk() {
+      this.courseGoodsList();
+    },
+    /**
+     * @param {Object} goodsId 商品id
+     * 查询商品重修状态
+     */
+    courseGoodsRebuildStatus(goodsId, gradeId) {
+      return new Promise((resolve) => {
+        this.$request
+          .courseGoodsRebuildStatus({
+            goodsId: goodsId,
+            gradeId: gradeId,
+          })
+          .then((res) => {
+            resolve(res.data);
+          });
+      });
+    },
+
+    courseGoodsList() {
+      let param = JSON.parse(JSON.stringify(this.param));
+
+      if (this.activeName == "-1") {
+        param.educationTypeId = "";
+      } else {
+        param.educationTypeId = this.activeName;
+      }
+      this.$request.courseGoodsList(param).then((res) => {
+        this.courseList = res.rows;
+        this.total = res.total;
+      });
+    },
+    progressText(item) {
+      return () => {
+        return (
+          item.stuAllNum +
+          item.recordNum +
+          "/" +
+          (item.secAllNum + item.examNum)
+        );
+      };
+    },
+
+    appointment(item) {
+      this.applyId = "";
+      this.appointItem = item;
+      this.appointModal = true;
+    },
+
+    confirmAppoint() {
+      if (!this.applyId) {
+        this.$message.warning("请选择要预约的考试");
+        return;
+      }
+      var data = {
+        goodsId: this.appointItem.goodsId,
+        gradeId: this.appointItem.gradeId,
+        applyId: this.applyId,
+        orderGoodsId: this.appointItem.orderGoodsId,
+      };
+      this.$request
+        .getApplysubscribe(data)
+        .then((res) => {
+          this.$router.push({
+            path: "/person-center/my-classhour/appointment",
+            query: {
+              goodsId: this.appointItem.goodsId,
+              gradeId: this.appointItem.gradeId,
+              orderGoodsId: this.appointItem.orderGoodsId,
+              applyId: this.applyId,
+            },
+          });
+        })
+        .catch((err) => {
+          this.$message({
+            type: "warning",
+            message: err.msg,
+          });
+        });
+    },
+  },
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="scss">
+.my-course {
+  &__header {
+    /deep/ .el-tabs__header {
+      margin-bottom: 0;
+    }
+  }
+  &__body {
+    .list {
+      .course-item {
+        margin-top: 24px;
+        background: #fafbfc;
+        border-radius: 8px;
+        overflow: hidden;
+
+        &__header {
+          height: 40px;
+          border-bottom: 1px solid #eee;
+          padding: 0 18px;
+
+          .state {
+            margin-top: 8px;
+            float: left;
+            font-size: 14px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #666666;
+
+            .red {
+              color: #ff3b30;
+            }
+
+            .note {
+              vertical-align: middle;
+              display: inline-block;
+              padding: 0 10px;
+              height: 24px;
+              background: #ffeceb;
+              border: 1px solid #ff3b30;
+              border-radius: 12px;
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #ff3b30;
+              text-align: center;
+              line-height: 24px;
+              margin-right: 10px;
+
+              &--yellow {
+                border-color: #ffb001;
+                color: #ffb001;
+                background: #fff8e8;
+              }
+
+              &--green {
+                border-color: #56dc68;
+                color: #56dc68;
+                background: #e6feea;
+              }
+            }
+          }
+
+          .time {
+            float: right;
+            line-height: 40px;
+            text-align: right;
+            font-size: 12px;
+            font-family: Microsoft YaHei;
+            font-weight: 400;
+            color: #666666;
+
+            &--red {
+              color: #ff3b30;
+            }
+          }
+        }
+
+        &__body {
+          .img {
+            float: left;
+            width: 160px;
+            height: 90px;
+
+            img {
+              max-width: 100%;
+              max-height: 100%;
+            }
+          }
+
+          .text {
+            float: left;
+            margin-left: 12px;
+            .title {
+              margin-top: 10px;
+              font-size: 16px;
+              font-family: Microsoft YaHei;
+              font-weight: bold;
+              color: #333333;
+              .note {
+                display: inline-block;
+                vertical-align: middle;
+                border: 1px solid #333333;
+                border-radius: 4px;
+                font-size: 12px;
+                font-family: Microsoft YaHei;
+                font-weight: 400;
+                color: #333333;
+                padding: 2px 5px;
+                margin-left: 12px;
+              }
+            }
+
+            .progress {
+              margin-top: 30px;
+
+              font-size: 14px;
+              font-family: Microsoft YaHei;
+              font-weight: 400;
+              color: #333333;
+
+              &-line {
+                width: 220px;
+                display: inline-block;
+              }
+
+              /deep/ .el-progress-bar {
+                padding-right: 70px;
+                margin-right: -70px;
+              }
+            }
+          }
+
+          .btns-wrap {
+            display: table;
+            float: right;
+            height: 90px;
+            width: 130px;
+
+            .btns {
+              display: table-cell;
+              vertical-align: middle;
+              text-align: center;
+
+              .btn {
+                cursor: pointer;
+                margin: 2px 0;
+                width: 122px;
+                height: 32px;
+                padding: 0;
+                border-radius: 16px;
+                display: inline-block;
+                text-align: center;
+                line-height: 32px;
+                color: #fff;
+
+                &--normal {
+                  &.disabled {
+                    background: rgb(101, 164, 253);
+                    border-color: rgb(101, 164, 253);
+                  }
+                }
+
+                &--warm {
+                  background: #ff3b30;
+
+                  &:hover {
+                    background: #f56c6c;
+                  }
+                }
+              }
+            }
+          }
+        }
+
+        &__footer {
+          padding: 20px 18px;
+          font-size: 14px;
+          color: #333;
+
+          .text {
+            margin-right: 20px;
+
+            &--red {
+              color: #ff3b30;
+            }
+          }
+        }
+      }
+    }
+
+    .pagination {
+      padding: 30px 0;
+      text-align: center;
+    }
+  }
+
+  .exercises-modal {
+    &__content {
+      > div {
+        font-size: 16px;
+        line-height: 30px;
+        text-align: center;
+
+        img {
+          display: inline;
+        }
+      }
+    }
+  }
+
+  .appoint-modal {
+    &__content {
+      .el-radio {
+        display: block;
+        margin: 10px 30px 10px 0;
+      }
+    }
+  }
+}
+</style>