登录小屏样式调整

src/views/equipmentManagement/components/paramsSetings.vue

@@ -5,116 +5,125 @@
     </div>
     <h1 class="title">sensor设置信息</h1>
 
-    <div class="grid-container">
-      <!-- 左侧参数设置 -->
-      <div class="setting-group">
-        <div class="setting-row" v-for="item in leftInfoEnum" :key="item.label">
-          <span class="label" :class="{'layout_2': item.type2 === 'checkbox'}">
-            <el-checkbox
-              style="margin-right: 10px"
-              v-if="item.type2 === 'checkbox'"
-              v-model="infoObj[item.propKey2]"
-            ></el-checkbox>
-            {{ item.label }}
-          </span>
-          <el-input
-            v-if="item.type === 'input'"
-            v-model="infoObj[item.propKey]"
-          ></el-input>
-          <el-select
-            v-model="infoObj[item.propKey]"
-            v-if="item.type === 'select'"
+    <div class="content-box">
+      <div class="grid-container">
+        <!-- 左侧参数设置 -->
+        <div class="setting-group">
+          <div
+            class="setting-row"
+            v-for="item in leftInfoEnum"
+            :key="item.label"
           >
-            <el-option
-              v-for="option in item.options"
-              :key="option.code"
-              :label="option.name"
-              :value="option.code"
-            ></el-option>
-          </el-select>
+            <span
+              class="label"
+              :class="{ layout_2: item.type2 === 'checkbox' }"
+            >
+              <el-checkbox
+                style="margin-right: 10px"
+                v-if="item.type2 === 'checkbox'"
+                v-model="infoObj[item.propKey2]"
+              ></el-checkbox>
+              {{ item.label }}
+            </span>
+            <el-input
+              v-if="item.type === 'input'"
+              v-model="infoObj[item.propKey]"
+            ></el-input>
+            <el-select
+              v-model="infoObj[item.propKey]"
+              v-if="item.type === 'select'"
+            >
+              <el-option
+                v-for="option in item.options"
+                :key="option.code"
+                :label="option.name"
+                :value="option.code"
+              ></el-option>
+            </el-select>
+          </div>
         </div>
-      </div>
 
-      <!-- 右侧参数设置 -->
-      <div class="setting-group">
-        <div
-          class="setting-row"
-          v-for="item in rightInfoEnum"
-          :key="item.label"
-        >
-          <span class="label">{{ item.label }}</span>
-          <el-input
-            v-if="item.type === 'input'"
-            v-model="infoObj[item.propKey]"
-          ></el-input>
+        <!-- 右侧参数设置 -->
+        <div class="setting-group">
+          <div
+            class="setting-row"
+            v-for="item in rightInfoEnum"
+            :key="item.label"
+          >
+            <span class="label">{{ item.label }}</span>
+            <el-input
+              v-if="item.type === 'input'"
+              v-model="infoObj[item.propKey]"
+            ></el-input>
+          </div>
         </div>
       </div>
-    </div>
-
-    <!-- 复选框区域 -->
-    <div class="checkbox-group">
-      <label class="custom-checkbox">
-        <input type="checkbox" v-model="infoObj.onlineBackblow" /> 在线反吹
-      </label>
-      <label class="custom-checkbox">
-        <input type="checkbox" v-model="infoObj.fastBlow" /> 快/慢
-      </label>
-      <label class="custom-checkbox">
-        <input type="checkbox" v-model="infoObj.d01Alarm" /> DO1报警
-      </label>
-      <label class="custom-checkbox">
-        <input type="checkbox" v-model="infoObj.d13Alarm" /> DI3有效
-      </label>
-    </div>
 
-    <!-- 仓室顺序 -->
-    <h4 style="margin-bottom: 10px">仓室顺序</h4>
-    <el-input
-      type="textarea"
-      :rows="4"
-      v-model="infoObj.compartSort"
-    ></el-input>
-
-    <!-- 复选框区域 -->
-    <div class="checkbox-group mgr10">
-      <label class="custom-checkbox">
-        <input type="checkbox" v-model="infoObj.diInput" /> DI接入Y/N
-      </label>
-      <label class="custom-checkbox">
-        <input type="checkbox" v-model="infoObj.showEarlyWarn" /> 显示预警
-      </label>
-      <div class="setting-row">
-        <span class="device-label">关联设备</span>
-        <el-select v-model="infoObj.relateDevicesNum" placeholder="请选择">
-          <el-option
-            v-for="(item, index) in 21"
-            :key="item"
-            :value="index"
-            :label="index"
-          ></el-option>
-        </el-select>
+      <!-- 复选框区域 -->
+      <div class="checkbox-group">
+        <label class="custom-checkbox">
+          <input type="checkbox" v-model="infoObj.onlineBackblow" /> 在线反吹
+        </label>
+        <label class="custom-checkbox">
+          <input type="checkbox" v-model="infoObj.fastBlow" /> 快/慢
+        </label>
+        <label class="custom-checkbox">
+          <input type="checkbox" v-model="infoObj.d01Alarm" /> DO1报警
+        </label>
+        <label class="custom-checkbox">
+          <input type="checkbox" v-model="infoObj.d13Alarm" /> DI3有效
+        </label>
       </div>
-    </div>
 
-    <!-- 复选框区域 -->
-    <div class="checkbox-group mgr10">
-      <div class="select-input">
+      <!-- 仓室顺序 -->
+      <h4 style="margin-bottom: 10px">仓室顺序</h4>
+      <el-input
+        type="textarea"
+        :rows="4"
+        v-model="infoObj.compartSort"
+      ></el-input>
+
+      <!-- 复选框区域 -->
+      <div class="checkbox-group mgr10">
         <label class="custom-checkbox">
-          <input
-            type="checkbox"
-            checked
-            v-model="infoObj.hasLiftValveCommunicationIp"
-          />
-          脉冲阀设备Y/N 通信IP
+          <input type="checkbox" v-model="infoObj.diInput" /> DI接入Y/N
         </label>
-        <div style="margin-left: 10px">
-          <el-input v-model="infoObj.liftValveCommunicationIp"></el-input>
-        </div>
-      </div>
-      <div>
         <label class="custom-checkbox">
-          <input type="checkbox" /> 室内脉冲轮流喷吹
+          <input type="checkbox" v-model="infoObj.showEarlyWarn" /> 显示预警
         </label>
+        <div class="setting-row">
+          <span class="device-label">关联设备</span>
+          <el-select v-model="infoObj.relateDevicesNum" placeholder="请选择">
+            <el-option
+              v-for="(item, index) in 21"
+              :key="item"
+              :value="index"
+              :label="index"
+            ></el-option>
+          </el-select>
+        </div>
+      </div>
+
+      <!-- 复选框区域 -->
+      <div class="checkbox-group mgr10">
+        <div class="select-input">
+          <label class="custom-checkbox">
+            <input
+              type="checkbox"
+              checked
+              v-model="infoObj.hasLiftValveCommunicationIp"
+            />
+            脉冲阀设备Y/N 通信IP
+          </label>
+          <div style="margin-left: 10px">
+            <el-input v-model="infoObj.liftValveCommunicationIp"></el-input>
+          </div>
+        </div>
+        <div>
+          <label class="custom-checkbox">
+            <input type="checkbox" v-model="infoObj.indoorPulseBlow"/> 室内脉冲轮流喷吹
+          </label>
+        </div>
       </div>
     </div>
 
@@ -355,18 +364,28 @@ body {
 
 .container {
   position: absolute;
-  top: 40%;
+  top: 10%;
   left: 50%;
-  transform: translate(-50%, -50%);
-  max-width: 650px;
+  transform: translateX(-50%);
+  max-height: 80vh;
+  max-width: 60vw;
   margin: 0 auto;
   background: white;
   border-radius: 12px;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
   padding: 0.8rem 1.2rem 1.2rem;
   z-index: 100;
+  // overflow-y: auto;
+  .content-box {
+    overflow: auto;
+    height: 55vh;
+  }
+  .content-box::-webkit-scrollbar {
+    width: 1px;
+  }
 }
 
+
 .title {
   color: #3b82f6;
   font-size: 1.8rem;

src/views/login/index.vue

@@ -1225,8 +1225,9 @@ $light_gray: #eee;
     box-shadow: 0px 15px 30px 0px rgba(0, 85, 183, 0.15);
     padding: 40px;
     position: absolute;
-    right: 14vw;
-    top: 22%;
+    right:10%;
+    top: 15%;
+    // transform: translateY(-50%);
     border-radius: 20px;
 
     .el-checkbox-group label {