三组件

src/api/product/address.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询地区列表
+export function listAddress(query) {
+  return request({
+    url: '/product/address/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询地区详细
+export function getAddress(id) {
+  return request({
+    url: '/product/address/' + id,
+    method: 'get'
+  })
+}
+
+// 新增地区
+export function addAddress(data) {
+  return request({
+    url: '/product/address',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改地区
+export function updateAddress(data) {
+  return request({
+    url: '/product/address',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除地区
+export function delAddress(id) {
+  return request({
+    url: '/product/address/' + id,
+    method: 'delete'
+  })
+}

src/api/product/as_attribute_group.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询属性组中间列表
+export function listAs_attribute_group(query) {
+  return request({
+    url: '/product/as_attribute_group/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询属性组中间详细
+export function getAs_attribute_group(id) {
+  return request({
+    url: '/product/as_attribute_group/' + id,
+    method: 'get'
+  })
+}
+
+// 新增属性组中间
+export function addAs_attribute_group(data) {
+  return request({
+    url: '/product/as_attribute_group',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改属性组中间
+export function updateAs_attribute_group(data) {
+  return request({
+    url: '/product/as_attribute_group',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除属性组中间
+export function delAs_attribute_group(id) {
+  return request({
+    url: '/product/as_attribute_group/' + id,
+    method: 'delete'
+  })
+}

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',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除属性
+export function delAttribute(id) {
+  return request({
+    url: '/product/attribute/' + id,
+    method: 'delete'
+  })
+}

src/api/product/attribute_group.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询属性组列表
+export function listGroup(query) {
+  return request({
+    url: '/product/group/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询属性组详细
+export function getGroup(id) {
+  return request({
+    url: '/product/group/' + id,
+    method: 'get'
+  })
+}
+
+// 新增属性组
+export function addGroup(data) {
+  return request({
+    url: '/product/group',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改属性组
+export function updateGroup(data) {
+  return request({
+    url: '/product/group',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除属性组
+export function delGroup(id) {
+  return request({
+    url: '/product/group/' + 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',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品牌
+export function delBrand(id) {
+  return request({
+    url: '/product/brand/' + id,
+    method: 'delete'
+  })
+}

src/api/product/category_attribute.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询品类属性中间列表
+export function listCategory_attribute(query) {
+  return request({
+    url: '/product/category_attribute/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品类属性中间详细
+export function getCategory_attribute(id) {
+  return request({
+    url: '/product/category_attribute/' + id,
+    method: 'get'
+  })
+}
+
+// 新增品类属性中间
+export function addCategory_attribute(data) {
+  return request({
+    url: '/product/category_attribute',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品类属性中间
+export function updateCategory_attribute(data) {
+  return request({
+    url: '/product/category_attribute',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品类属性中间
+export function delCategory_attribute(id) {
+  return request({
+    url: '/product/category_attribute/' + id,
+    method: 'delete'
+  })
+}

src/api/product/category_attribute_group.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询品类属性组中间列表
+export function listCategory_attribute_group(query) {
+  return request({
+    url: '/product/category_attribute_group/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品类属性组中间详细
+export function getCategory_attribute_group(id) {
+  return request({
+    url: '/product/category_attribute_group/' + id,
+    method: 'get'
+  })
+}
+
+// 新增品类属性组中间
+export function addCategory_attribute_group(data) {
+  return request({
+    url: '/product/category_attribute_group',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品类属性组中间
+export function updateCategory_attribute_group(data) {
+  return request({
+    url: '/product/category_attribute_group',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品类属性组中间
+export function delCategory_attribute_group(id) {
+  return request({
+    url: '/product/category_attribute_group/' + id,
+    method: 'delete'
+  })
+}

src/api/product/category_brand.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询品牌品类中间列表
+export function listCategory_brand(query) {
+  return request({
+    url: '/product/category_brand/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品牌品类中间详细
+export function getCategory_brand(id) {
+  return request({
+    url: '/product/category_brand/' + id,
+    method: 'get'
+  })
+}
+
+// 新增品牌品类中间
+export function addCategory_brand(data) {
+  return request({
+    url: '/product/category_brand',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品牌品类中间
+export function updateCategory_brand(data) {
+  return request({
+    url: '/product/category_brand',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品牌品类中间
+export function delCategory_brand(id) {
+  return request({
+    url: '/product/category_brand/' + id,
+    method: 'delete'
+  })
+}

src/api/product/category_info.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询品类信息列表
+export function listCategory_info(query) {
+  return request({
+    url: '/product/category_info/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品类信息详细
+export function getCategory_info(id) {
+  return request({
+    url: '/product/category_info/' + id,
+    method: 'get'
+  })
+}
+
+// 新增品类信息
+export function addCategory_info(data) {
+  return request({
+    url: '/product/category_info',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品类信息
+export function updateCategory_info(data) {
+  return request({
+    url: '/product/category_info',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品类信息
+export function delCategory_info(id) {
+  return request({
+    url: '/product/category_info/' + id,
+    method: 'delete'
+  })
+}

src/api/product/product_attrbute.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询商品属性中间表列表
+export function listProduct(query) {
+  return request({
+    url: '/product/product/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品属性中间表详细
+export function getProduct(id) {
+  return request({
+    url: '/product/product/' + id,
+    method: 'get'
+  })
+}
+
+// 新增商品属性中间表
+export function addProduct(data) {
+  return request({
+    url: '/product/product',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品属性中间表
+export function updateProduct(data) {
+  return request({
+    url: '/product/product',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品属性中间表
+export function delProduct(id) {
+  return request({
+    url: '/product/product/' + id,
+    method: 'delete'
+  })
+}

src/api/product/product_category.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询品类商品中间列表
+export function listProduct_category(query) {
+  return request({
+    url: '/product/product_category/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询品类商品中间详细
+export function getProduct_category(id) {
+  return request({
+    url: '/product/product_category/' + id,
+    method: 'get'
+  })
+}
+
+// 新增品类商品中间
+export function addProduct_category(data) {
+  return request({
+    url: '/product/product_category',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改品类商品中间
+export function updateProduct_category(data) {
+  return request({
+    url: '/product/product_category',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除品类商品中间
+export function delProduct_category(id) {
+  return request({
+    url: '/product/product_category/' + id,
+    method: 'delete'
+  })
+}

src/api/product/product_info.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询商品;列表
+export function listProduct_info(query) {
+  return request({
+    url: '/product/product/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询商品;详细
+export function getProduct_info(id) {
+  return request({
+    url: '/product/product/' + id,
+    method: 'get'
+  })
+}
+
+// 新增商品;
+export function addProduct_info(data) {
+  return request({
+    url: '/product/product',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改商品;
+export function updateProduct_info(data) {
+  return request({
+    url: '/product/product',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除商品;
+export function delProduct_info(id) {
+  return request({
+    url: '/product/product/' + id,
+    method: 'delete'
+  })
+}

src/api/product/rule.js

@@ -0,0 +1,45 @@
+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',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除规格
+export function delRule(id) {
+  return request({
+    url: '/product/rule/' + id,
+    method: 'delete'
+  })
+}

src/components/CheckAttributes/index.vue

@@ -0,0 +1,149 @@
+<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>
+          <span>已选属性组ids ：：{{this.checkedAttributeGroupIds}}</span>
+        </div>
+        <el-row :gutter="20"  style="height: 100px">
+          <el-col :span="3" v-for="(attributeGroup,index) in checkedAttributeGroupList">
+            <el-tag
+              style="margin: 0 10px"
+              :key="attributeGroup.name"
+              closable
+              @close="removeCheck(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-col :span="3"
+                  v-for="group in groupList">
+            <el-checkbox
+              v-model="checkedAttributeGroupIds"
+              :value="group.id"
+              :key="group.id"
+              :label="group.id"
+              @change="handleCheckedAttributeChange(group)"
+              border>
+              {{group.name}}
+            </el-checkbox>
+          </el-col>
+        </el-row>
+      </el-card>
+    </el-card>
+  </el-row>
+</template>
+<script>
+
+import {listGroup} from "@/api/product/attribute_group";
+
+export default {
+  name:"AttributeElement",
+  // 接参
+  props: {
+    value: {
+      type: Array,
+      default: []
+    },
+    checkedAttributeGroup:{
+      type: Array,
+      default: null
+    }
+  },
+  data() {
+    // 数据
+    return{
+      checkedAttributeGroupIds: [],
+      //已选属性数组
+      checkedAttributeGroupList: [],
+      //商品属性表
+      attributeList: [],
+      // 属性组数据
+      groupList: [],
+      // 总条数
+      total: 0,
+
+    }
+  },
+  // 挂载方法
+  created() {
+    this.getList()
+  },
+  watch:{
+    value: {
+      handler(val) {
+        console.log("进入初始化value::"+val.toString())
+        if (val.toString() !== this.checkedAttributeGroupIds.toString()){
+          this.checkedAttributeGroupIds = val
+          this.checkedAttributeGroupList = []
+        }
+        console.log("选中的ids：："+this.checkedAttributeGroupIds)
+      },
+      immediate: true
+    },
+    checkedAttributeGroup:{
+      handler(val) {
+        if (val !==undefined && val.length>0){
+          this.checkedAttributeGroupList = val
+          this.checkedAttributeGroupIds = this.checkedAttributeGroupList.map(checked => checked.id)
+        }
+      },
+      immediate: true
+    }
+  },
+  // 方法
+  methods: {
+    /** 属性复选框选择事件 */
+    handleCheckedAttributeChange(attribute){
+      let isChecked = this.checkedAttributeGroupIds.indexOf(attribute.id) > -1;
+      if (isChecked){
+        this.checkedAttributeGroupList.push(attribute)
+      }else {
+        //删除属性
+        this.checkedAttributeGroupList.splice(
+          this.checkedAttributeGroupList.indexOf(attribute),1
+        )
+      }
+      //将组件改变的值传给调用者
+      this.$emit("input",this.checkedAttributeGroupIds)
+      console.log(this.checkedAttributeGroupList)
+      // this.checkedAttributeGroupList.splice(this.checkedAttributeGroupIds.indexOf(attribute.id),1)
+    },
+    //关闭标签
+    removeCheck(index) {
+      console.log(index)
+      this.checkedAttributeGroupList.splice(index,1);
+      this.checkedAttributeGroupIds.splice(index,1)
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    /** 查询属性列表 */
+    getList(){
+      this.loading = true
+      listGroup(this.queryParams).then(response => {
+        this.groupList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/components/CheckBrank/index.vue

@@ -0,0 +1,149 @@
+<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>
+          <span>已选品牌ids ：：{{this.checkedBrandIds}}</span>
+        </div>
+        <el-row :gutter="20"  style="height: 100px">
+          <el-col :span="3" v-for="(brand,index) in checkedBrandList">
+            <el-tag
+              style="margin: 0 10px"
+              :key="brand.name"
+              closable
+              @close="removeCheck(index)">
+              {{brand.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-col :span="3"
+                  v-for="brand in brandList">
+            <el-checkbox
+              v-model="checkedBrandIds"
+              :value="brand.id"
+              :key="brand.id"
+              :label="brand.id"
+              @change="handleCheckedBrandChange(brand)"
+              border>
+              {{brand.name}}
+            </el-checkbox>
+          </el-col>
+        </el-row>
+      </el-card>
+    </el-card>
+  </el-row>
+</template>
+<script>
+
+import {listBrand} from "@/api/product/brand";
+
+export default {
+  name:"BrandElement",
+  // 接参
+  props: {
+    value: {
+      type: Array,
+      default: []
+    },
+    checkBrand:{
+      type: Array,
+      default: null
+    }
+  },
+  data() {
+    // 数据
+    return{
+      //已选品牌ids
+      checkedBrandIds: [],
+      //已选品牌数组
+      checkedBrandList: [],
+      //品牌品牌表
+      brandList: [],
+      // 总条数
+      total: 0,
+
+    }
+  },
+  // 挂载方法
+  created() {
+    this.getBrand()
+  },
+  watch:{
+    value: {
+      handler(val) {
+        console.log("进入初始化value::"+val.toString())
+        if (val.toString() !== this.checkedBrandIds.toString()){
+          this.checkedBrandIds = val
+          this.checkedBrandList = []
+        }
+        console.log("选中的ids：："+this.checkedBrandIds)
+      },
+      immediate: true
+    },
+    checkBrand:{
+      handler(val) {
+        console.log("进入初始化checkedBrand::"+val.toString())
+        if (val !==undefined && val.length>0){
+          this.checkedBrandList = val
+          this.checkedBrandIds = this.checkedBrandList.map(checked => checked.id)
+        }
+      },
+      immediate: true
+    }
+  },
+  // 方法
+  methods: {
+    /** 品牌复选框选择事件 */
+    handleCheckedBrandChange(brand){
+      let isChecked = this.checkedBrandIds.indexOf(brand.id) > -1;
+      if (isChecked){
+        this.checkedBrandList.push(brand)
+      }else {
+        //删除品牌
+        this.checkedBrandList.splice(
+          this.checkedBrandList.indexOf(brand),1
+        )
+      }
+      this.$emit("input",this.checkedBrandIds)
+      console.log(this.checkedBrandList)
+      // this.checkedBrandList.splice(this.checkedBrandIds.indexOf(brand.id),1)
+    },
+    //关闭标签
+    removeCheck(index) {
+      console.log(index)
+      this.checkedBrandList.splice(index,1);
+      this.checkedBrandIds.splice(index,1)
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    /** 查询品牌列表 */
+    getBrand(){
+      listBrand(this.queryParams).then(response => {
+        console.log('品牌集合')
+        console.log(response)
+        this.brandList = response.data.rows;
+        this.total = response.data.total;
+      });
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>
+

src/components/CheckedAttribute/index.vue

@@ -0,0 +1,150 @@
+<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>
+          <span>已选属性ids ：：{{this.checkedAttributeIds}}</span>
+          <span>属性：：{{this.checkedAttributeList}} </span>
+        </div>
+        <el-row :gutter="20"  style="height: 100px">
+          <el-col :span="3" v-for="(attribute,index) in checkedAttributeList">
+            <el-tag
+              style="margin: 0 10px"
+              :key="attribute.name"
+              closable
+              @close="removeCheck(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-col :span="3"
+                  v-for="attribute in attributeList">
+            <el-checkbox
+              v-model="checkedAttributeIds"
+              :value="attribute.id"
+              :key="attribute.id"
+              :label="attribute.id"
+              @change="handleCheckedAttributeChange(attribute)"
+              border>
+              {{attribute.name}}
+            </el-checkbox>
+          </el-col>
+        </el-row>
+      </el-card>
+    </el-card>
+  </el-row>
+</template>
+<script>
+
+import {listAttribute} from "@/api/product/attribute";
+
+export default {
+  name:"AttributeGroupElement",
+  // 接参
+  props: {
+    value: {
+      type: Array,
+      default: []
+    },
+    checkedAttribute:{
+      type: Array,
+      default: null
+    }
+  },
+  data() {
+    // 数据
+    return{
+      checkedAttributeIds: [],
+      //已选属性数组
+      checkedAttributeList: [],
+      //商品属性表
+      attributeList: [],
+      // 属性组数据
+      groupList: [],
+      // 总条数
+      total: 0,
+
+    }
+  },
+  // 挂载方法
+  created() {
+    this.getAttribute()
+  },
+  watch:{
+    value: {
+      handler(val) {
+        console.log("进入初始化value::"+val.toString())
+        if (val.toString() !== this.checkedAttributeIds.toString()){
+          this.checkedAttributeIds = val
+          this.checkedAttributeList = []
+        }
+        console.log("选中的ids：："+this.checkedAttributeIds)
+      },
+      immediate: true
+    },
+    checkedAttribute:{
+      handler(val) {
+        console.log("进入初始化checkedAttribute::"+val.toString())
+        if (val !==undefined && val.length>0){
+          this.checkedAttributeList = val
+          this.checkedAttributeIds = this.checkedAttributeList.map(checked => checked.id)
+        }
+      },
+      immediate: true
+    }
+  },
+  // 方法
+  methods: {
+    /** 属性复选框选择事件 */
+    handleCheckedAttributeChange(attribute){
+      let isChecked = this.checkedAttributeIds.indexOf(attribute.id) > -1;
+      if (isChecked){
+        this.checkedAttributeList.push(attribute)
+      }else {
+        //删除属性
+        this.checkedAttributeList.splice(
+          this.checkedAttributeList.indexOf(attribute),1
+        )
+      }
+      this.$emit("input",this.checkedAttributeIds)
+      console.log(this.checkedAttributeList)
+      // this.checkedAttributeList.splice(this.checkedAttributeIds.indexOf(attribute.id),1)
+    },
+    //关闭标签
+    removeCheck(index) {
+      console.log(index)
+      this.checkedAttributeList.splice(index,1);
+      this.checkedAttributeIds.splice(index,1)
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    /** 查询属性列表 */
+    getAttribute(){
+      listAttribute(this.queryParams).then(response => {
+        console.log('属性集合')
+        console.log(response)
+        this.attributeList = response.data.rows;
+        this.total = response.data.total;
+      });
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/components/ImageUpload/index.vue

@@ -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/main.js

@@ -37,6 +37,12 @@ import DictTag from '@/components/DictTag'
 import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
+//属性组组件
+import AttributeGroupElement from '@/components/CheckedAttribute'
+//属性组件
+import AttributeElement from '@/components/CheckAttributes'
+//品牌组件
+import BrandElement from '@/components/CheckBrank'
 
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
@@ -57,6 +63,10 @@ Vue.component('Editor', Editor)
 Vue.component('FileUpload', FileUpload)
 Vue.component('ImageUpload', ImageUpload)
 Vue.component('ImagePreview', ImagePreview)
+//自定义组件全局挂载
+Vue.component('AttributeGroupElement', AttributeGroupElement)
+Vue.component('AttributeElement', AttributeElement)
+Vue.component('BrandElement', BrandElement)
 
 Vue.use(directive)
 Vue.use(plugins)

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/address/index.vue

@@ -0,0 +1,273 @@
+<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="addressName">
+        <el-input
+          v-model="queryParams.addressName"
+          placeholder="请输入地区名"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="子级地区" prop="sonId">
+        <el-input
+          v-model="queryParams.sonId"
+          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:address: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="addressList"
+      row-key="sonId"
+      :default-expand-all="isExpandAll"
+      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+    >
+      <el-table-column label="地区名" prop="addressName" />
+      <el-table-column label="子级地区" align="center" prop="sonId" />
+      <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:address:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-plus"
+            @click="handleAdd(scope.row)"
+            v-hasPermi="['product:address:add']"
+          >新增</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:address: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-form-item label="地区名" prop="addressName">
+          <el-input v-model="form.addressName" placeholder="请输入地区名" />
+        </el-form-item>
+        <el-form-item label="子级地区" prop="sonId">
+          <el-input v-model="form.sonId" 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 { listAddress, getAddress, delAddress, addAddress, updateAddress } from "@/api/product/address";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+
+export default {
+  name: "Address",
+  components: {
+    Treeselect
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 地区表格数据
+      addressList: [],
+      // 地区树选项
+      addressOptions: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 是否展开，默认全部展开
+      isExpandAll: true,
+      // 重新渲染表格状态
+      refreshTable: true,
+      // 查询参数
+      queryParams: {
+        addressName: null,
+        sonId: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        addressName: [
+          { required: true, message: "地区名不能为空", trigger: "blur" }
+        ],
+        sonId: [
+          { required: true, message: "子级地区不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询地区列表 */
+    getList() {
+      this.loading = true;
+      listAddress(this.queryParams).then(response => {
+        this.addressList = this.handleTree(response.data, "sonId", "id");
+        this.loading = false;
+      });
+    },
+    /** 转换地区数据结构 */
+    normalizer(node) {
+      if (node.children && !node.children.length) {
+        delete node.children;
+      }
+      return {
+        id: node.sonId,
+        label: node.addressName,
+        children: node.children
+      };
+    },
+	/** 查询地区下拉树结构 */
+    getTreeselect() {
+      listAddress().then(response => {
+        this.addressOptions = [];
+        const data = { sonId: 0, addressName: '顶级节点', children: [] };
+        data.children = this.handleTree(response.data, "sonId", "id");
+        this.addressOptions.push(data);
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        addressName: null,
+        sonId: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd(row) {
+      this.reset();
+      this.getTreeselect();
+      if (row != null && row.sonId) {
+        this.form.id = row.sonId;
+      } else {
+        this.form.id = 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.id = row.sonId;
+      }
+      getAddress(row.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) {
+            updateAddress(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addAddress(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$modal.confirm('是否确认删除地区编号为"' + row.id + '"的数据项？').then(function() {
+        return delAddress(row.id);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    }
+  }
+};
+</script>

src/views/product/attribute/index.vue

@@ -0,0 +1,273 @@
+<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="80%" 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" 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" }
+        ],
+      }
+    };
+  },
+  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,
+        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
+      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/brand/index.vue

@@ -0,0 +1,321 @@
+<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="status">
+        <el-select v-model="queryParams.status" 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 label="公司地址" prop="addressName">
+        <el-input
+          v-model="queryParams.addressName"
+          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: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="name" />
+      <el-table-column label="图像标识" 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="introduction" />
+      <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="addressName" />
+      <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="80%" append-to-body>
+      {{this.form}}
+      <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="logo">
+          <image-upload v-model="form.logo" />
+        </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="status">
+          <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-form-item label="公司地址" prop="addressName">
+          <el-input v-model="form.addressName" 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,
+        name: null,
+        logo: null,
+        introduction: null,
+        status: null,
+        addressName: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        name: [
+          { required: true, message: "品牌名称不能为空", trigger: "blur" }
+        ],
+        logo: [
+          { required: true, message: "图像标识不能为空", trigger: "blur" }
+        ],
+        status: [
+          { required: true, message: "品牌启用不能为空", trigger: "change" }
+        ],
+      }
+    };
+  },
+  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,
+        name: null,
+        logo: null,
+        introduction: null,
+        status: null,
+        addressName: 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/categoryInfo/index.vue

@@ -0,0 +1,366 @@
+<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="status">
+        <el-select v-model="queryParams.status" 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:category_info: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="category_infoList"
+      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="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="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_info:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-plus"
+            @click="handleAdd(scope.row)"
+            v-hasPermi="['product:category_info:add']"
+          >新增</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:category_info: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="category_infoOptions" :normalizer="normalizer" 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_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-col :span="12">
+            <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="remark"  style="height: 150px">
+              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-tabs v-model="activeName" @tab-click="handleClick">
+          <el-tab-pane label="属性" name="first">
+            <AttributeGroupElement v-model="form.checkedAttributeIds" :checked-attribute="this.checkedAttribute"></AttributeGroupElement>
+          </el-tab-pane>
+          <el-tab-pane label="属性组" name="second">
+            <AttributeElement v-model="form.checkedAttributeGroupIds" :checked-attribute-group="this.checkedAttributeGroup"></AttributeElement>
+          </el-tab-pane>
+          <el-tab-pane label="品牌" name="third">
+            <BrandElement v-model="form.checkedBrandIds" :check-brand="this.checkedBrand"></BrandElement>
+          </el-tab-pane>
+        </el-tabs>
+
+      </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_info, getCategory_info, delCategory_info, addCategory_info, updateCategory_info } from "@/api/product/category_info";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import Brand from "@/views/product/brand/index.vue";
+
+export default {
+  name: "Category_info",
+  dicts: ['sys_yes_no'],
+  components: {
+    Brand,
+    Treeselect
+  },
+  data() {
+    return {
+      activeName: 'first',
+      // 组件绑定的品牌
+      checkedBrand: [],
+      // 组件绑定的属性组
+      checkedAttributeGroup: [],
+      // 组件绑定的属性
+      checkedAttribute: [],
+      // 遮罩层
+      loading: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 品类信息表格数据
+      category_infoList: [],
+      // 品类信息树选项
+      category_infoOptions: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 是否展开，默认全部展开
+      isExpandAll: true,
+      // 重新渲染表格状态
+      refreshTable: true,
+      // 查询参数
+      queryParams: {
+        name: null,
+        image: null,
+        parentId: null,
+        status: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        name: [
+          { required: true, message: "品类名称不能为空", trigger: "blur" }
+        ],
+        parentId: [
+          { required: true, message: "父级品类不能为空", trigger: "change" }
+        ],
+        status: [
+          { required: true, message: "是否启用不能为空", trigger: "change" }
+        ],
+        checkedAttributeIds: [
+          { required: true, message: "属性不能为空", trigger: "change" }
+        ],
+        checkedAttributeGroupList: [
+          { required: true, message: "属性组不能为空", trigger: "change" }
+        ],
+        checkedBrandList: [
+          { required: true, message: "品牌不能为空", trigger: "change" }
+        ],
+
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+
+
+    /** 查询品类信息列表 */
+    getList() {
+      this.loading = true;
+      listCategory_info(this.queryParams).then(response => {
+        this.category_infoList = 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_info().then(response => {
+        this.category_infoOptions = [];
+        const data = { id: 0, name: '顶级节点', children: [] };
+        data.children = this.handleTree(response.data, "id", "parentId");
+        this.category_infoOptions.push(data);
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        name: null,
+        image: null,
+        parentId: null,
+        status: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        checkedAttributeList: [],
+        checkedAttributeIds: [],
+        checkedAttributeGroupList: [],
+        checkedAttributeGroupIds: [],
+        checkedBrandIds: [],
+        checkedBrandList: []
+      };
+      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.id;
+      }
+      getCategory_info(row.id).then(response => {
+        console.log(response)
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改品类信息";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateCategory_info(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addCategory_info(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$modal.confirm('是否确认删除品类信息编号为"' + row.id + '"的数据项？').then(function() {
+        return delCategory_info(row.id);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    }
+  }
+};
+</script>

src/views/product/group/index.vue

@@ -0,0 +1,387 @@
+<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="states">
+        <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-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:group: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:group: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:group: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:group:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="groupList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="组名" align="center" prop="name" width="155"/>
+      <el-table-column label="属性" align="center" prop="attributeList" >
+        <template slot-scope="scope">
+          <el-tag v-for="attribute in scope.row.attributeList">
+            {{attribute.name}}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="品牌启用" align="center" prop="status" style="width: 20px;">
+      <template slot-scope="scope">
+        <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.states"/>
+      </template>
+      </el-table-column>
+      <el-table-column label="说明" align="center" prop="remark" style="width: 30px;"/>
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon ="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['product:group:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:group: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" type="text" 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-col>
+            <el-form-item label="说明" prop="remark">
+              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <AttributeGroupElement v-model="form.checkedAttributeIds" :checked-attribute="this.checkedAttribute">
+        </AttributeGroupElement>
+<!--        <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>-->
+<!--                {{this.form.checkedAttributeIds}}-->
+<!--                {{this.form.attributeList}}-->
+<!--              </div>-->
+<!--              <el-row :gutter="20"  style="height: 100px">-->
+<!--                <el-col :span="3" v-for="(attribute,index) in checkedAttribute">-->
+<!--                  <el-tag-->
+<!--                    style="margin: 0 10px"-->
+<!--                    :key="attribute.name"-->
+<!--                    closable-->
+<!--                    @close="removeCheck(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-col :span="3"-->
+<!--                      v-for="attribute in attributeList">-->
+<!--                <el-checkbox-->
+<!--                  v-model="form.checkedAttributeIds"-->
+<!--                  :value="attribute.id"-->
+<!--                  :key="attribute.id"-->
+<!--                  :label="attribute.id"-->
+<!--                  @change="handleCheckedAttributeChange(attribute)"-->
+<!--                  border>-->
+<!--                  {{attribute.name}}-->
+<!--                </el-checkbox>-->
+<!--              </el-col>-->
+<!--            </el-row>-->
+<!--          </el-card>-->
+<!--          </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 { listGroup, getGroup, delGroup, addGroup, updateGroup } from "@/api/product/attribute_group";
+import {listAttribute} from "@/api/product/attribute";
+
+export default {
+  name: "Group",
+  dicts: ['sys_yes_no'],
+  data() {
+    return {
+      //已选属性数组
+      checkedAttribute: [],
+      //商品属性表
+      attributeList: [],
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 属性组表格数据
+      groupList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        states: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        name: [
+          { required: true, message: "组名不能为空", trigger: "blur" }
+        ],
+        states: [
+          { required: true, message: "状态不能为空", trigger: "change" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    //属性复选框选择事件
+    handleCheckedAttributeChange(attribute){
+      let isChecked = this.form.checkedAttributeIds.indexOf(attribute.id) > -1;
+      if (isChecked){
+        this.checkedAttribute.push(attribute)
+      }else {
+        //删除属性
+        this.checkedAttribute.splice(
+          this.checkedAttribute.indexOf(attribute),1
+        )
+      }
+      console.log(this.checkedAttribute)
+
+      // this.checkedAttribute.splice(this.checkedAttributeIds.indexOf(attribute.id),1)
+    },
+    //关闭标签
+    removeCheck(index) {
+      console.log(index)
+      this.checkedAttribute.splice(index,1);
+      this.form.checkedAttributeIds.splice(index,1)
+    },
+    /** 查询属性组列表 */
+    getList() {
+      this.loading = true;
+      listGroup(this.queryParams).then(response => {
+        this.groupList = response.data.rows;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    /** 查询属性列表 */
+    getAttribute(){
+      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,
+        name: null,
+        states: null,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        checkedAttributeIds: [],
+      };
+      this.resetForm("form");
+      this.checkedAttribute= []
+    },
+    /** 搜索按钮操作 */
+    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.getAttribute();
+      this.reset();
+      this.open = true;
+      this.title = "添加属性组";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      // console.log('行属性组数据')
+      // console.log(row)
+      this.reset();
+      const id = row.id || this.ids
+      getGroup(id).then(response => {
+        // console.log(('根据id查到的属性组数据'))
+        console.log(response)
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改属性组";
+        this.checkedAttribute = response.data.attributeList
+      });
+      this.getAttribute();
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateGroup(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addGroup(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 delGroup(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/group/export', {
+        ...this.queryParams
+      }, `group_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/productInfo/index.vue

@@ -0,0 +1,344 @@
+<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="introduction">
+        <el-input
+          v-model="queryParams.introduction"
+          placeholder="请输入商品信息"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="品牌编号" prop="brandId">
+        <el-input
+          v-model="queryParams.brandId"
+          placeholder="请输入品牌编号"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="商品状态" prop="status">
+        <el-select v-model="queryParams.status" 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: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: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: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:product_info:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="product_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="brandId" />
+      <el-table-column label="图片" align="center" prop="images" width="100">
+        <template slot-scope="scope">
+          <image-preview :src="scope.row.images" :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_yes_no" :value="scope.row.status"/>
+        </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:product_info:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['product:product_info: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="introduction">
+          <el-input v-model="form.introduction" placeholder="请输入商品信息" />
+        </el-form-item>
+        <el-form-item label="品牌编号" prop="brandId">
+          <el-input v-model="form.brandId" placeholder="请输入品牌编号" />
+        </el-form-item>
+        <el-form-item label="图片" prop="images">
+          <image-upload v-model="form.images"/>
+        </el-form-item>
+        <el-form-item label="商品状态" prop="status">
+          <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-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="创建人" prop="createdBy">
+          <el-input v-model="form.createdBy" placeholder="请输入创建人" />
+        </el-form-item>
+        <el-form-item label="创建时间" prop="createdTime">
+          <el-date-picker clearable
+            v-model="form.createdTime"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="请选择创建时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="更新人" prop="updatedBy">
+          <el-input v-model="form.updatedBy" 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 { listProduct_info, getProduct_info, delProduct_info, addProduct_info, updateProduct_info } from "@/api/product/product_info";
+
+export default {
+  name: "Product_info",
+  dicts: ['sys_yes_no'],
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 商品;表格数据
+      product_infoList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+        introduction: null,
+        brandId: null,
+        images: null,
+        addressSend: null,
+        status: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        name: [
+          { required: true, message: "商品名不能为空", trigger: "blur" }
+        ],
+        introduction: [
+          { required: true, message: "商品信息不能为空", trigger: "blur" }
+        ],
+        status: [
+          { required: true, message: "商品状态不能为空", trigger: "change" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询商品;列表 */
+    getList() {
+      this.loading = true;
+      listProduct_info(this.queryParams).then(response => {
+        this.product_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,
+        brandId: null,
+        images: null,
+        addressSend: null,
+        status: null,
+        remark: null,
+        createdBy: null,
+        createdTime: null,
+        updatedBy: 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
+      getProduct_info(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) {
+            updateProduct_info(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addProduct_info(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 delProduct_info(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('product/product_info/export', {
+        ...this.queryParams
+      }, `product_info_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>

src/views/product/rule/index.vue

@@ -0,0 +1,415 @@
+<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>
+
+    <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="name" />
+      <el-table-column label="属性名称" align="center" >
+        <template slot-scope="scope">
+          <el-row  v-for="attr in scope.row.ruleAttrList">
+            <span onresize="mini">{{attr.attrName}}</span>
+          </el-row>
+        </template>
+      </el-table-column>
+      <el-table-column label="属性值" align="center" >
+        <template slot-scope="scope">
+          <el-row  v-for="attr in scope.row.ruleAttrList">
+            <span>{{attr.valueList.toString()}}</span>
+          </el-row>
+        </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:rule:edit']"
+          >修改</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-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-col :span="12">
+            <el-form-item label="说明" prop="remark">
+              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row v-for="(ruleAttr,index) in form.ruleAttrList">
+              <el-tag
+                :key="ruleAttr.attrName"
+                closable
+                @close="removeRule(index)">
+                {{ruleAttr.attrName}}
+              </el-tag>
+
+            <el-row style="margin: 10px 0">
+              <el-tag
+                style="float:left;margin-right: 20px"
+                v-for="(ruleProperty,index) in ruleAttr.valueList"
+                :key="ruleProperty"
+                @close="removeRuleProperty(ruleAttr.valueList,index)"
+                closable>
+                {{ruleProperty}}
+              </el-tag>
+              <el-button
+                v-if="!ruleAttr.ruleAttrAddStatus"
+                         @click="ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus"
+                         size="mini">添加</el-button>
+              <el-input v-if="ruleAttr.ruleAttrAddStatus"
+                        v-model="addRulePropertyValue"
+                        @blur="addRuleProperty(ruleAttr,false)"
+                        @keyup.enter.native="addRuleProperty(ruleAttr,true)"
+                        size="mini" placeholder="请输入规格属性值"
+                        style="float: left; width: 150px"/>
+              <el-button size="mini" v-if="ruleAttr.ruleAttrAddStatus" @click="ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus">取消</el-button>
+            </el-row>
+
+            <el-divider></el-divider>
+        </el-row>
+          <el-button v-if="!ruleAddStatus" @click="ruleAddStatus = !ruleAddStatus">添加规格</el-button>
+        <el-form v-if="ruleAddStatus" :inline="true" :model="ruleAddForm" class="demo-form-inline">
+          <el-form-item label="规格名称">
+            <el-input v-model="ruleAddForm.name" placeholder="请输入规格名称"></el-input>
+          </el-form-item>
+          <el-form-item label="规格属性">
+            <el-input v-model="ruleAddForm.valueList" placeholder="请输入规格属性"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="ruleAddFormFun" v-if="ruleAddStatus">添加</el-button>
+            <el-button type="primary" @click="ruleAddStatus = !ruleAddStatus">取消</el-button>
+          </el-form-item>
+        </el-form>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listRule, getRule, delRule, addRule, updateRule } from "@/api/product/rule";
+
+export default {
+  name: "Rule",
+  dicts: ['sys_yes_no'],
+  data() {
+    return {
+      ruleAddStatus: false,
+      ruleAddForm: {
+        name: null,
+        valueList: null,
+      },
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 规格表格数据
+      ruleList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: null,
+      },
+      // 表单参数
+      form: {},
+      addRulePropertyValue: null,
+      // 表单校验
+      rules: {
+        name: [
+          { required: true, message: "规格名称不能为空", trigger: "blur" }
+        ],
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    addRuleList() {
+        this.ruleAddFormStatus = false;
+
+    },
+    removeRule(index){
+      this.form.ruleAttrList.splice(index, 1);
+    },
+    removeRuleProperty(valueList,index){
+      valueList.splice(index, 1);
+    },
+    addRuleProperty(ruleAttr, continuousInput){
+      if (this.addRulePropertyValue === null || this.addRulePropertyValue === 0){
+        if (!continuousInput){
+          ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus
+        }
+        return;
+      }
+      console.log(ruleAttr)
+      if (ruleAttr.valueList.indexOf(this.addRulePropertyValue) > -1){
+        this.$message({
+          message: `规格[${ruleAttr.name}]属性值[${this.addRulePropertyValue}]已经存在`,
+          type: 'warning'
+        });
+        return;
+      }
+      ruleAttr.valueList.push(this.addRulePropertyValue)
+      this.addRulePropertyValue = null;
+      if (!continuousInput){
+        ruleAttr.ruleAttrAddStatus = !ruleAttr.ruleAttrAddStatus
+      }
+    },
+    ruleAddFormFun(){
+      if (this.ruleAddForm.name === null || this.ruleAddForm.name.length === 0){
+        this.$message({
+          message: '规格名称不可为空',
+          type: 'warning'
+        });
+        return;
+      }
+      if (this.ruleAddForm.valueList === null || this.ruleAddForm.valueList.length === 0){
+        this.$message({
+          message: '规格属性不可为空',
+          type: 'warning'
+        });
+        return;
+      }
+      let ruleAttr = this.form.ruleAttrList.find(ruleAttr => ruleAttr.name === this.ruleAddForm.name);
+      if (ruleAttr === undefined){
+        this.form.ruleAttrList.push({
+          "attrName": this.ruleAddForm.name,
+          "valueList": [this.ruleAddForm.valueList],
+          "ruleAttrAddStatus": false
+        })
+      }else {
+        if (ruleAttr.valueList.indexOf(this.ruleAddForm.valueList) > -1){
+          this.$message({
+            message: `规格[${this.ruleAddForm.name}]属性值[${this.ruleAddForm.valueList}]已经存在`,
+            type: 'warning'
+          });
+          return;
+        }
+        ruleAttr.valueList.push(this.ruleAddForm.valueList)
+      }
+      this.ruleAddForm = {
+        name: null,
+        valueList: null,
+      }
+      this.ruleAddStatus = 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,
+        remark: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        ruleAttrList: [],
+        asInsertRule: [],
+      };
+      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.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/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(res.msg);
         this.visible = false;
         this.$emit("ok");
       });

vue.config.js

@@ -35,7 +35,7 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        target: `http://localhost:8080`,
+        target: `http://localhost:18080`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''