新增属性功能优化

src/views/lessor/equipment/equipType/index.vue

@@ -612,33 +612,24 @@
           </el-col>
         </el-row>
 
-            <div
+          <el-row :gutter="20">
-              v-for="(item, index) in propertyNames"
-              :key="index"
-              class="dynamic-item"
-            >
-              <el-row :gutter="24">
-                <el-col :span="12">
-                  <el-form-item label="属性" prop="attribute">
-                    <el-input
-                      v-model="propertyNames[index]"
-                      placeholder="请输入"
-                      maxlength="20"
-                      style="width: 100%"
-                    >
-                    </el-input>
-                  </el-form-item>
-                </el-col>
                 <el-col
-                  :span="2"
+                  :span="24"
                   style="
-                    margin-top: 10px;
+                    margin-bottom: 10px;
                     display: flex;
                     justify-content: left;
                     align-items: center;
                   "
                 >
-                  <i
+                  <el-button
+                      class="primary-lease"
+                      type="primary"
+                      @click="addPartItem"
+                  >
+                     新增属性
+                  </el-button>
+                  <!-- <i
                     class="el-icon-plus"
                     style="font-size: 20px; color: blue"
                     @click="addPartItem"
@@ -648,19 +639,58 @@
                     style="font-size: 20px; color: red"
                     v-if="index != 0"
                     @click="removePartItem(index)"
-                  ></i>
+                  ></i> -->
                 </el-col>
           </el-row>
-            </div>
+      </el-form>
+      <el-form
+            label-width="80px"
+            v-for="(item, index) in maTypeProperties"
+            :key="index"
+            :model="item"
+            :rules="maTypeRules"
+            ref="maTypeRef"
+            class="dynamic-item"
+            >
+              <el-row :gutter="24">
+                <el-col :span="12">
+                  <el-form-item label="属性描述" prop="propertyName">
+                    <el-input
+                      v-model="item.propertyName"
+                      placeholder="请输入"
+                      maxlength="20"
+                      style="width: 100%"
+                    >
+                    </el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                  <el-form-item label="是否必填" prop="mustHave">
+                    <el-radio-group v-model="item.mustHave">
+                      <el-radio label=1>是</el-radio>
+                      <el-radio label=0>否</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                </el-col>
+               <el-col :span="4" v-if="index !== 0">
+                        <el-button
+                            size="small"
+                            type="danger"
+                            class="primary-lease"
+                            @click="removePartItem(index)"
+                        >
+                            移除
+                        </el-button>
+                </el-col>
+              </el-row>
+      </el-form>
         <el-row style="text-align: right">
-          <el-form-item>
+          
             <el-button size="small" type="primary" @click="onSubmit"
               >确 定</el-button
             >
             <el-button size="small" @click="onCancel">取 消</el-button>
-          </el-form-item>
         </el-row>
-      </el-form>
     </el-dialog>
 
     <!-- 修改价格弹框 -->
@@ -802,6 +832,23 @@ export default {
         ],
       },
 
+      maTypeRules:{
+        propertyName: [
+          {
+            required: true,
+            message: "属性描述不能为空",
+            trigger: "blur",
+          },
+        ],
+        mustHave: [
+          {
+            required: true,
+            message: "请选择是否为空",
+            trigger: "blur",
+          },
+        ],
+      },
+
       // 表单校验
       rules: {
         typeName: [
@@ -878,6 +925,8 @@ export default {
         //   }
         // ]
       },
+
+
       companyId: undefined,
       dialogImageUrl: "",
       dialogVisible: false,
@@ -901,6 +950,7 @@ export default {
         // ],
       },
 
+
       /* 新增弹框等数据源定义 */
       addTitleVisible: false,
       addTitle: "", // 新增弹框标题
@@ -923,7 +973,7 @@ export default {
       editTypeIds: [],
       batchEdit: true,
 
-      propertyNames: [''],
+      maTypeProperties: [{'propertyName':'','mustHave': null}],
     };
   },
   watch: {
@@ -1226,7 +1276,7 @@ export default {
 
     /* 树节点增加 */
     appendTreeNode(data) {
-      this.propertyNames = [];
+      this.maTypeProperties = [];
       if (data.level === 3) {
         this.reset();
         Object.assign(this.form, data);
@@ -1259,15 +1309,15 @@ export default {
     editTreeNode(data) {
       console.log(data, "修改");
       if(data.level!=2){
-      this.propertyNames= []
+      this.maTypeProperties= []
       Object.assign(this.addFormParams, data);
       this.addTitle = "修改";
       this.addFormParams.typeName = data.label;
       this.addTitleVisible = true;
       }else{
-      this.propertyNames= ['']
+      this.maTypeProperties= [{'propertyName':'','mustHave':null}]
-      if(data.propertyNames!=null){
+      if(data.maTypeProperties!=null){
-      this.propertyNames = data.propertyNames
+      this.maTypeProperties = data.maTypeProperties
       }
       Object.assign(this.addFormParams, data);
       this.addTitle = "修改";
@@ -1286,11 +1336,14 @@ export default {
         typeId: id,
         typeName,
         parentId,
-        propertyNames:this.propertyNames,
+        maTypeProperties:this.maTypeProperties,
       };
 
-      this.$refs["addFormParamsRef"].validate(async (valid) => {
+      this.$refs["addFormParamsRef"].validate( (valid) => {
         if (valid) {
+           this.$refs["maTypeRef"].forEach((formRef)=>{
+            formRef.validate(async(validTemp)=>{
+              if(validTemp){
                 if (this.addTitle === "新增") {
                   const res = await addMaType(addParams);
                   if (res.code === 200) {
@@ -1305,15 +1358,18 @@ export default {
                     this.addTitleVisible = false;
                     this.getTreeData();
                   }
-            this.propertyNames = [];
+                  this.maTypeProperties = [];
                 }
               }
+            })
+           })
+        }
       });
     },
     /* 取消 */
     onCancel() {
       this.addTitleVisible = false;
-      this.propertyNames = ['']
+      this.maTypeProperties = ['']
     },
     getParentName(list, id) {
       try {
@@ -1386,11 +1442,11 @@ export default {
 
     //新增属性
     addPartItem() {
-      this.propertyNames.push('');
+      this.maTypeProperties.push({'propertyName':'','mustHave': null});
     },
     removePartItem(index) {
-      if (this.propertyNames.length > 1) {
+      if (this.maTypeProperties.length > 1) {
-        this.propertyNames.splice(index, 1);
+        this.maTypeProperties.splice(index, 1);
       }
     },
   },