Procházet zdrojové kódy

首页课程推荐

xuqiaoying před 3 roky
rodič
revize
0bd9dee8b4
2 změnil soubory, kde provedl 272 přidání a 66 odebrání
  1. 2 2
      src/axios.js
  2. 270 64
      src/pages/home/index.vue

+ 2 - 2
src/axios.js

@@ -3,9 +3,9 @@ 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://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'

+ 270 - 64
src/pages/home/index.vue

@@ -376,16 +376,19 @@
       <div class="container">
         <div class="course__header">
           <div class="title">推荐课程</div>
-          <div class="tabs">
-            <div
-              v-for="(item, index) in goodsList1"
-              :key="index"
-              class="tab"
-              :class="active1 === index ? 'active' : ''"
-              @click="active1 = index"
-            >
-              {{ item.name }}
-            </div>
+          <div class="course__footer">
+            <div class="btn" @click="go('/course-list')">查看更多</div>
+          </div>
+        </div>
+        <!-- <div class="tabs">
+          <div
+            v-for="(item, index) in goodsList1"
+            :key="index"
+            class="tab"
+            :class="active1 === index ? 'active' : ''"
+            @click="active1 = index"
+          >
+            {{ item.name }}
           </div>
         </div>
         <div class="course__body">
@@ -406,11 +409,51 @@
               </li>
             </template>
           </ul>
+        </div> -->
+        <div class="tabs">
+          <div
+            v-for="(item, index) in courseName"
+            :key="index"
+            class="tab"
+            :class="couIndex === index ? 'active' : ''"
+            @click="changeCou(item.recommendId, index)"
+          >
+            {{ item.name }}
+          </div>
+        </div>
+        <div class="course__body">
+          <p
+            v-if="
+              !goodsList1.length
+            "
+            class="text_align"
+          >
+            该培训项目无推荐课程
+          </p>
+          <ul v-else class="list clearfix">
+            <template v-for="(item, index) in goodsList1">
+              <li class="course-item" :key="index">
+                <GoodsItem :item="item"></GoodsItem>
+              </li>
+            </template>
+          </ul>
         </div>
 
-        <div class="course__footer">
-          <div class="btn" @click="go('/course-list')">查看更多</div>
+        <div class="pagination">
+          <el-pagination
+            @current-change="currentChangeBank"
+            background
+            layout="prev, pager, next"
+            :total="paramList[0].total"
+            :page-size="paramList[0].pageSize"
+          >
+          </el-pagination>
         </div>
+
+        <!-- <div class="course__footer">
+          <div class="btn" @click="go('/course-list')">查看更多</div>
+        </div> -->
+
       </div>
     </section>
 
@@ -418,16 +461,19 @@
       <div class="container">
         <div class="bank__header">
           <div class="title">推荐题库</div>
-          <div class="tabs">
-            <div
-              v-for="(item, index) in goodsList2"
-              :key="index"
-              class="tab"
-              :class="active2 === index ? 'active' : ''"
-              @click="active2 = index"
-            >
-              {{ item.name }}
-            </div>
+          <div class="bank__footer">
+            <div class="btn" @click="go('/bank-list')">查看更多</div>
+          </div>
+        </div>
+        <!-- <div class="tabs">
+          <div
+            v-for="(item, index) in goodsList2"
+            :key="index"
+            class="tab"
+            :class="active2 === index ? 'active' : ''"
+            @click="active2 = index"
+          >
+            {{ item.name }}
           </div>
         </div>
         <div class="bank__body">
@@ -450,29 +496,55 @@
                 @click="goodsDetail(item, 2)"
               >
                 <GoodsItem :item="item"></GoodsItem>
-                <!-- <div class="bank-item__img">
-                  <div class="note" v-if="item.year">{{ item.year }}</div>
-                  <img
-                    v-if="item.coverUrl"
-                    :src="$tools.splitImgHost(item.coverUrl)"
-                    alt=""
-                  />
-                </div>
-                <div class="bank-item__title">
-                  {{ item.goodsName }}
-                </div>
-                <div class="bank-item__desc">
-                  <div class="price">¥{{ item.standPrice }}</div>
-                  <a class="add" @click.stop="addCart(item)">加购物车</a>
-                </div> -->
               </li>
             </template>
           </ul>
-        </div>
+        </div> -->
 
-        <div class="bank__footer">
-          <div class="btn" @click="go('/bank-list')">查看更多</div>
+        <div class="tabs">
+          <div
+            v-for="(item, index) in bankName"
+            :key="index"
+            class="tab"
+            :class="bankIndex === index ? 'active' : ''"
+            @click="changebank(item.recommendId, index)"
+          >
+            {{ item.name }}
+          </div>
         </div>
+        <div class="bank__body">
+          <p
+            v-if="
+              !goodsList2.length
+            "
+            class="text_align"
+          >
+            该培训项目无推荐题库
+          </p>
+          <ul v-else class="list clearfix">
+            <template v-for="(item, index) in goodsList2">
+              <li
+                class="bank-item"
+                :key="index"
+                @click="goodsDetail(item, 2)"
+              >
+                <GoodsItem :item="item"></GoodsItem>
+              </li>
+            </template>
+          </ul>
+        </div>
+        
+        <div class="pagination">
+          <el-pagination
+            @current-change="currentChangeCou"
+            background
+            layout="prev, pager, next"
+            :total="paramList[1].total"
+            :page-size="paramList[1].pageSize"
+          >
+          </el-pagination>
+        </div>
+        
       </div>
     </section>
 
@@ -630,15 +702,45 @@ export default {
       searchKey: "",
       type: "1",
       recordList: {},
+      params: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      paramList: [
+				{
+					pageNum: 1,
+					pageSize: 10,
+					total: 0,
+				},
+				
+				{
+					pageNum: 1,
+					pageSize: 10,
+					total: 0,
+				}
+			],
+      total1: 0,
+			total2: 0,
+      courseName: [],
+			bankName: [],
+			couIndex: 0,
+			bankIndex: 0,
+			courseId: '',
+			bankId: '',
     };
   },
+  created() {
+    this.goodsList1 = []
+		this.goodsList2 = []
+		this.courseLists()
+  },
   mounted() {
     if (this.userInfo) {
       this.getRecord();
       this.getmsg();
       this.getMsgCount();
     }
-    this.getActivityList();
+    // this.getActivityList();
     // this.color = this.colors[0];
     this.advertisingList();
     this.educationTypeList();
@@ -653,6 +755,98 @@ export default {
     },
   },
   methods: {
+    //课程
+		 courseLists() {			
+			this.$axios({
+				url: '/app/common/activity/recommend/list',
+				method: 'get',
+				params: {
+					platform: 1,
+					status: 1
+				},
+				noToken: true
+			}).then(async (res) => {
+        console.log('----------------res', res)
+        // return
+				if (res.code == 200) {
+					let list = res.rows || []
+					//课程
+					this.courseName = list.filter(x => x.type == 1).sort((a,b) => a.sort - b.sort).map(x => {
+						return {
+							name: x.name,
+							recommendId: x.recommendId
+						}
+					});
+					console.log('couIndex', this.couIndex, this.courseName)
+					//题库
+					this.bankName = list.filter(x => x.type == 2).sort((a,b) => a.sort - b.sort).map(x => {
+						return {
+							name: x.name,
+							recommendId: x.recommendId
+						}
+					});
+					if (this.courseName.length) {
+						this.courseId = this.courseName[0].recommendId
+						let list1 = await this.getGoodsList(this.courseName[0].recommendId, 0)
+						this.goodsList1.push(...list1)
+					}
+					
+					if (this.bankName.length) {
+						this.bankId = this.bankName[0].recommendId
+						let list2 = await this.getGoodsList(this.bankName[0].recommendId, 1)
+						this.goodsList2.push(...list2)
+					}
+
+				}
+			});
+		},
+    getGoodsList(recommendId, num) {	
+			return new Promise((resolve, reject) => {
+				 this.$axios({
+					url: `/app/common/activity/recommend/goodsList`,
+					method: 'get',
+					params: {
+						pageNum: this.paramList[num].pageNum,
+						pageSize: this.paramList[num].pageSize,
+						recommendId: recommendId
+					},
+					noToken: true
+				}).then((res) => {
+					if (res.code == 200) {
+						this.paramList[num].total = res.total
+						resolve(res.rows)
+					}	
+				})
+			})
+			 
+		},
+    async currentChangeCou(e) {
+      this.params.pageNum = e
+      this.goodsList1 = []
+      let list1 = await this.getGoodsList(this.courseId, 0)
+      this.goodsList1.push(...list1)
+    },
+    async changeCou(recommendId, index) {
+			this.couIndex = index
+			this.courseId = recommendId
+			this.paramList[0].pageNum = 1
+			this.goodsList1 = []
+			let list1 = await this.getGoodsList(recommendId, 0)
+			this.goodsList1.push(...list1)
+		},
+    async currentChangeBank(e) {
+      this.goodsList2 = []
+      let list2 = await this.getGoodsList(this.bankId, 0)
+      this.goodsList2.push(...list2)
+    },
+    async changebank(recommendId, index) {
+			this.bankIndex = index
+			this.bankId = recommendId
+			this.paramList[1].pageNum = 1
+			this.goodsList2 = []
+			let list2 = await this.getGoodsList(recommendId, 1)
+			this.goodsList2.push(...list2)
+		},
     /**
      * 关闭消息
      */
@@ -1907,6 +2101,7 @@ export default {
     &__header {
       display: flex;
       align-items: center;
+      justify-content: space-between;
 
       .title {
         background: url("~@/assets/video.png") no-repeat left center;
@@ -1918,33 +2113,39 @@ export default {
         text-shadow: 0px 6px 6px rgba(249, 113, 13, 0.08);
       }
 
-      .tabs {
-        margin-left: 40px;
-        display: flex;
-        align-items: center;
+      
+    }
+    .tabs {
+      margin-left: 28px;
+      display: flex;
+      align-items: center;
 
-        .tab {
-          cursor: pointer;
-          user-select: none;
-          // width: 88px;
-          padding: 0px 6px;
-          height: 24px;
-          border: 1px solid #f84e05;
-          border-radius: 12px;
-          text-align: center;
-          line-height: 24px;
-          color: #f84e05;
-          font-size: 14px;
-          margin: 0 4px;
+      .tab {
+        cursor: pointer;
+        user-select: none;
+        // width: 88px;
+        padding: 0px 6px;
+        height: 24px;
+        border: 1px solid #f84e05;
+        border-radius: 12px;
+        text-align: center;
+        line-height: 24px;
+        color: #f84e05;
+        font-size: 14px;
+        margin: 0 4px;
 
-          &.active {
-            color: #fff;
-            background: #f84e05;
-          }
+        &.active {
+          color: #fff;
+          background: #f84e05;
         }
       }
     }
 
+    .pagination {
+      padding: 30px 0;
+      text-align: center;
+    }
+
     &__body {
       .list {
         width: 100%;
@@ -1984,7 +2185,7 @@ export default {
     &__header {
       display: flex;
       align-items: center;
-
+      justify-content: space-between;
       .title {
         background: url("~@/assets/exercise.png") no-repeat left center;
         padding-left: 36px;
@@ -1995,7 +2196,9 @@ export default {
         text-shadow: 0px 6px 6px rgba(249, 113, 13, 0.08);
       }
 
-      .tabs {
+      
+    }
+    .tabs {
         margin-left: 40px;
         display: flex;
         align-items: center;
@@ -2020,6 +2223,9 @@ export default {
           }
         }
       }
+    .pagination {
+      padding: 30px 0;
+      text-align: center;
     }
 
     &__body {