From 3d0288a713fa35f1e3506c6dd5281c87dc16ef0c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?kaizheng=28=E9=83=91=E5=87=AF=29?= <kaizheng@upchina.com>
Date: Thu, 27 Feb 2025 20:24:09 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../liveDetail/components/guestList.vue       | 189 +++++++++++-------
 src/views/liveBroadcast/liveDetail/index.vue  |  26 +--
 2 files changed, 123 insertions(+), 92 deletions(-)

diff --git a/src/views/liveBroadcast/liveDetail/components/guestList.vue b/src/views/liveBroadcast/liveDetail/components/guestList.vue
index 5ffe3b0..9ef93fe 100644
--- a/src/views/liveBroadcast/liveDetail/components/guestList.vue
+++ b/src/views/liveBroadcast/liveDetail/components/guestList.vue
@@ -1,13 +1,18 @@
 <template>
-  <div class="p20">
-    <el-button type="primary" @click="dialogVisible1 = true" v-if="!tableData.length && liveStatus === 2">嘉宾设置</el-button>
-    <el-table :data="tableData" height="250" border style="width: 100%">
-      <el-table-column prop="" label="讲师名称" width="180"> 
+  <div>
+    <el-button
+      type="primary"
+      @click="dialogVisible1 = true"
+      v-if="!tableData.length && liveStatus === 2"
+      >嘉宾设置</el-button
+    >
+    <el-table :data="tableData" border style="width: 100%">
+      <el-table-column prop="" label="讲师名称" width="180">
         <template slot-scope="scope">
           {{ scope.row.guestInfo.showName }}
         </template>
       </el-table-column>
-      <el-table-column prop="" label="推流状态" width="180"> 
+      <el-table-column prop="" label="推流状态" width="180">
         <template slot-scope="scope">
           {{ streamStatusObj[scope.row.streamStatus] }}
         </template>
@@ -20,21 +25,39 @@
       <el-table-column prop="" label="主画面显示">
         <template slot-scope="scope">
           <el-switch
-            :disabled="[2,4].includes(liveStatus)"
+            :disabled="[2, 4].includes(liveStatus)"
             v-model="scope.row.showMain"
             active-color="#13ce66"
             :active-value="1"
             :inactive-value="2"
-            @change="(showMain)=> changeShowMain({showMain, item:scope.row})">
+            @change="showMain => changeShowMain({ showMain, item: scope.row })"
+          >
           </el-switch>
         </template>
       </el-table-column>
-      <el-table-column prop="" label="操作"> 
+      <el-table-column prop="" label="操作">
         <template slot-scope="scope">
-          <el-button type="text" @click="optFn({type:0, item:scope.row})" v-if="liveStatus === 2">移除</el-button>
-          <div v-else-if="scope.row.streamStatus === 'active' && liveStatus === 1">
-            <el-button type="text" @click="optFn({type:2, item:scope.row})" v-if="scope.row.status !== 2">开始连麦</el-button>
-            <el-button type="text" @click="optFn({type:3, item:scope.row})" v-if="scope.row.status === 2">结束连麦</el-button>
+          <el-button
+            type="text"
+            @click="optFn({ type: 0, item: scope.row })"
+            v-if="liveStatus === 2"
+            >移除</el-button
+          >
+          <div
+            v-else-if="scope.row.streamStatus === 'active' && liveStatus === 1"
+          >
+            <el-button
+              type="text"
+              @click="optFn({ type: 2, item: scope.row })"
+              v-if="scope.row.status !== 2"
+              >开始连麦</el-button
+            >
+            <el-button
+              type="text"
+              @click="optFn({ type: 3, item: scope.row })"
+              v-if="scope.row.status === 2"
+              >结束连麦</el-button
+            >
           </div>
         </template>
       </el-table-column>
@@ -54,21 +77,24 @@
           ></adviser-select>
         </el-form-item>
         <el-form-item label="嘉宾展示区域" prop="templateId">
-          <el-select v-model="form.templateId" placeholder="请选择嘉宾展示区域"  style="width: 100%;">
+          <el-select
+            v-model="form.templateId"
+            placeholder="请选择嘉宾展示区域"
+            style="width: 100%;"
+          >
             <el-option
-              v-for="(value,key) in mixQueryTemplateObj"
+              v-for="(value, key) in mixQueryTemplateObj"
               :key="key"
               :label="value"
-              :value="key">
+              :value="key"
+            >
             </el-option>
           </el-select>
         </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible1 = false">取 消</el-button>
-        <el-button type="primary" @click="saveMixDataFn"
-          >提 交</el-button
-        >
+        <el-button type="primary" @click="saveMixDataFn">提 交</el-button>
       </span>
     </el-dialog>
     <el-dialog
@@ -80,26 +106,29 @@
       <span>{{ tipText }}</span>
       <span slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible2 = false">取 消</el-button>
-        <el-button type="primary" @click="updateStatus"
-          >提 交</el-button
-        >
+        <el-button type="primary" @click="updateStatus">提 交</el-button>
       </span>
     </el-dialog>
   </div>
 </template>
 <script>
 import { mapGetters } from "vuex";
-import {  mixQueryTemplateObj } from "@/utils/options";
-import { getMixData, saveMixData, updateMixShowMain, updateMixStatus } from "@/api/videoLive"
+import { mixQueryTemplateObj } from "@/utils/options";
+import {
+  getMixData,
+  saveMixData,
+  updateMixShowMain,
+  updateMixStatus
+} from "@/api/videoLive";
 import AdviserSelect from "@/views/adviser/components/select";
 export default {
   components: {
     AdviserSelect
   },
   computed: {
-    ...mapGetters(["user"]),
+    ...mapGetters(["user"])
   },
-  props:{
+  props: {
     liveStatus: {
       type: Number
     }
@@ -109,126 +138,132 @@ export default {
       mixQueryTemplateObj,
       dialogVisible1: false,
       form: {
-        guestId: '',
-        templateId: '',
+        guestId: "",
+        templateId: "",
         videoId: this.$route.query.id
       },
       rules: {
         guestId: [{ required: true, message: "请选择嘉宾", trigger: "blur" }],
-        templateId: [{ required: true, message: "请选择嘉宾展示区域", trigger: "blur" }]
+        templateId: [
+          { required: true, message: "请选择嘉宾展示区域", trigger: "blur" }
+        ]
       },
       dialogVisible2: false,
       streamStatusObj: {
-        active: '已推流',
-        inactive: '未推流',
-        forbid: '禁播'
+        active: "已推流",
+        inactive: "未推流",
+        forbid: "禁播"
       },
       statusObj: {
-        1:'未连麦',
-        2:'已连麦',
-        3:'已结束连麦'
+        1: "未连麦",
+        2: "已连麦",
+        3: "已结束连麦"
       },
       tableData: [],
-      tipText: '',
+      tipText: "",
       optStatus: null,
       time: null
     };
   },
   async created() {
-    await this.getDetail()
-    this.timerGetDetail()
+    await this.getDetail();
+    this.timerGetDetail();
   },
   beforeDestroy() {
-    clearInterval(this.time)
+    clearInterval(this.time);
   },
   watch: {
-    liveStatus(){
-      this.timerGetDetail()
+    liveStatus() {
+      this.timerGetDetail();
     },
     dialogVisible1(value) {
-      if(!value) {
+      if (!value) {
         this.form = {
-          guestId: '',
-          templateId: '',
+          guestId: "",
+          templateId: "",
           videoId: this.$route.query.id
-        }
+        };
       }
     }
   },
   methods: {
     timerGetDetail() {
-      if([1,3].includes(this.liveStatus) && this.tableData.length && this.$route.query.id) {
-        clearInterval(this.time)
-        this.time = setInterval(()=>{
-          this.getDetail()
-        }, 5000)
+      if (
+        [1, 3].includes(this.liveStatus) &&
+        this.tableData.length &&
+        this.$route.query.id
+      ) {
+        clearInterval(this.time);
+        this.time = setInterval(() => {
+          this.getDetail();
+        }, 5000);
       }
     },
     async getDetail() {
-      console.log('getDetail')
-      let ret = await getMixData({id: this.$route.query.id})
-      if(ret && ret.code === 0 && ret.data) {
-        this.tableData = [ret.data]
-      } else if(ret && ret.code === 0 && !ret.data){
-        clearInterval(this.time)
-        this.tableData = []
+      console.log("getDetail");
+      let ret = await getMixData({ id: this.$route.query.id });
+      if (ret && ret.code === 0 && ret.data) {
+        this.tableData = [ret.data];
+      } else if (ret && ret.code === 0 && !ret.data) {
+        clearInterval(this.time);
+        this.tableData = [];
       }
     },
-    optFn({type, item}) {
-      this.optStatus = type
-      let name = item.guestInfo.showName
+    optFn({ type, item }) {
+      this.optStatus = type;
+      let name = item.guestInfo.showName;
       const textObj = {
         0: `是否确认将${name}从嘉宾名单中移除?`,
         2: `是否确认开始与嘉宾${name}连麦?`,
         3: `是否确认结束与嘉宾${name}连麦?`
-      }
-      this.tipText = textObj[type]
-      this.dialogVisible2 = true
+      };
+      this.tipText = textObj[type];
+      this.dialogVisible2 = true;
     },
     async updateStatus() {
       let ret = await updateMixStatus({
         status: this.optStatus,
         videoId: this.$route.query.id
-      })
-      if(ret && ret.code === 0) {
+      });
+      if (ret && ret.code === 0) {
         this.$message({
           type: "success",
           message: "操作成功!"
         });
-        this.dialogVisible2 = false
-        this.getDetail()
+        this.dialogVisible2 = false;
+        this.getDetail();
       }
     },
     saveMixDataFn() {
       this.$refs.ruleForm.validate(async valid => {
         if (valid) {
-          let ret =  await saveMixData(this.form)
-          if(ret && ret.code === 0) {
-            this.dialogVisible1 = false
+          let ret = await saveMixData(this.form);
+          if (ret && ret.code === 0) {
+            this.dialogVisible1 = false;
             this.$message({
               type: "success",
               message: "设置成功!"
             });
-            this.getDetail()
+            this.getDetail();
           }
         }
-      })
+      });
     },
-    async changeShowMain({showMain, item}) {
-      let ret =  await updateMixShowMain({
+    async changeShowMain({ showMain, item }) {
+      let ret = await updateMixShowMain({
         showMain,
         videoId: this.$route.query.id
-      })
-      if(ret && ret.code === 0) {
+      });
+      if (ret && ret.code === 0) {
         this.$message({
           type: "success",
           message: "设置成功!"
         });
       } else {
-        item.showMain =  showMain === 1? 2: 1
+        item.showMain = showMain === 1 ? 2 : 1;
       }
     }
-  },
+  }
 };
 </script>
 <style scoped lang="scss">
diff --git a/src/views/liveBroadcast/liveDetail/index.vue b/src/views/liveBroadcast/liveDetail/index.vue
index 7de6c9d..376011f 100644
--- a/src/views/liveBroadcast/liveDetail/index.vue
+++ b/src/views/liveBroadcast/liveDetail/index.vue
@@ -227,7 +227,10 @@
                   </template>
                 </el-table-column>
               </el-table>
-              <p v-if="[1, 2, 4].includes(type)" style="text-align: right;">
+              <p
+                v-if="[1, 2, 4].includes(type)"
+                style="line-height:40px;text-align: right;"
+              >
                 （此处的上下架产品仅控制是否在购物车列表展示）
               </p>
             </div>
@@ -318,7 +321,7 @@
               <el-button
                 v-if="detail.liveStatus !== 4 && detail.playType === 1"
                 type="primary"
-                style="margin-bottom:50px;"
+                style="margin-bottom:10px;"
                 @click="createQuestionnaire"
                 >创建问卷</el-button
               >
@@ -332,8 +335,8 @@
                 :header-cell-style="{ 'text-align': 'center' }"
                 :cell-style="{ 'text-align': 'center' }"
               >
-                <el-table-column type="index" label="序号" width="100" />
-                <el-table-column prop="title" label="问卷名称" width="200">
+                <el-table-column type="index" label="序号" />
+                <el-table-column prop="title" label="问卷名称">
                   <template slot-scope="scope">
                     <span
                       class="button-text"
@@ -343,18 +346,14 @@
                     >
                   </template>
                 </el-table-column>
-                <el-table-column prop="createTime" label="创建时间" width="200">
+                <el-table-column prop="createTime" label="创建时间">
                   <template slot-scope="scope">
                     {{ scope.row.createTime }}
                   </template>
                 </el-table-column>
-                <el-table-column
-                  prop="startTime"
-                  label="发起时间"
-                  width="200"
-                />
-                <el-table-column prop="writeNum" label="填写人数" width="100" />
-                <el-table-column prop="status" label="状态" width="100">
+                <el-table-column prop="startTime" label="发起时间" />
+                <el-table-column prop="writeNum" label="填写人数" />
+                <el-table-column prop="status" label="状态">
                   <template slot-scope="scope">
                     {{ questionnaireStatusList[scope.row.status] }}
                   </template>
@@ -3413,7 +3412,6 @@ export default {
   padding: 5px;
   display: flex;
   flex-direction: column;
-  min-height: 600px;
 }
 .audience-chat-box {
   display: flex;
@@ -3571,7 +3569,6 @@ export default {
 }
 
 .shopping-box {
-  padding-left: 20px;
   .shop-header {
     display: flex;
     justify-content: space-between;
@@ -3594,7 +3591,6 @@ export default {
 }
 
 .questionnaire-box {
-  padding: 20px;
 }
 
 .questionnaire-dialog {