属性组和商品规格的状态的修改

src/api/product/attributeGroup.js

@@ -43,3 +43,13 @@ export function delAttributeGroup(id) {
   })
 }
 
+//修改状态
+
+export function changeStatus(data) {
+  return request({
+    url: '/product/attributeGroup/'+data.id,
+    method: 'post',
+    data: data
+  })
+}
+

src/api/product/rule.js

@@ -42,3 +42,11 @@ export function delRule(id) {
     method: 'delete'
   })
 }
+
+export function changeStatus(data) {
+  return request({
+    url: '/product/rule/'+data.id,
+    method: 'post',
+    data: data
+  })
+}

src/views/product/attributeGroup/index.vue

@@ -34,7 +34,8 @@
           size="mini"
           @click="handleAdd"
           v-hasPermi="['product:attributeGroup:add']"
-        >新增</el-button>
+        >新增
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -45,7 +46,8 @@
           :disabled="single"
           @click="handleUpdate"
           v-hasPermi="['product:attributeGroup:edit']"
-        >修改</el-button>
+        >修改
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -56,7 +58,8 @@
           :disabled="multiple"
           @click="handleDelete"
           v-hasPermi="['product:attributeGroup:remove']"
-        >删除</el-button>
+        >删除
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -66,27 +69,54 @@
           size="mini"
           @click="handleExport"
           v-hasPermi="['product:attributeGroup:export']"
-        >导出</el-button>
+        >导出
+        </el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
     <el-table v-loading="loading" :data="attributeGroupList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column type="selection" width="55" align="center"/>
-      <el-table-column label="组名称" align="center" prop="name" />
+      <el-table-column label="组名称" align="center" prop="name"/>
-      <el-table-column label="组内属性" align="center" prop="attributeInfoList" >
+      <el-table-column label="组内属性" align="center" prop="attributeInfoList">
         <template slot-scope="scope">
           <el-tag v-for="attributeInfo in scope.row.attributeInfoList">
-            {{attributeInfo.name}}
+            {{ attributeInfo.name }}
           </el-tag>
         </template>
       </el-table-column>
+
       <el-table-column label="状态" align="center" prop="states">
         <template slot-scope="scope">
-          <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.states"/>
+          <!--          <el-switch-->
+          <!--            v-model="scope.row.states"-->
+          <!--            style="&#45;&#45;el-switch-on-color: #13ce66; &#45;&#45;el-switch-off-color: #ff4949"-->
+          <!--            active-value="100"-->
+          <!--            inactive-value="0"-->
+          <!--            active-text="是"-->
+          <!--            inactive-text="否"-->
+          <!--          />-->
+
+          <el-switch @change="handleStateChange(scope.row)"
+                     v-model="scope.row.states"
+                     style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+                     active-value="Y"
+                     inactive-value="N"
+                     active-text="是"
+                     inactive-text="否"
+          />
+
         </template>
+        <!--        <el-switch-->
+        <!--          v-model="value"-->
+        <!--          active-color="#13ce66"-->
+        <!--          inactive-color="#ff4949"-->
+        <!--          active-text="是"-->
+        <!--          inactive-text="否">-->
+        <!--        </el-switch>-->
+
       </el-table-column>
-      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column label="备注" align="center" prop="remark"/>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -95,14 +125,16 @@
             icon="el-icon-edit"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['product:attributeGroup:edit']"
-          >修改</el-button>
+          >修改
+          </el-button>
           <el-button
             size="mini"
             type="text"
             icon="el-icon-delete"
             @click="handleDelete(scope.row)"
             v-hasPermi="['product:attributeGroup:remove']"
-          >删除</el-button>
+          >删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -121,7 +153,7 @@
         <el-row>
           <el-col :span="12">
             <el-form-item label="组名称" prop="name">
-              <el-input v-model="form.name" placeholder="请输入组名称" />
+              <el-input v-model="form.name" placeholder="请输入组名称"/>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -131,17 +163,18 @@
                   v-for="dict in dict.type.sys_yes_no"
                   :key="dict.value"
                   :label="dict.value"
-                >{{dict.label}}</el-radio>
+                >{{ dict.label }}
+                </el-radio>
               </el-radio-group>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-form-item label="备注" prop="remark">
-            <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+            <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"/>
           </el-form-item>
         </el-row>
-        <CheckAttribute v-model="form.attributeIdList":checked-list="form.attributeList"/>
+        <CheckAttribute v-model="form.attributeIdList" :checked-list="form.attributeList"/>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
@@ -152,13 +185,21 @@
 </template>
 
 <script>
-import { listAttributeGroup, getAttributeGroup, delAttributeGroup, addAttributeGroup, updateAttributeGroup } from "@/api/product/attributeGroup";
+import {
+  listAttributeGroup,
+  getAttributeGroup,
+  delAttributeGroup,
+  addAttributeGroup,
+  updateAttributeGroup,
+  changeStatus
+} from "@/api/product/attributeGroup";
 
 export default {
   name: "AttributeGroup",
   dicts: ['sys_yes_no'],
   data() {
     return {
+      value: true,
       // 遮罩层
       loading: true,
       // 选中数组
@@ -189,10 +230,10 @@ export default {
       // 表单校验
       rules: {
         name: [
-          { required: true, message: "组名称不能为空", trigger: "blur" }
+          {required: true, message: "组名称不能为空", trigger: "blur"}
         ],
         states: [
-          { required: true, message: "状态不能为空", trigger: "change" }
+          {required: true, message: "状态不能为空", trigger: "change"}
         ],
       }
     };
@@ -241,7 +282,7 @@ export default {
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.id)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
       this.multiple = !selection.length
     },
     /** 新增按钮操作 */
@@ -260,6 +301,14 @@ export default {
         this.title = "修改属性组";
       });
     },
+    /**
+     * 修改状态
+     */
+    handleStateChange(row) {
+      changeStatus(row).then(response => {
+        this.$modal.msgSuccess("修改成功");
+      })
+    },
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate(valid => {
@@ -283,19 +332,22 @@ export default {
     /** 删除按钮操作 */
     handleDelete(row) {
       const ids = row.id || this.ids;
-      this.$modal.confirm('是否确认删除属性组编号为"' + ids + '"的数据项？').then(function() {
+      this.$modal.confirm('是否确认删除属性组编号为"' + ids + '"的数据项？').then(function () {
         return delAttributeGroup(ids);
       }).then(() => {
         this.getList();
         this.$modal.msgSuccess("删除成功");
-      }).catch(() => {});
+      }).catch(() => {
+      });
     },
     /** 导出按钮操作 */
     handleExport() {
       this.download('product/attributeGroup/export', {
         ...this.queryParams
       }, `attributeGroup_${new Date().getTime()}.xlsx`)
-    }
+    },
+
   }
 };
+
 </script>

src/views/product/rule/index.vue

@@ -71,16 +71,26 @@
         </template>
       </el-table-column>
       <el-table-column label="规格属性值" align="center" prop="name" >
-
         <template slot-scope="scope">
           <el-row v-for="ruleAttr in scope.row.ruleAttrList"><span>{{ruleAttr.valueList.toString()}}</span></el-row>
-
         </template>
       </el-table-column>
-      <el-table-column label="规格状态" align="center" prop="status" />
+      <el-table-column label="规格状态" align="center" prop="status" >
+        <template slot-scope="scope">
+          <el-switch @change="handleStateChange(scope.row)"
+                     v-model="scope.row.states"
+                     style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+                     active-value="Y"
+                     inactive-value="N"
+                     active-text="是"
+                     inactive-text="否"
+          />
+        </template>
+      </el-table-column>
+
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-        <template slot-scope="scope">
+        <template slot-scope="scope" >
           <el-button
             size="mini"
             type="text"
@@ -166,11 +176,13 @@
 
 <script>
 import { listRule, getRule, delRule, addRule, updateRule } from "@/api/product/rule";
+import {changeStatus} from "@/api/product/rule";
 
 export default {
   name: "Rule",
   data() {
     return {
+      value: true,
       // 遮罩层
       loading: true,
       // 选中数组
@@ -342,6 +354,14 @@ export default {
         this.title = "修改商品规格";
       });
     },
+    /**
+     * 修改状态
+     */
+    handleStateChange(row) {
+      changeStatus(row).then(response => {
+        this.$modal.msgSuccess("修改成功");
+      })
+    },
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate(valid => {