From f866cbfe0d8792b5af7d615f76039dff6867b447 Mon Sep 17 00:00:00 2001
From: wuyx <wuyx@dongwu-inc.com>
Date: Wed, 30 Nov 2022 21:34:45 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E4=BF=AE=E6=94=B9=E7=9B=B4=E6=92=AD?=
 =?UTF-8?q?=E6=90=9C=E7=B4=A2=E9=80=89=E6=8B=A9=E6=8E=88=E8=AF=BE=E8=80=81?=
 =?UTF-8?q?=E5=B8=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/drawers/AddLive.vue | 418 ++++++++++++-----------------
 1 file changed, 177 insertions(+), 241 deletions(-)

diff --git a/src/components/drawers/AddLive.vue b/src/components/drawers/AddLive.vue
index ae22dd14..a9489ad4 100644
--- a/src/components/drawers/AddLive.vue
+++ b/src/components/drawers/AddLive.vue
@@ -1,41 +1,25 @@
 <!-- 直播抽屉 -->
 <template>
-  <a-drawer
-    :visible="addliveVisible"
-    class="drawerStyle addliveDrawer"
-    width="80%"
-    title="添加直播"
-    placement="right"
-    @after-visible-change="afterVisibleChange"
-  >
+  <a-drawer :visible="addliveVisible" class="drawerStyle addliveDrawer" width="80%" title="添加直播" placement="right"
+    @after-visible-change="afterVisibleChange">
     <div class="drawerMain">
       <div class="header">
         <div class="headerTitle">{{ edit ? "编辑" : "添加" }}直播</div>
-        <img
-          style="width: 29px; height: 29px; cursor: pointer"
-          src="../../assets/images/basicinfo/close.png"
-          @click="closeDrawer"
-        />
+        <img style="width: 29px; height: 29px; cursor: pointer" src="../../assets/images/basicinfo/close.png"
+          @click="closeDrawer" />
       </div>
       <div class="contentMain">
         <div class="main_left">
           <div class="main_item">
             <div class="signbox">
               <div class="sign">
-                <img
-                  src="@/assets/images/coursewareManage/asterisk.png"
-                  alt=""
-                />
+                <img src="@/assets/images/coursewareManage/asterisk.png" alt="" />
               </div>
               <span style="margin-right: 3px">直播名称：</span>
             </div>
             <div class="btnbox">
-              <a-input
-                v-model:value="inputV1"
-                style="width: 400px; height: 32px"
-                placeholder="请输入考试名称"
-                maxlength="20"
-              />
+              <a-input v-model:value="inputV1" style="width: 400px; height: 32px" placeholder="请输入考试名称"
+                maxlength="20" />
             </div>
           </div>
           <div class="main_item2">
@@ -43,55 +27,34 @@
               <span style="margin-right: 3px">直播说明：</span>
             </div>
             <div class="textarea">
-              <a-textarea
-                v-model:value="textV1"
-                placeholder="请输入考试说明"
-                allow-clear
-                maxlength="364px"
-              />
+              <a-textarea v-model:value="textV1" placeholder="请输入考试说明" allow-clear maxlength="364px" />
             </div>
           </div>
           <div class="main_item">
             <div class="signbox">
               <div class="sign">
-                <img
-                  src="@/assets/images/coursewareManage/asterisk.png"
-                  alt=""
-                />
+                <img src="@/assets/images/coursewareManage/asterisk.png" alt="" />
               </div>
               <span style="margin-right: 3px">直播时间：</span>
             </div>
             <div class="btnbox">
-              <a-range-picker
-                style="width: 424px"
-                v-model:value="time"
-                :placeholder="['      开始时间', '        结束时间']"
-              />
+              <a-range-picker style="width: 424px" v-model:value="time" :placeholder="['      开始时间', '        结束时间']" />
             </div>
           </div>
           <div class="main_item">
             <div class="signbox">
               <div class="sign">
-                <img
-                  src="@/assets/images/coursewareManage/asterisk.png"
-                  alt=""
-                />
+                <img src="@/assets/images/coursewareManage/asterisk.png" alt="" />
               </div>
               <span style="margin-right: 3px">直播时长：</span>
             </div>
             <div class="btnbox">
-              <a-input-number
-                :min="0"
-                :max="300"
-                :precision="0"
-                style="
+              <a-input-number :min="0" :max="300" :precision="0" style="
                   width: 364px;
                   height: 32px;
                   border-radius: 8px;
                   overflow: hidden;
-                "
-                v-model:value="inputV2"
-              ></a-input-number>
+                " v-model:value="inputV2"></a-input-number>
 
               <span style="margin-left: 5px">分钟</span>
             </div>
@@ -99,76 +62,46 @@
           <div class="main_item">
             <div class="signbox">
               <div class="sign">
-                <img
-                  src="@/assets/images/coursewareManage/asterisk.png"
-                  alt=""
-                />
+                <img src="@/assets/images/coursewareManage/asterisk.png" alt="" />
               </div>
               <span style="margin-right: 3px">授课老师：</span>
             </div>
             <div class="btnbox">
-              <a-auto-complete
-                v-model:value="memberValue.label"
-                show-search
-                :not-found-content="fetching ? undefined : null"
-                placeholder="Select a teacher"
-                style="width: 364px"
-                :options="options"
-                @focus="handleFocus"
-                @change="handleChange2"
-                @popupScroll="templateScroll"
-                @search="handleSearch"
-              ></a-auto-complete>
+              <a-auto-complete v-model:value="memberValue.label" placeholder="请选择老师" style="width: 364px"
+                :options="options" @search="handleSearch"></a-auto-complete>
             </div>
           </div>
           <div class="mbl_items2">
-                  <div class="item_nam">
-                    <div class="asterisk_icon">
-                      <img
-                        src="@/assets/images/coursewareManage/asterisk.png"
-                        alt=""
-                      />
-                    </div>
-                    <span style="margin-right: 14px">直播封面</span>
+            <div class="item_nam">
+              <div class="asterisk_icon">
+                <img src="@/assets/images/coursewareManage/asterisk.png" alt="" />
+              </div>
+              <span style="margin-right: 14px">直播封面</span>
+            </div>
+            <div class="item_inp">
+
+              <a-upload name="avatar" list-type="picture-card" class="avatar-uploader" :show-upload-list="false"
+                :before-upload="beforeUpload">
+                <img class="i_upload_img" v-if="imageUrl" :src="imageUrl" alt="avatar" />
+                <div class="i_upload" v-else>
+                  <div class="addimg">
+                    <div class="heng"></div>
+                    <div class="shu"></div>
                   </div>
-                  <div class="item_inp">
-              
-                    <a-upload
-                      name="avatar"
-                      list-type="picture-card"
-                      class="avatar-uploader"
-                      :show-upload-list="false"
-                      :before-upload="beforeUpload"
-                    >
-                      <img
-                        class="i_upload_img"
-                        v-if="imageUrl"
-                        :src="imageUrl"
-                        alt="avatar"
-                      />
-                      <div class="i_upload" v-else>
-                        <div class="addimg">
-                          <div class="heng"></div>
-                          <div class="shu"></div>
-                        </div>
-                      </div>
-                    </a-upload>
-                    <div class="i_bottom">
-                      <div class="tip">支持图片格式为jpg/jpeg/png 图片最大为2MB</div>
-                    </div>
-                  </div>
-           </div>
+                </div>
+              </a-upload>
+              <div class="i_bottom">
+                <div class="tip">支持图片格式为jpg/jpeg/png 图片最大为2MB</div>
+              </div>
+            </div>
+          </div>
 
           <div class="main_item" style="margin-top: -10px">
             <div class="signbox">
               <span style="margin-right: 3px">直播链接：</span>
             </div>
             <div class="btnbox">
-              <a-input
-                v-model:value="inputV4"
-                style="width: 424px; height: 32px"
-                placeholder="请输入直播链接"
-              />
+              <a-input v-model:value="inputV4" style="width: 424px; height: 32px" placeholder="请输入直播链接" />
             </div>
           </div>
           <div class="main_item">
@@ -179,17 +112,13 @@
               <a-switch v-model:checked="switchC1" @click="PlayBack" />
             </div>
           </div>
-          <div v-if ="switchC1">
+          <div v-if="switchC1">
             <div class="main_item">
               <div class="signbox">
                 <span style="margin-right: 3px">回放链接：</span>
               </div>
               <div class="btnbox">
-                <a-input
-                  v-model:value="inputV5"
-                  style="width: 424px; height: 32px"
-                  placeholder="请输入回放链接"
-                />
+                <a-input v-model:value="inputV5" style="width: 424px; height: 32px" placeholder="请输入回放链接" />
               </div>
             </div>
           </div>
@@ -199,92 +128,73 @@
               <span style="margin-right: 3px">评估：</span>
             </div>
             <div class="btnbox2">
-              <a-checkbox v-model:checked="needEval"  @click="needEval=!needEval"
-                >需要评估</a-checkbox >
+              <a-checkbox v-model:checked="needEval" @click="needEval = !needEval">需要评估</a-checkbox>
             </div>
           </div>
           <div v-if="needEval" class="main_item">
-            <div class="signbox">  
+            <div class="signbox">
             </div>
             <div class="btnbox">
               <button class="xkbtn" @click="showAssessment">选择评估</button>
-              <div v-if = "assessmentId >0 ">
-              <a-tag  closable   color="processing" @close="logA">
-            <span style="font-size:14px;line-height: 33px;" >删除评估</span>
-            </a-tag></div>
-            <AssessmentList
-                      v-model:assessmentVisible="assessmentVisible"
-                      v-model:titleTag="titleTag"
-                      v-model:assessmentId="assessmentId"
-                    />
+              <div v-if="assessmentId > 0">
+                <a-tag closable color="processing" @close="logA">
+                  <span style="font-size:14px;line-height: 33px;">删除评估</span>
+                </a-tag>
+              </div>
+              <AssessmentList v-model:assessmentVisible="assessmentVisible" v-model:titleTag="titleTag"
+                v-model:assessmentId="assessmentId" />
 
             </div>
           </div>
 
-        
+
           <div class="main_item2">
             <div class="signbox">
               <span style="margin-right: 3px">考勤设置：</span>
             </div>
             <div class="kqszbox">
               <div class="qdqtbox">
-                <div class="qdbtn"><div class="btntext">签到</div></div>
+                <div class="qdbtn">
+                  <div class="btntext">签到</div>
+                </div>
               </div>
               <div class="setbox">
                 <div class="timerbox">
                   <span>开始前：</span>
-                  <a-input-number
-                    :min="0"
-                    :max="30"
-                    :precision="0"
-                    style="
+                  <a-input-number :min="0" :max="30" :precision="0" style="
                       width: 88px;
                       height: 32px;
                       border-radius: 8px;
                       overflow: hidden;
-                    "
-                    v-model:value="inputV6"
-                  ></a-input-number>
+                    " v-model:value="inputV6"></a-input-number>
                   <span style="color: #999999; margin-left: 8px">分钟</span>
                 </div>
                 <div class="timerbox">
                   <span>开始后：</span>
-                  <a-input-number
-                    :min="0"
-                    :max="30"
-                    :precision="0"
-                    style="
+                  <a-input-number :min="0" :max="30" :precision="0" style="
                       width: 88px;
                       height: 32px;
                       border-radius: 8px;
                       overflow: hidden;
-                    "
-                    v-model:value="inputV7"
-                  ></a-input-number>
+                    " v-model:value="inputV7"></a-input-number>
                   <span style="color: #999999; margin-left: 8px">分钟</span>
                 </div>
               </div>
               <div class="qdqtbox">
-                <div class="qtbtn"><div class="btntext">签退</div></div>
+                <div class="qtbtn">
+                  <div class="btntext">签退</div>
+                </div>
               </div>
               <div class="setbox">
                 <div class="timerbox">
                   <span>结束前：</span>
-                  <a-input-number
-                    :min="0"
-                    :max="30"
-                    :precision="0"
-                    style="
+                  <a-input-number :min="0" :max="30" :precision="0" style="
                       width: 88px;
                       height: 32px;
                       border-radius: 8px;
                       overflow: hidden;
-                    "
-                    v-model:value="inputV8"
-                  ></a-input-number>
-                  <span style="color: #999999; margin-left: 8px"
-                    >分钟（提前签退则记为早退）</span
-                  >
+                    " v-model:value="inputV8"></a-input-number>
+                  <span style="color: #999999; margin-left: 8px">分钟（提前签退则记为早退）</span>
                 </div>
               </div>
             </div>
@@ -296,9 +206,7 @@
             <div class="btnbox">
               <a-radio-group v-model:value="radioV1">
                 <a-radio :value="1" @click="cloradio1">仅签到</a-radio>
-                <a-radio :value="2" @click="cloradio1"
-                  >签到、签退全部完成</a-radio
-                >
+                <a-radio :value="2" @click="cloradio1">签到、签退全部完成</a-radio>
               </a-radio-group>
             </div>
           </div>
@@ -307,11 +215,7 @@
               <span style="margin-right: 3px">其他设置：</span>
             </div>
             <div class="btnbox">
-              <a-checkbox
-                v-model:checked="checkedC2"
-                @onclick="checkedC2 = !checkedC2"
-                >学员请假后记为任务完成</a-checkbox
-              >
+              <a-checkbox v-model:checked="checkedC2" @onclick="checkedC2 = !checkedC2">学员请假后记为任务完成</a-checkbox>
             </div>
           </div>
         </div>
@@ -346,7 +250,7 @@ function getBase64(img, callback) {
 
 export default {
   name: "AddLive",
-  components:{
+  components: {
     AssessmentList
   },
   props: {
@@ -394,7 +298,7 @@ export default {
       type: Number,
       default: null,
     },
-    projectTemplateId:{
+    projectTemplateId: {
       type: Number,
       default: null,
     },
@@ -409,8 +313,8 @@ export default {
       fetching: false,
       totalPages: 0,
       memberValue: {
-        value:"",
-        label:""
+        value: "",
+        label: ""
       }, // 授课老师关键词
       inputV1: "", //*直播名称
       time: "", //*直播时间
@@ -434,9 +338,9 @@ export default {
       obj: {}, //要传的obj数据
       assessment: [], //评估信息
       assessmentvalue: null,
-      needEval:false,
-      otherSettings:false,
-      assessmentVisible:false,
+      needEval: false,
+      otherSettings: false,
+      assessmentVisible: false,
     });
     const closeDrawer = () => {
       ctx.emit("update:addliveVisible", false);
@@ -455,14 +359,14 @@ export default {
       state.textV1 = "";
       state.switchC1 = "";
       state.imageUrl = "";
-      state.needEval=false;
+      state.needEval = false;
       state.otherSettings;
       ctx.emit("changeData", false);
       localStorage.setItem("stageId", props.chooseStageId);
       localStorage.setItem("chapterId", props.isactive);
     };
     const afterVisibleChange = (bool) => {
-      if (props.edit&&bool) {
+      if (props.edit && bool) {
         queryLive();
       }
       api
@@ -579,12 +483,12 @@ export default {
             //message.error(`${props.edit ? "编辑" : "新增"}阶段任务失败`);
           });
       } else if (props.isLevel == 3) {
-        console.log("props.projectTemplateId",props.projectTemplateId);
+        console.log("props.projectTemplateId", props.projectTemplateId);
         addTempTask({
           courseId: res.data.data.liveId,
           duration: res.data.data.duration,
           name: res.data.data.liveName,
-          projectTemplateId:props.projectTemplateId,
+          projectTemplateId: props.projectTemplateId,
           projectTaskId: props.projectTaskId || 0,
           stageId: props.chooseStageId || 0,
           type: 6,
@@ -599,9 +503,9 @@ export default {
       }
     };
     const showAssessment = () => {
-      
+
       state.assessmentVisible = true;
-      console.log("hshs======",state.assessmentVisible);
+      console.log("hshs======", state.assessmentVisible);
     };
     //创建直播
     const updateLiveBroadcast = () => {
@@ -651,7 +555,7 @@ export default {
         otherSettings: state.otherSettings, //1或0
         signOutTime: state.inputV8,
         standardSettings: state.radioV1, //1或2
-        isEvaluate:state.eedEval ? "1":"0",
+        isEvaluate: state.eedEval ? "1" : "0",
       };
       if (props.edit) {
         api
@@ -662,7 +566,7 @@ export default {
             updateTask(res);
             closeDrawer();
           })
-          .catch(() => {});
+          .catch(() => { });
       } else {
         api
           .createLiveBroadcast(state.obj)
@@ -672,7 +576,7 @@ export default {
             updateTask(res);
             closeDrawer();
           })
-          .catch(() => {});
+          .catch(() => { });
       }
     };
     const beforeUpload = (file) => {
@@ -697,14 +601,14 @@ export default {
           image.src = reader.result;
           image.onload = () => {
             const formData = new FormData();
-              formData.append("file", file);
-              console.log(file);
-              fileUp(formData).then((res) => {
-                if (res.data.code === 200) {
-                  state.imageUrl = res.data.data;
-                }
-              });
-              return resolve(true);
+            formData.append("file", file);
+            console.log(file);
+            fileUp(formData).then((res) => {
+              if (res.data.code === 200) {
+                state.imageUrl = res.data.data;
+              }
+            });
+            return resolve(true);
           };
         };
 
@@ -760,7 +664,7 @@ export default {
       options.value = [];
       state.fetching = true;
       state.currentPage = 1;
-      state.memberValue = memberValue;
+      state.memberValue.label = memberValue;
       queryMember();
       state.fetching = false;
     }, 300);
@@ -779,7 +683,7 @@ export default {
         state.discussSettings = "false";
       }
     };
-  
+
     return {
       ...toRefs(state),
       afterVisibleChange,
@@ -804,6 +708,7 @@ export default {
 .ant-table-striped :deep(.table-striped) td {
   background-color: #fafafa !important;
 }
+
 .addliveDrawer {
   .drawerMain {
     .header {
@@ -813,6 +718,7 @@ export default {
       justify-content: space-between;
       align-items: center;
       flex-shrink: 0;
+
       .headerTitle {
         font-size: 18px;
         font-weight: 600;
@@ -821,32 +727,39 @@ export default {
         margin-left: 24px;
       }
     }
+
     .contentMain {
       display: flex;
       justify-content: space-between;
+
       .main_left {
         padding-right: 30px;
         flex: 1;
         border-right: 1px solid #e8e8e8;
         margin-top: 32px;
+
         .main_item {
           display: flex;
           align-items: center;
           margin-top: 32px;
           margin-bottom: 32px;
+
           .signbox {
             width: 120px;
             display: flex;
             justify-content: end;
             align-items: center;
+
             .sign {
               margin-right: 5px;
             }
           }
+
           .btnbox {
             display: flex;
             flex: 1;
             align-items: center;
+
             .xkbtn {
               cursor: pointer;
               width: 130px;
@@ -859,24 +772,29 @@ export default {
             }
           }
         }
+
         .main_item2 {
           display: flex;
           align-items: flex-start;
           margin-bottom: 32px;
+
           .signbox {
             width: 120px;
             display: flex;
             justify-content: end;
             align-items: center;
+
             .sign {
               margin-right: 5px;
             }
           }
+
           .kqszbox {
             .qdqtbox {
               margin-left: 5px;
               cursor: pointer;
             }
+
             .qdbtn,
             .qtbtn {
               width: 75px;
@@ -887,15 +805,18 @@ export default {
               display: flex;
               align-items: center;
               justify-content: center;
+
               .btntext {
                 color: #387df7;
               }
             }
+
             .setbox {
               display: flex;
               flex-wrap: wrap;
               margin-top: 10px;
               margin-bottom: 24px;
+
               .timerbox {
                 margin-top: 6px;
                 margin-right: 32px;
@@ -905,10 +826,12 @@ export default {
               }
             }
           }
+
           .btnbox2 {
             display: flex;
             flex-direction: column;
             justify-content: flex-start;
+
             .xkbtn {
               cursor: pointer;
               width: 130px;
@@ -923,65 +846,76 @@ export default {
             }
           }
         }
+
         .mbl_items2 {
-                display: flex;
-                align-items: start;
-                margin-top: 10px;
-                margin-bottom: 10px;
-                .i_bottom{
-                  margin-bottom: 30px;
+          display: flex;
+          align-items: start;
+          margin-top: 10px;
+          margin-bottom: 10px;
+
+          .i_bottom {
+            margin-bottom: 30px;
+          }
+
+          .item_nam {
+            width: 100px;
+            display: flex;
+            align-items: center;
+            justify-content: flex-end;
+            white-space: nowrap;
+
+            .asterisk_icon {
+              width: 10px;
+              height: 10px;
+              margin-right: 5px;
+              margin-top: -15px;
+            }
+          }
+
+          .item_inp {
+            flex: 1;
+
+            .i_upload_img {
+              width: 100px;
+              height: 100px;
+              border-radius: 8px;
+            }
+
+            .i_upload {
+              width: 100px;
+              height: 100px;
+              border: 1px solid #4ea6ff;
+              border-radius: 8px;
+              text-align: center;
+              align-items: center;
+              cursor: pointer;
+
+              .addimg {
+                position: relative;
+
+                .heng {
+                  position: absolute;
+                  top: 50px;
+                  left: 25px;
+                  width: 50px;
+                  border: 1px solid #4ea6ff;
                 }
-                .item_nam {
-                  width: 100px;
-                  display: flex;
-                  align-items: center;
-                  justify-content: flex-end;
-                  white-space: nowrap;
-                  .asterisk_icon {
-                    width: 10px;
-                    height: 10px;
-                    margin-right: 5px;
-                    margin-top: -15px;
-                  }
-                }
-                .item_inp {
-                  flex: 1;
-                  .i_upload_img {
-                    width: 100px;
-                    height: 100px;
-                    border-radius: 8px;
-                  }
-                  .i_upload {
-                    width: 100px;
-                    height: 100px;
-                    border: 1px solid #4ea6ff;
-                    border-radius: 8px;
-                    text-align: center;
-                    align-items: center;
-                    cursor: pointer;
-                    .addimg {
-                      position: relative;
-                      .heng {
-                        position: absolute;
-                        top: 50px;
-                        left: 25px;
-                        width: 50px;
-                        border: 1px solid #4ea6ff;
-                      }
-                      .shu {
-                        position: absolute;
-                        top: 25px;
-                        left: 50px;
-                        height: 50px;
-                        border: 1px solid #4ea6ff;
-                      }
-                    }
-                  }
+
+                .shu {
+                  position: absolute;
+                  top: 25px;
+                  left: 50px;
+                  height: 50px;
+                  border: 1px solid #4ea6ff;
                 }
               }
-        
+            }
+          }
+        }
+
       }
     }
+
     .main_btns {
       height: 72px;
       width: 100%;
@@ -991,6 +925,7 @@ export default {
       align-items: center;
       justify-content: center;
       box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16);
+
       .btn1 {
         width: 100px;
         height: 40px;
@@ -1000,6 +935,7 @@ export default {
         background-color: #fff;
         cursor: pointer;
       }
+
       .btn2 {
         cursor: pointer;
         width: 100px;