From 0311f3bf35ba7687313a20df8c66681f292d28b4 Mon Sep 17 00:00:00 2001
From: xiaohuang <1559741705@qq.com>
Date: Tue, 2 Apr 2024 17:33:40 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=84=E6=A0=BC=E5=B1=9E=E6=80=A7=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/CheckAttribute/index.vue      | 296 +++++++++----------
 src/components/CheckAttributeGroup/index.vue | 101 +++----
 src/views/product/category/index.vue         |   6 +-
 src/views/product/rule/index.vue             | 256 ++++++++++++----
 4 files changed, 376 insertions(+), 283 deletions(-)

diff --git a/src/components/CheckAttribute/index.vue b/src/components/CheckAttribute/index.vue
index 5d6397d..5b20ab3 100644
--- a/src/components/CheckAttribute/index.vue
+++ b/src/components/CheckAttribute/index.vue
@@ -1,176 +1,156 @@
-
 <template>
-
-    <el-row>
-        <el-card class="box-card">
-            <div slot="header" class="clearfix">
-                <span>选择属性关联关系</span>
-            </div>
-            <el-card class="box-card">
-                <div slot="header" class="clearfix">
-                    <span>已选择属性</span>
-                </div>
-
-                <!--              <el-row>-->
-                <!--                <el-tag>标签一</el-tag>-->
-                <!--                <el-tag type="success">标签二</el-tag>-->
-                <!--                <el-tag type="info">标签三</el-tag>-->
-                <!--                <el-tag type="warning">标签四</el-tag>-->
-                <!--                <el-tag type="danger">标签五</el-tag>-->
-                <!--              </el-row>-->
-                <el-row>
-                    <el-col :span="2" v-for="(attribute, index) in checkedAttributeList">
-                        <el-tag
-                                style="margin: 5px 10px"
-                                :key="attribute.name"
-                                closable @close="removeChecked(index)">
-                            {{attribute.name}}
-                        </el-tag>
-                    </el-col>
-
-
-                </el-row>
-
-            </el-card>
-
-            <el-divider></el-divider>
-
-            <el-card class="box-card">
-                <div slot="header" class="clearfix">
-                    <span>未选属性</span>
-                </div>
-
-                <el-row>
-                    <el-form :inline="true" :model="attributeQuery" class="demo-form-inline">
-                        <el-form-item label="屬性編碼">
-                            <el-input v-model="attributeQuery.code" placeholder="屬性編碼"></el-input>
-                        </el-form-item>
-                    </el-form>
-
-                    <el-form :inline="true" :model="attributeQuery" class="demo-form-inline">
-                        <el-form-item label="屬性名稱">
-                            <el-input v-model="attributeQuery.name" placeholder="屬性名稱"></el-input>
-                        </el-form-item>
-
-                        <el-form-item>
-                            <el-button type="primary" @click="queryAttribute">查询</el-button>
-                        </el-form-item>
-                    </el-form>
-                </el-row>
-
-                <el-row >
-                    <el-col style="padding: 5px 10px" :span="3" v-for="attribute in attributeList">
-                        <el-checkbox
-                                v-model="attributeIdList"
-                                :key="attribute.id"
-                                :value="attribute.id"
-                                :label="attribute.id"
-                                @change="checkedAttribute(attribute)"
-                                border>{{attribute.name}}</el-checkbox>
-                    </el-col>
-                </el-row>
-
-                <pagination
-                        v-show="total>0"
-                        :total="total"
-                        :page.sync="attributeQuery.pageNum"
-                        :limit.sync="attributeQuery.pageSize"
-                        @pagination="queryAttribute"
-                />
-            </el-card>
-        </el-card>
-    </el-row>
+  <el-row>
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>选择属性关联关系</span>
+      </div>
+      <el-card class="box-card">
+        <div slot="header" class="clearfix">
+          <span>已选择属性</span>
+        </div>
+        <el-row>
+          <el-col :span="2" v-for="(attribute, index) in checkedAttributeList">
+            <el-tag
+              style="margin: 5px 10px"
+              :key="attribute.name"
+              closable @close="removeChecked(index)">
+              {{ attribute.name }}
+            </el-tag>
+          </el-col>
+        </el-row>
+      </el-card>
+      <el-divider></el-divider>
+      <el-card class="box-card">
+        <div slot="header" class="clearfix">
+          <span>未选属性</span>
+        </div>
+        <el-row>
+          <el-form :inline="true" :model="attributeQuery" class="demo-form-inline">
+            <el-form-item label="属性编码">
+              <el-input v-model="attributeQuery.code" placeholder="属性编码"></el-input>
+            </el-form-item>
+            <el-form-item label="属性名称">
+              <el-input v-model="attributeQuery.name" placeholder="属性名称"></el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="queryAttribute">查询</el-button>
+            </el-form-item>
+          </el-form>
+        </el-row>
+        <el-row>
+          <el-col style="padding: 5px 10px" :span="3" v-for="attribute in attributeList">
+            <el-checkbox
+              v-model="attributeIdList"
+              :key="attribute.id"
+              :value="attribute.id"
+              :label="attribute.id"
+              @change="checkedAttribute(attribute)"
+              border>{{ attribute.name }}
+            </el-checkbox>
+          </el-col>
+        </el-row>
+        <pagination
+          v-show="total>0"
+          :total="total"
+          :page.sync="attributeQuery.pageNum"
+          :limit.sync="attributeQuery.pageSize"
+          @pagination="queryAttribute"
+        />
+      </el-card>
+    </el-card>
+  </el-row>
 </template>
 
 <script>
 import {listAttribute} from "@/api/product/attribute";
 
-
 export default {
-    name: "CheckAttribute",
-    props:{
-      value:{
-        type:Array,
-        default: []
-      }
-  },
-
-
-  watch: {
-      value: {
-        handler(val){
-          if (val.toString() !== this.attributeIdList.toString()){
-            this.attributeIdList = val;
-            this.checkedAttributeList = []
-          }
-        },
-        immediate :true,
-      }
-  },
-
-    data(){
-        return{
-            attributeIdList: [],
-            checkedAttributeList: [],
-            attributeQuery:{
-                pageNum: 1,
-                pageSize: 10,
-                code: null,
-                name: null
-            },
-            attributeTotal: 0,
-            attributeList: []
-        }
+  name: "CheckAttribute",
+  props: {
+    value: {
+      type: Array,
+      default: []
     },
-
+    checkedList: {
+      type: Array,
+      default: null
+    }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        if (val.toString() !== this.attributeIdList.toString()){
+          this.attributeIdList = val;
+          this.checkedAttributeList = []
+        }
+      },
+      immediate: true,
+    },
+    checkedList: {
+      handler(val){
+        if (val !== undefined && val.length > 0){
+          this.checkedAttributeList = val;
+          this.attributeIdList = this.checkedAttributeList.map(checked => checked.id);
+        }
+      },
+      immediate: true
+    }
+  },
+  data() {
+    return {
+      attributeIdList: [],
+      checkedAttributeList: [],
+      attributeQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        code: null,
+        name: null
+      },
+      attributeTotal: 0,
+      attributeList: []
+    }
+  },
   created() {
     this.queryAttribute();
   },
-
   methods: {
-        /**
-         * 选中值触发方法
-         */
-        checkedAttribute(attribute){
-            let isCheck = this.attributeIdList.indexOf(attribute.id) > -1;
-            if (isCheck){
-                this.checkedAttributeList.push(attribute);
-            }else {
-                //删除
-                this.checkedAttributeList.splice(
-                    this.checkedAttributeList.indexOf(attribute),1
-                )
-            }
-            this.$emit("input", this.attributeIdList);
-        },
+    /**
+     * 选中值触发方法
+     */
+    checkedAttribute(attribute) {
+      let isCheck = this.attributeIdList.indexOf(attribute.id) > -1;
+      if (isCheck) {
+        this.checkedAttributeList.push(attribute);
+      } else {
+        // 删除
+        this.checkedAttributeList.splice(
+          this.checkedAttributeList.indexOf(attribute), 1
+        )
+      }
+      this.$emit("input", this.attributeIdList);
+    },
+    /**
+     * 删除选中值
+     * @param index
+     */
+    removeChecked(index) {
+      this.checkedAttributeList.splice(index, 1);
+      this.attributeIdList.splice(index, 1);
+    },
 
-
-        /**
-         * 删除选中值
-         * @param index
-         */
-        removeChecked(index){
-            console.log(index)
-            this.checkedAttributeList.splice(index,1);
-            this.attributeIdList.splice(index,1);
-        },
-
-        /**
-         * 查詢屬性
-         */
-        queryAttribute(){
-
-            listAttribute(this.attributeQuery).then(response => {
-                this.attributeList = response.data.rows;
-                this.total = response.data.total;
-                this.loading = false;
-            });
-        },
-
-    }
+    /**
+     * 查询属性
+     */
+    queryAttribute() {
+      listAttribute(this.attributeQuery).then(response => {
+        this.attributeList = response.data.rows;
+        this.total = response.data.total;
+      });
+    },
+  }
 }
 </script>
 
-<style scoped lang="scss">
+<style scoped>
 
 </style>
diff --git a/src/components/CheckAttributeGroup/index.vue b/src/components/CheckAttributeGroup/index.vue
index 2945f3a..d857d81 100644
--- a/src/components/CheckAttributeGroup/index.vue
+++ b/src/components/CheckAttributeGroup/index.vue
@@ -1,6 +1,4 @@
-
 <template>
-
   <el-row>
     <el-card class="box-card">
       <div slot="header" class="clearfix">
@@ -10,55 +8,33 @@
         <div slot="header" class="clearfix">
           <span>已选择属性组</span>
         </div>
-
-        <!--              <el-row>-->
-        <!--                <el-tag>标签一</el-tag>-->
-        <!--                <el-tag type="success">标签二</el-tag>-->
-        <!--                <el-tag type="info">标签三</el-tag>-->
-        <!--                <el-tag type="warning">标签四</el-tag>-->
-        <!--                <el-tag type="danger">标签五</el-tag>-->
-        <!--              </el-row>-->
         <el-row>
           <el-col :span="2" v-for="(attributeGroup, index) in checkedAttributeGroupList">
             <el-tag
               style="margin: 5px 10px"
               :key="attributeGroup.name"
               closable @close="removeChecked(index)">
-              {{attributeGroup.name}}
+              {{ attributeGroup.name }}
             </el-tag>
           </el-col>
-
-
         </el-row>
-
       </el-card>
-
       <el-divider></el-divider>
-
       <el-card class="box-card">
         <div slot="header" class="clearfix">
           <span>未选属性组</span>
         </div>
-
         <el-row>
           <el-form :inline="true" :model="attributeGroupQuery" class="demo-form-inline">
-            <el-form-item label="屬性編碼">
-              <el-input v-model="attributeGroupQuery.code" placeholder="屬性編碼"></el-input>
+            <el-form-item label="属性组名称">
+              <el-input v-model="attributeGroupQuery.name" placeholder="属性名称"></el-input>
             </el-form-item>
-          </el-form>
-
-          <el-form :inline="true" :model="attributeGroupQuery" class="demo-form-inline">
-            <el-form-item label="屬性名稱">
-              <el-input v-model="attributeGroupQuery.name" placeholder="屬性名稱"></el-input>
-            </el-form-item>
-
             <el-form-item>
               <el-button type="primary" @click="queryAttributeGroup">查询</el-button>
             </el-form-item>
           </el-form>
         </el-row>
-
-        <el-row >
+        <el-row>
           <el-col style="padding: 5px 10px" :span="3" v-for="attributeGroup in attributeGroupList">
             <el-checkbox
               v-model="attributeGroupIdList"
@@ -66,10 +42,10 @@
               :value="attributeGroup.id"
               :label="attributeGroup.id"
               @change="checkedAttributeGroup(attributeGroup)"
-              border>{{attributeGroup.name}}</el-checkbox>
+              border>{{ attributeGroup.name }}
+            </el-checkbox>
           </el-col>
         </el-row>
-
         <pagination
           v-show="total>0"
           :total="total"
@@ -85,93 +61,92 @@
 <script>
 import {listAttributeGroup} from "@/api/product/attributeGroup";
 
-
 export default {
   name: "CheckAttributeGroup",
-  props:{
-    value:{
-      type:Array,
+  props: {
+    value: {
+      type: Array,
       default: []
+    },
+    checkedList: {
+      type: Array,
+      default: null
     }
   },
-
-
-  data(){
-    return{
+  data() {
+    return {
       attributeGroupIdList: [],
       checkedAttributeGroupList: [],
-      attributeGroupQuery:{
+      attributeGroupQuery: {
         pageNum: 1,
         pageSize: 10,
-        code: null,
         name: null
       },
       attributeGroupTotal: 0,
       attributeGroupList: []
     }
   },
-
   watch: {
     value: {
-      handler(val){
+      handler(val) {
         if (val.toString() !== this.attributeGroupIdList.toString()){
           this.attributeGroupIdList = val;
           this.checkedAttributeGroupList = []
         }
       },
-      immediate :true,
+      immediate: true,
+    },
+    checkedList: {
+      handler(val){
+        if (val !== undefined && val.length > 0){
+          this.checkedAttributeGroupList = val;
+          this.attributeGroupIdList = this.checkedAttributeGroupList.map(checked => checked.id);
+        }
+      },
+      immediate: true
     }
   },
-
   created() {
     this.queryAttributeGroup();
   },
-
   methods: {
     /**
      * 选中值触发方法
      */
-    checkedAttributeGroup(attributeGroup){
+    checkedAttributeGroup(attributeGroup) {
       let isCheck = this.attributeGroupIdList.indexOf(attributeGroup.id) > -1;
-      if (isCheck){
+      if (isCheck) {
         this.checkedAttributeGroupList.push(attributeGroup);
-      }else {
-        //删除
+      } else {
+        // 删除
         this.checkedAttributeGroupList.splice(
-          this.checkedAttributeGroupList.indexOf(attributeGroup),1
+          this.checkedAttributeGroupList.indexOf(attributeGroup), 1
         )
       }
       this.$emit("input", this.attributeGroupIdList);
     },
-
-
     /**
      * 删除选中值
      * @param index
      */
-    removeChecked(index){
-      console.log(index)
-      this.checkedAttributeGroupList.splice(index,1);
-      this.attributeGroupIdList.splice(index,1);
+    removeChecked(index) {
+      this.checkedAttributeGroupList.splice(index, 1);
+      this.attributeGroupIdList.splice(index, 1);
     },
 
     /**
-     * 查詢屬性
+     * 查询属性
      */
-    queryAttributeGroup(){
-
+    queryAttributeGroup() {
       listAttributeGroup(this.attributeGroupQuery).then(response => {
         this.attributeGroupList = response.data.rows;
         this.total = response.data.total;
-        this.loading = false;
       });
     },
-
   }
 }
 </script>
 
-<style scoped lang="scss">
+<style scoped>
 
 </style>
-
diff --git a/src/views/product/category/index.vue b/src/views/product/category/index.vue
index ef2d5aa..f2015df 100644
--- a/src/views/product/category/index.vue
+++ b/src/views/product/category/index.vue
@@ -152,15 +152,15 @@
         <el-tabs value="attribute" type="card" >
 
           <el-tab-pane label="商品属性" name="attribute">
-           <CheckAttribute v-model="form.attributeGroupList"/>
+           <CheckAttribute v-model="form.attributeIdList" :checked-list="attributeInfoList"/>
           </el-tab-pane>
 
           <el-tab-pane label="商品属性组" name="attributeGroup">
-            <CheckAttributeGroup v-model="form.attributeGroupList"/>
+            <CheckAttributeGroup v-model="form.attributeGroupList" :checked-list="attributeGroupList"/>
           </el-tab-pane>
 
           <el-tab-pane label="商品品牌" name="brand">
-            <CheckBrandGroup v-model="form.attributeGroupList"/>
+            <CheckBrandGroup v-model="form.brandIdList" :checked-list="brandInfoList"/>
           </el-tab-pane>
         </el-tabs>
 
diff --git a/src/views/product/rule/index.vue b/src/views/product/rule/index.vue
index 6d23546..102c54a 100644
--- a/src/views/product/rule/index.vue
+++ b/src/views/product/rule/index.vue
@@ -116,54 +116,107 @@
         <el-form-item label="备注" prop="remark">
           <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
         </el-form-item>
-        <el-row v-for="(ruleAttr, index) in form.ruleAttrList">
-          <el-row style="margin: 20px 0">
-            <el-tag
-              :key="ruleAttr.name"
-              @close="removeRule(index)"
-              closable>
-              {{ruleAttr.name}}
-            </el-tag>
-          </el-row>
-          <el-row style="margin: 10px 0">
-            <el-tag
-              style="float: left; margin-right: 20px"
-              v-for="(ruleProperty, index) in ruleAttr.valueList"
-              :key="ruleProperty"
-              @close="removeRuleProperty(ruleAttr.valueList, index)"
-              closable>
-              {{ruleProperty}}
-            </el-tag>
-            <el-button v-if="!ruleAttr.ruleAttrAddStatus" @click="ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus" size="mini">添加</el-button>
-            <el-input v-if="ruleAttr.ruleAttrAddStatus"
-                      v-model="addRulePropertyValue"
-                      @blur="addRuleProperty(ruleAttr, false)"
-                      @keyup.enter.native="addRuleProperty(ruleAttr, true)"
-                      size="mini" placeholder="请输入规格属性值" style="float: left; width: 150px"/>
-          </el-row>
-          <el-divider></el-divider>
-        </el-row>
+<!--        <el-row v-for="(ruleAttr, index) in form.ruleAttrList">-->
+<!--          <el-row style="margin: 20px 0">-->
+<!--            <el-tag-->
+<!--              :key="ruleAttr.name"-->
+<!--              @close="removeRule(index)"-->
+<!--              closable>-->
+<!--              {{ruleAttr.name}}-->
+<!--            </el-tag>-->
+<!--          </el-row>-->
+<!--          <el-row style="margin: 10px 0">-->
+<!--            <el-tag-->
+<!--              style="float: left; margin-right: 20px"-->
+<!--              v-for="(ruleProperty, index) in ruleAttr.valueList"-->
+<!--              :key="ruleProperty"-->
+<!--              @close="removeRuleProperty(ruleAttr.valueList, index)"-->
+<!--              closable>-->
+<!--              {{ruleProperty}}-->
+<!--            </el-tag>-->
+<!--            <el-button v-if="!ruleAttr.ruleAttrAddStatus" @click="ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus" size="mini">添加</el-button>-->
+<!--            <el-input v-if="ruleAttr.ruleAttrAddStatus"-->
+<!--                      v-model="addRulePropertyValue"-->
+<!--                      @blur="addRuleProperty(ruleAttr, false)"-->
+<!--                      @keyup.enter.native="addRuleProperty(ruleAttr, true)"-->
+<!--                      size="mini" placeholder="请输入规格属性值" style="float: left; width: 150px"/>-->
+<!--          </el-row>-->
+<!--          <el-divider></el-divider>-->
+<!--        </el-row>-->
+<!--        <el-button v-if="!ruleAddFormStatus" @click="ruleAddFormStatus = !ruleAddFormStatus">添加规格</el-button>-->
+<!--        <el-form v-if="ruleAddFormStatus" :inline="true" :model="ruleAddForm" class="demo-form-inline">-->
+<!--          <el-form-item label="规格名称">-->
+<!--            <el-input v-model="ruleAddForm.name" placeholder="请输入规格名称"></el-input>-->
+<!--          </el-form-item>-->
+<!--          <el-form-item label="规格属性">-->
+<!--            <el-input v-model="ruleAddForm.valueList" placeholder="请输入规格属性"></el-input>-->
+<!--          </el-form-item>-->
+<!--          <el-form-item>-->
+<!--            <el-button type="primary" @click="ruleAddFormFun">添加</el-button>-->
+<!--          </el-form-item>-->
+<!--        </el-form>-->
+<!--      </el-form>-->
+
+   <el-row v-for="(ruleAttr,index) in form.ruleAttrList">
+     <el-row style="margin: 20px 0">
+       <el-tag
+         key="ruleAttr.name"
+         @close="removeRule(index)"
+         closable>
+         {{ruleAttr.name}}
+       </el-tag>
+     </el-row>
+
+     <el-row style="margin: 10px 0">
+       <el-tag
+         style="float: left;margin-right: 20px"
+         v-for="(ruleProperty, index) in ruleAttr.valueList"
+         :key="ruleProperty"
+         @close="removeRuleProperty(ruleAttr.valueList, index)"
+         closable>
+         {{ruleProperty}}
+       </el-tag>
+
+       <el-button v-if="!ruleAttr.ruleAttrAddStatus" @click="ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus" size="mini">添加</el-button>
+       <el-input v-if="ruleAttr.ruleAttrAddStatus"
+                 v-model="addRulePropertyValue"
+                 @blur="addRuleProperty(ruleAttr, false)"
+                 @keyup.enter.native="addRuleProperty(ruleAttr,true)"
+                 size="mini" placeholder="请输入规格属性值" style="float: left; width: 150px"/>
+
+     </el-row>
+
+     <el-divider></el-divider>
+
+   </el-row>
+
         <el-button v-if="!ruleAddFormStatus" @click="ruleAddFormStatus = !ruleAddFormStatus">添加规格</el-button>
+
         <el-form v-if="ruleAddFormStatus" :inline="true" :model="ruleAddForm" class="demo-form-inline">
           <el-form-item label="规格名称">
             <el-input v-model="ruleAddForm.name" placeholder="请输入规格名称"></el-input>
           </el-form-item>
+
           <el-form-item label="规格属性">
             <el-input v-model="ruleAddForm.valueList" placeholder="请输入规格属性"></el-input>
           </el-form-item>
+
           <el-form-item>
             <el-button type="primary" @click="ruleAddFormFun">添加</el-button>
           </el-form-item>
         </el-form>
       </el-form>
+
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
         <el-button @click="cancel">取 消</el-button>
       </div>
+
     </el-dialog>
   </div>
 </template>
 
+
 <script>
 import { listRule, getRule, delRule, addRule, updateRule } from "@/api/product/rule";
 
@@ -207,34 +260,111 @@ export default {
           { required: true, message: "创建时间不能为空", trigger: "blur" }
         ],
       },
+
       ruleAddForm: {
         name: null,
         valueList: null,
       },
       ruleAddFormStatus: false,
-      addRulePropertyValue: null
+      addRulePropertyValue: null,
+
+      // ruleAddForm: {
+      //   name: null,
+      //   valueList: null,
+      // },
+      // ruleAddFormStatus: false,
+      // addRulePropertyValue: null
     };
   },
   created() {
     this.getList();
   },
   methods: {
-    removeRule(index){
-      this.form.ruleAttrList.splice(index, 1);
+    // removeRule(index){
+    //   this.form.ruleAttrList.splice(index, 1);
+    // },
+    // removeRuleProperty(valueList,index){
+    //   valueList.splice(index, 1);
+    // },
+    // addRuleProperty(ruleAttr, continuousInput){
+    //   if (this.addRulePropertyValue === null || this.addRulePropertyValue === 0){
+    //     if (!continuousInput){
+    //       ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus
+    //     }
+    //     return;
+    //   }
+    //   if (ruleAttr.valueList.indexOf(this.addRulePropertyValue) > -1){
+    //     this.$message({
+    //       message: `规格[${ruleAttr.name}]属性值[${this.addRulePropertyValue}]已经存在`,
+    //       type: 'warning'
+    //     });
+    //     return;
+    //   }
+    //   ruleAttr.valueList.push(this.addRulePropertyValue)
+    //   this.addRulePropertyValue = null;
+    //   if (!continuousInput){
+    //     ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus
+    //   }
+    // },
+    // ruleAddFormFun(){
+    //   if (this.ruleAddForm.name === null || this.ruleAddForm.name.length === 0){
+    //     this.$message({
+    //       message: '规格名称不可为空',
+    //       type: 'warning'
+    //     });
+    //     return;
+    //   }
+    //   if (this.ruleAddForm.valueList === null || this.ruleAddForm.valueList.length === 0){
+    //     this.$message({
+    //       message: '规格属性不可为空',
+    //       type: 'warning'
+    //     });
+    //     return;
+    //   }
+    //
+    //   let ruleAttr = this.form.ruleAttrList.find(ruleAttr => ruleAttr.name === this.ruleAddForm.name);
+    //   if (ruleAttr === undefined){
+    //     this.form.ruleAttrList.push({
+    //       "name": this.ruleAddForm.name,
+    //       "valueList": [this.ruleAddForm.valueList],
+    //       "ruleAttrAddStatus": false
+    //     })
+    //   }else {
+    //     if (ruleAttr.valueList.indexOf(this.ruleAddForm.valueList) > -1){
+    //       this.$message({
+    //         message: `规格[${this.ruleAddForm.name}]属性值[${this.ruleAddForm.valueList}]已经存在`,
+    //         type: 'warning'
+    //       });
+    //       return;
+    //     }
+    //     ruleAttr.valueList.push(this.ruleAddForm.valueList)
+    //   }
+    //   this.ruleAddForm = {
+    //     name: null,
+    //     valueList: null,
+    //   }
+    //   this.ruleAddFormStatus = false;
+    // },
+
+    removeRule(index) {
+      this.form.ruleAttrList.splice(index,1);
     },
+
     removeRuleProperty(valueList,index){
-      valueList.splice(index, 1);
+      valueList.splice(index,1);
     },
+
     addRuleProperty(ruleAttr, continuousInput){
-      if (this.addRulePropertyValue === null || this.addRulePropertyValue === 0){
-        if (!continuousInput){
+      if (this.addRulePropertyValue == null || this.addRulePropertyValue == 0){
+        if (continuousInput){
           ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus
         }
         return;
       }
+
       if (ruleAttr.valueList.indexOf(this.addRulePropertyValue) > -1){
         this.$message({
-          message: `规格[${ruleAttr.name}]属性值[${this.addRulePropertyValue}]已经存在`,
+          message:`规格[${ruleAttr.name}]属性值[${this.addRulePropertyValue}]已经存在`,
           type: 'warning'
         });
         return;
@@ -245,45 +375,53 @@ export default {
         ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus
       }
     },
+
     ruleAddFormFun(){
-      if (this.ruleAddForm.name === null || this.ruleAddForm.name.length === 0){
+
+      if (this.ruleAddForm.name == null || this.ruleAddForm.name.length == 0){
         this.$message({
           message: '规格名称不可为空',
           type: 'warning'
-        });
+        })
+
         return;
       }
-      if (this.ruleAddForm.valueList === null || this.ruleAddForm.valueList.length === 0){
+
+      if (this.ruleAddForm.valueList == null || this.ruleAddForm.valueList.length == 0){
         this.$message({
           message: '规格属性不可为空',
-          type: 'warning'
+          type:'warning'
         });
         return;
       }
 
-      let ruleAttr = this.form.ruleAttrList.find(ruleAttr => ruleAttr.name === this.ruleAddForm.name);
-      if (ruleAttr === undefined){
-        this.form.ruleAttrList.push({
-          "name": this.ruleAddForm.name,
-          "valueList": [this.ruleAddForm.valueList],
-          "ruleAttrAddStatus": false
-        })
-      }else {
-        if (ruleAttr.valueList.indexOf(this.ruleAddForm.valueList) > -1){
-          this.$message({
-            message: `规格[${this.ruleAddForm.name}]属性值[${this.ruleAddForm.valueList}]已经存在`,
-            type: 'warning'
-          });
-          return;
-        }
-        ruleAttr.valueList.push(this.ruleAddForm.valueList)
-      }
-      this.ruleAddForm = {
-        name: null,
-        valueList: null,
-      }
+      let ruleAttr = this.form.ruleAttrList.find(ruleAttr => ruleAttr.name == this.ruleAddForm.name);
+     if (ruleAttr == undefined){
+       this.form.ruleAttrList.push({
+         "name": this.ruleAddForm.name,
+         "valueList": [this.ruleAddForm.valueList],
+         "ruleAttrAddStatus": false
+       })
+     }else {
+       if (ruleAttr.valueList.indexOf(this.ruleAddForm.valueList) > -1){
+         this.$message({
+           message: `规格[${this.ruleAddForm.name}]属性值[${this.ruleAddForm.valueList}]已经存在`,
+           type: 'warning'
+         });
+         return;
+       }
+       ruleAttr.valueList.push(this.ruleAddForm.valueList)
+     }
+
+     this.ruleAddForm = {
+       name: null,
+       valueList: null,
+     }
+
       this.ruleAddFormStatus = false;
     },
+
+
     /** 查询商品规格列表 */
     getList() {
       this.loading = true;