直播详情

1

src/views/liveClassManager/api.js

@@ -44,11 +44,19 @@ export const closeLiveBroadcast = data => {
 export const getLiveBroadcastRoomDetail= data => {
   return request({
     url: '/api-web/imLiveBroadcastRoomMember/queryRoomDetail',
-    method: 'get',
+    method: 'post',
     data,
   })
 }
 
+// 直播间详情 学生列表
+export const getLiveBroadcastRoomDetailList= data => {
+  return request({
+    url: '/api-web/imLiveBroadcastRoomMember/queryRoomMember',
+    method: 'post',
+    data,
+  })
+}
 // 修改直播间
 
 export const resetLiveBroadcastRoomList= data => {

src/views/liveClassManager/index.vue

@@ -116,7 +116,7 @@
                   >
                 </auth>
 
-                <el-button type="text" @click="gotoDetail(scope.row)"
+                <el-button type="text"   v-if="scope.row.liveState == 2" @click="gotoDetail(scope.row)"
                   >直播详情</el-button
                 >
                 <auth auths="imLiveBroadcastRoom/shareGroup">
@@ -249,7 +249,7 @@ export default {
     gotoDetail(row) {
       this.$router.push({
         path: "/business/liveClassDetail",
-        query: { ...row },
+        query: {roomUid:row.roomUid},
       });
     },
     shareLive(row) {

src/views/liveClassManager/liveClassDetail.vue

@@ -10,12 +10,18 @@
           直播数据
         </h2>
         <el-row class="row">
-          <p class="teacherName">主讲人：<span>唐老师</span></p>
-          <p class="teacherName sub">主题:<span>2022大师直播第五期</span></p>
-          <el-button type="text" class="fontBtn">直播回放 <i class="el-icon-video-play"></i></el-button>
+          <p class="teacherName">
+            主讲人：<span>{{ detail.speakerName }}</span>
+          </p>
+          <p class="teacherName sub">
+            主题:<span>{{ detail.roomTitle }}</span>
+          </p>
+          <el-button type="text" class="fontBtn"
+            >直播回放 <i class="el-icon-video-play"></i
+          ></el-button>
         </el-row>
         <p class="liveRemark">
-          直播内容：<span>如何在校管乐团中锻炼孩子的自我管理及团队协作意识</span>
+          直播内容：<span>{{ detail.liveRemark }}</span>
         </p>
       </div>
 
@@ -23,15 +29,15 @@
         <statistic class="statistic" :cols="0">
           <statistic-item>
             <span> 参与学员 </span>
-            <span>1736</span>
+            <span>{{ detail.totalLookNum }}</span>
           </statistic-item>
           <statistic-item>
             <span> 累计点赞 </span>
-            <span>1736</span>
+            <span>{{ detail.totalLikeNum }}</span>
           </statistic-item>
           <statistic-item>
             <span> 直播时长(分钟) </span>
-            <span>60</span>
+            <span>{{ detail.totalLiveTime }}</span>
           </statistic-item>
         </statistic>
       </div>
@@ -105,13 +111,26 @@
 </template>
 <script>
 import pagination from "@/components/Pagination/index";
-import {getLiveBroadcastRoomDetail} from './api'
+import {
+  getLiveBroadcastRoomDetail,
+  getLiveBroadcastRoomDetailList,
+} from "./api";
 export default {
   components: { pagination },
   data() {
     return {
       searchForm: {},
       tableList: [],
+      detail: {
+        list: null,
+        liveRemark: "",
+        roomTitle: "",
+        roomUid: "",
+        speakerName: "",
+        totalLikeNum: 0,
+        totalLiveTime: 0,
+        totalLookNum: 0,
+      },
       rules: {
         // 分页规则
         limit: 10, // 限制显示条数
@@ -122,26 +141,42 @@ export default {
     };
   },
   mounted() {
-    this.getList()
+    this.getDetail();
+    this.getList();
   },
   methods: {
     onCancel() {
-      this.$router.push('/liveClassManager')
-        this.$store.dispatch("delVisitedViews", this.$route);
+      this.$router.push("/liveClassManager");
+      this.$store.dispatch("delVisitedViews", this.$route);
     },
     search() {},
     onReSet() {},
-   async getList() {
-    try{
-      let obj = {rows:this.rules.limit,page:this.rules.page,roomUid:this.$route.query.roomUid,search:this.searchForm.search}
-      console.log(obj)
-      const res = await getLiveBroadcastRoomDetail(obj)
-      this.tableList = res.data.list
-      this.rules.total = res.data.total;
-    }catch(e){
-      console.log(e)
-    }
-   },
+    async getList() {
+      try {
+        let obj = {
+          rows: this.rules.limit,
+          page: this.rules.page,
+          roomUid: this.$route.query.roomUid,
+          search: this.searchForm.search,
+        };
+        const res = await getLiveBroadcastRoomDetailList(obj);
+        this.tableList = res.data.rows;
+        this.rules.total = res.data.total
+      } catch (e) {
+        console.log(e);
+      }
+    },
+    async getDetail() {
+      try {
+        let obj = {
+          roomUid: this.$route.query.roomUid,
+        };
+        console.log(obj);
+        const res = await getLiveBroadcastRoomDetail(obj);
+      } catch (e) {
+        console.log(e);
+      }
+    },
   },
 };
 </script>