fix(study): 修复视频播放结束逻辑和定时器清理问题

修复视频播放结束判断条件，增加对播放进度的验证
添加定时器清理逻辑防止内存泄漏

config/dev.env.js

@@ -4,6 +4,6 @@ const prodEnv = require('./prod.env')
 
 module.exports = merge(prodEnv, {
   // BASE_API: '"http://spadmin.jiangtang360.com/api"'
-  BASE_API: '"http://admin.jiangtang360.com/api"',
+  BASE_API: '"https://adminssl.jiangtang360.com/api"',
   // BASE_API: '"http://zywsadmin.jiangtang360.com/api"'
 })

config/index.js

@@ -12,7 +12,7 @@ module.exports = {
     assetsPublicPath: '/',
     proxyTable: {
       '/api': {
-        // target: 'http://admin.jiangtang360.com/admin',
+        // target: 'https://adminssl.jiangtang360.com/admin',
         target: 'http://sz-test.shengzhevictor.com', //设置调用接口域名和端口号别忘了加http///请求的第三方接口
         changeOrigin: true,///在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
         pathRewrite: {

config/prod.env.js

@@ -1,6 +1,6 @@
 'use strict'
 module.exports = {
   // BASE_API: '"http://spadmin.jiangtang360.com/api"'
-  BASE_API: '"http://admin.jiangtang360.com/api"'
+  BASE_API: '"https://adminssl.jiangtang360.com/api"'
   // BASE_API: '"http://zywsadmin.jiangtang360.com/api"'
 }

package.json

@@ -24,6 +24,7 @@
     "exif-js": "^2.3.0",
     "font-awesome": "^4.7.0",
     "mint-ui": "^2.2.13",
+    "qnweb-rtc": "^4.3.1",
     "qrcodejs2": "^0.0.2",
     "regenerator-runtime": "^0.14.1",
     "simple-peer": "^9.11.1",

src/components/Homes.vue

@@ -11,6 +11,15 @@
         <img src="../../static/lead/8.png" class="img8" v-if="step == 8"/>
         <img src="../../static/lead/9.png" class="img9" v-if="step == 9"/>
       </div> -->
+    <div class="cover" v-if="haveLive">
+      <div class="live_box" v-for="live in liveData" @click="goLive(live.room)">
+        <div>{{ live.title }}</div>
+        <br />
+        <div class="stream_info">
+          <p>開始時間：{{ live.start_time }}</p>
+        </div>
+      </div>
+    </div>
     <common-top></common-top>
     <div class="all">
       <div class="top">
@@ -37,7 +46,8 @@
       <div class="kecheng">
         <div class="kecheng_biaoti">
           <p class="kecheng_biaotiL">课程展示</p>
-            <p class="kecheng_biaotiR"  @click="goUrl('/courseAll')">查看全部&emsp;<img class="fr" src="../../static/imgs/header_icon_right.svg" alt=""></p>
+          <p class="kecheng_biaotiR" @click="goUrl('/courseAll')">查看全部&emsp;<img class="fr"
+              src="../../static/imgs/header_icon_right.svg" alt=""></p>
         </div>
 
         <div class="kechenginfo" v-for="(item, index) in course" :key="index">
@@ -46,7 +56,8 @@
             <p class="kechenginfoR_bt">{{ item.name }}</p>
             <p class="kechenginfoR_xbt">{{ item.description }}</p>
             <div class="kechenginfoR_bot">
-                <div class="kechenginfoR_botL"><img src="../../static/img/yanjing.png" alt="" class="yanjing">{{item.page_view}}人</div>
+              <div class="kechenginfoR_botL"><img src="../../static/img/yanjing.png" alt="" class="yanjing">{{
+                item.page_view }}人</div>
               <div class="kechenginfoR_botR" @click="goCourseDetail(item.id)">进入课程</div>
             </div>
           </div>
@@ -70,7 +81,9 @@
     return {
       company: {},
       course: [],
-            step: 0
+      step: 0,
+      haveLive: false,
+      liveData: [],
     }
   },
   created() {
@@ -78,6 +91,7 @@
   mounted() {
 
     this.getPageData();
+    this.getLiveStreams();
   },
   methods: {
     goCourseDetail(id) {
@@ -96,7 +110,23 @@
         data => {
           if (data.code == 1) {
             this.company = data.data.company;
+            //替换图片为https地址
+            this.company.banner = this.company.banner.replace(
+              "http://img",
+              "https://imgs"
+            );
+            this.company.thumbnail = this.company.thumbnail.replace(
+              "http://img",
+              "https://imgs"
+            );
             this.course = data.data.course;
+            //替换图片为https地址
+            for (let index = 0; index < this.course.length; index++) {
+              this.course[index].thumbnail = this.course[index].thumbnail.replace(
+                "http://img",
+                "https://imgs"
+              );
+            }
             var courseName = this.course.map(v => { return v.name })
             //证书需要课程名称，所以用localStorage缓存
             localStorage.setItem("courseName", JSON.stringify(courseName));
@@ -106,6 +136,22 @@
         },
         err => { })
     },
+    getLiveStreams() {
+      this.getData("/Membervideo/getLiveStreams", { token: getStore("token") }).then(
+        (data) => {
+          if (data.code == 1) {
+            if (data.data.length > 0) {
+              this.haveLive = true;
+              this.liveData = data.data;
+            }
+          }
+        },
+        (err) => {}
+      );
+    },
+    goLive(room) {
+      this.$router.push({ path: "/liveview?roomName=" + room });
+    },
     nextLead() {
       if (this.step == 9) {
         this.step = 0
@@ -123,18 +169,21 @@
 .all {
   padding: 5rem 0 6.5rem;
 }
+
 .top {
   width: 30rem;
   margin: auto;
   height: 18rem;
   display: flex;
   align-items: center;
+
   img {
     width: 100%;
     height: 15rem;
     object-fit: cover;
   }
 }
+
 .daohang {
   width: 90%;
   height: 6rem;
@@ -142,26 +191,32 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
+
   .daohang1 {
     width: 25%;
     border-right: 1px solid #CCCCCC;
     font-size: 1.35rem;
+
     &:last-child {
       border: none;
     }
   }
+
   .liuyan1 {
     border-right: none;
   }
+
   .tupian {
     width: 2.5rem;
     height: 2.5rem;
     margin-bottom: 0.5rem;
   }
 }
+
 .kecheng {
   width: 90%;
   margin: auto;
+
   .kecheng_biaoti {
     margin: 1rem 0;
     height: 3rem;
@@ -169,16 +224,19 @@
     justify-content: space-between;
     align-items: center;
   }
+
   .kecheng_biaotiL {
     font-size: 1.56rem;
     font-family: MicrosoftYaHei;
     font-weight: bold;
   }
+
   .kecheng_biaotiR {
     font-size: 1.25rem;
     font-family: MicrosoftYaHei;
     font-weight: 400;
     color: #C5C5C5;
+
     .fr {
       width: 1rem;
       height: 1rem;
@@ -191,6 +249,7 @@
     justify-content: space-between;
     align-items: center;
     border-bottom: 1px solid #CCCCCC;
+
     >img {
       width: 13rem;
       height: 10rem;
@@ -198,12 +257,14 @@
       margin-right: 0.5rem;
     }
   }
+
   .kechenginfoR {
     width: 56%;
     height: 10rem;
     text-align: left;
     position: relative;
   }
+
   .kechenginfoR_bt {
     display: block;
     width: 100%;
@@ -214,6 +275,7 @@
     overflow: hidden;
     text-overflow: ellipsis;
   }
+
   .kechenginfoR_xbt {
     display: block;
     width: 100%;
@@ -224,6 +286,7 @@
     margin: 1rem 0;
     word-wrap: break-word;
   }
+
   .kechenginfoR_bot {
     height: 4rem;
     display: flex;
@@ -233,6 +296,7 @@
     bottom: 0;
     width: 100%;
   }
+
   .kechenginfoR_botL {
     color: #CCCCCC;
     font-size: 1.25rem;
@@ -240,11 +304,13 @@
     justify-content: flex-start;
     align-items: center;
   }
+
   .yanjing {
     width: 1.5rem;
     height: 1.5rem;
     margin-right: 0.5rem;
   }
+
   .kechenginfoR_botR {
     width: 8rem;
     height: 3rem;
@@ -258,4 +324,24 @@
 
 }
 
+.cover {
+  left: 0;
+  top: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.live_box {
+  background-color: white;
+  width: 25rem;
+  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
+  margin: 3rem;
+  padding: 1rem;
+  border-radius: 10px;
+  cursor: pointer;
+  // display: flex;
+  // flex-direction: column;
+}
 </style>

src/components/common/CommonTop.vue

@@ -32,7 +32,7 @@
             data-vidtype="1"
             style="position: relative; z-index: 1; height: 35em; width: 31em"
             scrolling="no"
-            src="http://img.jiangtang360.com/1666599415204.mp4"
+            src="https://imgs.jiangtang360.com/1666599415204.mp4"
             allowfullscreen="1"
             frameborder="0"
           ></iframe>

src/components/signin/QRCode.vue

@@ -30,7 +30,7 @@ export default {
   },
   methods: {
     createQRCode(num) {
-      axios.get("http://admin.jiangtang360.com/api/Card/getTime").then(
+      axios.get("https://adminssl.jiangtang360.com/api/Card/getTime").then(
         (res) => {
           if (num === 1) {
             var redirect_uri = encodeURIComponent(this.redirect_uri)+res.data;

src/components/signin/SignIn.vue

@@ -77,7 +77,7 @@ export default {
       var params = new URLSearchParams(query);
       //扫描二维码传入的时间
       var paramValue = params.get("nowTime");
-      axios.get("http://admin.jiangtang360.com/api/Card/getTime").then(
+      axios.get("https://adminssl.jiangtang360.com/api/Card/getTime").then(
         (res) => {
           if (
             Number(paramValue) + 1000 * 60 * 5 > res.data &&
@@ -99,7 +99,7 @@ export default {
     getOpenid(code) {
       let formData = new FormData();
       formData.append("code", code);
-      axios.post("http://admin.jiangtang360.com/api/Signin/getOpenId", formData).then(
+      axios.post("https://adminssl.jiangtang360.com/api/Signin/getOpenId", formData).then(
         (res) => {
           if (res.data.code == 200) {
             this.openid = res.data.data;
@@ -120,7 +120,7 @@ export default {
       let formData = new FormData();
       formData.append("openid", openid);
       axios
-        .post("http://admin.jiangtang360.com/api/Signin/isTodaySignedIn", formData)
+        .post("https://adminssl.jiangtang360.com/api/Signin/isTodaySignedIn", formData)
         .then(
           (res) => {
             if (res.status == 200) {
@@ -141,7 +141,7 @@ export default {
       formData.append("openid", this.openid);
       axios
         .post(
-          "http://admin.jiangtang360.com/api/Signin/getLastSubmissionByOpenid",
+          "https://adminssl.jiangtang360.com/api/Signin/getLastSubmissionByOpenid",
           formData
         )
         .then(
@@ -169,7 +169,7 @@ export default {
             formData.append("openid", this.openid);
             axios
               .post(
-                "http://admin.jiangtang360.com/api/Signin/saveUserCheckinInfo",
+                "https://adminssl.jiangtang360.com/api/Signin/saveUserCheckinInfo",
                 formData
               )
               .then(

src/components/study/course.vue

@@ -2,12 +2,7 @@
   <div class="all">
     <back title="已学课程"></back>
     <div class="kecheng">
-      <div
+      <div class="kechenginfo" @click="goCourseDetail(item.id)" v-for="(item, index) in course" :key="index">
-        class="kechenginfo"
-        @click="goCourseDetail(item.id)"
-        v-for="(item, index) in course"
-        :key="index"
-      >
         <img :src="item.thumbnail" alt="" />
         <div class="kechenginfoR">
           <p class="kechenginfoR_bt">{{ item.name }}</p>
@@ -54,6 +49,12 @@ export default {
         (data) => {
           if (data.code == 1) {
             this.course = data.data;
+            for (let index = 0; index < this.course.length; index++) {
+              this.course[index].thumbnail = this.course[index].thumbnail.replace(
+                "http://img",
+                "https://imgs"
+              );
+            }
           } else {
             Toast(data.msg);
           }
@@ -70,45 +71,53 @@ export default {
   padding: 5.5rem 0;
   width: 90%;
   margin: auto;
+
   .kecheng_biaoti {
     height: 3rem;
     display: flex;
     justify-content: space-between;
     align-items: center;
   }
+
   .kecheng_biaotiL {
     font-size: 1.56rem;
     font-family: MicrosoftYaHei;
     font-weight: bold;
   }
+
   .kecheng_biaotiR {
     font-size: 1.25rem;
     font-family: MicrosoftYaHei;
     font-weight: 400;
     color: #c5c5c5;
+
     .fr {
       width: 1rem;
       height: 1rem;
     }
   }
+
   .kechenginfo {
     padding: 2rem 0;
     display: flex;
     justify-content: space-between;
     align-items: center;
     border-bottom: 1px solid #cccccc;
+
     >img {
       width: 11rem;
       height: 15rem;
       object-fit: cover;
     }
   }
+
   .kechenginfoR {
     width: 56%;
     height: 15rem;
     text-align: left;
     position: relative;
   }
+
   .kechenginfoR_bt {
     display: block;
     width: 100%;
@@ -119,6 +128,7 @@ export default {
     overflow: hidden;
     text-overflow: ellipsis;
   }
+
   .kechenginfoR_xbt {
     display: block;
     width: 100%;
@@ -131,10 +141,12 @@ export default {
     text-overflow: ellipsis;
     height: 7rem;
   }
+
   .kechenginfoR_end {
     font-size: 1rem;
     color: #0083ff;
   }
+
   .kechenginfoR_bot {
     height: 4rem;
     display: flex;
@@ -144,6 +156,7 @@ export default {
     bottom: 0;
     width: 100%;
   }
+
   .kechenginfoR_botL {
     color: #cccccc;
     font-size: 1.25rem;
@@ -151,11 +164,13 @@ export default {
     justify-content: flex-start;
     align-items: center;
   }
+
   .yanjing {
     width: 1.5rem;
     height: 1.5rem;
     margin-right: 0.5rem;
   }
+
   .kechenginfoR_botR {
     width: 8rem;
     height: 3rem;

src/components/study/courseAll.vue

@@ -9,7 +9,8 @@
           <p class="kechenginfoR_bt">{{ item.name }}</p>
           <p class="kechenginfoR_xbt">{{ item.description }}</p>
           <div class="kechenginfoR_bot">
-              <div class="kechenginfoR_botL"><img src="../../../static/img/yanjing.png" alt="" class="yanjing">{{item.page_view}}人</div>
+            <div class="kechenginfoR_botL"><img src="../../../static/img/yanjing.png" alt=""
+                class="yanjing">{{ item.page_view }}人</div>
             <div class="kechenginfoR_botR">进入课程</div>
           </div>
         </div>
@@ -47,6 +48,9 @@
         data => {
           if (data.code == 1) {
             this.course = data.data;
+            for (let index = 0; index < this.course.length; index++) {
+              this.course[index].thumbnail = this.course[index].thumbnail.replace('http://img', 'https://imgs');
+            }
           } else {
             Toast(data.msg);
           }
@@ -62,33 +66,39 @@
   padding: 5.5rem 0;
   width: 90%;
   margin: auto;
+
   .kecheng_biaoti {
     height: 3rem;
     display: flex;
     justify-content: space-between;
     align-items: center;
   }
+
   .kecheng_biaotiL {
     font-size: 1.56rem;
     font-family: MicrosoftYaHei;
     font-weight: bold;
   }
+
   .kecheng_biaotiR {
     font-size: 1.25rem;
     font-family: MicrosoftYaHei;
     font-weight: 400;
     color: #C5C5C5;
+
     .fr {
       width: 1rem;
       height: 1rem;
     }
   }
+
   .kechenginfo {
     padding: 2rem 0;
     display: flex;
     justify-content: space-between;
     align-items: center;
     border-bottom: 1px solid #CCCCCC;
+
     >img {
       width: 13rem;
       height: 10rem;
@@ -96,12 +106,14 @@
       margin-right: 0.5rem;
     }
   }
+
   .kechenginfoR {
     width: 56%;
     height: 10rem;
     text-align: left;
     position: relative;
   }
+
   .kechenginfoR_bt {
     display: block;
     width: 100%;
@@ -112,6 +124,7 @@
     overflow: hidden;
     text-overflow: ellipsis;
   }
+
   .kechenginfoR_xbt {
     display: block;
     width: 100%;
@@ -122,6 +135,7 @@
     margin: 1rem 0;
     word-wrap: break-word;
   }
+
   .kechenginfoR_bot {
     height: 4rem;
     display: flex;
@@ -131,6 +145,7 @@
     bottom: 0;
     width: 100%;
   }
+
   .kechenginfoR_botL {
     color: #CCCCCC;
     font-size: 1.25rem;
@@ -138,11 +153,13 @@
     justify-content: flex-start;
     align-items: center;
   }
+
   .yanjing {
     width: 1.5rem;
     height: 1.5rem;
     margin-right: 0.5rem;
   }
+
   .kechenginfoR_botR {
     width: 8rem;
     height: 3rem;
@@ -154,5 +171,4 @@
     font-size: 1.25rem;
   }
 }
-
 </style>

src/components/study/courseDetail.vue

@@ -272,7 +272,21 @@ export default {
         (data) => {
           if (data.code == 1) {
             this.courseData = data.data;
+            this.courseData.thumbnail = this.courseData.thumbnail.replace(
+              "http://img",
+              "https://imgs"
+            );
             this.section = data.data.section;
+            for (let index = 0; index < this.section.length; index++) {
+              this.section[index].thumbnail = this.section[index].thumbnail.replace(
+                "http://img",
+                "https://imgs"
+              );
+              this.section[index].video_url = this.section[index].video_url.replace(
+                "http://img",
+                "https://imgs"
+              );
+            }
             this.changeSection(data.data.recent_section);
           } else {
             Toast(data.msg);

src/components/user/photoPreview.vue

@@ -23,7 +23,7 @@ export default {
 
   mounted() {
     this.cardphotopath =
-      "http://admin.jiangtang360.com/static/admin/cards/" +
+      "https://adminssl.jiangtang360.com/static/admin/cards/" +
       this.$refs.getValue.value +
       ".jpg" +
       "?ran=" +

src/components/user/uploadphoto.vue

@@ -151,7 +151,7 @@ export default {
               axios
                 .post(
                   // "/uploadcardimage",formData
-                  "http://admin.jiangtang360.com/api/card/uploadcardimage",
+                  "https://adminssl.jiangtang360.com/api/card/uploadcardimage",
                   formData,
                   config
                   // Qs.stringify(formData)
@@ -188,13 +188,13 @@ export default {
 
   mounted() {
     this.photopath =
-      "http://admin.jiangtang360.com/static/admin/cards/" +
+      "https://adminssl.jiangtang360.com/static/admin/cards/" +
       this.$refs.getValue.value +
       ".jpg" +
       "?ran=" +
       Math.random();
     this.ImgObj.src =
-      "http://admin.jiangtang360.com/static/admin/cards/" +
+      "https://adminssl.jiangtang360.com/static/admin/cards/" +
       this.$refs.getValue.value +
       ".jpg" +
       "?ran=" +

src/router/index.js

@@ -121,6 +121,11 @@ export default new Router({
       name:'wxerror',
       component: resolve => require(['../components/login/wxError.vue'], resolve)
     },
+    {
+      path:'/liveview',
+      name:'liveview',
+      component: resolve => require(['../components/study/liveView.vue'], resolve)
+    },
     // 用户
     {
       path:'/user',

src/vuex/store.js

@@ -13,6 +13,7 @@ const state={
 const mutations={
     addInfo(state,loginInfo){
       state.loginInfo = loginInfo;
+      state.loginInfo.header = state.loginInfo.header.replace('http://img','https://imgs');
     }
 
 }