1

src/views/live/parts/videoDetail2.vue

@@ -22,10 +22,35 @@
         <el-col :span="24" class="jbxm">
           <van-tabs v-model="jbxmactive" type="card" animated>
             <van-tab title="嘉宾访谈">
-              嘉宾访谈
+              <el-col :span="24" class="jiabinlist">
+                <el-col :span="24" class="jiabin" v-for="(item, index) in zxzdlist" :key="index">
+                  <el-col :span="5" class="img4">
+                    <img :src="item.picture" style="width: 100%; height: 100%" />
+                  </el-col>
+                  <el-col :span="19" class="info">
+                    <el-col :span="16" class="title">
+                      {{ item.title }}
+                    </el-col>
+                    <el-col :span="8" class="time">
+                      {{ item.publish_time }}
+                    </el-col>
+                    <el-col :span="24" class="con">{{ item.titlejj }}</el-col>
+                  </el-col>
+                </el-col>
+              </el-col>
             </van-tab>
             <van-tab title="项目路演">
-              项目路演
+              <el-col :span="24" class="xmly">
+                <el-col :span="24" class="xmlylist" v-for="(item, index) in xmlyList" :key="index">
+                  <el-col :span="17" class="name textOver">
+                    {{ item.title }}
+                  </el-col>
+                  <el-col :span="7" class="date">{{ item.publish_time }} </el-col>
+                  <el-col :span="24" class="jianjie">
+                    {{ item.titlejj }}
+                  </el-col>
+                </el-col>
+              </el-col>
             </van-tab>
           </van-tabs>
         </el-col>
@@ -51,6 +76,8 @@
 <script>
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: dock } = createNamespacedHelpers('dock');
+const { mapActions: newsguidance } = createNamespacedHelpers('newsguidance');
+const { mapActions: newsroadshow } = createNamespacedHelpers('newsroadshow');
 export default {
   name: 'videoDetail2',
   props: {},
@@ -67,6 +94,10 @@ export default {
       dockinfo: [],
       // 嘉宾，项目
       jbxmactive: 0,
+      // 嘉宾访谈
+      zxzdlist: [],
+      // 项目路演
+      xmlyList: [],
     };
   },
   async created() {
@@ -77,11 +108,19 @@ export default {
   },
   methods: {
     ...dock({ dockQuery: 'query', dockFetch: 'fetch' }),
+    ...newsguidance({ danceQuery: 'query' }),
+    ...newsroadshow({ newsroadshowquery: 'query' }),
     // 查询
     async search() {
       //展会详情
       let res = await this.dockFetch(this.dock_id);
       if (this.$checkRes(res)) this.$set(this, `dockinfo`, res.data);
+      //嘉宾访谈
+      let jbftData = await this.danceQuery({ dock_id: this.id, role: 6, limit: 6 });
+      if (this.$checkRes(jbftData)) this.$set(this, `zxzdlist`, jbftData.data);
+      // 项目路演
+      let xmly = await this.newsroadshowquery({ dock_id: this.id });
+      if (this.$checkRes(xmly)) this.$set(this, `xmlyList`, xmly.data);
     },
     //倒计时查询展会视频详情
     counttime() {
@@ -175,6 +214,74 @@ export default {
   .jbxm {
     height: 500px;
     overflow: hidden;
+    margin-bottom: 20px;
+    .jiabinlist {
+      height: 450px;
+      margin-top: 10px;
+      padding: 0px 16px;
+      overflow-y: auto;
+      .jiabin {
+        height: 70px;
+        margin-bottom: 6px;
+        .img4 {
+          height: 70px;
+        }
+        .info {
+          padding-left: 10px;
+          .title {
+            font-size: 18px;
+            font-weight: bolder;
+            text-overflow: ellipsis;
+            font-size: 18px;
+            font-weight: bolder;
+          }
+          .time {
+            text-align: right;
+          }
+          .con {
+            font-size: 16px;
+            color: #666;
+            margin-top: 3px;
+            display: -webkit-box;
+            -webkit-box-orient: vertical;
+            -webkit-line-clamp: 2;
+            overflow: hidden;
+          }
+        }
+      }
+      .jiabin:last-child {
+        margin-bottom: 0px;
+      }
+    }
+    .xmly {
+      height: 450px;
+      margin-top: 10px;
+      padding: 0px 16px;
+      overflow-y: auto;
+      .xmlylist {
+        border-bottom: 1px dashed #ccc;
+        height: 70px;
+        margin-bottom: 5px;
+        .name {
+          font-size: 18px;
+          font-weight: bold;
+        }
+        .date {
+          font-size: 16px;
+          text-align: right;
+        }
+        .jianjie {
+          height: 45px;
+          font-size: 16px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          -webkit-line-clamp: 2;
+          word-break: break-all;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+        }
+      }
+    }
   }
   // 主办方
   .company {