优化编辑直播的样式

src/views/yqrange/create-live.vue

@@ -184,70 +184,72 @@
           <el-form-item label="直播角色">
             <div style="color:#666666;font-size:10px;">讲师（必填）</div>
             <el-col :span="10">
-              <el-form-item label="姓名" prop="lecturesUserName" label-width="60px;">
+              <el-form-item label="姓名" prop="lecturesUserName" label-width="80px">
                   <el-input
                     size="small"
                     v-model="formData.lecturesUserName"
                     placeholder="请输入姓名"
-                    style="width:70%;"
+                    style="width:85%;"
                   ></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="1">
-              <img src="../../assets/image/lianjie_icon.png" />
+              <img style="vertical-align: middle" src="../../assets/image/lianjie_icon.png" />
             </el-col>
-            <el-col :span="12">
+            <el-col :span="10">
               <!--<img src="../../assets/image/lianjie_icon.png" />-->
-            <el-form-item label="手机号" prop="lecturesPhone">
+            <el-form-item label="手机号" prop="lecturesPhone" label-width="80px">
               <el-input maxlength="11"
                 size="small"
                 v-model="formData.lecturesPhone"
                 placeholder="请输入手机号"
-                style="width:70%;"
+                style="width:85%;"
               ></el-input>
             </el-form-item>
             </el-col>
-            <el-col :span="15">
+            <el-col :span="24">
               <div style="color:#666666;font-size:10px;">嘉宾（选填）</div>
             </el-col>
             <div v-for="(item, index) in formData.guests" :key="index">
-            <el-col :span="10">
-              <el-form-item label=" 姓名" label-width="60px;" class="guest-label">
-                <el-input
-                  size="small"
-                  v-model="item.username"
-                  placeholder="请输入姓名"
-                  style="width:70%;"
-                ></el-input>
-              </el-form-item>
-            </el-col>
-              <el-col :span="1">
-                <img src="../../assets/image/lianjie_icon.png" />
-              </el-col>
-            <el-col :span="12">
-
-              <el-form-item label="手机号">
-                <el-input maxlength="11"
-                  size="small"
-                  v-model="item.phone"
-                  placeholder="请输入手机号"
-                  style="width:70%;"
-                ></el-input>
-
-               <img
-              @click="addGuest(index)"
-              class="edit-img"
-              src="../../assets/image/plus.png"
-              v-if="isPreview!=1"
-            />
-              <img
-                @click="delGuest(index)"
-                v-if="index >= 1 && isPreview!=1"
-                class="edit-img"
-                src="../../assets/image/trash.png"
-              />
-              </el-form-item>
-            </el-col>
+              <el-row>
+                <el-col :span="10">
+                  <el-form-item label=" 姓名" label-width="80px">
+                    <el-input
+                        size="small"
+                        v-model="item.username"
+                        placeholder="请输入姓名"
+                        style="width:85%;"
+                    ></el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="1">
+                  <img style="vertical-align: middle" src="../../assets/image/lianjie_icon.png" />
+                </el-col>
+                <el-col :span="10">
+                  <el-form-item label="手机号" label-width="80px">
+                    <el-input maxlength="11"
+                              size="small"
+                              v-model="item.phone"
+                              placeholder="请输入手机号"
+                              style="width:85%;"
+                    ></el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="2">
+                  <img
+                      @click="addGuest(index)"
+                      class="edit-img"
+                      src="../../assets/image/plus.png"
+                      v-if="isPreview!=1"
+                  />
+                  <img
+                      @click="delGuest(index)"
+                      v-if="index >= 1 && isPreview!=1"
+                      class="edit-img"
+                      src="../../assets/image/trash.png"
+                  />
+                </el-col>
+              </el-row>
             </div>
             <!--<el-col :span="15">-->
               <!--<p class="err-text" v-if="guestErrFlag"><img src="../../assets/image/err-icon.svg" alt="">{{guestErrText}}</p>-->