src/api/product/attribute.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询商品属性列表
+export function listAttribute(query) {
+  return request({
+    url: '/product/attribute/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品属性详细
+export function getAttribute(id) {
+  return request({
+    url: '/product/attribute/' + id,
+    method: 'get'
+  })
+}
+
+// 新增商品属性
+export function addAttribute(data) {
+  return request({
+    url: '/product/attribute',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品属性
+export function updateAttribute(data) {
+  return request({
+    url: '/product/attribute/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品属性
+export function delAttribute(id) {
+  return request({
+    url: '/product/attribute/' + id,
+    method: 'delete'
+  })
+}

src/api/product/attributeGroup.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询商品属性组列表
+export function listAttributeGroup(query) {
+  return request({
+    url: '/product/attributeGroup/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品属性组详细
+export function getAttributeGroup(id) {
+  return request({
+    url: '/product/attributeGroup/getInfo?id='+ id,
+    method: 'get'
+  })
+}
+
+// 新增商品属性组
+export function addAttributeGroup(data) {
+  return request({
+    url: '/product/attributeGroup',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品属性组
+export function updateAttributeGroup(data) {
+  return request({
+    url: '/product/attributeGroup/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品属性组
+export function delAttributeGroup(id) {
+  return request({
+    url: '/product/attributeGroup/' + id,
+    method: 'delete'
+  })
+}

src/api/product/brand.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询品牌信息列表
+export function listBrand(query) {
+  return request({
+    url: '/product/brand/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品牌信息详细
+export function getBrand(id) {
+  return request({
+    url: '/product/brand/' + id,
+    method: 'get'
+  })
+}
+
+// 新增品牌信息
+export function addBrand(data) {
+  return request({
+    url: '/product/brand',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品牌信息
+export function updateBrand(data) {
+  return request({
+    url: '/product/brand/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品牌信息
+export function delBrand(id) {
+  return request({
+    url: '/product/brand/' + id,
+    method: 'delete'
+  })
+}

src/api/product/category.js

@@ -0,0 +1,61 @@
+import request from '@/utils/request'
+
+// 查询品类信息列表
+export function listCategory(query) {
+  return request({
+    url: '/product/category/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品类信息详细
+export function getCategory(id) {
+  return request({
+    url: '/product/category/' + id,
+    method: 'get'
+  })
+}
+
+export function getTemplateAttribute(data) {
+  return request({
+    url: '/product/category/getTemplateAttribute/',
+    method: 'post',
+    data
+  })
+}
+
+//通过父类id  查询品类详情
+export function parentCategoryCommon(id) {
+  return request({
+    url: '/product/category/parentCategoryCommon/' + id,
+    method: 'get'
+  })
+}
+
+
+// 新增品类信息
+export function addCategory(data) {
+  return request({
+    url: '/product/category',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品类信息
+export function updateCategory(data) {
+  return request({
+    url: '/product/category/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品类信息
+export function delCategory(id) {
+  return request({
+    url: '/product/category/' + id,
+    method: 'delete'
+  })
+}

src/api/product/comment.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询商品评论列表
+export function listComment(query) {
+  return request({
+    url: '/product/comment/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品评论详细
+export function getComment(id) {
+  return request({
+    url: '/product/comment/' + id,
+    method: 'get'
+  })
+}
+
+// 新增商品评论
+export function addComment(data) {
+  return request({
+    url: '/product/comment',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品评论
+export function updateComment(data) {
+  return request({
+    url: '/product/comment/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品评论
+export function delComment(id) {
+  return request({
+    url: '/product/comment/' + id,
+    method: 'delete'
+  })
+}

src/api/product/commentLike.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询评论点赞列表
+export function listCommentLike(query) {
+  return request({
+    url: '/product/commentLike/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询评论点赞详细
+export function getCommentLike(id) {
+  return request({
+    url: '/product/commentLike/' + id,
+    method: 'get'
+  })
+}
+
+// 新增评论点赞
+export function addCommentLike(data) {
+  return request({
+    url: '/product/commentLike',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改评论点赞
+export function updateCommentLike(data) {
+  return request({
+    url: '/product/commentLike/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除评论点赞
+export function delCommentLike(id) {
+  return request({
+    url: '/product/commentLike/' + id,
+    method: 'delete'
+  })
+}

src/api/product/good.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询商品测试列表
+export function listGood(query) {
+  return request({
+    url: '/product/good/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品测试详细
+export function getGood(id) {
+  return request({
+    url: '/product/good/' + id,
+    method: 'get'
+  })
+}
+
+// 新增商品测试
+export function addGood(data) {
+  return request({
+    url: '/product/good',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品测试
+export function updateGood(data) {
+  return request({
+    url: '/product/good/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品测试
+export function delGood(id) {
+  return request({
+    url: '/product/good/' + id,
+    method: 'delete'
+  })
+}

src/api/product/info.js

@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+
+// 查询商品信息列表
+export function listInfo(query) {
+  return request({
+    url: '/product/info/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品信息详细
+export function getInfo(id) {
+  return request({
+    url: '/product/info/product/' + id,
+    method: 'get'
+  })
+}
+
+export function getPro(id) {
+  return request({
+    url: '/product/info/getProductDetail?id=' + id,
+    method: 'get'
+  })
+}
+
+
+// 新增商品信息
+export function addInfo(data) {
+  return request({
+    url: '/product/info',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品信息
+export function updateInfo(data) {
+  return request({
+    url: '/product/info/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品信息
+export function delInfo(id) {
+  return request({
+    url: '/product/info/' + id,
+    method: 'delete'
+  })
+}

src/api/product/projectSku.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询商品SKU列表
+export function listProjectSku(query) {
+  return request({
+    url: '/product/projectSku/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品SKU详细
+export function getProjectSku(id) {
+  return request({
+    url: '/product/projectSku/' + id,
+    method: 'get'
+  })
+}
+
+// 新增商品SKU
+export function addProjectSku(data) {
+  return request({
+    url: '/product/projectSku',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品SKU
+export function updateProjectSku(data) {
+  return request({
+    url: '/product/projectSku/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品SKU
+export function delProjectSku(id) {
+  return request({
+    url: '/product/projectSku/' + id,
+    method: 'delete'
+  })
+}

src/api/product/rule.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询商品规格列表
+export function listRule(query) {
+  return request({
+    url: '/product/rule/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品规格详细
+export function getRule(id) {
+  return request({
+    url: '/product/rule/' + id,
+    method: 'get'
+  })
+}
+
+// 新增商品规格
+export function addRule(data) {
+  return request({
+    url: '/product/rule',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品规格
+export function updateRule(data) {
+  return request({
+    url: '/product/rule/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品规格
+export function delRule(id) {
+  return request({
+    url: '/product/rule/' + id,
+    method: 'delete'
+  })
+}

src/api/product/ruleAttr.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询规格详情列表
+export function listRuleAttr(query) {
+  return request({
+    url: '/product/ruleAttr/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询规格详情详细
+export function getRuleAttr(id) {
+  return request({
+    url: '/product/ruleAttr/' + id,
+    method: 'get'
+  })
+}
+
+// 新增规格详情
+export function addRuleAttr(data) {
+  return request({
+    url: '/product/ruleAttr',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改规格详情
+export function updateRuleAttr(data) {
+  return request({
+    url: '/product/ruleAttr/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除规格详情
+export function delRuleAttr(id) {
+  return request({
+    url: '/product/ruleAttr/' + id,
+    method: 'delete'
+  })
+}

src/api/product/shop.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询购物车列表
+export function listShop(query) {
+  return request({
+    url: '/product/shop/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询购物车详细
+export function getShop(id) {
+  return request({
+    url: '/product/shop/' + id,
+    method: 'get'
+  })
+}
+
+// 新增购物车
+export function addShop(data) {
+  return request({
+    url: '/product/shop',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改购物车
+export function updateShop(data) {
+  return request({
+    url: '/product/shop/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除购物车
+export function delShop(id) {
+  return request({
+    url: '/product/shop/' + id,
+    method: 'delete'
+  })
+}

src/api/shopCart/shop.js

@@ -0,0 +1,89 @@
+import request from '@/utils/request'
+
+// 查询购物车列表
+export function listShop(query) {
+  return request({
+    url: '/shopCart/shop/list',
+    method: 'get',
+    params: query
+  })
+}
+
+
+export function testShop(query) {
+  return request({
+    url: '/shopCart/shop/shopList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询购物车详细
+export function getShop(id) {
+  return request({
+    url: '/shopCart/shop/' + id,
+    method: 'get'
+  })
+}
+
+// 新增购物车
+export function addShop(data) {
+  return request({
+    url: '/shopCart/shop',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改购物车
+export function updateShop(data) {
+  return request({
+    url: '/shopCart/shop/'+data.id,
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除购物车
+export function delShop(id) {
+  return request({
+    url: '/shopCart/shop/' + id,
+    method: 'delete'
+  })
+}
+
+export function checkState(state) {
+  return request({
+    url: '/shopCart/shop/checkState',
+    method: 'post',
+    data:state
+  })
+}
+export function updSelected(state) {
+  return request({
+    url: '/shopCart/shop/updSelected',
+    method: 'post',
+    data:state
+  })
+}
+
+export function editShopNum(state) {
+  return request({
+    url: '/shopCart/shop/editShopNum',
+    method: 'post',
+    data:state
+  })
+}
+export function delShoppingMethod(state) {
+  return request({
+    url: '/shopCart/shop/delShop',
+    method: 'post',
+    data:state
+  })
+}
+export function shopDetail() {
+  return request({
+    url: '/shopCart/shop/detail',
+    method: 'get'
+  })
+}

src/components/Attribute/index.vue

@@ -0,0 +1,160 @@
+<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-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: {
+    items: {
+      type: Array,
+      default: function() {
+        return ['item1', 'item2', 'item3'];
+      }
+    },
+    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: [],
+      total: 0,
+      value: []
+    }
+  },
+  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);
+    },
+    /**
+     * 删除选中值
+     * @param index
+     */
+    removeChecked(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;
+      });
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/AttributeGroup/index.vue

@@ -0,0 +1,160 @@
+<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-col :span="2" v-for="(attributeGroup, index) in checkedAttributeGroupList">
+            <el-tag
+              style="margin: 5px 10px"
+              :key="attributeGroup.name"
+              closable @close="removeChecked(index)">
+              {{ 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>
+            <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-col style="padding: 5px 10px" :span="3" v-for="attributeGroup in attributeGroupList">
+            <el-checkbox
+              v-model="attributeGroupIdList"
+              :key="attributeGroup.id"
+              :value="attributeGroup.id"
+              :label="attributeGroup.id"
+              @change="checkedAttributeGroup(attributeGroup)"
+              border>{{ attributeGroup.name }}
+            </el-checkbox>
+          </el-col>
+        </el-row>
+        <pagination
+          v-show="total>0"
+          :total="total"
+          :page.sync="attributeGroupQuery.pageNum"
+          :limit.sync="attributeGroupQuery.pageSize"
+          @pagination="queryAttributeGroup"
+        />
+      </el-card>
+    </el-card>
+  </el-row>
+</template>
+
+<script>
+import {listAttributeGroup} from "@/api/product/attributeGroup";
+
+export default {
+  name: "CheckAttributeGroup",
+  props: {
+    items: {
+      type: Array,
+      default: function() {
+        return ['item1', 'item2', 'item3'];
+      }
+    },
+    checkedList: {
+      type: Array,
+      default: null
+    }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        if (val.toString() !== this.attributeGroupIdList.toString()){
+          this.attributeGroupIdList = val;
+          this.checkedAttributeGroupList = []
+        }
+      },
+      immediate: true,
+    },
+    checkedList: {
+      handler(val){
+        if (val !== undefined && val.length > 0){
+          this.checkedAttributeGroupList = val;
+          this.attributeGroupIdList = this.checkedAttributeGroupList.map(checked => checked.id);
+        }
+      },
+      immediate: true
+    }
+  },
+  data() {
+    return {
+      attributeGroupIdList: [],
+      checkedAttributeGroupList: [],
+      attributeGroupQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        code: null,
+        name: null
+      },
+      attributeGroupTotal: 0,
+      attributeGroupList: [],
+      total: 0,
+      value:[]
+    }
+  },
+  created() {
+    this.queryAttributeGroup();
+  },
+  methods: {
+    /**
+     * 选中值触发方法
+     */
+    checkedAttributeGroup(attributeGroup) {
+      let isCheck = this.attributeGroupIdList.indexOf(attributeGroup.id) > -1;
+      if (isCheck) {
+        this.checkedAttributeGroupList.push(attributeGroup);
+      } else {
+        // 删除
+        this.checkedAttributeGroupList.splice(
+          this.checkedAttributeGroupList.indexOf(attributeGroup), 1
+        )
+      }
+      this.$emit("input", this.attributeGroupIdList);
+    },
+    /**
+     * 删除选中值
+     * @param index
+     */
+    removeChecked(index) {
+      this.checkedAttributeGroupList.splice(index, 1);
+      this.attributeGroupIdList.splice(index, 1);
+    },
+
+    /**
+     * 查询属性
+     */
+    queryAttributeGroup() {
+      listAttributeGroup(this.attributeGroupQuery).then(response => {
+        this.attributeGroupList = response.data.rows;
+        this.total = response.data.total;
+      });
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/Brand/index.vue

@@ -0,0 +1,160 @@
+<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-col :span="2" v-for="(brand, index) in checkedBrandList">
+            <el-tag
+              style="margin: 5px 10px"
+              :key="brand.nam"
+              closable @close="removeChecked(index)">
+              {{ brand.nam }}
+            </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="brandQuery" class="demo-form-inline">
+            <el-form-item label="品牌编码">
+              <el-input v-model="brandQuery.code" placeholder="品牌编码"></el-input>
+            </el-form-item>
+            <el-form-item label="品牌名称">
+              <el-input v-model="brandQuery.nam" placeholder="品牌名称"></el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="queryBrand">查询</el-button>
+            </el-form-item>
+          </el-form>
+        </el-row>
+        <el-row>
+          <el-col style="padding: 5px 10px" :span="3" v-for="brand in brandList">
+            <el-checkbox
+              v-model="brandIdList"
+              :key="brand.id"
+              :value="brand.id"
+              :label="brand.id"
+              @change="checkedBrand(brand)"
+              border>{{ brand.nam }}
+            </el-checkbox>
+          </el-col>
+        </el-row>
+        <pagination
+          v-show="total>0"
+          :total="total"
+          :page.sync="brandQuery.pageNum"
+          :limit.sync="brandQuery.pageSize"
+          @pagination="queryBrand"
+        />
+      </el-card>
+    </el-card>
+  </el-row>
+</template>
+
+<script>
+import {listBrand} from "@/api/product/brand";
+
+export default {
+  nam: "CheckBrand",
+  props: {
+    items: {
+      type: Array,
+      default: function() {
+        return ['item1', 'item2', 'item3'];
+      }
+    },
+    checkedList: {
+      type: Array,
+      default: null
+    }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        if (val.toString() !== this.brandIdList.toString()){
+          this.brandIdList = val;
+          this.checkedBrandList = []
+        }
+      },
+      immediate: true,
+    },
+    checkedList: {
+      handler(val){
+        if (val !== undefined && val.length > 0){
+          this.checkedBrandList = val;
+          this.brandIdList = this.checkedBrandList.map(checked => checked.id);
+        }
+      },
+      immediate: true
+    }
+  },
+  data() {
+    return {
+      brandIdList: [],
+      checkedBrandList: [],
+      brandQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        code: null,
+        nam: null
+      },
+      brandTotal: 0,
+      brandList: [],
+      total: 0,
+      value:[]
+    }
+  },
+  created() {
+    this.queryBrand();
+  },
+  methods: {
+    /**
+     * 选中值触发方法
+     */
+    checkedBrand(brand) {
+      let isCheck = this.brandIdList.indexOf(brand.id) > -1;
+      if (isCheck) {
+        this.checkedBrandList.push(brand);
+      } else {
+        // 删除
+        this.checkedBrandList.splice(
+          this.checkedBrandList.indexOf(brand), 1
+        )
+      }
+      this.$emit("input", this.brandIdList);
+    },
+    /**
+     * 删除选中值
+     * @param index
+     */
+    removeChecked(index) {
+      this.checkedBrandList.splice(index, 1);
+      this.brandIdList.splice(index, 1);
+    },
+
+    /**
+     * 查询品牌
+     */
+    queryBrand() {
+      listBrand(this.brandQuery).then(response => {
+        this.brandList = response.data.rows;
+        this.total = response.data.total;
+      });
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/Editor/index.vue

@@ -124,6 +124,9 @@ export default {
   methods: {
     init() {
       const editor = this.$refs.editor;
+      if (this.readOnly){
+        this.options.modules.toolbar = {};
+      }
       this.Quill = new Quill(editor, this.options);
       // 如果设置了上传地址则自定义图片上传事件
       if (this.type == 'url') {
@@ -176,7 +179,7 @@ export default {
     },
     handleUploadSuccess(res, file) {
       // 如果上传成功
-      if (res.data.code == 200) {
+      if (res.code == 200) {
         // 获取富文本组件实例
         let quill = this.Quill;
         // 获取光标所在位置

src/components/ImageUpload/index.vue

@@ -61,7 +61,7 @@ export default {
     // 文件类型, 例如['png', 'jpg', 'jpeg']
     fileType: {
       type: Array,
-      default: () => ["png", "jpg", "jpeg"],
+      default: () => ["png", "jpg", "jpeg","gif"],
     },
     // 是否显示提示
     isShowTip: {
@@ -149,7 +149,7 @@ export default {
     },
     // 上传成功回调
     handleUploadSuccess(res, file) {
-      if (res.data.code === 200) {
+      if (res.code === 200) {
         this.uploadList.push({name: res.data.url, url: res.data.url});
         this.uploadedSuccessfully();
       } else {

src/layouttest/index.vue

@@ -0,0 +1,148 @@
+<template>
+  <div>
+    <el-container>
+      <el-header>
+        <el-menu
+          default-active="1"
+          class="el-menu-demo el-menu-right"
+          mode="horizontal"
+          background-color="#545c64"
+          text-color="#fff"
+          active-text-color="#ffd04b">
+
+          <el-menu-item index="1">
+            <router-link :to="'/commodityMall' " class="link-type">
+              <span>商品商城</span>
+            </router-link>
+          </el-menu-item>
+          <el-menu-item index="2">
+            <router-link :to="'/orderShop' " class="link-type">
+              <span>购物车结算</span>
+            </router-link>
+          </el-menu-item>
+          <el-submenu index="3"  >
+            <template slot="title">我的购物车</template>
+            <el-table
+              :data="shop"
+              style="width: 100%">
+              <el-table-column
+                label="商品信息"
+                width="400">
+                <template slot-scope="scope">
+                  <div class="cell-content">
+                    <img  :src="scope.row.projectSkuInfo.image"  width="50px" height="50px" class="project-image">
+                    <div class="project-info">
+                      <h3 class="project-name">{{ scope.row.projectInfo.name }}</h3>
+                      <p class="project-description">{{ scope.row.detailSku }}</p>
+                    </div>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                label="数量"
+                width="100">
+                <template slot-scope="scope">
+                  <span style="margin-left: 10px">{{scope.row.num}}</span>
+                </template>
+              </el-table-column>
+            </el-table>
+
+            <el-button type="info" style="margin-left: 400px" @click="toShopping">进入购物车</el-button>
+          </el-submenu>
+          <el-menu-item index="4" disabled>消息中心</el-menu-item>
+
+        </el-menu>
+      </el-header>
+      <el-main>
+        <el-row :gutter="20">
+          <el-col :span="12" :offset="6">
+            <router-view></router-view>
+          </el-col>
+        </el-row>
+      </el-main>
+    </el-container>
+
+  </div>
+</template>
+<script>
+import
+{getInfo, listInfo} from "@/api/product/info";
+import {testShop} from "@/api/shopCart/shop";
+
+export default {
+  name: 'Index',
+  data() {
+    return {
+      shop: []
+    }
+  },
+  created() {
+    this.shopList()
+  },
+  methods: {
+    shopList(){
+      testShop(this.queryParams).then(res=>{
+        console.log(res)
+        this.shop=res.data.rows
+      })
+    },
+    toShopping(){
+      this.$router.push('/shopping')
+    }
+
+  }
+}
+</script>
+<style scoped>
+
+
+
+.el-header, .el-footer {
+  background-color: #B3C0D1;
+  color: #333;
+  text-align: center;
+  line-height: 60px;
+}
+
+.el-menu-demo {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.el-main {
+  color: #333;
+}
+
+body > .el-container {
+  margin-bottom: 40px;
+}
+
+.el-container:nth-child(5) .el-aside,
+.el-container:nth-child(6) .el-aside {
+  line-height: 260px;
+}
+
+.el-container:nth-child(7) .el-aside {
+  line-height: 320px;
+}
+
+.cell-content {
+  display: flex;
+  align-items: flex-start; /* 垂直上边对齐 */
+}
+
+.project-image {
+  margin-right: 10px; /* 图片与文本之间的间距 */
+}
+
+.project-info {
+  display: flex;
+  flex-direction: column; /* 设置为列方向布局，实现上下排列 */
+  align-items: flex-start; /* 垂直上边对齐 */
+}
+
+.project-name,
+.project-description {
+  margin-bottom: 5px; /* 项目名称和描述之间的间距 */
+}
+</style>

src/main.js

@@ -38,6 +38,17 @@ import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
 
+
+// 属性选择
+import Attribute from "@/components/Attribute/index.vue";
+
+// 品牌选择
+import Brand from "@/components/Brand/index.vue";
+
+// 品牌选择
+import AttributeGroup from "@/components/AttributeGroup/index.vue";
+
+
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
 Vue.prototype.getConfigKey = getConfigKey
@@ -48,6 +59,9 @@ Vue.prototype.selectDictLabel = selectDictLabel
 Vue.prototype.selectDictLabels = selectDictLabels
 Vue.prototype.download = download
 Vue.prototype.handleTree = handleTree
+Vue.component('Attribute', Attribute)
+Vue.component('Brand', Brand)
+Vue.component('AttributeGroup', AttributeGroup)
 
 // 全局组件挂载
 Vue.component('DictTag', DictTag)

src/router/index.js

@@ -2,6 +2,7 @@ import Vue from 'vue'
 import Router from 'vue-router'
 /* Layout */
 import Layout from '@/layout'
+import Layouttest from "@/layouttest";
 
 Vue.use(Router)
 
@@ -73,6 +74,59 @@ export const constantRoutes = [
       }
     ]
   },
+
+  {
+    path: '',
+    component: Layouttest,
+    redirect: 'commodity_mall',
+    children: [
+      {
+        path: '/commodityMall',
+        component: () => import('@/views/product/productInfo/commodityMall/commodity.vue'),
+        name: 'Test',
+        meta: {title: "商品商城", icon: 'dashboard', affix: true}
+      }
+    ]
+  },
+  {
+    path: '',
+    component: Layouttest,
+    redirect: 'product_details',
+    children: [
+      {
+        path: '/detailsComponent/:id',
+        component: () => import('@/views/product/productInfo/detail/productDetails.vue'),
+        name: 'Test',
+        meta: {title: "商品详情", icon: 'dashboard', affix: true}
+      }
+    ]
+  },
+  {
+    path: '',
+    component: Layouttest,
+    redirect: 'shop_detail',
+    children: [
+      {
+        path: 'shopping',
+        component: () => import('@/views/shopCart/shop/detail/shopDetail.vue'),
+        name: 'Test',
+        meta: {title: "购物车", icon: 'dashboard', affix: true}
+      }
+    ]
+  },
+  {
+    path: '',
+    component: Layouttest,
+    redirect: 'order_shop',
+    children: [
+      {
+        path: 'orderShop',
+        component: () => import('@/views/shopCart/shop/order/orderShop.vue'),
+        name: 'Test',
+        meta: {title: "购物车结算", icon: 'dashboard', affix: true}
+      }
+    ]
+  },
   {
     path: '/user',
     component: Layout,
@@ -86,7 +140,8 @@ export const constantRoutes = [
         meta: {title: '个人中心', icon: 'user'}
       }
     ]
-  }
+  },
+
 ]
 
 // 动态路由，基于用户权限动态去加载
@@ -178,5 +233,5 @@ Router.prototype.replace = function push(location) {
 export default new Router({
   mode: 'history', // 去掉url中的#
   scrollBehavior: () => ({y: 0}),
-  routes: constantRoutes
+  routes: constantRoutes,
 })

src/utils/request.js

@@ -73,7 +73,6 @@ service.interceptors.request.use(config => {
 
 // 响应拦截器
 service.interceptors.response.use(res => {
-  debugger
     // 未设置状态码则默认成功状态
     const code = res.data.code || 200;
     // 获取错误信息

src/views/product/attribute/index.vue

@@ -0,0 +1,279 @@
+<template>
+  <div class="app-container">
+
+
+
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="属性编码" prop="code">
+        <el-input
+          v-model="queryParams.code"
+          placeholder="请输入属性编码"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="属性名" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入属性名"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:attribute:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:attribute:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:attribute:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:attribute:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="attributeList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="属性编码" align="center" prop="code" />
+      <el-table-column label="属性名" align="center" prop="name" />
+      <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
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:attribute:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:attribute:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改商品属性对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="属性编码" prop="code">
+          <el-input v-model="form.code" placeholder="请输入属性编码" />
+        </el-form-item>
+        <el-form-item label="属性名" prop="name">
+          <el-input v-model="form.name" placeholder="请输入属性名" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </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 { listAttribute, getAttribute, delAttribute, addAttribute, updateAttribute } from "@/api/product/attribute";
+
+export default {
+  name: "Attribute",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 商品属性表格数据
+      attributeList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        code: null,
+        name: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        code: [
+          { required: true, message: "属性编码不能为空", trigger: "blur" }
+        ],
+        name: [
+          { required: true, message: "属性名不能为空", trigger: "blur" }
+        ],
+        createBy: [
+          { required: true, message: "创建人不能为空", trigger: "blur" }
+        ],
+        createTime: [
+          { required: true, message: "创建时间不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+
+    /** 查询商品属性列表 */
+    getList() {
+      this.loading = true;
+      listAttribute(this.queryParams).then(response => {
+        this.attributeList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        code: null,
+        name: null,
+        remark: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加商品属性";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getAttribute(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改商品属性";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateAttribute(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addAttribute(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除商品属性编号为"' + ids + '"的数据项？').then(function() {
+        return delAttribute(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/attribute/export', {
+        ...this.queryParams
+      }, `attribute_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/attributeGroup/index.vue

@@ -0,0 +1,437 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="属性名" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入属性名"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="状态" prop="states">
+        <el-select v-model="queryParams.states" placeholder="请选择状态" clearable>
+          <el-option
+            v-for="dict in dict.type.sys_yes_no"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:attributeGroup:add']"
+        >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:attributeGroup:edit']"
+        >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:attributeGroup:remove']"
+        >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:attributeGroup:export']"
+        >导出
+        </el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-row>
+        <el-table v-loading="loading" :data="attributeGroupList" @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="attributeInfoList" >
+            <template slot-scope="scope">
+              <el-tag v-for="item in scope.row.attributeInfoList">
+                {{item.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"/>
+            </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">
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-edit"
+                @click="handleUpdate(scope.row)"
+                v-hasPermi="['product:attributeGroup:query']"
+              >修改
+              </el-button>
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click="handleDelete(scope.row)"
+                v-hasPermi="['product:attributeGroup:remove']"
+              >删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+
+
+    </el-row>
+
+
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改商品属性组对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="80%" append-to-body >
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+
+
+        <!--属性名 状态-->
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="属性名" prop="name">
+              <el-input v-model="form.name" placeholder="请输入属性名"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="状态" prop="states">
+              <el-radio-group v-model="form.states">
+                <el-radio
+                  v-for="dict in dict.type.sys_yes_no"
+                  :key="dict.value"
+                  :label="dict.value"
+                >{{ 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-form-item>
+        </el-row>
+
+
+        <el-row>
+
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <span>已选属性</span>
+            </div>
+            <div slot="header" class="clearfix">
+              <el-col :span="2" v-for="(item ,index) in attributeList">
+                <el-tag
+                  v-if="attributeIdList.indexOf(item.id) > -1"
+                  style="margin: 5px 10px"
+                  :key="item.name"
+                  closable @close="handleClose(index)">
+                  {{ item.name }}
+                </el-tag>
+              </el-col>
+            </div>
+          </el-card>
+
+          <el-card class="box-card">
+
+              <div slot="header" class="clearfix">
+                <span>未选属性</span>
+              </div>
+              <div slot="header" class="clearfix">
+                <el-form :inline="true" :model="attribute" class="demo-form-inline">
+                  <el-form-item label="属性编码">
+                    <el-input v-model="attribute.code" placeholder="属性编码"></el-input>
+                  </el-form-item>
+                  <el-form-item label="属性名称">
+                    <el-input v-model="attribute.name" placeholder="属性名"></el-input>
+                  </el-form-item>
+                  <el-form-item>
+                    <el-button type="primary" @click="attributeQuery">查询</el-button>
+                  </el-form-item>
+                </el-form>
+              </div>
+
+
+            <el-row>
+              <el-col style="padding: 5px 10px" :span="3" v-for="item in attributeList">
+
+                <el-checkbox
+                  v-model="attributeIdList"
+                  :key="item.id"
+                  :value="item.id"
+                  :label="item.id"
+                  border>{{ item.name }}
+                </el-checkbox>
+              </el-col>
+            </el-row>
+
+            <pagination
+              v-show="attributeTotal>0"
+              :total="attributeTotal"
+              :page.sync="attribute.pageNum"
+              :limit.sync="attribute.pageSize"
+              @pagination="attributeQuery"
+            />
+            {{ attributeIdList }}
+          </el-card>
+
+
+        </el-row>
+      </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 {
+  listAttributeGroup,
+  getAttributeGroup,
+  delAttributeGroup,
+  addAttributeGroup,
+  updateAttributeGroup
+} from "@/api/product/attributeGroup";
+import {listAttribute} from "@/api/product/attribute";
+
+export default {
+  name: "AttributeGroup",
+  dicts: ['sys_yes_no'],
+  data() {
+    return {
+      tags: [
+        {name: '标签一', type: ''},
+        {name: '标签二', type: 'success'},
+        {name: '标签三', type: 'info'},
+        {name: '标签四', type: 'warning'},
+        {name: '标签五', type: 'danger'}
+      ],
+      attributeTotal: 0,
+      attributeList: [],
+      attributeIdList: [],
+      attribute: {
+        pageNum: 1,
+        pageSize: 6,
+        code: null,
+        name: null
+      },
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 商品属性组表格数据
+      attributeGroupList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        states: null,
+      },
+      // 表单参数
+      form: {
+        attributeIdList: [],
+      },
+      // 表单校验
+      rules: {
+        name: [
+          {required: true, message: "属性名不能为空", trigger: "blur"}
+        ],
+        states: [
+          {required: true, message: "状态不能为空", trigger: "change"}
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+
+    attributeQuery() {
+      listAttribute(this.attribute).then(response => {
+        this.attributeList = response.data.rows;
+        this.attributeTotal = response.data.total;
+      });
+    },
+    handleClose(index) {
+      this.attributeIdList.splice(this.attributeIdList.indexOf(index), 1)
+    },
+    /** 查询商品属性组列表 */
+    getList() {
+      this.loading = true;
+      listAttributeGroup(this.queryParams).then(response => {
+        this.attributeGroupList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        name: null,
+        states: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        attributeIdList:null,
+        attributeIds:null,
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length !== 1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加商品属性组";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getAttributeGroup(id).then(response => {
+        console.log(response)
+        this.form = response.data;
+        this.attributeIdList=response.data.attributeIdList
+        this.open = true;
+        this.title = "修改商品属性组";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            this.form.attributeIdList=this.attributeIdList
+            updateAttributeGroup(this.form).then(response => {
+              console.log(this.form)
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+              this.reset();
+              this.form.attributeIds=''
+              this.attributeIdList=[]
+            });
+          } else {
+            this.form.attributeIdList=this.attributeIdList
+            addAttributeGroup(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+              this.reset();
+              this.form.attributeIds=''
+              this.attributeIdList=[]
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除商品属性组编号为"' + ids + '"的数据项？').then(function () {
+        return delAttributeGroup(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/attributeGroup/export', {
+        ...this.queryParams
+      }, `attributeGroup_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/brand/index.vue

@@ -0,0 +1,312 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="品牌名称" prop="nam">
+        <el-input
+          v-model="queryParams.nam"
+          placeholder="请输入品牌名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="是否启用" prop="start">
+        <el-select v-model="queryParams.start" placeholder="请选择是否启用" clearable>
+          <el-option
+            v-for="dict in dict.type.sys_yes_no"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:brand:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:brand:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:brand:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:brand:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="brandList" @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="nam" />
+      <el-table-column label="LOGO" align="center" prop="logo" width="100">
+        <template slot-scope="scope">
+          <image-preview :src="scope.row.logo" :width="50" :height="50"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="是否启用" align="center" prop="start">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.start"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="介绍" align="center" prop="introduction" />
+      <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
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:brand:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:brand:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改品牌信息对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="品牌名称" prop="nam">
+          <el-input v-model="form.nam" placeholder="请输入品牌名称" />
+        </el-form-item>
+        <el-form-item label="LOGO" prop="logo">
+          <image-upload v-model="form.logo"/>
+        </el-form-item>
+        <el-form-item label="是否启用" prop="start">
+          <el-radio-group v-model="form.start">
+            <el-radio
+              v-for="dict in dict.type.sys_yes_no"
+              :key="dict.value"
+              :label="dict.value"
+            >{{dict.label}}</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="介绍" prop="introduction">
+          <el-input v-model="form.introduction" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </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 { listBrand, getBrand, delBrand, addBrand, updateBrand } from "@/api/product/brand";
+
+export default {
+  name: "Brand",
+  dicts: ['sys_yes_no'],
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 品牌信息表格数据
+      brandList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        nam: null,
+        logo: null,
+        start: null,
+        introduction: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        nam: [
+          { required: true, message: "品牌名称不能为空", trigger: "blur" }
+        ],
+        logo: [
+          { required: true, message: "LOGO不能为空", trigger: "blur" }
+        ],
+        start: [
+          { required: true, message: "是否启用不能为空", trigger: "change" }
+        ],
+        createBy: [
+          { required: true, message: "创建人不能为空", trigger: "blur" }
+        ],
+        createTime: [
+          { required: true, message: "创建时间不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询品牌信息列表 */
+    getList() {
+      this.loading = true;
+      listBrand(this.queryParams).then(response => {
+        this.brandList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        nam: null,
+        logo: null,
+        start: null,
+        introduction: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加品牌信息";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getBrand(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改品牌信息";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateBrand(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addBrand(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除品牌信息编号为"' + ids + '"的数据项？').then(function() {
+        return delBrand(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/brand/export', {
+        ...this.queryParams
+      }, `brand_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/category/index.vue

@@ -0,0 +1,401 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="品牌名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入品牌名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="父级品类" prop="parentId">
+        <el-input
+          v-model="queryParams.parentId"
+          placeholder="请输入父级品类"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="是否启用" prop="start">
+        <el-input
+          v-model="queryParams.start"
+          placeholder="请输入是否启用"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:category:add']"
+        >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="info"
+          plain
+          icon="el-icon-sort"
+          size="mini"
+          @click="toggleExpandAll"
+        >展开/折叠
+        </el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-if="refreshTable"
+      v-loading="loading"
+      :data="categoryList"
+      row-key="id"
+      :default-expand-all="isExpandAll"
+      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+    >
+      <el-table-column label="品牌名称" prop="name"/>
+      <el-table-column label="图片" align="center" prop="image" width="100">
+        <template slot-scope="scope">
+          <image-preview :src="scope.row.image" :width="50" :height="50"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="父级品类" align="center" prop="parentId"/>
+      <el-table-column label="是否启用" align="center" prop="start">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.start"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="介绍" align="center" prop="introduction"/>
+      <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
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:category:edit']"
+          >修改
+          </el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-plus"
+            @click="handleAdd(scope.row)"
+            v-hasPermi="['product:category:add']"
+          >新增
+          </el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:category:remove']"
+          >删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 添加或修改品类信息对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="父级品类" prop="parentId">
+              <treeselect v-model="form.parentId" :options="categoryOptions" :normalizer="normalizer"
+                          placeholder="请选择父级品类"/>
+            </el-form-item>
+
+            <el-form-item label="品牌名称" prop="name">
+              <el-input v-model="form.name" placeholder="请输入品牌名称"/>
+            </el-form-item>
+            <el-form-item label="图片" prop="image">
+              <image-upload v-model="form.image"/>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="12">
+            <el-form-item label="状态" prop="states">
+              <el-radio-group v-model="form.start">
+                <el-radio
+                  v-for="dict in dict.type.sys_yes_no"
+                  :key="dict.value"
+                  :label="dict.value"
+                >{{ dict.label }}
+                </el-radio>
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item label="介绍" prop="introduction">
+              <el-input v-model="form.introduction" type="textarea" placeholder="请输入内容"/>
+            </el-form-item>
+            <el-form-item label="备注">
+              <editor v-model="form.remark" :min-height="80"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row>
+          <el-tabs>
+            <el-tab-pane label="商品属性" name="attribute">
+              <Attribute v-model="form.attributeIdList" :checked-list="attributeInfoList"/>
+            </el-tab-pane>
+            <el-tab-pane label="商品属性组" name="attributeGroup">
+              <AttributeGroup v-model="form.attributeGroupIdList" :checked-list="attributeGroupList"/>
+            </el-tab-pane>
+            <el-tab-pane label="商品品牌" name="band">
+              <Brand v-model="form.brandIdList" :checked-list="brandInfoList"/>
+            </el-tab-pane>
+          </el-tabs>
+        </el-row>
+
+
+      </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 {
+  listCategory,
+  getCategory,
+  delCategory,
+  addCategory,
+  updateCategory,
+  parentCategoryCommon
+} from "@/api/product/category";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+
+export default {
+
+  name: "Category",
+  dicts: ['sys_yes_no'],
+  components: {
+    Treeselect
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 品类信息表格数据
+      categoryList: [],
+      // 品类信息树选项
+      categoryOptions: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 是否展开，默认全部展开
+      isExpandAll: true,
+      // 重新渲染表格状态
+      refreshTable: true,
+      // 查询参数
+      queryParams: {
+        name: null,
+        image: null,
+        parentId: null,
+        start: null,
+        introduction: null,
+      },
+      // 表单参数
+      form: {
+        attributeInfoList: [],
+        brandInfoList: [],
+        attributeGroupList: [],
+      },
+      // 表单校验
+      rules: {
+        name: [
+          {required: true, message: "品牌名称不能为空", trigger: "blur"}
+        ],
+        image: [
+          {required: true, message: "图片不能为空", trigger: "blur"}
+        ],
+        parentId: [
+          {required: true, message: "父级品类不能为空", trigger: "blur"}
+        ],
+        start: [
+          {required: true, message: "是否启用不能为空", trigger: "blur"}
+        ],
+        createBy: [
+          {required: true, message: "创建人不能为空", trigger: "blur"}
+        ],
+        createTime: [
+          {required: true, message: "创建时间不能为空", trigger: "blur"}
+        ],
+      },
+      attributeInfoList: [],
+      brandInfoList: [],
+      attributeGroupList: [],
+    };
+  },
+  watch: {
+    'form.parentId': {
+      handler(val) {
+        if (val !== undefined && val !== 0) {
+          parentCategoryCommon(val).then(
+            response => {
+              this.attributeInfoList = response.data.attributeInfoList;
+              this.attributeGroupList = response.data.attributeGroupList;
+              this.brandInfoList = response.data.brandInfoList;
+            }
+          )
+        }
+      },
+      immediate: true
+    }
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询品类信息列表 */
+    getList() {
+      this.loading = true;
+      listCategory(this.queryParams).then(response => {
+        this.categoryList = this.handleTree(response.data, "id", "parentId");
+        this.loading = false;
+      });
+    },
+    /** 转换品类信息数据结构 */
+    normalizer(node) {
+      if (node.children && !node.children.length) {
+        delete node.children;
+      }
+      return {
+        id: node.id,
+        label: node.name,
+        children: node.children
+      };
+    },
+    /** 查询品类信息下拉树结构 */
+    getTreeselect() {
+      listCategory().then(response => {
+        this.categoryOptions = [];
+        const data = {id: 0, name: '顶级节点', children: []};
+        data.children = this.handleTree(response.data, "id", "parentId");
+        this.categoryOptions.push(data);
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        name: null,
+        image: null,
+        parentId: null,
+        start: null,
+        introduction: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd(row) {
+      this.reset();
+      this.getTreeselect();
+      if (row != null && row.id) {
+        this.form.parentId = row.id;
+      } else {
+        this.form.parentId = 0;
+      }
+      this.open = true;
+      this.title = "添加品类信息";
+    },
+    /** 展开/折叠操作 */
+    toggleExpandAll() {
+      this.refreshTable = false;
+      this.isExpandAll = !this.isExpandAll;
+      this.$nextTick(() => {
+        this.refreshTable = true;
+      });
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      this.getTreeselect();
+      if (row != null) {
+        this.form.parentId = row.parentId;
+      }
+      getCategory(row.id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改品类信息";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          this.form.brandInfoList=this.brandInfoList
+          this.form.attributeInfoList=this.attributeInfoList
+          this.form.attributeGroupList=this.attributeGroupList
+          console.log(this.form)
+          if (this.form.id != null) {
+            updateCategory(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+              this.attributeInfoList=[]
+              this.attributeGroupList=[]
+              this.brandInfoList=[]
+            });
+          } else {
+            addCategory(this.form).then(response => {
+              console.log(this.form)
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+              this.attributeInfoList=[]
+              this.attributeGroupList=[]
+              this.brandInfoList=[]
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$modal.confirm('是否确认删除品类信息编号为"' + row.id + '"的数据项？').then(function () {
+        return delCategory(row.id);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      });
+    }
+  }
+};
+</script>

src/views/product/comment/index.vue

@@ -0,0 +1,289 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="商品id" prop="projectId">
+        <el-input
+          v-model="queryParams.projectId"
+          placeholder="请输入商品id"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="父类id" prop="parentId">
+        <el-input
+          v-model="queryParams.parentId"
+          placeholder="请输入父类id"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:comment:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:comment:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:comment:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:comment:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="commentList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="主键" align="center" prop="id" />
+      <el-table-column label="商品id" align="center" prop="projectId" />
+      <el-table-column label="评论" align="center" prop="comment" />
+      <el-table-column label="图片" align="center" prop="images" />
+      <el-table-column label="父类id" align="center" prop="parentId" />
+      <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
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:comment:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:comment:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改商品评论对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="商品id" prop="projectId">
+          <el-input v-model="form.projectId" placeholder="请输入商品id" />
+        </el-form-item>
+        <el-form-item label="评论" prop="comment">
+          <el-input v-model="form.comment" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="图片" prop="images">
+          <el-input v-model="form.images" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="父类id" prop="parentId">
+          <el-input v-model="form.parentId" placeholder="请输入父类id" />
+        </el-form-item>
+        <el-form-item label="备注">
+          <editor v-model="form.remark" :min-height="192"/>
+        </el-form-item>
+      </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 { listComment, getComment, delComment, addComment, updateComment } from "@/api/product/comment";
+
+export default {
+  name: "Comment",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 商品评论表格数据
+      commentList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        projectId: null,
+        comment: null,
+        images: null,
+        parentId: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        projectId: [
+          { required: true, message: "商品id不能为空", trigger: "blur" }
+        ],
+        createBy: [
+          { required: true, message: "创建人不能为空", trigger: "blur" }
+        ],
+        createTime: [
+          { required: true, message: "创建时间不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询商品评论列表 */
+    getList() {
+      this.loading = true;
+      listComment(this.queryParams).then(response => {
+        this.commentList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        projectId: null,
+        comment: null,
+        images: null,
+        parentId: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加商品评论";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getComment(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改商品评论";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateComment(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addComment(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除商品评论编号为"' + ids + '"的数据项？').then(function() {
+        return delComment(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/comment/export', {
+        ...this.queryParams
+      }, `comment_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/commentLike/index.vue

@@ -0,0 +1,280 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="评论id" prop="commentId">
+        <el-input
+          v-model="queryParams.commentId"
+          placeholder="请输入评论id"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="点赞人id" prop="userId">
+        <el-input
+          v-model="queryParams.userId"
+          placeholder="请输入点赞人id"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:commentLike:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:commentLike:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:commentLike:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:commentLike:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="commentLikeList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="主键" align="center" prop="id" />
+      <el-table-column label="评论id" align="center" prop="commentId" />
+      <el-table-column label="点赞人id" align="center" prop="userId" />
+      <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
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:commentLike:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:commentLike:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改评论点赞对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="评论id" prop="commentId">
+          <el-input v-model="form.commentId" placeholder="请输入评论id" />
+        </el-form-item>
+        <el-form-item label="点赞人id" prop="userId">
+          <el-input v-model="form.userId" placeholder="请输入点赞人id" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </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 { listCommentLike, getCommentLike, delCommentLike, addCommentLike, updateCommentLike } from "@/api/product/commentLike";
+
+export default {
+  name: "CommentLike",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 评论点赞表格数据
+      commentLikeList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        commentId: null,
+        userId: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        commentId: [
+          { required: true, message: "评论id不能为空", trigger: "blur" }
+        ],
+        userId: [
+          { required: true, message: "点赞人id不能为空", trigger: "blur" }
+        ],
+        createBy: [
+          { required: true, message: "创建人不能为空", trigger: "blur" }
+        ],
+        createTime: [
+          { required: true, message: "创建时间不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询评论点赞列表 */
+    getList() {
+      this.loading = true;
+      listCommentLike(this.queryParams).then(response => {
+        this.commentLikeList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        commentId: null,
+        userId: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加评论点赞";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getCommentLike(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改评论点赞";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateCommentLike(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addCommentLike(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除评论点赞编号为"' + ids + '"的数据项？').then(function() {
+        return delCommentLike(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/commentLike/export', {
+        ...this.queryParams
+      }, `commentLike_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/good/index.vue

@@ -0,0 +1,540 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="属性名" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入属性名"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="值类型" prop="typeName">
+        <el-input
+          v-model="queryParams.typeName"
+          placeholder="请输入值类型"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:good:add']"
+        >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:good:edit']"
+        >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:good:remove']"
+        >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:good:export']"
+        >导出
+        </el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    {{goodList}}
+    <el-table v-loading="loading" :data="goodList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center"/>
+      <el-table-column label="id" align="center" prop="id"/>
+      <el-table-column label="属性名" align="center" prop="name"/>
+      <el-table-column label="可检索" align="center" prop="searching"/>
+      <el-table-column label="值类型" align="center" prop="typeName"/>
+      <el-table-column label="图标" align="center" prop="image" width="100">
+        <template slot-scope="scope">
+          <image-preview :src="scope.row.image" :width="50" :height="50"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="可选值" align="center" prop="checkValue"/>
+      <el-table-column label="启用" align="center" prop="enable"/>
+      <el-table-column label="所属分类" align="center" prop="classify"/>
+      <el-table-column label="所属分组" align="center" prop="groupValue"/>
+      <el-table-column label="快速展示" align="center" prop="quickShow">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.quickShow"/>
+        </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">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:good:edit']"
+          >修改
+          </el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:good:remove']"
+          >删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改商品测试对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="属性名" prop="name">
+          <el-input v-model="form.name" placeholder="请输入属性名"/>
+        </el-form-item>
+
+        <el-form-item label="值类型" prop="typeName">
+          <el-switch
+            style="display: block"
+            v-model="value"
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+            active-text="只能单个值"
+            inactive-text="允许多个值">
+          </el-switch>
+        </el-form-item>
+
+
+        <el-form-item label="可选值">
+          <Attribute v-model="form.attributeIdList" :checked-list="attributeInfoList"/>
+        </el-form-item>
+
+        <el-form-item label="图标" prop="image">
+          <image-upload v-model="form.image"/>
+        </el-form-item>
+
+        <el-form-item label="所属分组">
+          <el-cascader :options="options" clearable></el-cascader>
+        </el-form-item>
+
+
+        <el-form-item label="可检索" prop="searching">
+          <el-switch
+            v-model="form.searching"
+            active-color="#13ce66"
+            inactive-color="#ff4949">
+          </el-switch>
+        </el-form-item>
+        <el-form-item label="快速展示" prop="quickShow">
+          <el-switch
+            v-model="form.quickShow"
+            active-color="#13ce66"
+            inactive-color="#ff4949">
+          </el-switch>
+        </el-form-item>
+        <el-form-item label="启用" prop="enable">
+          <el-switch
+            v-model="form.enable"
+            active-color="#13ce66"
+            inactive-color="#ff4949">
+          </el-switch>
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" placeholder="请输入备注"/>
+        </el-form-item>
+      </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 {listGood, getGood, delGood, addGood, updateGood} from "@/api/product/good";
+
+export default {
+  name: "Good",
+  dicts: ['sys_normal_disable'],
+  data() {
+    return {
+      options: [{
+        value: 'zhinan',
+        label: '指南',
+        children: [{
+          value: 'shejiyuanze',
+          label: '设计原则',
+          children: [{
+            value: 'yizhi',
+            label: '一致'
+          }, {
+            value: 'fankui',
+            label: '反馈'
+          }, {
+            value: 'xiaolv',
+            label: '效率'
+          }, {
+            value: 'kekong',
+            label: '可控'
+          }]
+        }, {
+          value: 'daohang',
+          label: '导航',
+          children: [{
+            value: 'cexiangdaohang',
+            label: '侧向导航'
+          }, {
+            value: 'dingbudaohang',
+            label: '顶部导航'
+          }]
+        }]
+      }, {
+        value: 'zujian',
+        label: '组件',
+        children: [{
+          value: 'basic',
+          label: 'Basic',
+          children: [{
+            value: 'layout',
+            label: 'Layout 布局'
+          }, {
+            value: 'color',
+            label: 'Color 色彩'
+          }, {
+            value: 'typography',
+            label: 'Typography 字体'
+          }, {
+            value: 'icon',
+            label: 'Icon 图标'
+          }, {
+            value: 'button',
+            label: 'Button 按钮'
+          }]
+        }, {
+          value: 'form',
+          label: 'Form',
+          children: [{
+            value: 'radio',
+            label: 'Radio 单选框'
+          }, {
+            value: 'checkbox',
+            label: 'Checkbox 多选框'
+          }, {
+            value: 'input',
+            label: 'Input 输入框'
+          }, {
+            value: 'input-number',
+            label: 'InputNumber 计数器'
+          }, {
+            value: 'select',
+            label: 'Select 选择器'
+          }, {
+            value: 'cascader',
+            label: 'Cascader 级联选择器'
+          }, {
+            value: 'switch',
+            label: 'Switch 开关'
+          }, {
+            value: 'slider',
+            label: 'Slider 滑块'
+          }, {
+            value: 'time-picker',
+            label: 'TimePicker 时间选择器'
+          }, {
+            value: 'date-picker',
+            label: 'DatePicker 日期选择器'
+          }, {
+            value: 'datetime-picker',
+            label: 'DateTimePicker 日期时间选择器'
+          }, {
+            value: 'upload',
+            label: 'Upload 上传'
+          }, {
+            value: 'rate',
+            label: 'Rate 评分'
+          }, {
+            value: 'form',
+            label: 'Form 表单'
+          }]
+        }, {
+          value: 'data',
+          label: 'Data',
+          children: [{
+            value: 'table',
+            label: 'Table 表格'
+          }, {
+            value: 'tag',
+            label: 'Tag 标签'
+          }, {
+            value: 'progress',
+            label: 'Progress 进度条'
+          }, {
+            value: 'tree',
+            label: 'Tree 树形控件'
+          }, {
+            value: 'pagination',
+            label: 'Pagination 分页'
+          }, {
+            value: 'badge',
+            label: 'Badge 标记'
+          }]
+        }, {
+          value: 'notice',
+          label: 'Notice',
+          children: [{
+            value: 'alert',
+            label: 'Alert 警告'
+          }, {
+            value: 'loading',
+            label: 'Loading 加载'
+          }, {
+            value: 'message',
+            label: 'Message 消息提示'
+          }, {
+            value: 'message-box',
+            label: 'MessageBox 弹框'
+          }, {
+            value: 'notification',
+            label: 'Notification 通知'
+          }]
+        }, {
+          value: 'navigation',
+          label: 'Navigation',
+          children: [{
+            value: 'menu',
+            label: 'NavMenu 导航菜单'
+          }, {
+            value: 'tabs',
+            label: 'Tabs 标签页'
+          }, {
+            value: 'breadcrumb',
+            label: 'Breadcrumb 面包屑'
+          }, {
+            value: 'dropdown',
+            label: 'Dropdown 下拉菜单'
+          }, {
+            value: 'steps',
+            label: 'Steps 步骤条'
+          }]
+        }, {
+          value: 'others',
+          label: 'Others',
+          children: [{
+            value: 'dialog',
+            label: 'Dialog 对话框'
+          }, {
+            value: 'tooltip',
+            label: 'Tooltip 文字提示'
+          }, {
+            value: 'popover',
+            label: 'Popover 弹出框'
+          }, {
+            value: 'card',
+            label: 'Card 卡片'
+          }, {
+            value: 'carousel',
+            label: 'Carousel 走马灯'
+          }, {
+            value: 'collapse',
+            label: 'Collapse 折叠面板'
+          }]
+        }]
+      }, {
+        value: 'ziyuan',
+        label: '资源',
+        children: [{
+          value: 'axure',
+          label: 'Axure Components'
+        }, {
+          value: 'sketch',
+          label: 'Sketch Templates'
+        }, {
+          value: 'jiaohu',
+          label: '组件交互文档'
+        }]
+      }],
+      attributeInfoList: [],
+      value: true,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 商品测试表格数据
+      goodList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        typeName: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {}
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询商品测试列表 */
+    getList() {
+      this.loading = true;
+      listGood(this.queryParams).then(response => {
+        console.log(response)
+        this.goodList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        name: null,
+        searching: null,
+        typeName: null,
+        image: null,
+        checkValue: null,
+        enable: null,
+        classify: null,
+        groupValue: null,
+        quickShow: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        remark: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length !== 1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加商品测试";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getGood(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改商品测试";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateGood(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addGood(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除商品测试编号为"' + ids + '"的数据项？').then(function () {
+        return delGood(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/good/export', {
+        ...this.queryParams
+      }, `good_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/productInfo/commodityMall/commodity.vue

@@ -0,0 +1,95 @@
+<template>
+  <div>
+    <el-main>
+      <el-row>
+        <el-col :span="8">
+          <el-card v-for="good in goodList" style="width: 500px">
+            <el-descriptions :data="good" title="商品列表">
+              <el-descriptions-item label="商品图片">
+                <img :src="good.image" style="width: 100px" height="100px">
+              </el-descriptions-item>
+              <el-descriptions-item label="商品名称">{{ good.name }}</el-descriptions-item>
+              <el-descriptions-item label="销量">
+                1000
+              </el-descriptions-item>
+              <el-descriptions-item label="备注">
+                <el-tag size="small">电子产品</el-tag>
+              </el-descriptions-item>
+              <el-descriptions-item label="产地">
+                江苏省苏州市吴中区吴中大道 1188 号
+              </el-descriptions-item>
+              <el-descriptions-item>
+                <el-button type="primary" size="small" @click="details1(good.id)">详情</el-button>
+              </el-descriptions-item>
+            </el-descriptions>
+          </el-card>
+        </el-col>
+      </el-row>
+    </el-main>
+
+    <el-main>
+      <el-row :gutter="20">
+        <el-col :span="12" :offset="6">
+          <router-view></router-view>
+        </el-col>
+      </el-row>
+    </el-main>
+
+
+  </div>
+</template>
+<script>
+
+import {getPro, listInfo} from "@/api/product/info";
+
+export default {
+  name: 'Index',
+  computed: {},
+  data() {
+    return {
+      goodList: [],
+      queryParams: {},
+    }
+  },
+  created() {
+    this.getList()
+  },
+
+  methods: {
+    details1(id) {
+      this.$router.push('/detailsComponent/' + id)
+    },
+    /*获取商品信息*/
+    getList() {
+      this.loading = true;
+      listInfo(this.queryParams).then(response => {
+        this.goodList = response.data.rows;
+        console.log(this.goodList)
+      });
+    },
+  }
+}
+</script>
+<style scoped>
+.like {
+  cursor: pointer;
+  font-size: 12px;
+  display: inline-block;
+}
+
+.el-carousel__item h3 {
+  color: #475669;
+  font-size: 20px;
+  opacity: 0.75;
+  line-height: 300px;
+  margin: 0;
+}
+
+.el-carousel__item:nth-child(2n) {
+  background-color: #99a9bf;
+}
+
+.el-carousel__item:nth-child(2n+1) {
+  background-color: #d3dce6;
+}
+</style>

src/views/product/productInfo/detail/productDetails.vue

@@ -0,0 +1,354 @@
+<template>
+  <div>
+
+    <el-breadcrumb separator-class="el-icon-arrow-right">
+      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
+      <el-breadcrumb-item :to="{ path: '/commodityMall' }">商城</el-breadcrumb-item>
+      <el-breadcrumb-item v-for="breadcrumb in breadcrumbList">{{ breadcrumb }}</el-breadcrumb-item>
+    </el-breadcrumb>
+
+
+    <el-row>
+      <el-col :span="12">
+        <el-carousel indicator-position="outside" style="width: 350px">
+          <el-carousel-item v-for="item in imageList" :key="item">
+            <h3>
+              <img :src="item">
+            </h3>
+          </el-carousel-item>
+        </el-carousel>
+        <el-row :gutter="20" style="margin-top: 20px">
+          <el-col :span="6">
+            <div>
+              <el-statistic
+                group-separator=","
+                :precision="2"
+                :value="value2"
+                title="销量人气"
+              ></el-statistic>
+            </div>
+          </el-col>
+          <el-col :span="6">
+            <div>
+              <el-statistic title="商品评价">
+                <template slot="formatter">
+                  999
+                </template>
+              </el-statistic>
+            </div>
+          </el-col>
+          <el-col :span="6">
+            <div>
+              <el-statistic
+                group-separator=","
+                :precision="2"
+                decimal-separator="."
+                :value="value1"
+                title="收藏人气"
+              >
+                <template slot="prefix">
+                  <i class="el-icon-s-flag" style="color: red"></i>
+                </template>
+                <template slot="suffix">
+                  <i class="el-icon-s-flag" style="color: blue"></i>
+                </template>
+              </el-statistic>
+            </div>
+          </el-col>
+          <el-col :span="6">
+            <div>
+              <el-statistic :value="like ? 521 : 520" :title="brandName">
+                <template slot="suffix">
+                            <span @click="like = !like" class="like">
+                              <i
+                                class="el-icon-star-on"
+                                style="color:red"
+                                v-show="!!like"
+                              ></i>
+                              <i class="el-icon-star-off" v-show="!like"></i>
+                            </span>
+                </template>
+              </el-statistic>
+            </div>
+          </el-col>
+        </el-row>
+      </el-col>
+      <el-col :span="12">
+        <h1 style=" display: inline-block; margin-right: 160px; margin-left: 30px">{{ good.name }}</h1>{{checkgood.goodname}}
+        <h3 style="display: inline-block; color: red;">单价： ￥{{ checkgood.price }}</h3>
+        <el-form ref="form" :model="form" label-width="80px" style="margin-top: 50px">
+          <el-form-item v-for="(rule, index) in form.ruleList" :key="index" :label="rule.name">
+            <el-radio-group v-model="form['rule'+index]" @change="changeRule">
+              <el-radio v-for="value in rule.value"
+                        :key="value"
+                        :label="value" border>{{ value }}
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
+
+
+          <el-form-item label="购买数量">
+            <el-input-number v-model="form.num" :disabled="disabled" :min="1" :max="100" label="描述文字"></el-input-number>
+            库存{{ checkgood.stock }}
+            <h3 style="color: red;">总价￥{{ checkgood.sumPrice }}</h3>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="onSubmit">加入购物车</el-button>
+            <el-button type="danger">立即购买</el-button>
+          </el-form-item>
+        </el-form>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-card class="box-card" style="margin-top: 20px">
+        <div slot="header" class="clearfix">
+          <span>商品详情</span>
+        </div>
+        <el-descriptions class="margin-top" :column="3" size="medium" border>
+          <template slot="extra">
+            <el-button type="primary" size="small">商品评论</el-button>
+          </template>
+          <el-descriptions-item v-for="detail in goodDetail">
+            <template slot="label">
+              <i class="el-icon-user"></i>
+              {{ detail.name }}
+            </template>
+            {{ detail.value }}
+          </el-descriptions-item>
+        </el-descriptions>
+        <el-row>
+          <template v-for="item in 2" >
+            <img :src="good.image">
+          </template>
+          <editor v-model="good.introduction" :read-only="true">
+            <img :src="good.introduction">
+          </editor>
+        </el-row>
+      </el-card>
+    </el-row>
+
+
+
+
+  </div>
+</template>
+<script>
+import {getPro} from "@/api/product/info";
+import rule from "@/views/product/rule/index.vue";
+import {addShop} from "@/api/shopCart/shop";
+
+export default {
+  name: 'product_details',
+  data() {
+    return {
+      /*加入购物车*/
+      joinShop:{
+        projectId:0,
+        projectSku:"",
+        num:0,
+        detailSku:[]
+      },
+      /*选择商品sku信息*/
+      goodSkuDetail:{},
+      id: 0,
+      /*图片*/
+      imageList: [],
+      /*品牌信息*/
+      brandName: "",
+      good: {},
+      like: true,
+      value1: 999,
+      value2: 999,
+      title: "增长人数",
+      breadcrumbList: [],
+      //规格表单
+      form: {
+        ruleList: [],
+        num: 1
+      },
+      ruleValueList: [],
+      /*国歌表单*/
+      categoryCommonElement: {
+        templateAttributeGroupList: [],
+        templateAttributeList: [],
+        attributeList: []
+      },
+      /*商品详情*/
+      goodDetail: [],
+      /*sku*/
+      sku: [],
+      /*选择商品数*/
+      disabled:false,
+      /*选择商品属性*/
+      checkgood:{
+        /*单价*/
+        price: 0,
+        /*库存*/
+        stock: 0,
+        /*总价*/
+        sumPrice: 0,
+        /*商品+类型名*/
+        goodname: "",
+      },
+
+    }
+  },
+  created() {
+
+    const id = this.$route.params.id;
+    this.id = id
+    this.details(id)
+  },
+  watch: {
+    "form.num": {
+      handler(val) {
+        this.checkgood.stock = this.checkgood.stock - 1
+        this.checkgood.sumPrice = this.checkgood.sumPrice + this.checkgood.price
+      }
+    },
+    "checkgood.stock": {
+      handler(val) {
+        if (val === 0) {
+          this.$message.error("库存不够")
+          this.form.num=this.form.num - 1
+          this.disabled=true
+        }
+      }
+    }
+  },
+  methods: {
+
+    changeRule() {
+      this.disabled=false
+      this.form.num=1
+      let selectedValues = this.sku.map((rule, index) => {
+        return this.form['rule' + index]; // 获取每个索引对应的值
+      }).filter(value => value !== '').join(''); // 过滤空值，然后拼接成字符串
+
+      this.goodSkuDetail.sku=selectedValues
+
+      this.sku.forEach(
+        sku => {
+          if (selectedValues === sku.sku) {
+            this.checkgood.price = sku.price
+            this.checkgood.sumPrice = sku.price
+            this.checkgood.stock = sku.stock
+            this.checkgood.goodname = selectedValues
+          }
+        }
+      )
+    },
+
+    /*加入购物车*/
+    onSubmit() {
+      let length = this.form.ruleList.length;
+      let rule=[]
+      for (let i = 0; i <length; i++) {
+         rule.push(`${this.form.ruleList[i].name}:${this.form[`rule${i}`]}`)
+      }
+      this.joinShop.detailSku= rule.join(", ");
+      this.joinShop.projectId=this.good.id
+      this.joinShop.projectSku=this.checkgood.goodname
+      this.joinShop.num=this.form.num
+      console.log(this.joinShop)
+      addShop(this.joinShop).then(
+        res=>{
+          this.$message.success("添加成功")
+        }
+      )
+    },
+
+    details: function (id) {
+      getPro(id).then(
+        res => {
+          console.log(res.data.product)
+          this.breadcrumbList = res.data.typeList
+          this.brandName = res.data.brandName
+          this.good = res.data.product
+          this.imageList = res.data.product.carouselImages.split(",")
+          this.sku = res.data.projectSkuInfo
+          let e1 = []
+
+          res.data.ruleList.forEach(
+            rule => {
+              e1.push({id: rule.id, name: rule.name, value: rule.value})
+            }
+          )
+
+          this.form.ruleList = e1
+          this.categoryCommonElement = res.data.categoryCommonElementResp
+          e = []
+          let e = []
+          this.categoryCommonElement.attributeList.forEach(
+            attribute => {
+              e.push(
+                {name: attribute.name, value: attribute.value}
+              )
+            }
+          )
+          this.categoryCommonElement.templateAttributeList.forEach(
+            attribute => {
+              e.push(
+                {name: attribute.name, value: attribute.value}
+              )
+            }
+          )
+          let f = []
+          this.categoryCommonElement.templateAttributeGroupList.forEach(
+            group => {
+              f.push(group.attributeList)
+            }
+          )
+          f.forEach(
+            group => {
+              group.forEach(
+                group1 => {
+                  e.push(
+                    {name: group1.name, value: group1.value}
+                  )
+                }
+              )
+            }
+          )
+
+          this.goodDetail = []
+          this.goodDetail = e.filter(rule => rule.value !== null)
+
+        }
+      )
+    }
+
+  }
+}
+</script>
+<style scoped>
+
+.el-header, .el-footer {
+  background-color: #B3C0D1;
+  color: #333;
+  text-align: center;
+  line-height: 60px;
+}
+
+.el-menu-demo {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.el-main {
+  color: #333;
+}
+
+body > .el-container {
+  margin-bottom: 40px;
+}
+
+.el-container:nth-child(5) .el-aside,
+.el-container:nth-child(6) .el-aside {
+  line-height: 260px;
+}
+
+.el-container:nth-child(7) .el-aside {
+  line-height: 320px;
+}
+</style>

src/views/product/productInfo/index.vue

@@ -0,0 +1,895 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="商品名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入商品名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:info:add']"
+        >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:info:edit']"
+        >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:info:remove']"
+        >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:info:export']"
+        >导出
+        </el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="infoList" @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="introduction"/>
+      <el-table-column label="主类型" align="center" prop="mianType"/>
+      <el-table-column label="父类型" align="center" prop="parentType"/>
+      <el-table-column label="商品类型" align="center" prop="type"/>
+      <el-table-column label="商品图片" align="center" prop="image" width="100">
+        <template slot-scope="scope">
+          <image-preview :src="scope.row.image" :width="50" :height="50"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="商品轮播图" align="center" prop="carouselImages" width="100">
+        <template slot-scope="scope">
+          <image-preview :src="scope.row.carouselImages" :width="50" :height="50"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="商品状态" align="center" prop="status">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="规格" align="center" prop="ruleId"/>
+      <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
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:info:query']"
+          >修改
+          </el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:info:remove']"
+          >删除
+          </el-button>
+          <el-button
+            size="mini"
+            type="text"
+            @click="detail(scope.row.id)"
+          >详细
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改商品信息对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
+
+      <el-steps :active="active" finish-status="success">
+        <el-step title="商品信息"></el-step>
+        <el-step title="商品规格"></el-step>
+        <el-step title="商品品类"></el-step>
+        <el-step title="商品备注"></el-step>
+      </el-steps>
+
+
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+
+        <div v-if="active==1">
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="商品名称" prop="name">
+                <el-input v-model="form.name" placeholder="请输入商品名称"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="商品状态" prop="status">
+                <el-radio-group v-model="form.status">
+                  <el-radio
+                    v-for="dict in dict.type.sys_normal_disable"
+                    :key="dict.value"
+                    :label="dict.value"
+                  >{{ dict.label }}
+                  </el-radio>
+                </el-radio-group>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="商品描述">
+                <editor v-model="form.introduction" :min-height="192"/>
+              </el-form-item>
+
+              <!--商品品牌-->
+
+              <el-form-item label="品牌" prop="brandId">
+                <el-select
+                  v-model="form.brandId"
+                  filterable
+                  remote
+                  reserve-keyword
+                  placeholder="请输入关键词"
+                  :remote-method="remoteSearchBrandList"
+                  :loading="loading"
+                 clearable
+                >
+                  <el-option
+                    v-for="brand in brandList"
+                    :key="brand.id"
+                    :label="brand.nam"
+                    :value="brand.id"
+                  >
+                    <el-row>
+                      <div style="display: inline-flex; align-items: center;">
+                        {{ brand.nam }}-----------------
+                        <image-preview :src="brand.logo" style="height: 30px; width: 30px;"></image-preview>
+                      </div>
+                    </el-row>
+                  </el-option>
+                </el-select>
+              </el-form-item>
+
+
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item label="商品图片" prop="image">
+                <image-upload v-model="form.image"/>
+              </el-form-item>
+              <el-form-item label="商品轮播图" prop="carouselImages">
+                <image-upload v-model="form.carouselImages"/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </div>
+
+        <div v-if="active==2">
+          <el-form-item label="商品规格" prop="ruleId">
+            <el-select v-model="form.ruleId" @change="changeRule" placeholder="商品规格">
+              <el-option
+                v-for="rule in ruleList"
+                :key="rule.id"
+                :label="rule.name"
+                :value="rule.id">
+                <span>
+                  {{ rule.name }}-----
+                  {{ rule.ruleAttrList.map(ruleAttr => ruleAttr.name).toString() }}-----
+                  {{ rule.ruleAttrList.map(ruleAttr => ruleAttr.ruleList.map(a => a.toString())) }}
+                </span>
+              </el-option>
+            </el-select>
+
+            <el-form :inline="true" :model="oneSettingValue" class="demo-form-inline">
+              <el-form-item label="商品图片">
+                <image-upload
+                  v-model="oneSettingValue.image"
+                  :limit="1"
+                  :is-show-tip="false">
+                </image-upload>
+              </el-form-item>
+
+              <el-form-item label="商品价格">
+                <el-input v-model="oneSettingValue.price" placeholder="商品价格"></el-input>
+              </el-form-item>
+
+              <el-form-item label="商品库存">
+                <el-input v-model="oneSettingValue.stock" placeholder="商品库存"></el-input>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" @click="onSubmit">一键添加</el-button>
+                <el-button type="primary" @click="onClean">一键清空</el-button>
+              </el-form-item>
+            </el-form>
+
+            <el-table
+              :data="skuList"
+              border
+              style="width: 100%">
+              <el-table-column v-for="title in titleList" :prop="title.prop" :label="title.label">
+                <template slot-scope="scope">
+                  <span v-if="title.prop.indexOf('prop') >-1 ">{{ scope.row[title.prop] }}</span>
+                  <el-input-number v-else-if="['stock','price'].indexOf(title.prop) > -1"
+                                   v-model="scope.row[title.prop]" :step="0.1" :max="10000"></el-input-number>
+
+                  <div v-else-if="['image'].indexOf(title.prop) > -1" style="width: 30px; height: 30px;">
+                    <image-upload v-model="scope.row[title.prop]"
+                                  :limit="1"
+                                  :is-show-tip="false"
+                                  class="custom-image-upload"
+                    ></image-upload>
+                  </div>
+
+                </template>
+              </el-table-column>
+            </el-table>
+
+
+          </el-form-item>
+        </div>
+
+
+        <div v-if="active==3">
+          <el-form-item label="商品品类" prop="ruleId">
+            <el-cascader
+              v-model="categoryOptionValue"
+              clearable
+              :props="{'value': 'id', 'label': 'name'}"
+              :options="categoryOptions"></el-cascader>
+          </el-form-item>
+
+          <el-card class="box-card">
+            <div slot="header" class="clearfix">
+              <el-tabs v-model="activeName">
+                <el-tab-pane label="商品属性组" name="first">
+
+                  <el-row>
+                    <el-col :span="6"
+                            v-for="templateAttributeGroup in categoryCommonElement.templateAttributeGroupList">
+                      <el-card class="box-card">
+                        <div slot="header" class="clearfix">
+                          <span>属性组名称【{{ templateAttributeGroup.groupName }}】</span>
+                        </div>
+                        <div style="width: 100px;height: 200px">
+                          <el-form-item  :label="attribute.name" v-for="attribute in templateAttributeGroup.attributeList">
+                            <el-input style="width: 100px;" v-model="attribute.value"></el-input>
+                          </el-form-item>
+                        </div>
+                      </el-card>
+                    </el-col>
+                  </el-row>
+                </el-tab-pane>
+
+                <el-tab-pane label="商品属性" name="second">
+                  商品属性
+                  <el-row style="overflow-x: auto; height: 300px;">
+                    <el-form label-width="80px">
+                      <el-col :span="6" v-for="templateAttribute in categoryCommonElement.templateAttributeList">
+                        <el-form-item :label="templateAttribute.name">
+                          <el-input v-model="templateAttribute.value"></el-input>
+                        </el-form-item>
+                      </el-col>
+                    </el-form>
+                  </el-row>
+                </el-tab-pane>
+
+
+                <el-tab-pane label="自有属性" name="third">
+                  自有属性
+                  <el-card class="box-card">
+                    <el-row>
+                      <el-form :inline="true" :model="customAttributeForm" class="demo-form-inline">
+                        <el-form-item label="属性编码">
+                          <el-input v-model="customAttributeForm.code" placeholder="属性编码"></el-input>
+                        </el-form-item>
+                        <el-form-item label="属性名称">
+                          <el-input v-model="customAttributeForm.name" placeholder="属性名称"></el-input>
+                        </el-form-item>
+                        <el-form-item label="属性值">
+                          <el-input v-model="customAttributeForm.value" placeholder="属性值"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+                          <el-button type="primary" @click="saveCustomAttribute">确定</el-button>
+                        </el-form-item>
+                      </el-form>
+                    </el-row>
+                  </el-card>
+
+                  <el-card class="box-card">
+                    <el-row>
+                      <el-checkbox-group v-model="attributeIdCheckedList" @change="handleCheckedCitiesChange">
+                        <el-checkbox v-for="attribute in categoryCommonElement.attributeList"
+                                     :label="attribute.id"
+                                     :value="attribute.id"
+                                     :key="attribute.id">
+                          {{ attribute.name }}
+                        </el-checkbox>
+                      </el-checkbox-group>
+                    </el-row>
+                  </el-card>
+
+                  <el-card class="box-card">
+                    <el-row>
+                      <el-col :span="6" v-for="attribute in attributeCheckedList">
+                        <el-form-item :label="attribute.name">
+                          <el-input v-model="attribute.value"></el-input>
+                        </el-form-item>
+                      </el-col>
+                    </el-row>
+                  </el-card>
+
+
+                </el-tab-pane>
+              </el-tabs>
+            </div>
+
+          </el-card>
+        </div>
+
+        <div v-if="active==4">
+          <el-form-item label="商品备注">
+            <editor v-model="form.remark" :min-height="192"/>
+          </el-form-item>
+        </div>
+      </el-form>
+
+
+      <el-button style="margin-top: 12px;" @click="back">上一步</el-button>
+      <el-button style="margin-top: 12px;" @click="next">下一步</el-button>
+      <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 {listInfo, getInfo, delInfo, addInfo, updateInfo} from "@/api/product/info";
+import {listBrand} from "@/api/product/brand";
+import {listRule} from "@/api/product/rule";
+import {getTemplateAttribute,  listCategory} from "@/api/product/category";
+import {addAttribute} from "@/api/product/attribute";
+
+export default {
+  name: "Info",
+  dicts: ['sys_normal_disable'],
+  data() {
+    return {
+      oneSettingValue: {
+        "image": null,
+        "stock": null,
+        "price": null
+      },
+      templateTitleList: [
+        {
+          "label": "规格图片",
+          "prop": "image"
+        },
+        {
+          "label": "商品库存",
+          "prop": "stock"
+        }, {
+          "label": "商品价格",
+          "prop": "price"
+        }
+      ],
+      skuList: [],
+      titleList: [],
+      attributeIdCheckedList: [],
+      attributeCheckedList: [],
+      customAttributeForm: {},
+      activeName: '',
+      categoryOptionValue: [],
+      categoryOptions: [],
+      value: [],
+      list: [],
+      brandList: [],
+      ruleList: [],
+      ruleAddForm: {
+        name: null,
+        ruleList: null,
+      },
+      categoryCommonElement: {
+        templateAttributeGroupList: [],
+        templateAttributeList: [],
+        attributeList: []
+      },
+      ruleAddFormStatus: false,
+      addRulePropertyValue: null,
+      active: 2,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 商品信息表格数据
+      infoList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        introduction: null,
+        mianType: null,
+        parentType: null,
+        type: null,
+        image: null,
+        carouselImages: null,
+        status: null,
+        ruleId: null,
+        brandId: null,
+      },
+      skuList1 : [],
+      // 表单参数
+      form: {
+        sku:"",
+        mianType:'',
+        parentType:'',
+        type:'',
+        specification:[],
+        groupList:"",
+        attributeList:"",
+        persionList:"",
+        remark:'',
+      },
+      // 表单校验
+      rules: {
+        name: [
+        //   {required: true, message: "商品名称不能为空", trigger: "blur"}
+        // ],
+        // introduction: [
+        //   {required: true, message: "商品描述不能为空", trigger: "blur"}
+        // ],
+        // mainType: [
+        //   {required: true, message: "主类型不能为空", trigger: "change"}
+        // ],
+        // parentType: [
+        //   {required: true, message: "父类型不能为空", trigger: "change"}
+        // ],
+        // type: [
+        //   {required: true, message: "商品类型不能为空", trigger: "change"}
+        // ],
+        // image: [
+        //   {required: true, message: "商品图片不能为空", trigger: "blur"}
+        // ],
+        // carouselImages: [
+        //   {required: true, message: "商品轮播图不能为空", trigger: "blur"}
+        // ],
+        // status: [
+        //   {required: true, message: "商品状态不能为空", trigger: "change"}
+        // ],
+        // remark: [
+        //   {required: true, message: "备注不能为空", trigger: "blur"}
+        ],
+      },
+      a:[],
+      b:[],
+      c:[],
+      d:[],
+      e:[
+        {
+          "attributeId":0,
+          "value":""
+        }
+      ],
+      test:{
+        id:0,
+        value:0,
+      },
+      check:[]
+    };
+  },
+  watch: {
+    categoryOptionValue: {
+      handler(value) {
+        if (value != null && value !== undefined && value.length > 0) {
+          this.form.mianType = value[0];
+          this.form.parentType = value[1];
+          this.form.type = value[2];
+        } else {
+          this.form.mianType = null
+          this.form.parentType = null
+          this.form.type = null
+        }
+      }
+    },
+    "form.id":{
+      handler(val){
+        this.test.id=val
+      }
+    },
+    "form.type": {
+      handler(value) {
+        if (value != null) {
+          this.test.value=value
+          getTemplateAttribute(this.test).then(response => {
+            const {data} = response;
+            const {templateAttributeGroupList, templateAttributeList, attributeList} = data;
+            this.categoryCommonElement.templateAttributeGroupList = templateAttributeGroupList;
+            this.categoryCommonElement.templateAttributeList = templateAttributeList;
+            this.categoryCommonElement.attributeList = attributeList;
+            console.log(attributeList)
+            let e=[]
+            e=attributeList.filter(attribute=>attribute.value!=null)
+            console.log(e)
+            this.attributeCheckedList=e
+          })
+        }
+      }
+    },
+
+  },
+  created() {
+    this.getList();
+    this.ruleListFind();
+    this.CategoryTree();
+  },
+  methods: {
+    detail(id){
+      console.log(id)
+      this.$router.push('/test/'+id)
+    },
+    onSubmit() {
+      this.skuList.forEach(skuInfo => {
+        skuInfo.image = this.oneSettingValue.image;
+        skuInfo.stock = this.oneSettingValue.stock;
+        skuInfo.price = this.oneSettingValue.price;
+      })
+    },
+    onClean(){
+      this.skuList=[]
+    },
+    changeRule(ruleId) {
+
+      this.titleList = []
+      let ruleInfo = this.ruleList.find(ruleInfo => ruleInfo.id === ruleId);
+      const {ruleAttrList} = ruleInfo;
+
+      let skuTotal = 1;
+      for (let ruleAttrListKey in ruleAttrList) {
+        let ruleAttrInfo = ruleAttrList[ruleAttrListKey];
+        this.titleList.push({
+          "label": ruleAttrInfo.name,
+          "prop": "prop" + ruleAttrListKey
+        })
+        skuTotal = skuTotal * ruleAttrInfo.ruleList.length;
+      }
+      this.titleList.push(...this.templateTitleList)
+      this.skuList = []
+      for (let i = 0; i < skuTotal; i++) {
+        this.skuList.push(
+          {
+            "image": null,
+            "price": 0,
+            "stock": 0
+          }
+        )
+      }
+
+      //currentIndex 当前下表
+      for (let currentIndex in ruleAttrList) {
+        let ruleAttrInfo = ruleAttrList[currentIndex];
+        //continuousSize  连续出现次数  forSize 循环出现次数
+        let continuousSize = 1, forSize = 1;
+        for (let continuousIndex = parseInt(currentIndex) + 1; continuousIndex < ruleAttrList.length; continuousIndex++) {
+          continuousSize = continuousSize * ruleAttrList[continuousIndex].ruleList.length
+        }
+        for (let forIndex = parseInt(currentIndex) - 1; forIndex >= 0; forIndex--) {
+          forSize = forSize * ruleAttrList[forIndex].ruleList.length
+        }
+
+        let counter = 0;
+        for (let forIndex = 0; forIndex < forSize; forIndex++) {
+          const {ruleList} = ruleAttrInfo;
+          ruleList.forEach(value => {
+            for (let continuousIndex = 0; continuousIndex < continuousSize; continuousIndex++) {
+              this.skuList[counter++]["prop" + currentIndex] = value;
+
+            }
+          })
+        }
+      }
+
+
+      // 生成所有可能的SKU组合
+      const generateSkuCombinations = (currentIndex, currentCombination) => {
+        if (currentIndex === ruleAttrList.length) {
+          // 所有属性都已经组合完毕，将组合结果添加到skuList
+          this.skuList1.push(currentCombination);
+          return;
+        }
+
+        const { ruleList } = ruleAttrList[currentIndex];
+        for (let value of ruleList) {
+          generateSkuCombinations(currentIndex + 1, currentCombination + value);
+        }
+      };
+
+      // 从第一个属性开始生成组合
+      generateSkuCombinations(0, '');
+
+
+
+    },
+    handleCheckedCitiesChange() {
+      let attributeId = this.attributeIdCheckedList
+        .find(attributeId => this.attributeCheckedList.map(attributeChecked => attributeChecked.id).indexOf(attributeId) === -1)
+      if (attributeId != undefined) {
+        let attributeInfo = this.categoryCommonElement.attributeList.find(attributeInfo => attributeInfo.id === attributeId);
+        this.attributeCheckedList.push(attributeInfo)
+      } else {
+        let attributeChecked = this.attributeCheckedList.find(attributeChecked => this.attributeIdCheckedList.indexOf(attributeChecked));
+        this.attributeCheckedList.splice(this.attributeCheckedList.indexOf(attributeChecked), 1);
+      }
+
+    },
+    saveCustomAttribute() {
+      addAttribute({"code": this.customAttributeForm.code, "name": this.customAttributeForm.name}).then(response => {
+        if (response.code == 200) {
+          let attributeId = response.data,
+            code = this.customAttributeForm.code,
+            name = this.customAttributeForm.name,
+            value = this.customAttributeForm.value;
+          this.categoryCommonElement.attributeList.push({
+            "id": attributeId,
+            "name": name,
+            "code": code
+          });
+          this.attributeIdCheckedList.push(attributeId)
+          this.attributeCheckedList.push({
+            "id": attributeId,
+            "name": name,
+            "value": value
+          });
+          this.customAttributeForm = {}
+        }
+      })
+    },
+    ruleListFind() {
+      listRule({"params[isPage]": false}).then(response => {
+        this.ruleList = response.data;
+      });
+    },
+    remoteSearchBrandList(queryValue) {
+      listBrand({"nam": queryValue, "params[isPage]": false}).then(response => {
+        this.brandList = response.data;
+      });
+    },
+    CategoryTree() {
+      listCategory().then(response => {
+        this.categoryOptions = []
+        this.categoryOptions = this.handleTree(response.data, "id", "parentId");
+      })
+    },
+    next() {
+      if (this.active++ >= 4) this.active = 1;
+    },
+    back() {
+      if (this.active-- <= 1) this.active = 4;
+    },
+    /** 查询商品信息列表 */
+    getList() {
+      this.loading = true;
+      listInfo(this.queryParams).then(response => {
+        this.infoList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        name: null,
+        introduction: null,
+        mianType: null,
+        parentType: null,
+        type: null,
+        image: null,
+        carouselImages: null,
+        status: null,
+        ruleId: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length !== 1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加商品信息";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getInfo(id).then(response => {
+        // let a=[]
+        // response.data.specification.forEach(
+        //   specification=>{
+        //     a.push(
+        //       {image:specification.image,stock:specification.stock,price:specification.price}
+        //     )
+        //   }
+        // )
+        // this.skuList=a
+        // console.log(this.skuList)
+        this.test.id=id
+        this.form = response.data;
+        //this.oneSettingValue=response.data.specificationList
+        this.oneSettingValue=response.data.specification
+        this.changeRule(response.data.ruleId)
+        this.onSubmit()
+        this.form.type=parseInt(response.data.type)
+        this.form.mianType=parseInt(response.data.mianType)
+        this.form.parentType=parseInt(response.data.parentType)
+        this.CategoryTree()
+        this.open = true;
+        this.title = "修改商品信息";
+
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            this.selectAttribute()
+            updateInfo(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            this.selectAttribute()
+            console.log(this.form)
+            addInfo(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+              this.skuList=[]
+            });
+          }
+        }
+      });
+    },
+    selectAttribute(){
+      this.a=[]
+      this.b=[]
+      this.c=[]
+      this.categoryCommonElement.templateAttributeGroupList.forEach(
+        templateAttributeGroup=>{
+          templateAttributeGroup.attributeList.forEach(
+            attribute=>{
+              this.a+=(attribute.id+"-"+attribute.name+"-"+attribute.value+",")
+            }
+          )
+        }
+      )
+      this.categoryCommonElement.templateAttributeList.forEach(
+        templateAttributeGroup=>{
+          this.b+=(templateAttributeGroup.id+"-"+templateAttributeGroup.name+"-"+templateAttributeGroup.value+",")
+        }
+      )
+      this.attributeCheckedList.forEach(
+        attributeChecked=>{
+          this.c+=(attributeChecked.id+"-"+attributeChecked.name+"-"+attributeChecked.value)
+        }
+      )
+      this.form.sku=this.skuList1
+      this.form.specification=this.skuList
+      this.form.groupList=this.a
+      this.form.attributeList=this.b
+      this.form.persionList=this.c
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除商品信息编号为"' + ids + '"的数据项？').then(function () {
+        return delInfo(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      });
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/info/export', {
+        ...this.queryParams
+      }, `info_${new Date().getTime()}.xlsx`)
+    },
+  }
+};
+</script>
+
+<style>
+.custom-image-upload img {
+  max-width: 30px;
+  max-height: 30px;
+}
+</style>

src/views/product/projectSku/index.vue

@@ -0,0 +1,319 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="商品id" prop="projectId">
+        <el-input
+          v-model="queryParams.projectId"
+          placeholder="请输入商品id"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="商品库存" prop="stock">
+        <el-input
+          v-model="queryParams.stock"
+          placeholder="请输入商品库存"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="商品价格" prop="price">
+        <el-input
+          v-model="queryParams.price"
+          placeholder="请输入商品价格"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:projectSku:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:projectSku:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:projectSku:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:projectSku:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="projectSkuList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="主键" align="center" prop="id" />
+      <el-table-column label="商品id" align="center" prop="projectId" />
+      <el-table-column label="sku" align="center" prop="sku" />
+      <el-table-column label="商品库存" align="center" prop="stock" />
+      <el-table-column label="商品价格" align="center" prop="price" />
+      <el-table-column label="规格图片" align="center" prop="image" width="100">
+        <template slot-scope="scope">
+          <image-preview :src="scope.row.image" :width="50" :height="50"/>
+        </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">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:projectSku:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:projectSku:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改商品SKU对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="商品id" prop="projectId">
+          <el-input v-model="form.projectId" placeholder="请输入商品id" />
+        </el-form-item>
+        <el-form-item label="sku" prop="sku">
+          <el-input v-model="form.sku" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="商品库存" prop="stock">
+          <el-input v-model="form.stock" placeholder="请输入商品库存" />
+        </el-form-item>
+        <el-form-item label="商品价格" prop="price">
+          <el-input v-model="form.price" placeholder="请输入商品价格" />
+        </el-form-item>
+        <el-form-item label="规格图片" prop="image">
+          <image-upload v-model="form.image"/>
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </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 { listProjectSku, getProjectSku, delProjectSku, addProjectSku, updateProjectSku } from "@/api/product/projectSku";
+
+export default {
+  name: "ProjectSku",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 商品SKU表格数据
+      projectSkuList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        projectId: null,
+        sku: null,
+        stock: null,
+        price: null,
+        image: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        projectId: [
+          { required: true, message: "商品id不能为空", trigger: "blur" }
+        ],
+        sku: [
+          { required: true, message: "sku不能为空", trigger: "blur" }
+        ],
+        stock: [
+          { required: true, message: "商品库存不能为空", trigger: "blur" }
+        ],
+        price: [
+          { required: true, message: "商品价格不能为空", trigger: "blur" }
+        ],
+        image: [
+          { required: true, message: "规格图片不能为空", trigger: "blur" }
+        ],
+        createBy: [
+          { required: true, message: "创建人不能为空", trigger: "blur" }
+        ],
+        createTime: [
+          { required: true, message: "创建时间不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询商品SKU列表 */
+    getList() {
+      this.loading = true;
+      listProjectSku(this.queryParams).then(response => {
+        this.projectSkuList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        projectId: null,
+        sku: null,
+        stock: null,
+        price: null,
+        image: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加商品SKU";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getProjectSku(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改商品SKU";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateProjectSku(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addProjectSku(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除商品SKU编号为"' + ids + '"的数据项？').then(function() {
+        return delProjectSku(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/projectSku/export', {
+        ...this.queryParams
+      }, `projectSku_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/rule/index.vue

@@ -0,0 +1,440 @@
+
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="规格名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入规格名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:rule:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:rule:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:rule:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:rule:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    {{ruleList}}
+    <el-table v-loading="loading" :data="ruleList" @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="status">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.status"/>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="规格属性名" align="center" prop="name" >
+        <template slot-scope="scope">
+          <el-row v-for="rule in scope.row.ruleAttrList"><span>{{rule.name}}</span></el-row>
+        </template>
+      </el-table-column>
+      <el-table-column label="规格属性值" align="center" prop="name" >
+
+        <template slot-scope="scope">
+          <el-row v-for="rule in scope.row.ruleAttrList"><span>{{rule.ruleList.toString()}}</span></el-row>
+
+        </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">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:rule:query']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:rule:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改商品规格对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="规格名称" prop="name">
+              <el-input v-model="form.name" placeholder="请输入规格名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="规格状态" prop="states">
+              <el-radio-group v-model="form.status">
+                <el-radio
+                  v-for="dict in dict.type.sys_yes_no"
+                  :key="dict.value"
+                  :label="dict.value"
+                >{{ 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-form-item>
+        </el-row>
+
+
+        <el-row v-for="(rule, index) in form.ruleList">
+          <el-row style="margin: 15px 10px">
+              规格名称：
+              <el-tag
+                :key="rule.name"
+                @close="removeRule(index)"
+                closable>
+                {{rule.name}}
+              </el-tag>
+          </el-row>
+          <el-row style="margin: 15px 10px">
+            规格属性：
+            <el-tag
+              v-for="(ruleProperty, index) in rule.ruleList"
+              :key="ruleProperty"
+              @close="removeRuleProperty(rule.ruleList, index)"
+              closable>
+              {{ruleProperty}}
+            </el-tag>
+            <el-button v-if="!rule.ruleAddStatus" @click="rule.ruleAddStatus = !rule.ruleAddStatus" size="mini">添加</el-button>
+            <el-input v-if="rule.ruleAddStatus"
+                      v-model="addRulePropertyValue"
+                      @blur="addRuleProperty(rule, false)"
+                      @keyup.enter.native="addRuleProperty(rule, true)"
+                      size="mini" placeholder="请输入规格属性值" style="float: left; width: 150px"/>
+          </el-row>
+          <el-divider></el-divider>
+        </el-row>
+        <el-button v-if="!ruleAddFormStatus" type="success" @click="ruleAddFormStatus = !ruleAddFormStatus">添加规格</el-button>
+
+        <el-form v-if="ruleAddFormStatus" :inline="true" :model="ruleAddForm" class="demo-form-inline">
+
+          <el-row>
+            <el-form-item label="规格名称">
+              <el-input v-model="ruleAddForm.name" placeholder="请输入规格名称"></el-input>
+            </el-form-item>
+          </el-row>
+
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="规格属性">
+                <el-input v-model="ruleAddForm.ruleList" placeholder="请输入规格属性"></el-input>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="12">
+              <el-form-item>
+                <el-button type="danger" @click="ruleAdd" plain>添加</el-button>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+        </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";
+
+export default {
+  name: "Rule",
+  dicts: ['sys_yes_no'],
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 商品规格表格数据
+      ruleList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        status: null,
+      },
+      // 表单参数
+      form: {
+        ruleList:[],
+        ruleAttrList:[]
+      },
+      // 表单校验
+      rules: {
+        createBy: [
+          { required: true, message: "创建人不能为空", trigger: "blur" }
+        ],
+        createTime: [
+          { required: true, message: "创建时间不能为空", trigger: "blur" }
+        ],
+      },
+      ruleAddForm: {
+        name: null,
+        ruleList: null,
+      },
+      ruleAddFormStatus: false,
+      addRulePropertyValue: null
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+
+    removeRule(index){
+      this.form.ruleList.splice(index, 1);
+    },
+    removeRuleProperty(ruleList,index){
+      ruleList.splice(index, 1);
+    },
+    addRuleProperty(rule, continuousInput){
+      if (this.addRulePropertyValue === null || this.addRulePropertyValue === 0){
+        if (!continuousInput){
+          rule.ruleAddStatus = !rule.ruleAddStatus
+        }
+        return;
+      }
+      if (rule.ruleList.indexOf(this.addRulePropertyValue) > -1){
+        this.$message({
+          message: `规格[${rule.name}]属性值[${this.addRulePropertyValue}]已经存在`,
+          type: 'warning'
+        });
+        return;
+      }
+      rule.ruleList.push(this.addRulePropertyValue)
+      this.addRulePropertyValue = null;
+      if (!continuousInput){
+        rule.ruleAddStatus = !rule.ruleAddStatus
+      }
+    },
+    ruleAdd(){
+      if (this.ruleAddForm.name === null || this.ruleAddForm.name.length === 0){
+        this.$message({
+          message: '规格名称不可为空',
+          type: 'warning'
+        });
+        return;
+      }
+      if (this.ruleAddForm.ruleList === null || this.ruleAddForm.ruleList.length === 0){
+        this.$message({
+          message: '规格属性不可为空',
+          type: 'warning'
+        });
+        return;
+      }
+
+      let rule = this.form.ruleList.find(rule => rule.name === this.ruleAddForm.name);
+      if (rule === undefined){
+        this.form.ruleList.push({
+          "name": this.ruleAddForm.name,
+          "ruleList": [this.ruleAddForm.ruleList],
+          "ruleAddStatus": false
+        })
+      }else {
+        if (rule.ruleList.indexOf(this.ruleAddForm.ruleList) > -1){
+          this.$message({
+            message: `规格[${this.ruleAddForm.name}]属性值[${this.ruleAddForm.ruleList}]已经存在`,
+            type: 'warning'
+          });
+          return;
+        }
+        rule.ruleList.push(this.ruleAddForm.ruleList)
+      }
+      this.ruleAddForm = {
+        name: null,
+        ruleList: null,
+      }
+      this.ruleAddFormStatus = false;
+    },
+
+
+    /** 查询商品规格列表 */
+    getList() {
+      this.loading = true;
+      listRule(this.queryParams).then(response => {
+        console.log(response)
+        this.ruleList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        name: null,
+        status: null,
+        remark: null,
+        ruleList:[]
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加商品规格";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getRule(id).then(response => {
+        console.log(response)
+        this.form = response.data;
+        this.form.ruleList= response.data.ruleAttrList
+        this.form.ruleList.ruleAddForm=response.data.ruleList.ruleList
+        this.open = true;
+        this.title = "修改商品规格";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateRule(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addRule(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除商品规格编号为"' + ids + '"的数据项？').then(function() {
+        return delRule(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/rule/export', {
+        ...this.queryParams
+      }, `rule_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/ruleAttr/index.vue

@@ -0,0 +1,291 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="规格id" prop="ruleId">
+        <el-input
+          v-model="queryParams.ruleId"
+          placeholder="请输入规格id"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="类目名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入类目名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="规格值" prop="attrValue">
+        <el-input
+          v-model="queryParams.attrValue"
+          placeholder="请输入规格值"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['product:ruleAttr:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['product:ruleAttr:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['product:ruleAttr:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['product:ruleAttr:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="ruleAttrList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="主键" align="center" prop="id" />
+      <el-table-column label="规格id" align="center" prop="ruleId" />
+      <el-table-column label="类目名称" align="center" prop="name" />
+      <el-table-column label="规格值" align="center" prop="attrValue" />
+      <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
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:ruleAttr:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:ruleAttr:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改规格详情对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="规格id" prop="ruleId">
+          <el-input v-model="form.ruleId" placeholder="请输入规格id" />
+        </el-form-item>
+        <el-form-item label="类目名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入类目名称" />
+        </el-form-item>
+        <el-form-item label="规格值" prop="attrValue">
+          <el-input v-model="form.attrValue" placeholder="请输入规格值" />
+        </el-form-item>
+        <el-form-item label="备注">
+          <editor v-model="form.remark" :min-height="192"/>
+        </el-form-item>
+      </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 { listRuleAttr, getRuleAttr, delRuleAttr, addRuleAttr, updateRuleAttr } from "@/api/product/ruleAttr";
+
+export default {
+  name: "RuleAttr",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 规格详情表格数据
+      ruleAttrList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        ruleId: null,
+        name: null,
+        attrValue: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        ruleId: [
+          { required: true, message: "规格id不能为空", trigger: "blur" }
+        ],
+        createBy: [
+          { required: true, message: "创建人不能为空", trigger: "blur" }
+        ],
+        createTime: [
+          { required: true, message: "创建时间不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询规格详情列表 */
+    getList() {
+      this.loading = true;
+      listRuleAttr(this.queryParams).then(response => {
+        this.ruleAttrList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        ruleId: null,
+        name: null,
+        attrValue: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加规格详情";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getRuleAttr(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改规格详情";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateRuleAttr(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addRuleAttr(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除规格详情编号为"' + ids + '"的数据项？').then(function() {
+        return delRuleAttr(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/ruleAttr/export', {
+        ...this.queryParams
+      }, `ruleAttr_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/shopCart/shop/detail/shopDetail.vue

@@ -0,0 +1,400 @@
+<template>
+  <div>
+
+
+    <el-card>
+      <el-table
+        ref="multipleTable"
+        :data="shop"
+        style="width: 100%"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column
+          type="selection"
+          width="55">
+        </el-table-column>
+        <el-table-column
+          label="商品信息"
+          width="300">
+          <template slot-scope="scope">
+            <div class="cell-content">
+              <img :src="scope.row.image" width="100px" height="100px" class="project-image">
+              <div class="project-info">
+                <h3 class="project-name">{{ scope.row.name }}</h3>
+                <p class="project-description">{{ scope.row.detailSku }}</p>
+              </div>
+            </div>
+          </template>
+
+        </el-table-column>
+        <el-table-column
+          prop="isselected"
+          label="选中状态"
+          width="100">
+        </el-table-column>
+        <el-table-column
+          prop="price"
+          label="单价"
+          width="100">
+        </el-table-column>
+        <el-table-column property="num" label="购买数量" width="200">
+          <template slot-scope="scope">
+            <el-input-number v-model="scope.row.num"
+                             @change="handleNumChange(scope.row)"
+                             :min="1" label="描述文字"></el-input-number>
+          </template>
+
+        </el-table-column>
+        <el-table-column property="sum" label="小计" width="120">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.subtotal }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="danger"
+              @click="handleDelete( scope.row)">删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-divider></el-divider>
+      <span style="color: #97a8be">失效商品</span>
+      <el-table
+        :show-header="false"
+        :data="oldshop"
+        style="width: 100%"
+      >
+        <el-table-column
+          width="55">
+          <template slot-scope="scope">
+            <el-checkbox disabled></el-checkbox>
+          </template>
+        </el-table-column>
+        <el-table-column
+          width="300">
+          <template slot-scope="scope">
+            <div class="cell-content">
+              <img :src="scope.row.projectSkuInfo.image" width="100px" height="100px" class="project-image">
+              <div class="project-info">
+                <h3 class="project-name">{{ scope.row.projectInfo.name }}</h3>
+                <p class="project-description">{{ scope.row.detailSku }}</p>
+              </div>
+            </div>
+          </template>
+
+        </el-table-column>
+        <el-table-column
+          prop="isselected"
+          width="100">
+        </el-table-column>
+        <el-table-column
+          prop="price"
+          width="100">
+        </el-table-column>
+        <el-table-column property="num" width="200">
+          <template slot-scope="scope">
+            <el-input-number disabled v-model="scope.row.num"
+                             @change="handleNumChange(scope.$index,scope.row)"
+                             :min="1" label="描述文字"></el-input-number>
+          </template>
+
+        </el-table-column>
+        <el-table-column property="sum" width="120">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.num * scope.row.price }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column>
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              @click="handleEdit( scope.row)">移入收藏夹
+            </el-button>
+            <el-button
+              size="mini"
+              type="danger"
+              @click="handleDelete( scope.row)">删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-card style="margin-top: 20px">
+        <div>
+          <el-row>
+            <el-col :span="6">
+              <div style="padding-top: 8px">
+                <el-checkbox v-model="isAllCheck" @change="changeIsAllCheck">全选</el-checkbox>
+                <el-button type="text" style="margin-left: 10px" @click="handleDelete(undefined)">删除选中商品
+                </el-button>
+                <el-button type="text">添加我的收藏</el-button>
+              </div>
+
+            </el-col>
+            <el-col :span="14">
+              <div style="margin-left: 80px;padding-top: 8px">
+                <span>共<span style="color: red;">{{ statisticsShop.total }}</span> 件商品
+                  ，已选择 <span style="color: red;">{{ statisticsShop.selectTotal }}</span> 件</span>
+                <el-divider direction="vertical"></el-divider>
+                <span>商品合计 : <span style="color: red;">¥{{ statisticsShop.priceTotal }}</span></span>
+                <el-divider direction="vertical"></el-divider>
+                <span>商品合计 : <span style="color: red; font-size: 24px">¥{{
+                    statisticsShop.priceTotal
+                  }}</span></span>
+              </div>
+            </el-col>
+            <el-col :span="4">
+              <el-button style="float: right; " type="success" @click="orderShop">下单结算</el-button>
+            </el-col>
+          </el-row>
+
+
+        </div>
+      </el-card>
+
+    </el-card>
+
+  </div>
+</template>
+<script>
+import {listShop} from "@/api/product/shop";
+import {checkState, delShoppingMethod, editShopNum, shopDetail, testShop, updSelected} from "@/api/shopCart/shop";
+import shop from "@/views/shopCart/shop/index.vue";
+import item from "@/layout/components/Sidebar/Item.vue";
+
+export default {
+  name: 'shop_detail',
+  data() {
+    return {
+      /*选中商品*/
+      selectedProduct: [],
+      /*生效商品对象*/
+      shop: [],
+      /*查询对象*/
+      queryParams: {},
+      /*多选框id*/
+      ids: [],
+      /*失效商品*/
+      oldshop: [
+        {
+          "id": 3,
+          "projectId": 62,
+          "projectSku": "x红色钛合金",
+          "isselected": 1,
+          "detailSku": "尺码:x\n 颜色:红色 材质:钛合金",
+          "projectInfo": {
+            "id": 62,
+            "name": "失效",
+            "introduction": "失效",
+            "mianType": "49",
+            "parentType": "50",
+            "type": "51",
+            "image": "http://127.0.0.1:9300/statics/2024/03/25/屏幕截图 2024-03-15 201358_20240325165814A020.png",
+            "carouselImages": "http://127.0.0.1:9300/statics/2024/03/25/v2-1d73a9fd4aa25ccccd7800eead8672d0_hd_20240325171828A038.gif",
+            "status": "0",
+            "ruleId": 8,
+            "brandId": 1
+          },
+          "projectSkuInfo": {
+            "id": 251,
+            "projectId": 62,
+            "sku": "x红色钛合金",
+            "stock": 23,
+            "price": 123,
+            "image": "http://127.0.0.1:9300/statics/2024/03/25/v2-1d73a9fd4aa25ccccd7800eead8672d0_hd_20240325165822A022.gif"
+          },
+          "userId": 1,
+          "num": 1,
+          "price": 123,
+          "sumPrice": null
+        }
+      ],
+      isAllCheck: false,
+      /*统计*/
+      statisticsShop: {
+        /*商品总数*/
+        total: 0,
+        /*选中商品总数*/
+        selectTotal: 0,
+        /*商品总价*/
+        priceTotal: 0.00,
+        /*实际商品总价*/
+        actualTotal: 0.00
+      }
+    }
+  },
+  created() {
+    this.init();
+  },
+
+  methods: {
+    /*下单结算*/
+    orderShop() {
+      this.$router.push('/orderShop')
+    },
+    /*删除*/
+    handleDelete(row) {
+      console.log(row)
+      let dekShopReq = []
+      if (row) {
+        dekShopReq.push({
+          "projectId": row.projectId,
+          "projectSku": row.projectSku,
+          "id": row.shoppingId,
+        })
+      } else {
+        if (this.selectedProduct.length === 0) {
+          this.$message.error("请选择商品")
+          return
+        }
+        this.selectedProduct.forEach(item => {
+          dekShopReq.push({
+            "projectId": item.projectId,
+            "projectSku": item.projectSku,
+            "id": item.shoppingId,
+          })
+        })
+      }
+      delShoppingMethod(dekShopReq).then(
+        res => {
+          this.init()
+        }
+      )
+    },
+    /*初始化*/
+    init() {
+      this.shop = []
+      this.selectedProduct = []
+      shopDetail().then(
+        res => {
+          this.statisticsShop = res.data.statisticsShop
+          this.shop = res.data.shopSkuList
+          setTimeout(this.initShopSelected, 200)
+        }
+      )
+    },
+    /*默认选中*/
+    initShopSelected() {
+      this.shop.forEach(item => {
+        if (item.isselected === 1) {
+          this.$refs.multipleTable.toggleRowSelection(item, true);
+        }
+      })
+    },
+    /*多选框*/
+    handleSelectionChange(val) {
+      let selectShopList = []
+      let newSelect = val.filter(
+        row => !this.selectedProduct.includes(row)
+      );
+
+      newSelect.forEach(item => {
+        selectShopList.push({
+          "projectId": item.projectId,
+          "projectSku": item.projectSku,
+          "isselected": 1,
+        })
+      })
+
+      let noSelect = this.selectedProduct.filter(
+        row => !val.includes(row)
+      );
+      noSelect.forEach(item => {
+        selectShopList.push({
+          "projectId": item.projectId,
+          "projectSku": item.projectSku,
+          "isselected": 0,
+        })
+      })
+      let cartProjectMap = {};
+      this.shop.map(item =>
+        cartProjectMap[`${item.projectId} + ${item.projectSku}`] = item.isselected)
+
+
+      let editCartProjectFilterList
+        = selectShopList.filter(item => item.isselected !==
+        cartProjectMap[`${item.projectId} + ${item.projectSku}`])
+
+
+      if (editCartProjectFilterList.length > 0) {
+        updSelected(selectShopList).then(
+          res => {
+            this.init();
+          }
+        )
+      }
+
+      this.selectedProduct = val
+      this.isAllCheck = val.length === this.shop.length
+      //this.countTotalPrice()
+    },
+    /*全选*/
+    changeIsAllCheck() {
+      if (this.isAllCheck) {
+        this.$refs.multipleTable.toggleAllSelection();
+      } else {
+        this.$refs.multipleTable.clearSelection();
+      }
+    },
+
+    /*数量计数器*/
+    handleNumChange(row) {
+      let shopNumEdit = {
+        "projectId": row.projectId,
+        "projectSku": row.projectSku,
+        "num": row.num,
+      }
+      editShopNum(shopNumEdit).then(
+        res => {
+          this.init()
+        }
+      )
+      // this.shop[index].num = row.num;
+      // this.countTotalPrice()
+    },
+
+    /*计算总价  选中个数*/
+    countTotalPrice() {
+      this.statisticsShop.priceTotal = this.selectedProduct.reduce((sum, shop) => {
+        if (shop.hasOwnProperty('num') && shop.hasOwnProperty('price')) {
+          return sum + shop.num * shop.price;
+        } else {
+          return sum;
+        }
+      }, 0);
+    },
+
+    /*购物车列表*/
+    shopList() {
+      testShop(this.queryParams).then(res => {
+        this.shop = res.data.rows
+      });
+    }
+  }
+}
+
+</script>
+<style scoped>
+.cell-content {
+  display: flex;
+  align-items: flex-start; /* 垂直上边对齐 */
+}
+
+.project-image {
+  margin-right: 10px; /* 图片与文本之间的间距 */
+}
+
+.project-info {
+  display: flex;
+  flex-direction: column; /* 设置为列方向布局，实现上下排列 */
+  align-items: flex-start; /* 垂直上边对齐 */
+}
+
+.project-name,
+.project-description {
+  margin-bottom: 5px; /* 项目名称和描述之间的间距 */
+}
+
+</style>

src/views/shopCart/shop/index.vue

@@ -0,0 +1,310 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="商品id" prop="projectId">
+        <el-input
+          v-model="queryParams.projectId"
+          placeholder="请输入商品id"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="SKU" prop="projectSku">
+        <el-input
+          v-model="queryParams.projectSku"
+          placeholder="请输入SKU"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="用户id" prop="userId">
+        <el-input
+          v-model="queryParams.userId"
+          placeholder="请输入用户id"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="商品数量" prop="num">
+        <el-input
+          v-model="queryParams.num"
+          placeholder="请输入商品数量"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="是否选中" prop="isSelected">
+        <el-input
+          v-model="queryParams.isSelected"
+          placeholder="请输入是否选中"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['shopCart:shop:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['shopCart:shop:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['shopCart:shop:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['shopCart:shop:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="shopList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="主键" align="center" prop="id" />
+      <el-table-column label="商品id" align="center" prop="projectId" />
+      <el-table-column label="SKU" align="center" prop="projectSku" />
+      <el-table-column label="用户id" align="center" prop="userId" />
+      <el-table-column label="商品数量" align="center" prop="num" />
+      <el-table-column label="是否选中" align="center" prop="isSelected" />
+      <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
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['shopCart:shop:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['shopCart:shop:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改购物车对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="商品id" prop="projectId">
+          <el-input v-model="form.projectId" placeholder="请输入商品id" />
+        </el-form-item>
+        <el-form-item label="SKU" prop="projectSku">
+          <el-input v-model="form.projectSku" placeholder="请输入SKU" />
+        </el-form-item>
+        <el-form-item label="用户id" prop="userId">
+          <el-input v-model="form.userId" placeholder="请输入用户id" />
+        </el-form-item>
+        <el-form-item label="商品数量" prop="num">
+          <el-input v-model="form.num" placeholder="请输入商品数量" />
+        </el-form-item>
+        <el-form-item label="是否选中" prop="isSelected">
+          <el-input v-model="form.isSelected" placeholder="请输入是否选中" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </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 { listShop, getShop, delShop, addShop, updateShop } from "@/api/shopCart/shop";
+
+export default {
+  name: "Shop",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 购物车表格数据
+      shopList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        projectId: null,
+        projectSku: null,
+        userId: null,
+        num: null,
+        isSelected: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询购物车列表 */
+    getList() {
+      this.loading = true;
+      listShop(this.queryParams).then(response => {
+        this.shopList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        projectId: null,
+        projectSku: null,
+        userId: null,
+        num: null,
+        isSelected: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加购物车";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getShop(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改购物车";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateShop(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addShop(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除购物车编号为"' + ids + '"的数据项？').then(function() {
+        return delShop(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('shopCart/shop/export', {
+        ...this.queryParams
+      }, `shop_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/shopCart/shop/order/orderShop.vue

@@ -0,0 +1,22 @@
+<template>
+  <div>
+
+     哈哈哈
+
+
+
+  </div>
+</template>
+<script>
+export default {
+  name: 'order_shop',
+  data() {
+    return {}
+  },
+  created() {
+  },
+  methods: {}
+}
+</script>
+<style scoped>
+</style>

src/views/tool/gen/editTable.vue

@@ -183,7 +183,7 @@ export default {
       const basicForm = this.$refs.basicInfo.$refs.basicInfoForm;
       const genForm = this.$refs.genInfo.$refs.genInfoForm;
       Promise.all([basicForm, genForm].map(this.getFormPromise)).then(res => {
-        const validateResult = res.data.every(item => !!item);
+        const validateResult = res.every(item => !!item);
         if (validateResult) {
           const genTable = Object.assign({}, basicForm.model, genForm.model);
           genTable.columns = this.columns;
@@ -194,7 +194,7 @@ export default {
             parentMenuId: genTable.parentMenuId
           };
           updateGenTable(genTable).then(res => {
-            this.$modal.msgSuccess(res.data.msg);
+            this.$modal.msgSuccess(res.msg);
             if (res.code === 200) {
               this.close();
             }

src/views/tool/gen/importTable.vue

@@ -108,7 +108,7 @@ export default {
         return;
       }
       importTable({tables: tableNames}).then(res => {
-        this.$modal.msgSuccess(res.data.msg);
+        this.$modal.msgSuccess("导入成功");
         this.visible = false;
         this.$emit("ok");
       });

src/views/tool/gen/index.vue

@@ -96,21 +96,18 @@
         align="center"
         label="表名称"
         prop="tableName"
-        width="120"
       />
       <el-table-column
         :show-overflow-tooltip="true"
         align="center"
         label="表描述"
         prop="tableComment"
-        width="120"
       />
       <el-table-column
         :show-overflow-tooltip="true"
         align="center"
         label="实体"
         prop="className"
-        width="120"
       />
       <el-table-column align="center" label="创建时间" prop="createTime" width="160"/>
       <el-table-column align="center" label="更新时间" prop="updateTime" width="160"/>