fix

src/views/QRCode/index.vue

@@ -26,32 +26,32 @@
       v-if="genericCode || regularCode || zfbGenericCode || zfbRegularCode"
       class="container"
     >
-      <el-row :gutter="40">
-        <el-col v-if="genericCode" :span="12">
-          <div class="app-container">
-            <div class="title">{{ qrcodeTitle }} - 微信通用码</div>
-            <div class="flex-center">
-              <el-image :src="genericCode" alt="加载失败" class="qrcode" />
-            </div>
-          </div>
-        </el-col>
-        <el-col v-if="regularCode" :span="12">
-          <div class="app-container">
-            <div class="title">{{ qrcodeTitle }} - 微信员工码</div>
-            <div class="flex-center">
-              <el-image :src="regularCode" class="qrcode" alt="加载失败" />
-            </div>
-          </div>
-        </el-col>
-        <el-col v-if="zfbFkjCode" :span="12">
-          <div class="app-container">
-            <div class="title">{{ qrcodeTitle }} - 访客机开门二维码</div>
-            <div class="flex-center">
-              <el-image :src="zfbFkjCode" class="qrcode" alt="加载失败" />
-            </div>
-          </div>
-        </el-col>
-<!--        <el-col v-if="zfbGenericCode" :span="8">
+      <!--      <el-row :gutter="40">
+        <el-col v-if="genericCode" :span="8">-->
+      <div class="app-container">
+        <div class="title">{{ qrcodeTitle }} - 微信通用码</div>
+        <div class="flex-center">
+          <el-image :src="genericCode" alt="加载失败" class="qrcode" />
+        </div>
+      </div>
+      <!--        </el-col>
+        <el-col v-if="regularCode" :span="8">-->
+      <div class="app-container">
+        <div class="title">{{ qrcodeTitle }} - 微信员工码</div>
+        <div class="flex-center">
+          <el-image :src="regularCode" class="qrcode" alt="加载失败" />
+        </div>
+      </div>
+      <!--        </el-col>
+        <el-col v-if="zfbFkjCode" :span="8">-->
+      <div class="app-container">
+        <div class="title">{{ qrcodeTitle }} - 访客机开门二维码</div>
+        <div class="flex-center">
+          <el-image :src="zfbFkjCode" class="qrcode" alt="加载失败" />
+        </div>
+      </div>
+      <!--        </el-col>-->
+      <!--        <el-col v-if="zfbGenericCode" :span="8">
           <div class="app-container">
             <div class="title">{{ qrcodeTitle }} - 支付宝通用码</div>
             <div class="flex-center">
@@ -59,18 +59,18 @@
             </div>
           </div>
         </el-col>-->
-        <el-col v-if="zfbRegularCode" :span="8">
+      <!--        <el-col v-if="zfbRegularCode" :span="8">
           <div class="app-container">
             <div class="title">{{ qrcodeTitle }} - 支付宝员工码</div>
             <div class="flex-center">
               <el-image :src="zfbRegularCode" class="qrcode" alt="加载失败" />
             </div>
           </div>
-        </el-col>
+        </el-col>-->
       </el-row>
     </div>
     <!-- 预约场景 -->
-    <div v-if="reservationCode" class="container">
+    <!--    <div v-if="reservationCode" class="container">
       <el-row :gutter="40">
         <el-col :span="8">
           <div class="app-container">
@@ -95,9 +95,9 @@
           </div>
         </el-col>
       </el-row>
-    </div>
+    </div>-->
     <!-- 楼宇场景 -->
-    <div v-if="buildingCode || buildingRegularCode" class="container">
+    <!--    <div v-if="buildingCode || buildingRegularCode" class="container">
       <el-row :gutter="40">
         <el-col v-if="buildingCode" :span="12">
           <div class="app-container">
@@ -107,14 +107,14 @@
             </div>
           </div>
         </el-col>
-<!--        <el-col v-if="ZFBbuildingCode" :span="8">
+&lt;!&ndash;        <el-col v-if="ZFBbuildingCode" :span="8">
           <div class="app-container">
             <div class="title">{{ qrcodeTitle }} - 支付宝通用码</div>
             <div class="flex-center">
               <el-image class="qrcode" :src="ZFBbuildingCode" alt="加载失败" />
             </div>
           </div>
-        </el-col>-->
+        </el-col>&ndash;&gt;
         <el-col v-if="zfbFkjCode" :span="12">
           <div class="app-container">
             <div class="title">{{ qrcodeTitle }} - 访客机开门二维码</div>
@@ -135,7 +135,7 @@
             </div>
           </div>
         </el-col>
-        <el-col v-if="ZFBbuildingRegularCode" :span="8">
+&lt;!&ndash;        <el-col v-if="ZFBbuildingRegularCode" :span="8">
           <div class="app-container">
             <div class="title">{{ qrcodeTitle }} - 支付宝员工码</div>
             <div class="flex-center">
@@ -146,17 +146,17 @@
               />
             </div>
           </div>
-        </el-col>
-        <el-col v-if="placeType == 3" :span="8">
+        </el-col>&ndash;&gt;
+&lt;!&ndash;        <el-col v-if="placeType == 3" :span="8">
           <div class="app-container">
             <div class="title">{{ qrcodeTitle }} - 支付宝入库码</div>
             <div class="flex-center">
               <el-image class="qrcode" :src="schoolCode" alt="加载失败" />
             </div>
           </div>
-        </el-col>
+        </el-col>&ndash;&gt;
       </el-row>
-    </div>
+    </div>-->
   </div>
 </template>
 
@@ -247,10 +247,17 @@ export default {
   background-image: url("../../assets/bg.png");
   background-size: 100% 100%;
   background-repeat: no-repeat;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
 }
 .container {
+  width: 100%;
   padding: 0 80px;
   /* height: calc(100vh - 60px); */
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
 }
 .app-container {
   flex: none;

src/views/white_list/index.vue

@@ -686,171 +686,173 @@
             </el-form-item>
           </div>
         </div>
-        <div v-for="(item, index) in user_form.contents" :key="index">
-          <el-form-item
-            v-if="item.customType === '日期'"
-            :label="item.customName"
-            :prop="`contents.${index}.customNameVal`"
-            :rules="rules.customNameVal"
-          >
-            <el-date-picker
-              v-model="item.customNameVal"
-              style="width: 200px"
-              type="datetime"
-              :placeholder="item.prompt"
-              value-format="yyyy-MM-dd"
-              format="yyyy-MM-dd"
-            />
-          </el-form-item>
-          <el-form-item
-            v-if="item.customType === '时间'"
-            :label="item.customName"
-            :prop="`contents.${index}.customNameVal`"
-            :rules="rules.customNameVal"
-          >
-            <el-time-picker
-              v-model="item.customNameVal"
-              style="width: 200px"
-              :picker-options="{
-                selectableRange: '00:00:00 - 23:59:59',
-              }"
-              value-format="HH:mm"
-              format="HH:mm"
-            />
-          </el-form-item>
-          <el-form-item
-            v-if="item.customType === '下拉选择'"
-            :rules="rules.customNameVal"
-            :label="item.customName"
-            :prop="`contents.${index}.customNameVal`"
-          >
-            <el-select
-              v-model="item.customNameVal"
-              style="width: 200px"
-              clearable
-              filterable
-              :placeholder="item.prompt"
+        <div class="wrap-content">
+          <div v-for="(item, index) in user_form.contents" :key="index" class="wrap-content__item">
+            <el-form-item
+              v-if="item.customType === '日期'"
+              :label="item.customName"
+              :prop="`contents.${index}.customNameVal`"
+              :rules="rules.customNameVal"
             >
-              <el-option
-                v-for="item in item.configurationOption"
-                :key="item.name"
-                :label="item.name"
-                :value="item.name"
+              <el-date-picker
+                v-model="item.customNameVal"
+                style="width: 200px"
+                type="datetime"
+                :placeholder="item.prompt"
+                value-format="yyyy-MM-dd"
+                format="yyyy-MM-dd"
               />
-            </el-select>
-          </el-form-item>
-
-          <el-form-item
-            v-if="item.customType === '文本'"
-            :label="item.customName"
-            :prop="`contents.${index}.customNameVal`"
-            :rules="rules.customNameVal"
-          >
-            <el-input
-              v-model="item.customNameVal"
-              :placeholder="item.prompt"
-            />
-          </el-form-item>
-          <template v-if="item.customType === '图片'">
+            </el-form-item>
             <el-form-item
+              v-if="item.customType === '时间'"
               :label="item.customName"
               :prop="`contents.${index}.customNameVal`"
               :rules="rules.customNameVal"
             >
-              <el-upload
-                ref="upload"
-                name="file"
-                class="avatar-uploader"
-                :action="doUpload"
-                :show-file-list="false"
-                :http-request="(file) => doUploadAvatar2(file, item)"
-                :before-upload="beforeAvatarUpload"
-                :auto-upload="true"
-                accept="image/png,image/gif,image/jpg,image/jpeg"
+              <el-time-picker
+                v-model="item.customNameVal"
+                style="width: 200px"
+                :picker-options="{
+                  selectableRange: '00:00:00 - 23:59:59',
+                }"
+                value-format="HH:mm"
+                format="HH:mm"
+              />
+            </el-form-item>
+            <el-form-item
+              v-if="item.customType === '下拉选择'"
+              :rules="rules.customNameVal"
+              :label="item.customName"
+              :prop="`contents.${index}.customNameVal`"
+            >
+              <el-select
+                v-model="item.customNameVal"
+                style="width: 200px"
+                clearable
+                filterable
+                :placeholder="item.prompt"
               >
-                <img
-                  v-if="item.customNameVal"
-                  :src="item.customNameVal"
-                  class="avatar"
-                >
-                <i v-else class="el-icon-plus avatar-uploader-icon" />
-              </el-upload>
+                <el-option
+                  v-for="item in item.configurationOption"
+                  :key="item.name"
+                  :label="item.name"
+                  :value="item.name"
+                />
+              </el-select>
             </el-form-item>
-          </template>
 
-          <template v-if="item.customType.indexOf('省市区') > -1">
             <el-form-item
-              :rules="rules.customNameVal"
+              v-if="item.customType === '文本'"
               :label="item.customName"
               :prop="`contents.${index}.customNameVal`"
+              :rules="rules.customNameVal"
             >
-              <div class="flex">
-                <el-select
-                  v-model="matchContentId(item.id).provinceName"
-                  placeholder="请选择省份"
-                  @change="
-                    (value) => {
-                      chooseProvince(value, matchContentId(item.id));
-                    }
-                  "
-                >
-                  <el-option
-                    v-for="item in matchContentId(item.id).province_list"
-                    :key="item.areaCodeId"
-                    :label="item.name"
-                    :value="item.name"
-                  />
-                </el-select>
-                <el-select
-                  v-model="matchContentId(item.id).cityName"
-                  class="margin-left-s"
-                  placeholder="请选择城市"
-                  @change="
-                    (value) => {
-                      chooseCity(value, matchContentId(item.id));
-                    }
-                  "
-                >
-                  <el-option
-                    v-for="item in matchContentId(item.id).city_list"
-                    :key="item.areaCodeId"
-                    :label="item.name"
-                    :value="item.name"
-                  />
-                </el-select>
-                <el-select
-                  v-model="matchContentId(item.id).areaName"
-                  class="margin-left-s"
-                  placeholder="请选择区/县"
-                  @change="
-                    (value) => {
-                      chooseArea(value, matchContentId(item.id));
-                    }
-                  "
-                >
-                  <el-option
-                    v-for="item in matchContentId(item.id).area_list"
-                    :key="item.areaCodeId"
-                    :label="item.name"
-                    :value="item.name"
-                  />
-                </el-select>
-                <el-select
-                  v-if="item.customType == '省市区街道'"
-                  v-model="matchContentId(item.id).streetName"
-                  class="margin-left-s"
-                  placeholder="请选择街道"
-                >
-                  <el-option
-                    v-for="item in matchContentId(item.id).street_list"
-                    :key="item.streetCodeId"
-                    :label="item.name"
-                    :value="item.name"
-                  />
-                </el-select>
-              </div>
+              <el-input
+                v-model="item.customNameVal"
+                :placeholder="item.prompt"
+              />
             </el-form-item>
-          </template>
+            <template v-if="item.customType === '图片'">
+              <el-form-item
+                :label="item.customName"
+                :prop="`contents.${index}.customNameVal`"
+                :rules="rules.customNameVal"
+              >
+                <el-upload
+                  ref="upload"
+                  name="file"
+                  class="avatar-uploader"
+                  :action="doUpload"
+                  :show-file-list="false"
+                  :http-request="(file) => doUploadAvatar2(file, item)"
+                  :before-upload="beforeAvatarUpload"
+                  :auto-upload="true"
+                  accept="image/png,image/gif,image/jpg,image/jpeg"
+                >
+                  <img
+                    v-if="item.customNameVal"
+                    :src="item.customNameVal"
+                    class="avatar"
+                  >
+                  <i v-else class="el-icon-plus avatar-uploader-icon" />
+                </el-upload>
+              </el-form-item>
+            </template>
+
+            <template v-if="item.customType.indexOf('省市区') > -1">
+              <el-form-item
+                :rules="rules.customNameVal"
+                :label="item.customName"
+                :prop="`contents.${index}.customNameVal`"
+              >
+                <div class="flex">
+                  <el-select
+                    v-model="matchContentId(item.id).provinceName"
+                    placeholder="请选择省份"
+                    @change="
+                      (value) => {
+                        chooseProvince(value, matchContentId(item.id));
+                      }
+                    "
+                  >
+                    <el-option
+                      v-for="item in matchContentId(item.id).province_list"
+                      :key="item.areaCodeId"
+                      :label="item.name"
+                      :value="item.name"
+                    />
+                  </el-select>
+                  <el-select
+                    v-model="matchContentId(item.id).cityName"
+                    class="margin-left-s"
+                    placeholder="请选择城市"
+                    @change="
+                      (value) => {
+                        chooseCity(value, matchContentId(item.id));
+                      }
+                    "
+                  >
+                    <el-option
+                      v-for="item in matchContentId(item.id).city_list"
+                      :key="item.areaCodeId"
+                      :label="item.name"
+                      :value="item.name"
+                    />
+                  </el-select>
+                  <el-select
+                    v-model="matchContentId(item.id).areaName"
+                    class="margin-left-s"
+                    placeholder="请选择区/县"
+                    @change="
+                      (value) => {
+                        chooseArea(value, matchContentId(item.id));
+                      }
+                    "
+                  >
+                    <el-option
+                      v-for="item in matchContentId(item.id).area_list"
+                      :key="item.areaCodeId"
+                      :label="item.name"
+                      :value="item.name"
+                    />
+                  </el-select>
+                  <el-select
+                    v-if="item.customType == '省市区街道'"
+                    v-model="matchContentId(item.id).streetName"
+                    class="margin-left-s"
+                    placeholder="请选择街道"
+                  >
+                    <el-option
+                      v-for="item in matchContentId(item.id).street_list"
+                      :key="item.streetCodeId"
+                      :label="item.name"
+                      :value="item.name"
+                    />
+                  </el-select>
+                </div>
+              </el-form-item>
+            </template>
+          </div>
         </div>
       </el-form>