1

src/views/channel/detail.vue

@@ -29,17 +29,10 @@
               <span>选集</span>
             </el-col>
             <el-col :span="24" class="two">
-              <van-swipe>
-                <van-swipe-item class="list" v-for="(item, index) in videodata" :key="index" @click="changevideo(index, item)">
+              <van-swipe :initial-swipe="menuIndex">
+                <van-swipe-item class="list" v-for="(item, index) in videodata" :key="index" @click="changevideo(item, index)">
                   <p :style="`color:${menuIndex == index ? menuColor : ''}`">{{ item.title }}</p>
                   <p :style="`color:${menuIndex == index ? menuColor : ''}`">{{ item.start_time }}</p>
-                  <!-- <el-col :span="12" class="listvideo">
-                    <video :src="item.file_path" controlsList="nodownload"></video>
-                  </el-col>
-                  <el-col :span="12" class="listtxt">
-                    <p :class="{ active: changeColor == index }">{{ item.title }}</p>
-                    <p>{{ item.start_time }}</p>
-                  </el-col> -->
                 </van-swipe-item>
               </van-swipe>
             </el-col>
@@ -54,9 +47,9 @@
 import { mapState, createNamespacedHelpers } from 'vuex';
 import NavBar from '@/layout/common/topInfo.vue';
 const { mapActions: channel } = createNamespacedHelpers('channel');
-const { mapActions: markettype } = createNamespacedHelpers('markettype');
 const { mapActions: channelVideo } = createNamespacedHelpers('channelVideo');
-
+var moment = require('moment');
+const _ = require('lodash');
 export default {
   metaInfo() {
     return { title: this.$route.meta.title };
@@ -74,52 +67,65 @@ export default {
       isleftarrow: '',
       // 返回
       navShow: true,
-      // 类型
-      typelist: [],
       activeNames: ['1'],
       form: {},
+      // 视频列表
       videodata: [],
+      // 视频路径
       videoUrl: '',
+      // 选集参数
       menuIndex: '',
       menuColor: 'rgb(64,158,255)',
     };
   },
   async created() {
-    await this.searchtype();
     await this.search();
-    await this.searchvideo();
-    this.changevideo('0', this.videodata[0]);
   },
   methods: {
-    ...markettype({ markettypeList: 'query' }),
     ...channel(['query', 'fetch']),
     ...channelVideo({ videoquery: 'query' }),
     async search() {
-      const res = await this.fetch(this.id);
+      let res = await this.fetch(this.id);
       if (this.$checkRes(res)) {
         this.$set(this, `form`, res.data);
       }
-    },
-    async searchvideo() {
-      const res = await this.videoquery({ user_id: this.id });
+      res = await this.videoquery({ user_id: this.id });
       if (this.$checkRes(res)) {
-        this.$set(this, `videodata`, res.data);
+        this.$set(this, `videodata`, _.orderBy(res.data, ['start_time'], ['asc']));
       }
     },
-    changevideo(index, item) {
-      this.menuIndex = index;
-      this.$set(this, `videoUrl`, item.file_path);
+    changevideo(item, index) {
+      if (item) {
+        console.log(item.file_path);
+        this.menuIndex = index;
+        this.$set(this, `videoUrl`, item.file_path);
+      }
+    },
+    searchvideo() {
+      let data = this.videodata;
+      let adate = moment().format('YYYY-MM-DD HH:mm');
+      // let adate = '2020-11-13 10:16';
+      let arr = data.find(i => i.start_time <= adate && i.end_time >= adate);
+      let index = data.findIndex(i => i.start_time <= adate && i.end_time >= adate);
+      if (arr && index) {
+        this.changevideo(arr, index);
+      } else {
+        this.changevideo(data[0], '0');
+      }
     },
     back() {
       this.$router.push({ path: '/channel/index' });
     },
-    // 查询字典表
-    async searchtype() {
-      // 类型
-      let res = await this.markettypeList({ category: '04' });
-      if (this.$checkRes(res)) {
-        this.$set(this, `typelist`, res.data);
-      }
+  },
+  watch: {
+    videodata: {
+      immediate: true,
+      deep: true,
+      handler(val) {
+        if (val) {
+          this.searchvideo();
+        }
+      },
     },
   },
   computed: {