配电设施表单样式修改

ems-ui/src/views/basecfg/powerbox/index.vue

@@ -63,32 +63,55 @@
 
     <!-- 添加或修改动力箱柜对话框 -->
     <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body>
+
       <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-        <el-form-item label="箱柜代码" prop="boxCode">
-          <el-input v-model="form.boxCode" placeholder="请输入箱柜代码" />
-        </el-form-item>
-        <el-form-item label="箱柜类型" prop="boxType">
-          <el-select v-model="form.boxType">
-            <el-option v-for="item in boxTypeOptions" :label="item.name" :value="item.code" :key="item.code" />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="所在服务区" prop="areaCode">
-          <el-select v-model="form.areaCode">
-            <el-option v-for="item in areaOptions" :label="item.areaName" :value="item.areaCode" :key="item.areaCode" />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="安装位置" prop="location">
-          <el-input v-model="form.location" placeholder="请输入安装位置" />
-        </el-form-item>
-        <el-form-item label="箱体尺寸" prop="boxSize">
-          <el-input v-model="form.boxSize" placeholder="请输入箱体尺寸" />
-        </el-form-item>
-        <el-form-item label="网关地址" prop="gatewayAddr">
-          <el-input v-model="form.gatewayAddr" placeholder="请输入网关地址" />
-        </el-form-item>
-        <el-form-item label="网关端口" prop="gatewayPort">
-          <el-input v-model="form.gatewayPort" placeholder="请输入网关端口" />
-        </el-form-item>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="箱柜代码" prop="boxCode">
+              <el-input v-model="form.boxCode" placeholder="请输入箱柜代码"  />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="箱柜类型" prop="boxType" >
+              <el-select v-model="form.boxType" placeholder="请选择箱柜类型" style="width: 100%;">
+                <el-option v-for="item in boxTypeOptions" :label="item.name" :value="item.code" :key="item.code" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="所在服务区" prop="areaCode">
+              <el-select v-model="form.areaCode" placeholder="请选择所在服务区" style="width: 100%;">
+                <el-option v-for="item in areaOptions" :label="item.areaName" :value="item.areaCode" :key="item.areaCode" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="安装位置" prop="location">
+              <el-input v-model="form.location" placeholder="请输入安装位置" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="箱体尺寸" prop="boxSize">
+              <el-input v-model="form.boxSize" placeholder="请输入箱体尺寸" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="网关地址" prop="gatewayAddr">
+              <el-input v-model="form.gatewayAddr" placeholder="请输入网关地址" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="网关端口" prop="gatewayPort">
+              <el-input v-model="form.gatewayPort" placeholder="请输入网关端口" />
+            </el-form-item>
+          </el-col>
+        </el-row>
         <el-form-item label="电气元件" prop="elecEqptList" >
           <el-table v-loading="loading" :data="form.elecEqptList" max-height="200px">
             <el-table-column label="元件编码" align="center"  prop="eqptCode">