填写节点信息组件完善

src/components/ConstructionDetails/index.vue

@@ -43,14 +43,15 @@
             <hr>
             <!--  用料明细 -->
             <div
-                v-for="(i,idx) in e.zEngineeringMaterialBo"
-                :key="idx"
+                v-for="(i,index) in e.zEngineeringMaterialBo"
+                :key="index"
               >
-                <el-form :model="formModel">
+                <el-form :model="nodeInfo" class="nodeForm">
                     <el-form-item
                       :prop="i.materialQuality"
                       label-width="50px"
                       label="材质"
+                      v-show="i.materialQuality != null"
 
                       >
                       <!--                  :rules="{required: true, message: '请输入材质', trigger: 'blur'}"-->
@@ -64,20 +65,90 @@
                           ></el-option>
                       </el-select>
                     </el-form-item>
+                    <el-form-item
+                      :prop="i.specifications"
+                      label-width="50px"
+                      label="规格"
+                      v-show="i.specifications != null"
+
+                      >
+                      <el-select v-model="i.specifications" placeholder="请选择规格" style="width: 100%" @change="getEnginSpecificationsList(item, index)">
+                          <el-option
+                          v-for="e in specificationsList"
+                          :key="e.id"
+                          :label="e.name"
+                          :value="e.id"
+                          ></el-option>
+                      </el-select>
+                    </el-form-item>
+                    <el-form-item
+                      :prop="i.number"
+                      label-width="50px"
+                      label="数量"
+
+                      >
+                      <div class="block" style="display: inline-block; margin-right: 20px;">
+                          <el-input v-model="i.number" placeholder="请输入数量" style="width: 100%" maxlength="8" type="number"/>
+                      </div>
+                    </el-form-item>
+
+                    <el-form-item
+                      :prop="i.corrosionLevel"
+                      label="腐蚀等级"
+                      v-show="i.corrosionLevel != null"
+
+                      >
+                      <!--                  :rules="{required: true, message: '请输入材质', trigger: 'blur'}"-->
+                      <!--                  <el-input v-model="item.materialQuality" placeholder="请输入材质" style="width: 100%"/>-->
+                      <el-select v-model="i.corrosionLevel" placeholder="请选择腐蚀等级" style="width: 100%" @change="getEnginSpecificationsList(item, index)">
+                          <el-option
+                          v-for="e in corrosionLevelList"
+                          :key="e.dictValue"
+                          :label="e.dictLabel"
+                          :value="e.dictValue"
+                          ></el-option>
+                      </el-select>
+                    </el-form-item>
+                    <el-form-item
+                      :prop="i.visitType"
+                      label-width="50px"
+                      label="上门类型"
+                      v-show="i.visitType != null"
+
+                      >
+                      <!--                  :rules="{required: true, message: '请输入材质', trigger: 'blur'}"-->
+                      <!--                  <el-input v-model="item.materialQuality" placeholder="请输入材质" style="width: 100%"/>-->
+                      <el-select v-model="i.visitType" placeholder="请选择上门类型" style="width: 100%" @change="getEnginSpecificationsList(item, index)">
+                          <el-option
+                          v-for="e in dict.type.visit_type"
+                          :key="e.value"
+                          :label="e.label"
+                          :value="e.value"
+                          ></el-option>
+                      </el-select>
+                    </el-form-item>
+                    <el-form-item
+                      :prop="i.selfClosingValveType"
+                      label-width="50px"
+                      label="自闭阀类型"
+                      v-show="i.selfClosingValveType != null"
+
+                      >
+                      <!--                  :rules="{required: true, message: '请输入材质', trigger: 'blur'}"-->
+                      <!--                  <el-input v-model="item.materialQuality" placeholder="请输入材质" style="width: 100%"/>-->
+                      <el-select v-model="i.selfClosingValveType" placeholder="请选择自闭阀类型" style="width: 100%" @change="getEnginSpecificationsList(item, index)">
+                          <el-option
+                          v-for="e in dict.type.self_closing_valve_type"
+                          :key="e.value"
+                          :label="e.label"
+                          :value="e.value"
+                          ></el-option>
+                      </el-select>
+                    </el-form-item>
                 </el-form>
                 <!-- <el-input size="mini" v-if="i.brand" style="width: 80%" v-model="i.brand" placeholder="请输入品牌">
                   <template slot="prepend">品牌</template>
                 </el-input>
-                <el-input size="mini" v-if="i.materialQualityName" v-model="i.materialQualityName"
-                          placeholder="请输入品牌">
-                  <template slot="prepend">材质</template>
-                </el-input>
-                <el-input size="mini" v-if="i.specificationsName" v-model="i.specificationsName" placeholder="请输入品牌">
-                  <template slot="prepend">规格</template>
-                </el-input>
-                <el-input size="mini" v-if="i.number" v-model="i.number" placeholder="请输入品牌">
-                  <template slot="prepend">数量</template>
-                </el-input>
                 <el-input v-if="i.visitType" size="mini" v-model="i.visitType" placeholder="请输入品牌">
                   <template slot="prepend">上门类型</template>
                 </el-input>
@@ -89,19 +160,23 @@
                   <template slot="prepend">自闭阀类型</template>
                 </el-input> -->
             </div>
+            <!-- <el-form-item label="照片" :prop="e.zEngiineeringPhotoBoList" class="obsImage"> -->
+              <ObsImageUpload
+                class="obsImageUpload"
+                ref="obsImageUpload"
+                :limit="9999"
+                :fileType="['png', 'jpg', 'jpeg']"
+                @input="getUrl"
+                :value="e.zEngiineeringPhotoBoList"
+                :disabled="false"
+              ></ObsImageUpload>
+            <!-- </el-form-item> -->
             <hr>
-
-            <ObsImageUpload
-              ref="obsImageUpload"
-              :limit="9999"
-              :fileType="['png', 'jpg', 'jpeg']"
-              disabled
-              :value="e.zEngiineeringPhotoBoList"
-            ></ObsImageUpload>
           </el-collapse-item>
         </el-collapse>
       </el-tab-pane>
       <!--                  <el-button class="check" @click="checkWorking">审核</el-button>-->
+      <button @click="updateNodeOption">修改</button>
     </el-tabs>
   </el-dialog>
 </template>
@@ -130,6 +205,15 @@ export default {
       materialQualityList:[],                     // 材质
       specificationsList:[],                      // 规格
       materialComponList:[],
+      nodeInfo:{
+          backfillTime:'',                        // 回填时间
+          constructTime:'',
+          constructAccordingDrawings:'',
+          segmentedCompressionQualified:'',
+          zEngiineeringPhotoBoList:[],            // 照片集合
+          zEngineeringMaterialBo:[],              // 用料集合
+          remark:'',
+      },
     }
   },
   created(){
@@ -155,7 +239,13 @@ export default {
       this.activeNames = item1[0].value
       this.$parent.viewNodeSource(item1[0].value)
     },
-    immediate: true // watch侦听操作内的函数会立刻被执行
+    currentCollapses(){
+      console.log(this.currentCollapses[0].zEngineeringMaterialBo[0].materialQuality)
+      getEnginSpecificationsList({materId:this.currentCollapses[0].zEngineeringMaterialBo[0].materialQuality}).then(res => {
+        console.log('规格',res.data)
+        this.specificationsList = res.data
+      })
+    }
   },
   methods: {
     // 查看单节点历史
@@ -167,6 +257,9 @@ export default {
     checkWorking() {
 
     },
+    updateNodeOption(){
+      console.log('最新面板',this.currentCollapses)
+    },
     // 查看历史
     open(dicts, type = null) {
 
@@ -195,12 +288,36 @@ export default {
       }
 
       this.dialogVisible = true
-    }
+    },
+    // 获取材质规格
+    getEnginSpecificationsList(e,idx){
+        getEnginSpecificationsList({materId:e.materialQuality}).then(res => {
+            console.log('规格',res.data)
+            this.specificationsList = res.data
+        })
+    },
+    getUrl(url,idx) {
+      this.$refs.obsImageUpload.fileList ? this.$refs.obsImageUpload.fileList.map(e=>e.url):[];
+    },
   }
 }
 </script>
 
 <style lang="scss" scoped>
+
+::v-deep .nodeForm{
+  .el-form-item__content{
+    display: flex;
+  }
+}
+::v-deep .obsImageUpload{
+  .el-upload--picture-card{
+    display: block !important;
+  }
+}
+::v-deep .obsImageUpload >div{
+  display: flex;
+}
 ::v-deep .el-dialog {
   height: 85%;