直播结束

src/api/live.js

@@ -39,10 +39,14 @@ export default {
   },
   // 直播间点赞接口
   addLiveLikeByUser(options) {
-    return requestPOST(`${process.env.OLSHOP_URL}liveBroadcastInfo/addLiveLikeByUser`, options);
+    return requestPOST(`${process.env.OLSHOP_URL}/liveBroadcastInfo/addLiveLikeByUser`, options);
   },
   // 直播中商品列表
   getListByLiveBroadcastId(options) {
-    return requestGET(`${process.env.OLSHOP_URL}liveBroadcastGoods/getListByLiveBroadcastId?id=${Number(options)}`);
+    return requestGET(`${process.env.OLSHOP_URL}/liveBroadcastGoods/getListByLiveBroadcastId?id=${Number(options)}`);
+  },
+  // 单次直播数据统计接口
+  getLiveStatisticsById(options) {
+    return requestPOST(`${process.env.OLSHOP_URL}/liveBroadcastInfo/getLiveStatisticsById`,options);
   },
 };
\ No newline at end of file

src/components/livedModel/livedGoodsDia.vue

@@ -183,10 +183,10 @@ export default {
         fromLived: 1,
         liveId: this.liveId
       };
-      this.backPath = `/goods/${val.productId}`;
+      let backPath = `/goods/${val.productId}`;
       wx.reLaunch({
         url: `../index/main?from=livedToGoodsInfo&backpath=${
-          this.backPath
+          backPath
         }&params=${JSON.stringify(query)}`
       });
     }

src/components/livedModel/livedIsEnded.vue

@@ -9,15 +9,15 @@
       </p>
       <div class="data">
         <div>
-          <p>333</p>
+          <p>{{endInfo.watchNum}}</p>
           <p>观看</p>
         </div>
         <div>
-          <p>333</p>
+          <p>{{endInfo.guestBookNum}}</p>
           <p>评论</p>
         </div>
         <div>
-          <p>333</p>
+          <p>{{endInfo.likeNum}}</p>
           <p>赞</p>
         </div>
       </div>
@@ -29,15 +29,15 @@
         </div>
         <div class="list">
           <div class="item" v-for="(item,index) in list" :key="index">
-            <div class="img">
-              <img :src="item.img" alt />
+            <div class="img" @click="toGoodsInfo(item)">
+              <img :src="item.productImgUrl" alt />
             </div>
             <div class="info">
-              <p class="name line-clamp2">{{item.name}}</p>
+              <p class="name line-clamp2">{{item.productName}}</p>
               <div class="price">
                 <p>
                   <span>￥</span>
-                  <span>{{item.price}}</span>
+                  <span>{{item.minPrice}}</span>
                 </p>
                 <div class="icon">
                   <van-icon name="shopping-cart" />
@@ -53,48 +53,42 @@
 
 <script type="text/ecmascript-6">
 export default {
-  props:["updateGoods","goodsList"],
+  props: ["updateGoods", "goodsList", "endInfo"],
   name: "",
   data() {
     return {
-      list: [
-        {
-          name: "产品名称产品名称产品名称产品名称产品名称",
-          img:
-            "//img3.imgtn.bdimg.com/it/u=3743111107,1940472030&fm=11&gp=0.jpg",
-          price: 123
-        },
-        {
-          name: "产品名称产品名称产品名称产品名称产品名称",
-          img:
-            "//img3.imgtn.bdimg.com/it/u=3743111107,1940472030&fm=11&gp=0.jpg",
-          price: 123
-        },
-        {
-          name: "产品名称产品名称产品名称产品名称产品名称",
-          img:
-            "//img3.imgtn.bdimg.com/it/u=3743111107,1940472030&fm=11&gp=0.jpg",
-          price: 123
-        },
-        {
-          name: "产品名称产品名称产品名称产品名称产品名称",
-          img:
-            "//img3.imgtn.bdimg.com/it/u=3743111107,1940472030&fm=11&gp=0.jpg",
-          price: 123
-        }
-      ]
+      list: [],
+      liveId: 0
     };
   },
-  watch:{
-    updateGoods(){
-      this.list=this.goodsList;
+  watch: {
+    updateGoods() {
+      this.list = this.goodsList;
     }
   },
   components: {},
   computed: {},
+  onLoad(options) {
+    let params = JSON.parse(options.params);
+    this.liveId = params.liveId;
+  },
   created() {},
   mounted() {},
-  methods: {}
+  methods: {
+    // 到商品详情
+    toGoodsInfo(val) {
+      let query = {
+        fromLived: 1,
+        liveId: this.liveId
+      };
+      let backPath = `/goods/${val.productId}`;
+      wx.reLaunch({
+        url: `../index/main?from=livedToGoodsInfo&backpath=${backPath}&params=${JSON.stringify(
+          query
+        )}`
+      });
+    }
+  }
 };
 </script>
 
@@ -159,7 +153,7 @@ export default {
       }
       .tit {
         font-size: 16px;
-        padding: 0 4px;
+        padding: 0 4px 6px 0;
       }
       .list {
         max-height: 50vh;
@@ -188,20 +182,20 @@ export default {
             display: flex;
             flex-direction: column;
             justify-content: space-between;
-            .name{
+            .name {
               text-align: left;
             }
-            .price{
+            .price {
               display: flex;
               justify-content: space-between;
               align-items: center;
               font-size: 18px;
-              span{
-                color: #FF0000;
+              span {
+                color: #ff0000;
               }
-              .icon{
+              .icon {
                 font-size: 22px;
-                color: #FF8181;
+                color: #ff8181;
               }
             }
           }

src/components/livedModel/livedSelectionSpe.vue

@@ -24,7 +24,7 @@
                 <div>￥{{product_goods_info.discountPrice}}</div>
                 <div v-if="product_goods_info.singleItemActivityId">
                   <p class="delPrice">￥{{product_goods_info.originalPrice}}</p>
-                  <!-- <del style="color:#666;">￥{{product_goods_info.originalPrice}}</!--> -->
+                  <!-- <del style="color:#666;">￥{{product_goods_info.originalPrice}}</!--> 
                 </div>
                 <div
                   v-else-if="product_goods_info.discountPrice-0<product_goods_info.goodsSuggestedRetailPrice-0"

src/pages/lived/index.vue

@@ -28,7 +28,12 @@
       <!-- 未开始展示 -->
       <notStarted v-if="liveNoticeInfo.liveBroadcastState==0" :info="liveNoticeInfo"></notStarted>
       <!-- 结束展示 -->
-      <livedIsEnded v-if="liveNoticeInfo.liveBroadcastState==2" :updateGoods="updateGoods" :goodsList="goodsList"></livedIsEnded>
+      <livedIsEnded
+        v-if="liveNoticeInfo.liveBroadcastState==2&&endInfo"
+        :updateGoods="updateGoods"
+        :endInfo="endInfo"
+        :goodsList="goodsList"
+      ></livedIsEnded>
       <!-- 控件层 -->
       <livedControls
         v-if="liveNoticeInfo&&liveNoticeInfo.liveBroadcastState<2"
@@ -46,7 +51,7 @@
     <live-player
       v-if="liveNoticeInfo.liveBroadcastState==1&&liveNoticeInfo.boStreamRTMP"
       class="livePlayer"
-      :src="'rtmp://live.mayi888.com/xgy/127?auth_key=1584633600000-0-0-ac39474385b37a7adac070d15b0bb5de'"
+      :src="liveNoticeInfo.boStreamRTMP"
       mode="RTC"
       autoplay
       @error="error"
@@ -76,14 +81,17 @@ export default {
       liveNoticeInfo: {}, //详情
       entryNoticeText: "", //用户通知
       guestBookList: [], // 定时查评论
-      goodsList:[],//商品列表
+      goodsList: [], //商品列表
       updateVal: 0, //子组件监听此数据进行数据赋值
-      updateGoods:0,//商品相关组件监听
+      updateGoods: 0, //商品相关组件监听
       likeInfo: {}, //点赞
       isVideo: false, //是否有直播或回放链接
       liveTime: null, //定时器
       isWifi: true, //提示网络环境
-      infoTiming: null //定时器
+      infoTiming: null, //全局定时器
+      goodTiming: null, //商品定时器
+      endInfo: {}, //直播结束详情
+      firstComing: true // 首次进入
     };
   },
   components: {
@@ -115,21 +123,22 @@ export default {
     this.shopName = params.shopName;
     this.shopLogo = DFSImg(params.shopLogo, 40, 40);
     this.init();
-    setTimeout(() => {
-      this.infoTiming = setInterval(() => {
-        this.timingGetInfo();
-        this.getGoodsList();
-      }, 5000);
-    }, 2000);
+    this.infoTiming = setInterval(() => {
+      this.timingGetInfo();
+    }, 5000);
     this.userEntry("IN");
   },
   onUnload() {
     this.userEntry("OUT");
     this.liveNoticeInfo.liveBroadcastState = -1;
     this.liveNoticeInfo = {};
+    this.firstComing=true;
     if (this.infoTiming) {
       clearInterval(this.infoTiming);
     }
+    if (this.goodTiming) {
+      clearInterval(this.goodTiming);
+    }
   },
   mounted() {},
   methods: {
@@ -143,16 +152,22 @@ export default {
           this.liveNoticeInfo.coverUrl = this.liveNoticeInfo.coverUrl
             ? DFSImg(this.liveNoticeInfo.coverUrl)
             : "";
-          if(this.liveNoticeInfo.liveBroadcastState > 1 && this.infoTiming) {
-            clearInterval(this.infoTiming);
-          } else {
-            // 调用定时接口
-            this.timingGetInfo();
-          }
           this.getGoodsList();
-          if(this.liveNoticeInfo.liveBroadcastState >=2){
+          if (this.liveNoticeInfo.liveBroadcastState == 2) {
             // 调直播结束
             this.endLived();
+          } else {
+            this.timingGetInfo();
+          }
+          if (this.liveNoticeInfo.liveBroadcastState != 2 && !this.goodTiming) {
+            this.goodTiming = setInterval(() => {
+              this.getGoodsList();
+            }, 5000);
+          } else if (
+            this.liveNoticeInfo.liveBroadcastState == 2 &&
+            this.goodTiming
+          ) {
+            clearInterval(this.goodTiming);
           }
         }
       });
@@ -187,38 +202,45 @@ export default {
           ) {
             // 未开始且接口也未开始不作操作
           } else if (
-            this.liveNoticeInfo.liveBroadcastState == 0 &&
-            resData.liveState == "IN_LIVE"
-          ) {
-            // 未开始且接口直播中
-            this.init();
-          } else if (
             this.liveNoticeInfo.liveBroadcastState == 1 &&
             resData.liveState == "IN_LIVE"
           ) {
             // 直播中且接口直播中---主要操作
             // 数据初始化
             this.entryNoticeText = "";
-            this.liveNoticeInfo.watchNum = resData.watchNum;//观看人数
+            this.liveNoticeInfo.watchNum = resData.watchNum; //观看人数
             if (resData.entryNoticeList.length > 0) {
               if (resData.entryNoticeList.length == 1) {
-                this.entryNoticeText = `${resData.entryNoticeList[0].userName}`;//用户进入
+                this.entryNoticeText = `${resData.entryNoticeList[0].userName}`; //用户进入
               } else {
                 this.entryNoticeText = `${
                   resData.entryNoticeList[0].userName
-                }等${resData.entryNoticeList.length}人`;//用户进入
+                }等${resData.entryNoticeList.length}人`; //用户进入
               }
             }
           } else if (
-            this.liveNoticeInfo.liveBroadcastState == 1 &&
-            resData.liveState == "END_LIVE"
+            this.liveNoticeInfo.liveBroadcastState == 0 &&
+            resData.liveState == "IN_LIVE"
           ) {
-            // 直播中且接口已结束
+            console.log("未开始----直播中")
+            // 未开始且接口直播中/直播中且接口已结束
             this.init();
+          } else if (
+            (this.liveNoticeInfo.liveBroadcastState == 2 &&
+              resData.liveState == "END_LIVE") ||
+            (this.liveNoticeInfo.liveBroadcastState == 1 &&
+              resData.liveState == "END_LIVE")
+          ) {
+            console.log(this.liveNoticeInfo.liveBroadcastState,resData.liveState,this.firstComing,"直播中----结束","结束----结束")
+            //直播结束且接口已结束
+            if (this.firstComing) {
+              this.firstComing = false;
+              this.init();
+            }
           }
-          this.guestBookList=resData.guestBookList;//评论列表
-          this.likeInfo=resData.likeInfo;//点赞信息
-          this.updateVal = Math.random();//监听使用数据
+          this.guestBookList = resData.guestBookList; //评论列表
+          this.likeInfo = resData.likeInfo; //点赞信息
+          this.updateVal = Math.random(); //监听使用数据
         } else {
           if (this.infoTiming) {
             clearInterval(this.infoTiming);
@@ -227,28 +249,36 @@ export default {
       });
     },
     // 获取商品列表
-    getGoodsList(){
-      let id=this.liveId;
-      live.getListByLiveBroadcastId(id).then(res=>{
-        if(res.data.code==200){
-          this.goodsList=[];
-          let arr=[];
-          if(res.data.data.length>0){
-            this.goodsList=res.data.data.forEach((item,index)=>{
-              if(item.productImgUrl){
-                item.productImgUrl=DFSImg(item.productImgUrl);
+    getGoodsList() {
+      let id = this.liveId;
+      live.getListByLiveBroadcastId(id).then(res => {
+        if (res.data.code == 200) {
+          this.goodsList = [];
+          let arr = [];
+          if (res.data.data.length > 0) {
+            this.goodsList = res.data.data.forEach((item, index) => {
+              if (item.productImgUrl) {
+                item.productImgUrl = DFSImg(item.productImgUrl);
+                item.minPrice = Number(item.minPrice);
               }
               arr.push(item);
-            })
-            this.goodsList=arr;
+            });
+            this.goodsList = arr;
             this.updateGoods = Math.random();
           }
         }
-      })
+      });
     },
     // 直播结束数据
-    endLived(){
-
+    endLived() {
+      let query = {
+        id: Number(this.liveId)
+      };
+      live.getLiveStatisticsById(query).then(res => {
+        if (res.data.code == 200) {
+          this.endInfo = res.data.data;
+        }
+      });
     },
     userEntry(type) {
       let query = {
@@ -268,11 +298,11 @@ export default {
         }
       });
     },
-    error(res){
-      console.log(res,'------------------237')
+    error(res) {
+      console.log(res, "------------------237");
     },
-    changes(res){
-      console.log(res,'---------------241')
+    changes(res) {
+      console.log(res, "---------------241");
     }
   }
 };