cuishiyu
/
2108a-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

商品属性组添加成功

dev
csy 2024-03-04 09:11:38 +08:00
parent e75ffd7423
commit 1033707324
10 changed files with 152 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/product/attribute.js
View File

@ -29,7 +29,7 @@ export function addAttribute(data) {
// 修改商品属性 // 修改商品属性
export function updateAttribute(data) { export function updateAttribute(data) {
return request({ return request({
url: '/product/attribute', url: '/product/attribute/'+data.id,
method: 'put', method: 'put',
data: data data: data
}) })

2
src/api/product/attributeGroup.js
View File

@ -29,7 +29,7 @@ export function addAttributeGroup(data) {
// 修改属性组 // 修改属性组
export function updateAttributeGroup(data) { export function updateAttributeGroup(data) {
return request({ return request({
url: '/product/attributeGroup', url: '/product/attributeGroup/'+data.id,
method: 'put', method: 'put',
data: data data: data
}) })

12
src/api/product/brand.js
View File

@ -1,6 +1,6 @@
import request from '@/utils/request' import request from '@/utils/request'
// 查询商品品牌列表 // 查询品牌信息列表
export function listBrand(query) { export function listBrand(query) {
return request({ return request({
url: '/product/brand/list', url: '/product/brand/list',
@ -9,7 +9,7 @@ export function listBrand(query) {
}) })
} }
// 查询商品品牌详细 // 查询品牌信息详细
export function getBrand(id) { export function getBrand(id) {
return request({ return request({
url: '/product/brand/' + id, url: '/product/brand/' + id,
@ -17,7 +17,7 @@ export function getBrand(id) {
}) })
} }
// 新增商品品牌 // 新增品牌信息
export function addBrand(data) { export function addBrand(data) {
return request({ return request({
url: '/product/brand', url: '/product/brand',
@ -26,16 +26,16 @@ export function addBrand(data) {
}) })
} }
// 修改商品品牌 // 修改品牌信息
export function updateBrand(data) { export function updateBrand(data) {
return request({ return request({
url: '/product/brand', url: '/product/brand/'+data.id,
method: 'put', method: 'put',
data: data data: data
}) })
} }
// 删除商品品牌 // 删除品牌信息
export function delBrand(id) { export function delBrand(id) {
return request({ return request({
url: '/product/brand/' + id, url: '/product/brand/' + id,

10
src/api/product/category.js
View File

@ -17,6 +17,14 @@ export function getCategory(id) {
}) })
} }
// 查询品类信息详细
export function parentCommonElement(id) {
return request({
url: '/product/category/parentCommonElement/' + id,
method: 'get'
})
}
// 新增品类信息 // 新增品类信息
export function addCategory(data) { export function addCategory(data) {
return request({ return request({
@ -29,7 +37,7 @@ export function addCategory(data) {
// 修改品类信息 // 修改品类信息
export function updateCategory(data) { export function updateCategory(data) {
return request({ return request({
url: '/product/category', url: '/product/category/'+data.id,
method: 'put', method: 'put',
data: data data: data
}) })

2
src/api/product/comment.js
View File

@ -29,7 +29,7 @@ export function addComment(data) {
// 修改商品评论 // 修改商品评论
export function updateComment(data) { export function updateComment(data) {
return request({ return request({
url: '/product/comment', url: '/product/comment/'+data.id,
method: 'put', method: 'put',
data: data data: data
}) })

2
src/api/product/info.js
View File

@ -29,7 +29,7 @@ export function addInfo(data) {
// 修改商品信息 // 修改商品信息
export function updateInfo(data) { export function updateInfo(data) {
return request({ return request({
url: '/product/info', url: '/product/info/'+data.id,
method: 'put', method: 'put',
data: data data: data
}) })

2
src/api/product/rule.js
View File

@ -29,7 +29,7 @@ export function addRule(data) {
// 修改商品规格 // 修改商品规格
export function updateRule(data) { export function updateRule(data) {
return request({ return request({
url: '/product/rule', url: '/product/rule/'+data.id,
method: 'put', method: 'put',
data: data data: data
}) })

152
src/views/product/attributeGroup/index.vue
View File

@ -9,8 +9,8 @@
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="states">
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable> <el-select v-model="queryParams.states" placeholder="请选择状态" clearable>
<el-option <el-option
v-for="dict in dict.type.sys_yes_no" v-for="dict in dict.type.sys_yes_no"
:key="dict.value" :key="dict.value"
@ -73,11 +73,17 @@
<el-table v-loading="loading" :data="attributeGroupList" @selection-change="handleSelectionChange"> <el-table v-loading="loading" :data="attributeGroupList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键" align="center" prop="id" />
<el-table-column label="组名称" align="center" prop="name" /> <el-table-column label="组名称" align="center" prop="name" />
<el-table-column label="状态" align="center" prop="status"> <el-table-column label="组内属性" align="center" prop="attributeInfoList" >
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.sys_yes_no" :value="scope.row.status"/> <el-tag v-for="attributeInfo in scope.row.attributeInfoList">
{{attributeInfo.name}}
</el-tag>
</template>
</el-table-column>
<el-table-column label="状态" align="center" prop="states">
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_yes_no" :value="scope.row.states"/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="备注" align="center" prop="remark" /> <el-table-column label="备注" align="center" prop="remark" />
@ -112,7 +118,6 @@
<!-- 添加或修改属性组对话框 --> <!-- 添加或修改属性组对话框 -->
<el-dialog :title="title" :visible.sync="open" width="80%" append-to-body> <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 ref="form" :model="form" :rules="rules" label-width="80px">
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="组名称" prop="name"> <el-form-item label="组名称" prop="name">
@ -120,8 +125,8 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="状态" prop="status"> <el-form-item label="状态" prop="states">
<el-radio-group v-model="form.status"> <el-radio-group v-model="form.states">
<el-radio <el-radio
v-for="dict in dict.type.sys_yes_no" v-for="dict in dict.type.sys_yes_no"
:key="dict.value" :key="dict.value"
@ -136,6 +141,7 @@
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" /> <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
</el-form-item> </el-form-item>
</el-row> </el-row>
<el-row> <el-row>
<el-card class="box-card"> <el-card class="box-card">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
@ -146,9 +152,9 @@
<span>已选择属性</span> <span>已选择属性</span>
</div> </div>
<el-row> <el-row>
<el-col :span="2" v-for="(attribute,index) in attributeList"> <el-col :span="2" v-for="(attribute, index) in checkedAttributeList">
<el-tag v-if="checkedList.indexOf(attribute.id) > -1" <el-tag
style="margin: 0 10px" style="margin: 5px 10px"
:key="attribute.name" :key="attribute.name"
closable @close="removeChecked(index)"> closable @close="removeChecked(index)">
{{attribute.name}} {{attribute.name}}
@ -157,42 +163,42 @@
</el-row> </el-row>
</el-card> </el-card>
<el-divider></el-divider> <el-divider></el-divider>
<el-card class="box-card"> <el-card class="box-card">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<span>未选择属性</span> <span>未选属性</span>
</div> </div>
<el-row> <el-row>
<el-form :inline="true" :model="attributeQuery" class="demo-form-inline"> <el-form :inline="true" :model="attributeQuery" class="demo-form-inline">
<el-form-item label="属性编码"> <el-form-item label="属性编码">
<el-input v-model="attributeQuery.code" placeholder="属性编码"> <el-input v-model="attributeQuery.code" placeholder="属性编码"></el-input>
</el-input> </el-form-item>
</el-form-item> <el-form-item label="属性名称">
<el-form-item label="属性名称"> <el-input v-model="attributeQuery.name" placeholder="属性名称"></el-input>
<el-input v-model="attributeQuery.name" placeholder="属性名称"></el-input> </el-form-item>
</el-form-item> <el-form-item>
<el-form-item> <el-button type="primary" @click="queryAttribute">查询</el-button>
<el-button type="primary" @click="queryAttribute">查询</el-button> </el-form-item>
</el-form-item> </el-form>
</el-form> </el-row>
</el-row> <el-row>
<el-row> <el-col style="padding: 5px 10px" :span="3" v-for="attribute in attributeList" >
<el-col style="padding: 5px 10px" :span="3" v-for="attribute in attributeList" > <el-checkbox
<el-checkbox v-model="form.attributeIdList"
v-model="checkedList" :key="attribute.id"
:key="attribute.id" :value="attribute.id"
:value="attribute.id" :label="attribute.id"
:label="attribute.id" @change="checkedAttribute(attribute)"
border>{{attribute.name}}</el-checkbox> border>{{attribute.name}}</el-checkbox>
</el-col> </el-col>
</el-row> </el-row>
<pagination <pagination
v-show="total>0" v-show="total>0"
:total="total" :total="total"
:page.sync="attributeQuery.pageNum" :page.sync="attributeQuery.pageNum"
:limit.sync="attributeQuery.pageSize" :limit.sync="attributeQuery.pageSize"
@pagination="queryAttribute" @pagination="queryAttribute"
/> />
</el-card> </el-card>
</el-card> </el-card>
</el-row> </el-row>
</el-form> </el-form>
@ -236,26 +242,25 @@ export default {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
name: null, name: null,
status: null, states: null
}, },
// 表单参数 // 表单参数
form: {}, form: {},
// 表单校验 // 表单校验
rules: { rules: {
createBy: [ name: [
{ required: true, message: "创建人不能为空", trigger: "blur" } { required: true, message: "组名称不能为空", trigger: "blur" }
], ],
createTime: [ states: [
{ required: true, message: "创建时间不能为空", trigger: "blur" } { required: true, message: "状态不能为空", trigger: "change" }
], ],
}, },
tags: [ tags: [
{ name: '标签一'}, { name: '标签一' },
{ name: '标签二'} { name: '标签二' }
], ],
checkedAttributeList: [],
checkedList:[], attributeQuery: {
attributeQuery:{
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
code: null, code: null,
@ -269,11 +274,30 @@ export default {
this.getList(); this.getList();
}, },
methods: { methods: {
/**
* 选中值触发方法
*/
checkedAttribute(attribute){
let isCheck = this.form.attributeIdList.indexOf(attribute.id) > -1;
if (isCheck){
this.checkedAttributeList.push(attribute);
}else {
// 删除
this.checkedAttributeList.splice(
this.checkedAttributeList.indexOf(attribute), 1
)
}
},
/**
* 删除选中值
* @param index
*/
removeChecked(index){ removeChecked(index){
console.log(index) console.log(index)
this.checkedList.splice(index-1,1) this.checkedAttributeList.splice(index, 1);
this.form.attributeIdList.splice(index, 1);
}, },
/** /**
* 查询属性 * 查询属性
*/ */
@ -303,13 +327,11 @@ export default {
this.form = { this.form = {
id: null, id: null,
name: null, name: null,
status: null, states: null,
remark: null, remark: null,
createBy: null, attributeIdList: [],
createTime: null,
updateBy: null,
updateTime: null
}; };
this.checkedAttributeList = []
this.resetForm("form"); this.resetForm("form");
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
@ -333,7 +355,7 @@ export default {
this.reset(); this.reset();
this.open = true; this.open = true;
this.title = "添加属性组"; this.title = "添加属性组";
this.queryAttribute() this.queryAttribute();
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {

14
src/views/product/brand/index.vue
View File

@ -1,9 +1,9 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="品牌名称" prop="name"> <el-form-item label="品牌名称" prop="nam">
<el-input <el-input
v-model="queryParams.name" v-model="queryParams.nam"
placeholder="请输入品牌名称" placeholder="请输入品牌名称"
clearable clearable
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
@ -80,7 +80,7 @@
<el-table v-loading="loading" :data="brandList" @selection-change="handleSelectionChange"> <el-table v-loading="loading" :data="brandList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键" align="center" prop="id" /> <el-table-column label="主键" align="center" prop="id" />
<el-table-column label="品牌名称" align="center" prop="name" /> <el-table-column label="品牌名称" align="center" prop="nam" />
<el-table-column label="Logo" align="center" prop="logo" width="100"> <el-table-column label="Logo" align="center" prop="logo" width="100">
<template slot-scope="scope"> <template slot-scope="scope">
<image-preview :src="scope.row.logo" :width="50" :height="50"/> <image-preview :src="scope.row.logo" :width="50" :height="50"/>
@ -130,8 +130,8 @@
<!-- 添加或修改商品品牌对话框 --> <!-- 添加或修改商品品牌对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="品牌名称" prop="name"> <el-form-item label="品牌名称" prop="nam">
<el-input v-model="form.name" placeholder="请输入品牌名称" /> <el-input v-model="form.nam" placeholder="请输入品牌名称" />
</el-form-item> </el-form-item>
<el-form-item label="Logo" prop="logo"> <el-form-item label="Logo" prop="logo">
<image-upload v-model="form.logo" :limit="1" :is-show-tip="false"/> <image-upload v-model="form.logo" :limit="1" :is-show-tip="false"/>
@ -190,7 +190,7 @@ export default {
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
name: null, nam: null,
logo: null, logo: null,
introduction: null, introduction: null,
start: null, start: null,
@ -230,7 +230,7 @@ export default {
reset() { reset() {
this.form = { this.form = {
id: null, id: null,
name: null, nam: null,
logo: null, logo: null,
introduction: null, introduction: null,
start: null, start: null,

46
src/views/product/category/index.vue
View File

@ -88,7 +88,7 @@
</el-table-column> </el-table-column>
<el-table-column label="父级品类" align="center" prop="parentId" /> <el-table-column label="父级品类" align="center" prop="parentId" />
<el-table-column label="是否启用" align="center" prop="start" /> <el-table-column label="是否启用" align="center" prop="start" />
<el-table-column label="介绍" align="center" prop="introductoin" /> <el-table-column label="介绍" align="center" prop="introduction" />
<el-table-column label="备注" align="center" prop="remark" /> <el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope"> <template slot-scope="scope">
@ -121,20 +121,27 @@
<!-- 添加或修改品类信息对话框 --> <!-- 添加或修改品类信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="父级品类" prop="parentId">
<treeselect v-model="form.parentId" :options="categoryOptions" :normalizer="normalizer" placeholder="请选择父级品类" />
</el-form-item>
<el-form-item label="品类名称" prop="name"> <el-form-item label="品类名称" prop="name">
<el-input v-model="form.name" placeholder="请输入品类名称" /> <el-input v-model="form.name" placeholder="请输入品类名称" />
</el-form-item> </el-form-item>
<el-form-item label="图片" prop="image"> <el-form-item label="图片" prop="image">
<image-upload v-model="form.image"/> <image-upload v-model="form.image"/>
</el-form-item> </el-form-item>
<el-form-item label="父级品类" prop="parentId">
<el-input v-model="form.parentId" placeholder="请输入父级品类" />
</el-form-item>
<el-form-item label="是否启用" prop="start"> <el-form-item label="是否启用" prop="start">
<el-input v-model="form.start" placeholder="请输入是否启用" /> <el-input v-model="form.start" placeholder="请输入是否启用" />
<el-radio-group v-model="form.start">
<el-radio
v-for="dict in dict.type.sys_yes_no"
:key="dict.value"
:label="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="介绍" prop="introductoin"> <el-form-item label="介绍" prop="introduction">
<el-input v-model="form.introductoin" type="textarea" placeholder="请输入内容" /> <el-input v-model="form.introduction" type="textarea" placeholder="请输入内容" />
</el-form-item> </el-form-item>
<el-form-item label="备注" prop="remark"> <el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" /> <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
@ -153,6 +160,7 @@ import { listCategory, getCategory, delCategory, addCategory, updateCategory } f
export default { export default {
name: "Category", name: "Category",
dicts: ['sys_yes_no'],
data() { data() {
return { return {
// 遮罩层 // 遮罩层
@ -169,6 +177,8 @@ export default {
total: 0, total: 0,
// 品类信息表格数据 // 品类信息表格数据
categoryList: [], categoryList: [],
// 品类信息树选项
categoryOptions: [],
// 弹出层标题 // 弹出层标题
title: "", title: "",
// 是否显示弹出层 // 是否显示弹出层
@ -181,7 +191,7 @@ export default {
image: null, image: null,
parentId: null, parentId: null,
start: null, start: null,
introductoin: null, introduction: null,
}, },
// 表单参数 // 表单参数
form: {}, form: {},
@ -221,6 +231,26 @@ export default {
this.loading = false; this.loading = false;
}); });
}, },
/** 转换品类信息数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.id,
label: node.name,
children: node.children
};
},
/** 查询品类信息下拉树结构 */
getTreeselect() {
listCategory().then(response => {
this.categoryOptions = [];
const data = { id: 0, name: '顶级节点', children: [] };
data.children = this.handleTree(response.data, "id", "parentId");
this.categoryOptions.push(data);
});
},
// 取消按钮 // 取消按钮
cancel() { cancel() {
this.open = false; this.open = false;
@ -234,7 +264,7 @@ export default {
image: null, image: null,
parentId: null, parentId: null,
start: null, start: null,
introductoin: null, introduction: null,
remark: null, remark: null,
createBy: null, createBy: null,
createTime: null, createTime: null,