双师制和商品专题页面布局

src/axios.js

@@ -3,10 +3,10 @@ import store from './store'
 import { Message } from 'element-ui'
 // 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 = 'https://test.xyyxt.net'   //预发布
 // export const BASE_URL = 'http://192.168.1.7:5055'    //dev
 // export const BASE_URL = 'http://192.168.1.24:5055'    //dev
-export const BASE_URL = 'http://120.79.166.78:19012'    //测试-外网
+// export const BASE_URL = 'http://120.79.166.78:19012'    //测试-外网
 // export const BASE_URL = 'http://42.192.164.187:19005'    //test
 // export const BASE_URL = 'http://192.168.1.222:5055'    //测试
 export const tenantId = '867735392558919680'

src/pages/course-detail/index.vue

@@ -2625,7 +2625,6 @@
           <!-- <span v-if="courseItem.teaList && courseItem.teaList.length > 0" v-for="(tea, index) in courseItem.teaList" :key="index">
             <el-button type="info" round>{{tea.aliasName}}</el-button>
           </span> -->
-          <!--  @click="switchTeacher(item.courseId, cindex)"-->
           <span v-if="courseItem.teaList && courseItem.teaList.length > 0" class="teacher_names">
             <span v-for="(tea, cindex) in courseItem.teaList" :key="cindex + 'three'" class="names"  >
               {{ tea.aliasName }}

src/pages/goods-detail/course-detail.vue

@@ -72,13 +72,13 @@
                     <div class="goods-menu clearfix" >
                       
                       <div class="left-box">
-                        <div v-for="(courseItem, index) in goodsTeacher" :key="index + 'one'">
+                        <div v-for="(courseItem, tindex) in goodsTeacher" :key="tindex + 'one'">
                         <div class="left-box__body">
-                          <template v-for="(course, index) in courseItem.courseList">
+                          <template v-for="(course, cindex) in courseItem.courseList">
                           <div
                             class="course-list-item"
                             v-if="course.show == 1"
-                            :key="index + 'two'"
+                            :key="cindex + 'two'"
                           >
                             <div class="doubles">
                               <div
@@ -95,10 +95,9 @@
                               </div>
                               <div v-if="courseItem.teaList && courseItem.teaList.length > 0" class="teacher_names">
                                 <div v-for="(tea, index) in courseItem.teaList" :key="index + 'three'" class="names"
-                                 :class="{nactive: teaIndex == index}" @click="switchTeacher(tea, index)">
+                                 :class="{nactive: States[tindex] == index}" @click="switchTeacher(tea, index, tindex)">
                                   {{ tea.aliasName }}
                                 </div>
-                                <!-- <el-button type="info" @click="switchTeacher(tea)" round>{{tea.aliasName}}</el-button> -->
                               </div>
                             </div>
                             <template v-if="course.showList">
@@ -589,6 +588,7 @@ export default {
       menuIndex: [], //需要展开的章节索引值
       freeMenuList: [], //赠送题卷列表
       teaIndex: 0,
+      States: {0: 0},
     };
   },
   beforeDestroy() {
@@ -1559,7 +1559,8 @@ export default {
       });
     },
         //切换老师
-    switchTeacher(data, index){
+    switchTeacher(data, index, tindex){
+      this.States[tindex] = index
       this.teaIndex = index
         console.log(data,'data');
         this.goodsTeacher.forEach((item,index) => {

src/pages/goodsTopic/components/buyDialog.vue

@@ -55,7 +55,7 @@ export default {
         },
         topicId: {
             type: [String, Number],
-            default: '1'
+            default: ''
         }
     },
     data() {
@@ -96,7 +96,7 @@ export default {
                 noToken: true,
                 params: {
                     subjectType: this.subjectType,
-                    topicId: this.topicId || 1,
+                    topicId: this.topicId,
                     type: this.type
                 }
             }).then((res) => {

src/pages/goodsTopic/components/catalogue.vue

@@ -27,177 +27,190 @@
                                 </div>
                                 <!-- 章节目录 -->
                                 <template v-if="tab.name == '1'">
-                                    <!-- <catalogue :goodsId='goodsId'></catalogue> -->
                                     <div class="mulu_body">
                                         <div class="left-box">
+                                            <div v-for="(courseItem, tindex) in goodsTeacher" :key="tindex + 'one'">
                                             <div class="left-box__body">
-                                                <div
-                                                class="course-list-item"
-                                                v-for="(course, index) in s_courseList"
-                                                :key="index"
-                                                >
-                                                <div
-                                                    class="course-list-item_title"
-                                                    @click="openCourse(course)"
-                                                >
-                                                    <i
-                                                    :class="{
-                                                        'el-icon-caret-right': !course.showList,
-                                                        'el-icon-caret-bottom': course.showList,
-                                                    }"
-                                                    ></i>
-                                                    {{ course.courseName }}
-                                                </div>
-                                                <template v-if="course.showList">
-                                                    <div
-                                                    class="item"
-                                                    v-for="(item, index) in course.list"
-                                                    :key="index"
-                                                    >
-                                                    <template v-if="item.type == 1">
+                                                <template v-for="(course, cindex) in courseItem.courseList">
+                                                    <!-- v-for="(course, cindex) in s_courseList" -->
+                                                    <div v-if="course.show == 1" :key="cindex + 'two'">
                                                         <div
-                                                        class="item__title"
-                                                        @click="openModule(item)"
+                                                            class="course-list-item"
+                                                            v-show="course.subjectId === newActiveSubjectId || !newActiveSubjectId"
                                                         >
-                                                        <i
-                                                            :class="{
-                                                            'el-icon-caret-right': !item.showList,
-                                                            'el-icon-caret-bottom': item.showList,
-                                                            }"
-                                                        ></i>
-                                                        {{ item.name }}
-                                                        </div>
-                                                        <div class="item__content">
-                                                        <div
-                                                            class="bank-chapter"
-                                                            v-if="item.showList"
-                                                        >
-                                                            <div
-                                                            class="bank-chapter__item"
-                                                            v-for="(
-                                                                chapter, chapterIndex
-                                                            ) in item.list"
-                                                            :key="chapterIndex"
-                                                            >
                                                             <div
-                                                                class="bank-chapter__item__text"
-                                                                @click="openChapter(chapter)"
+                                                                class="course-list-item_title"
+                                                                @click="openCourse(course)"
                                                             >
                                                                 <i
                                                                 :class="{
-                                                                    'el-icon-caret-right':
-                                                                    !chapter.showList,
-                                                                    'el-icon-caret-bottom':
-                                                                    chapter.showList,
+                                                                    'el-icon-caret-right': !course.showList,
+                                                                    'el-icon-caret-bottom': course.showList,
                                                                 }"
-                                                                ></i
-                                                                >{{ chapter.name }}
+                                                                ></i>
+                                                                {{ course.courseName }}
                                                             </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"
-                                                                >
-                                                                    {{ section.name }}
+                                                            <div v-if="courseItem.teaList && courseItem.teaList.length > 0" class="teacher_names">
+                                                                <div v-for="(tea, index) in courseItem.teaList" :key="index + 'three'" class="names"
+                                                                :class="{nactive: States[tindex] == index}"
+                                                                 @click="switchTeacher(tea, index, tindex)">
+                                                                {{ tea.aliasName }}
                                                                 </div>
+                                                            </div>
+                                                            <template v-if="course.showList">
                                                                 <div
-                                                                    v-if="section.tryListen"
-                                                                    @click="
-                                                                    toDo(section, item.courseId)
-                                                                    "
-                                                                    class="btn"
+                                                                class="item"
+                                                                v-for="(item, index) in course.list"
+                                                                :key="index"
                                                                 >
-                                                                    试看
-                                                                </div>
-                                                                </div>
-                                                            </div>
-                                                            </div>
-                                                        </div>
-                                                        </div>
-                                                    </template>
+                                                                <template v-if="item.type == 1">
+                                                                    <div
+                                                                    class="item__title"
+                                                                    @click="openModule(item)"
+                                                                    >
+                                                                    <i
+                                                                        :class="{
+                                                                        'el-icon-caret-right': !item.showList,
+                                                                        'el-icon-caret-bottom': item.showList,
+                                                                        }"
+                                                                    ></i>
+                                                                    {{ item.name }}
+                                                                    </div>
+                                                                    <div class="item__content">
+                                                                    <div
+                                                                        class="bank-chapter"
+                                                                        v-if="item.showList"
+                                                                    >
+                                                                        <div
+                                                                        class="bank-chapter__item"
+                                                                        v-for="(
+                                                                            chapter, chapterIndex
+                                                                        ) in item.list"
+                                                                        :key="chapterIndex"
+                                                                        >
+                                                                        <div
+                                                                            class="bank-chapter__item__text"
+                                                                            @click="openChapter(chapter)"
+                                                                        >
+                                                                            <i
+                                                                            :class="{
+                                                                                'el-icon-caret-right':
+                                                                                !chapter.showList,
+                                                                                'el-icon-caret-bottom':
+                                                                                chapter.showList,
+                                                                            }"
+                                                                            ></i
+                                                                            >{{ chapter.name }}
+                                                                        </div>
 
-                                                    <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="openChapter(item)"
-                                                            >
-                                                                <i
-                                                                :class="{
-                                                                    'el-icon-caret-right':
-                                                                    !item.showList,
-                                                                    'el-icon-caret-bottom':
-                                                                    item.showList,
-                                                                }"
-                                                                ></i
-                                                                >{{ item.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"
+                                                                            >
+                                                                                {{ section.name }}
+                                                                            </div>
+                                                                            <div
+                                                                                v-if="section.tryListen"
+                                                                                @click="
+                                                                                toDo(section, item.courseId)
+                                                                                "
+                                                                                class="btn"
+                                                                            >
+                                                                                试看
+                                                                            </div>
+                                                                            </div>
+                                                                        </div>
+                                                                        </div>
+                                                                    </div>
+                                                                    </div>
+                                                                </template>
 
-                                                            <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"
-                                                                >
-                                                                    {{ section.name }}
-                                                                </div>
-                                                                <div
-                                                                    v-if="section.tryListen"
-                                                                    @click="
-                                                                    toDo(section, item.courseId)
-                                                                    "
-                                                                    class="btn"
-                                                                >
-                                                                    试看
-                                                                </div>
-                                                                </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="openChapter(item)"
+                                                                        >
+                                                                            <i
+                                                                            :class="{
+                                                                                'el-icon-caret-right':
+                                                                                !item.showList,
+                                                                                'el-icon-caret-bottom':
+                                                                                item.showList,
+                                                                            }"
+                                                                            ></i
+                                                                            >{{ item.name }}
+                                                                        </div>
 
-                                                    <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">
-                                                                {{ item.name }}
-                                                            </div>
-                                                            <div
-                                                                v-if="item.tryListen"
-                                                                @click="toDo(item, item.courseId)"
-                                                                class="btn"
-                                                            >
-                                                                试看
-                                                            </div>
-                                                            </div>
-                                                        </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"
+                                                                            >
+                                                                                {{ section.name }}
+                                                                            </div>
+                                                                            <div
+                                                                                v-if="section.tryListen"
+                                                                                @click="
+                                                                                toDo(section, item.courseId)
+                                                                                "
+                                                                                class="btn"
+                                                                            >
+                                                                                试看
+                                                                            </div>
+                                                                            </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">
+                                                                            {{ item.name }}
+                                                                        </div>
+                                                                        <div
+                                                                            v-if="item.tryListen"
+                                                                            @click="toDo(item, item.courseId)"
+                                                                            class="btn"
+                                                                        >
+                                                                            试看
+                                                                        </div>
+                                                                        </div>
+                                                                    </div>
+                                                                    </div>
+                                                                </template>
+                                                                </div>
+                                                            </template>
                                                         </div>
-                                                    </template>
                                                     </div>
                                                 </template>
-                                                </div>
+                                            </div>
+
                                             </div>
                                         </div>
                                     </div>
@@ -230,7 +243,7 @@
         </div>
         
         <!-- 弹窗 -->
-        <buy-dialog :buyModal.sync="buyModal" :topicId="topicId" :subjectType="1" :type="1"></buy-dialog>
+        <buy-dialog :buyModal.sync="buyModal" :topicId="topicId" :subjectType="1" :type="3"></buy-dialog>
     </div>
         
     <!-- </div> -->
@@ -288,6 +301,10 @@ export default {
             playCourseId: 0, // 播放课程id
             showAsk: false,
             buyModal: false,
+            goodsTeacher: [],
+            teaIndex: 0,
+            States: {0: 0},
+            newActiveSubjectId: '',
         }
     },
     watch: {
@@ -304,8 +321,9 @@ export default {
             this.showAsk = !this.showAsk
         },
         toChangeCou(item, index) {
+            this.newActiveSubjectId = item.subjectId
             this.subIndex = index
-            this.s_courseList = this.courseList.filter(e => e.subjectId == item.subjectId)
+            // this.s_courseList = this.courseList.filter(e => e.subjectId == item.subjectId)
         },
         togoBuy() {
             this.buyModal = true
@@ -338,6 +356,27 @@ export default {
                 }
             });
         },
+        //切换老师
+        switchTeacher(data, index, tindex){
+            console.log(data,'data', index,tindex);
+            this.States[tindex] = index
+            this.teaIndex = index
+            this.goodsTeacher.forEach((item,index) => {
+                if(item.teaList && item.teaList.length > 0){
+                let list = item.teaList.filter(x => x.aliasName == data.aliasName)
+                if(list && list.length > 0){
+                    item.courseList.forEach((course,courseIndex) => {
+                        if(course.courseId == data.courseId){
+                            
+                            this.$set(this.goodsTeacher[index].courseList[courseIndex],"show",1)
+                        }else{
+                            this.$set(this.goodsTeacher[index].courseList[courseIndex],"show",0)
+                        }
+                    })
+                }
+                }
+            })
+        },
         /**
          * 获取课程章节列表，/app/common/goods/course/list/' + data,
          */
@@ -348,6 +387,8 @@ export default {
                         item.showList = false
                         item.list = []
                     })
+                    // 获取双师制
+                    this.getCourseTeacher(res.rows)
                     this.courseList = res.rows || []
                     // 筛选科目名称
                     let ids = []
@@ -361,6 +402,7 @@ export default {
 					this.subList = [...newArr]
                     this.subList = this.subList.filter(item => item.subjectName)
                     console.log('this.subList', this.subList)
+                    this.subList.length && (this.newActiveSubjectId = this.subList[0].subjectId)
                     
                     if (this.needOpen) {
                         for (let i = 0; i < this.courseList.length; i++) {
@@ -381,6 +423,73 @@ export default {
                 
             })
         },
+        getCourseTeacher(rows) {
+            //获取商品双师资模板
+            this.$request.getGoodsCourseTeacher({
+               goodsId: this.goodsId
+            }).then((res1) => {
+              console.log(res1,'res1');
+              if(res1.data && res1.data.length > 0){
+                  //课程老师模板
+                  let teacherTel = res1.data;
+                  //商品课程
+                  let courses = rows;
+                  teacherTel.forEach((tea) => {
+                    let dataList = []
+                    let teacherList = []
+                      courses.forEach((item) => {
+                        if(tea.courseIds.search(item.courseId) > -1){
+                          dataList.push(item)
+                          teacherList = tea.courseList
+                        }
+                      })
+                      let result = {
+                        teaList:teacherList,
+                        courseList:dataList
+                      }
+                      this.goodsTeacher.push(result)
+                  })
+                  if(this.goodsTeacher && this.goodsTeacher.length > 0){
+                    let courseIds = []
+                    this.goodsTeacher.forEach((item) => {
+                        item.courseList.forEach((course) => {
+                          courseIds.push(course.courseId)
+                        })
+                    })
+                    if(courseIds.length > 0){
+                      courses.forEach((item) => {
+                          if(!courseIds.includes(item.courseId)){
+                              let data = {
+                                teaList:[],
+                                courseList: []
+                              }
+                              data.courseList.push(item)
+                              this.goodsTeacher.push(data)
+                          }
+                      })
+                    }
+                    this.goodsTeacher.forEach((item) => {
+                      if(item.courseList && item.courseList.length > 0){
+                        item.courseList[0].show = 1
+                      }
+                    })
+                  }
+              }else{
+                //没有双师资模板
+                rows.forEach((item) => {
+                  item.show = 1
+                  let data = {
+                      teaList:[],
+                      courseList: []
+                  }
+                  data.courseList.push(item)
+                  this.goodsTeacher.push(data)
+                })
+               
+              }
+            }) 
+            console.log(this.goodsTeacher,'this.goodsTeacher');
+        },
         // 获取课程目录，/app/common/course/menuList
         getCourseMenus(item) {
             return new Promise((resolve) => {
@@ -682,9 +791,9 @@ export default {
         width: 100%;
         height: 100%;
         overflow-y: auto;
-
+        padding-top: 10px;
         .course-list-item {
-            padding: 16px;
+            padding: 0px 16px 10px;
             border-radius: 10px;
 
             .item {
@@ -706,7 +815,6 @@ export default {
                         &__item {
                             padding-top: 10px;
                             padding-bottom: 10px;
-                            // border-bottom: 1px solid #eeeeee;
                             font-size: 14px;
                             color: #fff;
                             &__text {
@@ -722,7 +830,6 @@ export default {
                         &__item {
                             padding-top: 10px;
                             padding-bottom: 10px;
-                            // border-bottom: 1px solid #eeeeee;
                             font-size: 14px;
                             display: flex;
                             color: #3f8dfd;
@@ -822,4 +929,22 @@ export default {
         }
     }
 }
+// 老师名称样式
+.teacher_names {
+    display: flex;
+    margin-left: 20px;
+    margin-top: 10px;
+    .names {
+        font-size: 13px;
+        color: #383838;
+        margin-right: 8px;
+        cursor: pointer;
+        background: #818181;
+        border-radius: 4px;
+        padding: 3px 6px;
+        &.nactive {
+            background: #CCCCCC;
+        }
+    }
+}
 </style>

src/pages/goodsTopic/index.vue

@@ -42,7 +42,11 @@
             </div>
             <div class="mains">
                 <div class="content_up">
-                    <div class="banner_one"></div>
+                    <div class="banner_one">
+                        <div class="one_bg">
+                            <img class="bgimg" src="@/assets/topic/one_bg.png" alt="" />
+                        </div>
+                    </div>
                     <div class="banner_two">
                         <catalogue :goodsId='goodsId' :topicId="topicId"></catalogue>
                     </div> 
@@ -386,10 +390,19 @@ export default {
                 width: 100%;
                 height: 280px;
                 background: url('../../assets/topic/banner_one.png') center center no-repeat;
-                background-size: 100% 100%;
-                display: flex;
-                align-items: center;
-                justify-content: center;
+                // background-size: 100% 100%;
+                // display: flex;
+                // align-items: center;
+                // justify-content: center;
+                .one_bg {
+                    width: 1056px;
+                    height: 280px;
+                    margin: 0 auto;
+                    >img {
+                        width: 100%;
+                        height: 100%;
+                    }
+                }
             }
             .banner_two {
                 width: 100%;