属性组功能完善

src/views/product/group/index.vue

@@ -67,15 +67,20 @@
 
     <el-table v-loading="loading" :data="groupList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="主键" align="center" prop="id" />
-      <el-table-column label="组名" align="center" prop="name" />
-      <el-table-column label="属性" align="center" prop="name" />
-      <el-table-column label="状态" align="center" prop="states">
+      <el-table-column label="组名" align="center" prop="name" width="155"/>
+      <el-table-column label="属性" align="center" prop="attributeList" >
         <template slot-scope="scope">
-          <dict-attribute :options="dict.type.sys_yes_no" :value="scope.row.states"/>
+          <el-tag v-for="attribute in scope.row.attributeList">
+            {{attribute.name}}
+          </el-tag>
         </template>
       </el-table-column>
-      <el-table-column label="说明" align="center" prop="remark" />
+      <el-table-column label="品牌启用" align="center" prop="status" style="width: 20px;">
+      <template slot-scope="scope">
+        <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.states"/>
+      </template>
+      </el-table-column>
+      <el-table-column label="说明" align="center" prop="remark" style="width: 30px;"/>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -141,6 +146,7 @@
               <div slot="header" class="clearfix">
                 <span>已选属性</span>
                 {{this.form.checkedAttributeIds}}
+                {{this.form.attributeList}}
               </div>
               <el-row :gutter="20"  style="height: 100px">
                 <el-col :span="3" v-for="(attribute,index) in checkedAttribute">
@@ -153,7 +159,6 @@
                   </el-tag>
                 </el-col>
               </el-row>
-
             </el-card>
             <el-divider></el-divider>
           <el-card class="box-card">
@@ -161,7 +166,8 @@
               <span>可选属性</span>
             </div>
             <el-row>
-              <el-col :span="3" v-for="attribute in attributeList">
+              <el-col :span="3"
+                      v-for="attribute in attributeList">
                 <el-checkbox
                   v-model="form.checkedAttributeIds"
                   :value="attribute.id"
@@ -169,7 +175,6 @@
                   :label="attribute.id"
                   @change="handleCheckedAttributeChange(attribute)"
                   border>
-                  {{attribute.id}}
                   {{attribute.name}}
                 </el-checkbox>
               </el-col>
@@ -177,7 +182,6 @@
           </el-card>
           </el-card>
         </el-row>
-
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
@@ -190,6 +194,7 @@
 <script>
 import { listGroup, getGroup, delGroup, addGroup, updateGroup } from "@/api/product/attribute_group";
 import {listAttribute} from "@/api/product/attribute";
+import attribute from "@/views/product/attribute/index.vue";
 
 export default {
   name: "Group",
@@ -276,6 +281,8 @@ export default {
     /** 查询属性列表 */
     getAttribute(){
       listAttribute(this.queryParams).then(response => {
+        console.log('属性集合')
+        console.log(response)
         this.attributeList = response.data.rows;
         this.total = response.data.total;
         this.loading = false;
@@ -327,17 +334,19 @@ export default {
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
-      console.log(row)
-      this.getAttribute();
+      // console.log('行属性组数据')
+      // console.log(row)
       this.reset();
       const id = row.id || this.ids
       getGroup(id).then(response => {
+        // console.log(('根据id查到的属性组数据'))
         console.log(response)
         this.form = response.data;
         this.open = true;
         this.title = "修改属性组";
-        this.form.checkedAttributeIds= []
+        this.checkedAttribute = response.data.attributeList
       });
+      this.getAttribute();
     },
     /** 提交按钮 */
     submitForm() {