代码优化

src/views/pro/projectManagement/constructionPro/editOutsourcingPro.vue

@@ -1,27 +1,38 @@
 <template>
   <div class="app-container">
-
     <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
-      <h2 style="color: #409EFF;background: #e8e8e8;padding: 15px;border-radius: 10px">当前施工信息</h2>
+      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">当前施工信息</h2>
       <el-row :gutter="gutterValue">
         <el-col :span="7">
           <el-form-item label-width="120px" label="承包商数量">
-            <el-input v-model="formData.consNum" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.consNum"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="分包商数量">
-            <el-input v-model="formData.subNum" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.subNum"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="当前在场人数">
-            <el-input v-model="formData.presentNum" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.presentNum"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
@@ -29,22 +40,34 @@
       <el-row>
         <el-col :span="7">
           <el-form-item label-width="120px" label="特殊工种人数">
-            <el-input v-model="formData.specialJobsNum" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '96%'}"
+              v-model="formData.specialJobsNum"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '96%' }"
             ></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="工器具总数">
-            <el-input v-model="formData.equipmentNum" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '96%'}"
+              v-model="formData.equipmentNum"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '96%' }"
             ></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="特殊设备数量">
-            <el-input v-model="formData.specialEquipmentNum" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '96%'}"
+              v-model="formData.specialEquipmentNum"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '96%' }"
             ></el-input>
           </el-form-item>
         </el-col>
@@ -52,45 +75,66 @@
       <el-row>
         <el-col :span="7">
           <el-form-item label-width="120px" label="监理人数">
-            <el-input v-model="formData.supervisorNum" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.supervisorNum"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="工程状态">
-            <el-select v-model="formData.proStatus" placeholder="请选择工程状态" clearable :style="{width: '100%'}"
+            <el-select
-                       :disabled="true"
+              v-model="formData.proStatus"
+              placeholder="请选择工程状态"
+              clearable
+              :style="{ width: '100%' }"
+              :disabled="true"
             >
-              <el-option v-for="dict in proStatusOptions"
+              <el-option
-                         :key="dict.value"
+                v-for="dict in proStatusOptions"
-                         :label="dict.label"
+                :key="dict.value"
-                         :value="dict.value"
+                :label="dict.label"
+                :value="dict.value"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
-      <h2 style="color: #409EFF;background: #e8e8e8;padding: 15px;border-radius: 10px">工程基本信息填写</h2>
+      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">工程基本信息填写</h2>
       <el-row :gutter="gutterValue">
         <el-col :span="7">
           <el-form-item label-width="120px" label="工程名称" style="width: 100%">
-            <el-input v-model="formData.proName" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.proName"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="工程负责人" style="width: 100%">
-            <el-input v-model="formData.proLeader" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.proLeader"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="负责人联系方式" style="width: 100%">
-            <el-input v-model="formData.proLeaderPhone" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.proLeaderPhone"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
@@ -98,29 +142,45 @@
       <el-row>
         <el-col :span="7">
           <el-form-item label-width="120px" label="工程类型" style="width: 100%">
-            <el-select v-model="formData.proType" placeholder="请选择工程类型" clearable :style="{width: '100%'}"
+            <el-select
-                       :disabled="true"
+              v-model="formData.proType"
+              placeholder="请选择工程类型"
+              clearable
+              :style="{ width: '100%' }"
+              :disabled="true"
             >
-              <el-option v-for="dict in proTypeOptions"
+              <el-option
-                         :key="dict.value"
+                v-for="dict in proTypeOptions"
-                         :label="dict.label"
+                :key="dict.value"
-                         :value="dict.value"
+                :label="dict.label"
+                :value="dict.value"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="计划开工日期" prop="startDate" style="width: 100%">
-            <el-date-picker v-model="formData.startDate" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
+            <el-date-picker
-                            :style="{width: '100%'}" placeholder="请选择开工期日计划开工日期"
+              v-model="formData.startDate"
-                            :editable="false" clearable
+              format="yyyy-MM-dd"
+              value-format="yyyy-MM-dd"
+              :style="{ width: '100%' }"
+              placeholder="请选择开工期日计划开工日期"
+              :editable="false"
+              clearable
             ></el-date-picker>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="计划竣工日期" prop="endDate">
-            <el-date-picker v-model="formData.endDate" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
+            <el-date-picker
-                            :editable="false" :style="{width: '100%'}" placeholder="请选择计划竣工日期" clearable
+              v-model="formData.endDate"
+              format="yyyy-MM-dd"
+              value-format="yyyy-MM-dd"
+              :editable="false"
+              :style="{ width: '100%' }"
+              placeholder="请选择计划竣工日期"
+              clearable
             ></el-date-picker>
           </el-form-item>
         </el-col>
@@ -128,17 +188,25 @@
       <el-row v-if="formData.proType == 2">
         <el-col :span="7">
           <el-form-item label-width="120px" label="选择监理单位" prop="supervisorUnitId">
-            <el-select v-model="formData.supervisorUnitId" placeholder="请选择监理单位" clearable :disabled="true"
+            <el-select
-                       :style="{width: '100%'}"
+              v-model="formData.supervisorUnitId"
+              placeholder="请选择监理单位"
+              clearable
+              :disabled="true"
+              :style="{ width: '100%' }"
             >
-              <el-option v-for="(item,index) in supervisorUnitOptions" :key="index" :label="item.label"
+              <el-option
-                         :value="item.value" :disabled="item.disabled"
+                v-for="(item, index) in supervisorUnitOptions"
+                :key="index"
+                :label="item.label"
+                :value="item.value"
+                :disabled="item.disabled"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
-      <h2 style="color: #409EFF;background: #e8e8e8;padding: 15px;border-radius: 10px">工程地址配置</h2>
+      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">工程地址配置</h2>
       <el-row :gutter="gutterValue">
         <el-form-item
           v-for="(domain, index) in formData.proAddress"
@@ -147,92 +215,136 @@
           :key="domain.key"
           :prop="'proAddress.' + index + '.value'"
           :rules="{
-      required: true, message: '请选择工程地址', trigger: 'blur'
+            required: true,
-    }"
+            message: '请选择工程地址',
+            trigger: 'blur',
+          }"
         >
-          <el-select v-model="domain.value" placeholder="请选择工程地址" clearable @clear="clearAddress(index)"
+          <el-select
-                     :style="{width: '26%'}"
+            v-model="domain.value"
-                     @change="changeLonLat(domain.value,index)"
+            placeholder="请选择工程地址"
+            clearable
+            @clear="clearAddress(index)"
+            :style="{ width: '26%' }"
+            @change="changeLonLat(domain.value, index)"
           >
-            <el-option v-for="(option, i) in proAddressOptions" :key="i" :label="option.label" :value="option.value"
+            <el-option
-                       :disabled="option.disabled"
+              v-for="(option, i) in proAddressOptions"
+              :key="i"
+              :label="option.label"
+              :value="option.value"
+              :disabled="option.disabled"
             ></el-option>
           </el-select>
-          <el-input v-model="domain.lon" placeholder="经度" clearable :disabled="true"
+          <el-input
-                    :style="{width: '20%',marginLeft:'2%'}" v-no-whitespace
+            v-model="domain.lon"
+            placeholder="经度"
+            clearable
+            :disabled="true"
+            :style="{ width: '20%', marginLeft: '2%' }"
+            v-no-whitespace
           ></el-input>
-          <el-input v-model="domain.lat" placeholder="经度" clearable :disabled="true"
+          <el-input
-                    :style="{width: '20%',marginLeft:'2%'}" v-no-whitespace
+            v-model="domain.lat"
+            placeholder="经度"
+            clearable
+            :disabled="true"
+            :style="{ width: '20%', marginLeft: '2%' }"
+            v-no-whitespace
           ></el-input>
-          <el-button type="primary" plain size="medium" icon="el-icon-circle-plus" circle :style="{marginLeft:'2%'}"
+          <el-button
-                     @click="addAddressOption"
+            type="primary"
+            plain
+            size="medium"
+            icon="el-icon-circle-plus"
+            circle
+            :style="{ marginLeft: '2%' }"
+            @click="addAddressOption"
           ></el-button>
-          <el-button v-if="index !== 0" v-show="true" type="danger" plain icon="el-icon-remove" circle
+          <el-button
-                     @click="removeAddressOption(domain)"
+            v-if="index !== 0"
+            v-show="true"
+            type="danger"
+            plain
+            icon="el-icon-remove"
+            circle
+            @click="removeAddressOption(domain)"
           ></el-button>
           <el-button v-if="index === 0" v-show="true" type="primary" @click="addAddress">新增地址</el-button>
         </el-form-item>
-
       </el-row>
-      <h2 style="color: #409EFF;background: #e8e8e8;padding: 15px;border-radius: 10px">承包商配置</h2>
+      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">承包商配置</h2>
       <el-row :gutter="gutterValue">
-        <el-form-item
+        <el-form-item v-for="(domain, index) in formData.consArr" :label="'选择承包商' + index" :key="domain.key">
-          v-for="(domain, index) in formData.consArr"
-          :label="'选择承包商' + index"
-          :key="domain.key"
-        >
           <el-col :span="7">
-            <el-select v-model="domain.value" placeholder="请选择承包商" clearable :disabled="true"
+            <el-select
-                       :style="{width: '100%'}"
+              v-model="domain.value"
-                       @change="changeLonLat(domain.value,index)"
+              placeholder="请选择承包商"
+              clearable
+              :disabled="true"
+              :style="{ width: '100%' }"
+              @change="changeLonLat(domain.value, index)"
             >
-              <el-option v-for="(option, i) in consOptions" :key="i" :label="option.label" :value="option.value"
+              <el-option
-                         :disabled="option.disabled"
+                v-for="(option, i) in consOptions"
+                :key="i"
+                :label="option.label"
+                :value="option.value"
+                :disabled="option.disabled"
               ></el-option>
             </el-select>
           </el-col>
           <el-col :span="12">
-            <el-checkbox-group v-model="domain.checkList"  style="margin-left: 2%;">
+            <el-checkbox-group v-model="domain.checkList" style="margin-left: 2%">
-              <el-checkbox v-for="(option,index) in materialOptions" :label="option.value" :key="index" disabled>
+              <el-checkbox v-for="(option, index) in materialOptions" :label="option.value" :key="index" disabled>
                 {{ option.label }}
               </el-checkbox>
             </el-checkbox-group>
           </el-col>
         </el-form-item>
       </el-row>
-      <h2 style="color: #409EFF;background: #e8e8e8;padding: 15px;border-radius: 10px">其他信息</h2>
+      <h2 style="color: #409eff; background: #e8e8e8; padding: 15px; border-radius: 10px">其他信息</h2>
       <el-row :gutter="gutterValue">
         <el-col :span="7">
           <el-form-item label-width="120px" label="创建人">
-            <el-input v-model="formData.createPerson" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.createPerson"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="7">
           <el-form-item label-width="120px" label="创建时间">
-            <el-input v-model="formData.createTime" clearable :disabled="true" v-no-whitespace
+            <el-input
-                      :style="{width: '100%'}"
+              v-model="formData.createTime"
+              clearable
+              :disabled="true"
+              v-no-whitespace
+              :style="{ width: '100%' }"
             ></el-input>
           </el-form-item>
         </el-col>
       </el-row>
     </el-form>
     <el-dialog :title="'创建工程地址'" :visible.sync="open" width="500px" append-to-body :close-on-click-modal="false">
-      <bns-map
+      <bns-map :items="mapItems" v-on:closeMain="closeMain"></bns-map>
-        :items="mapItems"
-        v-on:closeMain="closeMain"
-      >
-      </bns-map>
     </el-dialog>
 
-
     <div slot="footer" class="dialog-footer">
-      <el-button type="primary" @click="submitForm" :style="{float:'right',marginLeft:'10px'}" v-preventReClick="5000">提 交</el-button>
+      <el-button
-      <el-button @click="closePage" :style="{float:'right'}">取 消</el-button>
+        type="primary"
+        @click="submitForm"
+        :style="{ float: 'right', marginLeft: '10px' }"
+        v-preventReClick="5000"
+      >
+        提 交
+      </el-button>
+      <el-button @click="closePage" :style="{ float: 'right' }">取 消</el-button>
     </div>
   </div>
-
 </template>
 <script>
 import { dictTableOption, selectCons, selectMaterial, selectProAddress, selectSupervisionUnit } from '@/api/tool/select'
@@ -252,36 +364,43 @@ export default {
       proAddressForm: {},
       //工程地址form表单 校验
       proAddressRules: {
-        proAddress: [{
+        proAddress: [
-          required: true,
+          {
-          message: '请输入工程地址',
+            required: true,
-          trigger: 'blur'
+            message: '请输入工程地址',
-        }],
+            trigger: 'blur',
-        lon: [{
+          },
-          required: true,
+        ],
-          message: '请输入经度',
+        lon: [
-          trigger: 'blur'
+          {
-        }],
+            required: true,
-        lat: [{
+            message: '请输入经度',
-          required: true,
+            trigger: 'blur',
-          message: '请输入纬度',
+          },
-          trigger: 'blur'
+        ],
-        }]
+        lat: [
+          {
+            required: true,
+            message: '请输入纬度',
+            trigger: 'blur',
+          },
+        ],
       },
       //工程地址
       mapItems: {},
       gutterValue: parseInt('20', 10),
-      mainFormFields: [  // 主表单字段定义
+      mainFormFields: [
+        // 主表单字段定义
         {
           label: '工程地址',
           prop: 'proAddress',
           type: 'select',
           labelWidth: '120px',
           disabled: false,
-          options: this.proAddressOptions
+          options: this.proAddressOptions,
         },
         { label: '经度', prop: 'lon', type: 'input', labelWidth: '120px', disabled: true },
-        { label: '纬度', prop: 'lat', type: 'input', labelWidth: '120px', disabled: true }
+        { label: '纬度', prop: 'lat', type: 'input', labelWidth: '120px', disabled: true },
       ],
       formData: {
         // 承包商数量
@@ -321,53 +440,67 @@ export default {
             value: '',
             lon: '',
             lat: '',
-            key: Date.now()
+            key: Date.now(),
-          }
+          },
         ],
         //承包商
         consArr: [],
         //创建人
         createPerson: '',
         //创建时间
-        createTime: ''
+        createTime: '',
       },
       //主表单校验
       rules: {
-        proName: [{
+        proName: [
-          required: true,
+          {
-          message: '请输入工程名称',
+            required: true,
-          trigger: 'blur'
+            message: '请输入工程名称',
-        }],
+            trigger: 'blur',
-        proLeader: [{
+          },
-          required: true,
+        ],
-          message: '请输入工程负责人',
+        proLeader: [
-          trigger: 'blur'
+          {
-        }],
+            required: true,
-        proLeaderPhone: [{
+            message: '请输入工程负责人',
-          required: true,
+            trigger: 'blur',
-          message: '请输入负责人联系方式',
+          },
-          trigger: 'blur'
+        ],
-        }],
+        proLeaderPhone: [
-        supervisorUnit: [{
+          {
-          required: true,
+            required: true,
-          message: '请选择监理单位',
+            message: '请输入负责人联系方式',
-          trigger: 'change'
+            trigger: 'blur',
-        }],
+          },
-        startDate: [{
+        ],
-          required: true,
+        supervisorUnit: [
-          message: '请选择开工期日计划开工日期',
+          {
-          trigger: 'change'
+            required: true,
-        }],
+            message: '请选择监理单位',
-        endDate: [{
+            trigger: 'change',
-          required: true,
+          },
-          message: '请选择计划竣工日期',
+        ],
-          trigger: 'change'
+        startDate: [
-        }],
+          {
-        proType: [{
+            required: true,
-          required: true,
+            message: '请选择开工期日计划开工日期',
-          message: '请选择工程类型',
+            trigger: 'change',
-          trigger: 'change'
+          },
-        }]
+        ],
+        endDate: [
+          {
+            required: true,
+            message: '请选择计划竣工日期',
+            trigger: 'change',
+          },
+        ],
+        proType: [
+          {
+            required: true,
+            message: '请选择工程类型',
+            trigger: 'change',
+          },
+        ],
       },
       //工程类型下拉选
       proTypeOptions: [],
@@ -381,11 +514,11 @@ export default {
       //工程地址选项
       proAddressOptions: [],
       paramsData: {},
-      proId: ''
+      proId: '',
     }
   },
   created() {
-    this.proId = this.$route.params && this.$route.params.proId;
+    this.proId = this.$route.params && this.$route.params.proId
     this.getProType()
     this.getStatus()
     this.getProAddress()
@@ -394,8 +527,7 @@ export default {
     this.getSupervisionUnit()
     this.getData(this.proId)
   },
-  mounted() {
+  mounted() {},
-  },
   watch: {
     open: {
       handler(newVal, oldVal) {
@@ -405,15 +537,15 @@ export default {
           this.getProAddress()
         }
       },
-      deep: true // 监听对象或数组的变化
+      deep: true, // 监听对象或数组的变化
-    }
+    },
   },
   methods: {
     //获取工程类型
     getProType() {
       const params = {
         dictType: 'sys_pro_type',
-        dictValue: ''
+        dictValue: '',
       }
       dictTableOption(params).then(response => {
         this.proTypeOptions = response.data
@@ -423,7 +555,7 @@ export default {
     getStatus() {
       const params = {
         dictType: 'sys_pro_status',
-        dictValue: ''
+        dictValue: '',
       }
       dictTableOption(params).then(response => {
         this.proStatusOptions = response.data
@@ -474,11 +606,11 @@ export default {
         console.log(this.formData)
         if (!valid) {
           return false
-        }else{
+        } else {
-          if (this.hasDuplicates(this.formData.proAddress,'label')){
+          if (this.hasDuplicates(this.formData.proAddress, 'label')) {
             this.$message({
               message: '工程地址不能重复',
-              type: 'error'
+              type: 'error',
             })
             return false
           }
@@ -486,7 +618,7 @@ export default {
             if (response.code === 200) {
               this.$message({
                 message: '修改成功',
-                type: 'success'
+                type: 'success',
               })
               //关闭tab页
               this.$tab.closePage()
@@ -528,7 +660,7 @@ export default {
       this.form = {
         proAddress: undefined,
         lon: undefined,
-        lat: undefined
+        lat: undefined,
       }
       this.resetForm('proAddressForm')
     },
@@ -550,7 +682,7 @@ export default {
         value: '',
         lon: '',
         lat: '',
-        key: Date.now()
+        key: Date.now(),
       })
     },
     //移除工程地址选项
@@ -582,10 +714,8 @@ export default {
     closeMain() {
       this.open = false
       console.log('closeMain')
-    }
+    },
-  }
+  },
 }
-
 </script>
-<style>
+<style></style>
-</style>

src/views/pro/projectManagement/outsourcingPro/index.vue

@@ -278,6 +278,7 @@ export default {
     /** 修改按钮操作 */
     handleUpdate(row) {
       this.$router.push('/project/projectManagements/outsourcingPro/editOutsourcingPro/' + row.proId)
+      localStorage.setItem('proStatusUseInfo', row.proStatus)
     },
     /** 导出按钮操作 */
     handleExport() {