diff --git a/api/promotions.js b/api/promotions.js index e796a62..e893943 100644 --- a/api/promotions.js +++ b/api/promotions.js @@ -9,10 +9,11 @@ import { http, Method } from "@/utils/request.js"; * @param {*} * @returns */ -export function getLiveList() { +export function getLiveList(params) { return http.request({ url: `broadcast/studio`, method: Method.GET, + params }); } diff --git a/config/api.js b/config/api.js index 7ebeda9..2a6f483 100644 --- a/config/api.js +++ b/config/api.js @@ -11,8 +11,8 @@ const dev = { }; // 生产环境 const prod = { - common: "https://common-api.pickmall.cn", - buyer: "https://buyer-api.pickmall.cn", + common: 'http://192.168.0.109:8890', + buyer: 'http://192.168.0.109:8888', }; //默认生产环境 diff --git a/manifest.json b/manifest.json index 0cdf3bc..35576c2 100644 --- a/manifest.json +++ b/manifest.json @@ -185,7 +185,7 @@ "setting" : { "urlCheck" : false, "minified" : true, - "postcss" : true, + "postcss" : false, "es6" : true }, "permission" : { @@ -221,6 +221,6 @@ } }, "title" : "lilishop", - "template" : "/pages/passport/appleLogin.html" + "template" : "" } } diff --git a/pages/promotion/lives.vue b/pages/promotion/lives.vue index 5cb2d25..07b0c89 100644 --- a/pages/promotion/lives.vue +++ b/pages/promotion/lives.vue @@ -2,14 +2,14 @@
- + - + - +
@@ -29,21 +29,19 @@ {{item.name}}
- lilishop
-
- +
- +
-
+ @@ -53,8 +51,10 @@ import { getLiveList } from "@/api/promotions.js"; export default { data() { return { + status: "loadmore", activeColor: this.$lightColor, - keyword: "", + current: 0, // 当前tabs索引 + keyword: "", //搜索直播间 // 标签栏 tabs: [ { @@ -63,27 +63,36 @@ export default { { name: "全部", }, - - { - name: "回放", - }, ], // 导航栏的配置 background: { background: "#ff9f28", }, + // 直播间params + params: [ + { + pageNumber: 1, + pageSize: 10, + status: "START", + }, + { + pageNumber: 1, + pageSize: 4, + }, + ], + // 推荐直播间Params + recommendParams: { + pageNumber: 1, + pageSize: 3, + recommend: 0, + }, // 直播间列表 - liveList: "", + liveList: [], + // 推荐直播间列表 + recommendLiveList: [], + //轮播图滚动的图片 swiperImg: [ - { - image: - "https://lilishop-oss.oss-cn-beijing.aliyuncs.com/8e33ab68ef734558bdc158d6b1b1451f.png", - }, - { - image: - "https://lilishop-oss.oss-cn-beijing.aliyuncs.com/5ec999c942374e849d085071b4d20a19.jpeg", - }, { image: "https://lilishop-oss.oss-cn-beijing.aliyuncs.com/48d789cb9c864b7b87c1c0f70996c3e8.jpeg", @@ -91,28 +100,122 @@ export default { ], }; }, - mounted() { + onShow() { + this.getLives(); + this.getRecommendLives(); + }, + onReachBottom() { + this.params[this.current].pageNumber++; this.getLives(); }, methods: { /** - * + * 点击标签栏切换 */ - async getLives() { - let res = await getLiveList(); - if (res.data.success) { - this.liveList = res.data.result.records; + changeTabs(index) { + this.current = index; + this.init(); + }, - this.liveList.forEach((item) => { - console.log(); - }); + /** + * 初始化直播间 + */ + init() { + this.liveList = []; + this.status = "loadmore"; + this.getLives(); + }, + + /** + * 清除搜索内容 + */ + clear() { + delete this.params[this.current].name; + this.init(); + }, + /** + * 点击顶部推荐直播间 + */ + clickSwiper(val) { + console.log(this.swiperImg[val]) + this.handleLivePlayer(this.swiperImg[val]); + }, + + /** + * 搜索直播间 + */ + searchLive(val) { + this.params[this.current].name = val; + this.init(); + }, + /** + * 获取推荐直播间 + */ + async getRecommendLives() { + this.status = "loading"; + let recommendLives = await getLiveList(this.recommendParams); + if (recommendLives.data.success) { + // 推荐直播间 + if (recommendLives.data.result.records.length != 0) { + this.status = "loadmore"; + this.recommendLives = recommendLives.data.result.records; + } else { + this.status = "noMore"; + } + + /** + * 如果推荐直播间没有的情况下 + * 1.获取直播间第一个图片 + * 2.如果没有直播间设置一个默认图片 + */ + + if (this.recommendLives.length == 0) { + if (this.liveList[0].shareImg) { + this.$set(this, "swiperImg", [ + { + image: this.liveList[0].shareImg, + roomId: this.liveList[0].roomId, + }, + ]); + } + } else { + this.recommendLives.forEach((item) => { + this.$set(this, "swiperImg", [ + { image: item.shareImg, roomId: item.roomId }, + ]); + }); + } } }, /** - * 推荐直播间 + * 获取直播间 */ - async getStarLive() {}, + async getLives() { + this.status = "loading"; + let res = await getLiveList(this.params[this.current]); + // 直播间 + if (res.data.success) { + if (res.data.result.records.length != 0) { + this.status = "loadmore"; + this.liveList.push(...res.data.result.records); + } else { + this.status = "noMore"; + } + res.data.result.total > + this.params[this.current].pageNumber * + this.params[this.current].pageSize + ? (this.status = "loadmore") + : (this.status = "noMore"); + + console.log(this.status); + this.liveList.forEach((item) => { + if (item.roomGoodsList) { + item.roomGoodsList = JSON.parse(item.roomGoodsList); + } + }); + } + }, /** * 进入直播间