Explorar o código

pms 调拨页面样式调整

zhangcl hai 2 meses
pai
achega
5cb108d7df
Modificáronse 2 ficheiros con 80 adicións e 31 borrados
  1. 1 1
      src/locales/zh-CN.ts
  2. 79 30
      src/views/pms/device/allotlog/ConfigDeviceAllot.vue

+ 1 - 1
src/locales/zh-CN.ts

@@ -630,7 +630,7 @@ export default {
     reasonForAdjustment:'调整原因',
     rfaHolder:'请输入调整原因',
     adjustmentRecords:'调整记录',
-    selectPersons: '请选择人'
+    selectPersons: '请选择责任人'
   },
   deviceStatus:{
     deviceName:'设备名称',

+ 79 - 30
src/views/pms/device/allotlog/ConfigDeviceAllot.vue

@@ -59,38 +59,49 @@
     <!-- 暂存关联列表 -->
     <div class="submit-area">
       <div class="card selection-area">
-        <!-- 左侧人员选择 -->
-        <div class="person-selector">
-          <el-select
-            v-model="selectedPersons"
-            multiple
-            filterable
-            :placeholder="t('configPerson.selectPersons')"
-            style="width: 100%"
-          >
-            <el-option
-              v-for="person in simpleUsers"
-              :key="person.id"
-              :label="person.nickname"
-              :value="person.id"
-            />
-          </el-select>
-        </div>
+        <div class="control-row">
+          <!-- 左侧人员选择 -->
+          <div class="control-group">
+            <label class="control-title">{{ t('devicePerson.rp') }}</label>
+            <div class="person-selector">
+              <el-select
+                v-model="selectedPersons"
+                multiple
+                filterable
+                :placeholder="t('configPerson.selectPersons')"
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="person in simpleUsers"
+                  :key="person.id"
+                  :label="person.nickname"
+                  :value="person.id"
+                />
+              </el-select>
+            </div>
+          </div>
 
-        <div class="reason-input-wrapper">
-          <el-input
-            v-model="formData.reason"
-            :placeholder="t('configDevice.rfaHolder')"
-            class="reason-input"
-            type="textarea"
-            :rows="3"
-            @input="updateTempRelations"
-          />
+          <div class="control-group">
+            <label class="control-title">{{ t('configDevice.reasonForAdjustment') }}</label>
+            <div class="reason-input-wrapper">
+              <el-input
+                v-model="formData.reason"
+                :placeholder="t('configDevice.rfaHolder')"
+                class="reason-input"
+                type="textarea"
+                :rows="4"
+                resize="none"
+                @input="updateTempRelations"
+              />
+            </div>
+          </div>
         </div>
       </div>
+
       <el-button
         type="primary"
         size="large"
+        style="min-width: 180px;"
         @click="submitRelations"
         :disabled="tempRelations.length === 0 || !formData.reason.trim() || selectedPersons.length === 0"
       >
@@ -416,7 +427,7 @@ onMounted(async () => {
 }
 
 .submit-area {
-  margin-top: 5px;
+  margin-top: 20px;
   text-align: center;
 }
 
@@ -486,13 +497,51 @@ h3 {
   color: #999;
 }
 
+.control-row {
+  display: flex;
+  width: 100%;
+  gap: 20px;
+}
+
+/* 调整文本域高度 */
+.reason-input-wrapper :deep(.el-textarea__inner) {
+  height: 100% !important;
+  min-height: 100px;
+}
+
+/* 响应式调整 */
+@media (max-width: 992px) {
+  .control-row {
+    flex-direction: column;
+    gap: 15px;
+  }
+
+  .control-group {
+    width: 100%;
+  }
+}
+
 .selection-area {
   display: flex;
-  gap: 20px; /* 两个元素之间的间距 */
 }
 
+.control-group {
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+}
+
+.control-title {
+  display: block;
+  margin-bottom: 8px;
+  font-weight: bold;
+  color: #606266;
+}
+
+.person-selector,
 .reason-input-wrapper {
-  flex: 1; /* 占据一半宽度 */
-  min-width: 0; /* 防止溢出 */
+  flex: 1;
+  min-height: 100px;
 }
 </style>