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

商品信息添加和修改

dev
Wang XinLong 2024-03-24 16:49:46 +08:00
parent 3c7bdb278b
commit efc1ea8170
4 changed files with 152 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,9 +1,9 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="品牌名称" prop="nam">
<el-form-item label="品牌名称" prop="name">
<el-input
v-model="queryParams.nam"
v-model="queryParams.name"
placeholder="请输入品牌名称"
clearable
@keyup.enter.native="handleQuery"
@ -74,7 +74,7 @@
<el-table v-loading="loading" :data="brandList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键" align="center" prop="id" />
<el-table-column label="品牌名称" align="center" prop="nam" />
<el-table-column label="品牌名称" align="center" prop="name" />
<el-table-column label="LOGO" align="center" prop="logo" width="100">
<template slot-scope="scope">
<image-preview :src="scope.row.logo" :width="50" :height="50"/>
@ -118,8 +118,8 @@
<!-- 添加或修改品牌信息对话框 -->
<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="nam">
<el-input v-model="form.nam" placeholder="请输入品牌名称" />
<el-form-item label="品牌名称" prop="name">
<el-input v-model="form.name" placeholder="请输入品牌名称" />
</el-form-item>
<el-form-item label="LOGO" prop="logo">
<image-upload v-model="form.logo" :limit="1" :is-show-tip="false"/>
@ -178,7 +178,7 @@ export default {
queryParams: {
pageNum: 1,
pageSize: 10,
nam: null,
name: null,
logo: null,
start: null,
introduction: null,
@ -187,7 +187,7 @@ export default {
form: {},
// 表单校验
rules: {
nam: [
name: [
{ required: true, message: "品牌名称不能为空", trigger: "blur" }
],
logo: [
@ -227,7 +227,7 @@ export default {
reset() {
this.form = {
id: null,
nam: null,
name: null,
logo: null,
start: null,
introduction: null,

151
src/views/product/info/index.vue
View File

@ -92,7 +92,7 @@
<el-table-column label="主键" align="center" prop="id" />
<el-table-column label="商品名称" align="center" prop="name" />
<el-table-column label="商品描述" align="center" prop="introduction" />
<el-table-column label="主类型" align="center" prop="mianType" />
<el-table-column label="主类型" align="center" prop="mainType" />
<el-table-column label="父类型" align="center" prop="parentType" />
<el-table-column label="商品类型" align="center" prop="type" />
<el-table-column label="商品图片" align="center" prop="image" width="100">
@ -183,11 +183,11 @@
<el-option
v-for="brand in brandList"
:key="brand.id"
:label="brand.nam"
:label="brand.name"
:value="brand.id">
<el-row>
<image-preview :height="40" :width="40" :src="brand.logo" style="float: left;"/>
<div style="float: left; margin: 2px 18px 0 15px; font-size: 20px;">{{brand.nam}}</div>
<div style="float: left; margin: 2px 18px 0 15px; font-size: 20px;">{{brand.name}}</div>
</el-row>
</el-option>
</el-select>
@ -231,7 +231,7 @@
<div style="height: 200px; width: 100%;">
<el-form ref="templateAttributeGroupForm" label-width="80px">
<el-form-item :label="attribute.name" v-for="attribute in templateAttributeGroup.attributeList">
<el-input v-model="attribute.value"></el-input>
<el-input v-model="attribute.value" :key="attribute.id"></el-input>
</el-form-item>
</el-form>
</div>
@ -335,14 +335,15 @@
<el-table
:data="skuList"
border
max-height="500"
style="width: 100%">
<el-table-column v-for="title in titleList" :prop="title.prop" :label="title.label">
<template slot-scope="scope">
<span v-if="title.prop.indexOf('prop') > -1">{{scope.row[title.prop]}}</span>
<el-input-number v-else-if="['stock','price'].indexOf(title.prop) > -1" v-model="scope.row[title.prop]" :precision="2" :step="0.01"></el-input-number>
<image-upload v-else-if="['image'].indexOf(title.prop) > -1" v-model="scope.row[title.prop]"
:limit="1"
:is-show-tip="false"
:limit="1"
:is-show-tip="false"
></image-upload>
</template>
</el-table-column>
@ -400,7 +401,7 @@ export default {
pageSize: 10,
name: null,
introduction: null,
mianType: null,
mainType: null,
parentType: null,
type: null,
image: null,
@ -457,6 +458,7 @@ export default {
templateAttributeList: [],
attributeList: []
},
respData: [],
templateTitleList: [
{
"label":"规格图片",
@ -476,18 +478,20 @@ export default {
"image": null,
"stock": null,
"price": null
}
},
fifObj: [],
respSkuList: []
};
},
watch: {
categoryOptionValue: {
handler(value){
if (value !== null && value !== undefined && value.length > 0){
this.form.mianType = value[0];
this.form.mainType = value[0];
this.form.parentType = value[1];
this.form.type = value[2];
}else {
this.form.mianType = null;
this.form.mainType = null;
this.form.parentType = null;
this.form.type = null;
}
@ -497,15 +501,59 @@ export default {
handler(value) {
console.log(value)
if (value != null){
getTemplateAttribute(value).then(response => {
const {data} = response;
const {templateAttributeGroupList,templateAttributeList,attributeList} = data;
this.categoryCommonElement.templateAttributeGroupList = templateAttributeGroupList;
this.categoryCommonElement.templateAttributeList = templateAttributeList;
this.categoryCommonElement.attributeList = attributeList;
getTemplateAttribute(value).then(res => {
this.categoryCommonElement.templateAttributeGroupList = res.data.templateAttributeGroupList;
this.categoryCommonElement.templateAttributeList = res.data.templateAttributeList;
this.categoryCommonElement.attributeList = res.data.attributeList;
console.log(this.respData)
if (this.respData!= null && this.respData != [] && this.respData != undefined && this.respData.length>0){
this.categoryCommonElement.templateAttributeGroupList.forEach(template =>{
template.attributeList.forEach(te => {
this.respData.forEach(
asPro => {
if (te.id === asPro.attributeId){
this.$set(te, 'value', asPro.value)
this.fifObj.push(asPro)
}
}
)
})
})
console.log("categoryCommonElement",this.categoryCommonElement)
this.categoryCommonElement.templateAttributeList.forEach(
tem => {
this.respData.forEach(
asPro => {
if (tem.id === asPro.attributeId){
this.$set(tem, 'value', asPro.value);
this.fifObj.push(asPro)
}
}
)
}
)
this.attributeCheckedList = []
this.respData.forEach(asPro => {
if (!this.fifObj.includes(asPro)){
this.attributeCheckedList.push(asPro)
}
})
console.log("attributeCheckedList",this.attributeCheckedList)
this.attributeIdCheckedList = []
this.categoryCommonElement.attributeList.forEach(attr => {
this.attributeCheckedList.forEach(attri => {
if (attr.id == attri.attributeId){
attri.name = attr.name
this.attributeIdCheckedList.push(attr.id)
}
})
})
console.log("attributeIdCheckedList",this.attributeIdCheckedList)
}
})
}
}
}
},
@ -522,6 +570,7 @@ export default {
},
changeRule(ruleId){
this.titleList = []
console.log("list",this.ruleList)
let ruleInfo = this.ruleList.find(ruleInfo => ruleInfo.id === ruleId);
const {ruleAttrList} = ruleInfo;
let skuTotal = 1;
@ -567,15 +616,22 @@ export default {
})
}
}
if (this.respSkuList != null && this.respSkuList != [] && this.respSkuList.length>0){
for (let i = 0; i < this.respSkuList.length; i++) {
this.skuList[i].stock = this.respSkuList[i].stock
this.skuList[i].price = this.respSkuList[i].price
this.skuList[i].image = this.respSkuList[i].image
}
}
},
saveCustomAttribute(){
addAttribute({"code": this.customAttributeForm.code, "name": this.customAttributeForm.name}).then(response => {
if (response.code === 200){
// 添加逻辑
let attributeId = response.data,
code = this.customAttributeForm.code,
name = this.customAttributeForm.name,
value = this.customAttributeForm.value;
code = this.customAttributeForm.code,
name = this.customAttributeForm.name,
value = this.customAttributeForm.value;
// categoryCommonElement / attributeIdCheckedList / attributeCheckedList
this.categoryCommonElement.attributeList.push({
"id": attributeId,
@ -669,7 +725,7 @@ export default {
id: null,
name: null,
introduction: null,
mianType: null,
mainType: null,
parentType: null,
type: null,
image: null,
@ -714,23 +770,70 @@ export default {
this.reset();
const id = row.id || this.ids
getInfo(id).then(response => {
this.form = response.data;
// this.form = response.data;
console.log("response",response)
this.form = response.data.projectInfo
this.respData = response.data.asProductAttributeInfoList
this.respSkuList = response.data.projectSkuInfoList
this.categoryOptionValue = [
Number(response.data.projectInfo.mainType),
Number(response.data.projectInfo.parentType),
Number(response.data.projectInfo.type)
];
this.open = true;
this.title = "修改商品信息";
console.log("id",response.data.projectInfo.ruleId)
this.changeRule(response.data.projectInfo.ruleId)
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
let attrValueList = [];
for (const templateAttributeGroup of this.categoryCommonElement.templateAttributeGroupList) {
templateAttributeGroup.attributeList.map(attribute => attrValueList.push({id: attribute.id, value: attribute.value}))
}
this.categoryCommonElement.templateAttributeList.map(attribute => attrValueList.push({id: attribute.id, value: attribute.value}))
this.attributeCheckedList.map(attribute => attrValueList.push({id: attribute.attributeId, value: attribute.value}))
let ruleInfo = this.ruleList.find(ruleInfo => ruleInfo.id === this.form.ruleId);
const {ruleAttrList} = ruleInfo;
let ruleAttrSize = ruleAttrList.length;
let productSkuList = this.skuList.map(skuInfo => {
let sku = "";
for (let index = 0; ; index++) {
sku += skuInfo["prop"+index];
if (index+1 >= ruleAttrSize){
break;
}else {
sku += "-";
}
}
return {
sku: sku,
image: skuInfo.image,
stock: skuInfo.stock,
price: skuInfo.price
}
})
let productAddReq = {
projectAddModel: this.form,
attrValueList: attrValueList,
projectSkuList: productSkuList
};
console.log(productAddReq)
if (productAddReq.projectAddModel.id != undefined && productAddReq.projectAddModel.id != null){
productAddReq.id = productAddReq.projectAddModel.id
}
if (this.form.id != null) {
updateInfo(this.form).then(response => {
updateInfo(productAddReq).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addInfo(this.form).then(response => {
addInfo(productAddReq).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();

17
src/views/product/rule/index.vue
View File

@ -77,7 +77,12 @@
</template>
</el-table-column>
<el-table-column label="规格状态" align="center" prop="status" />
<!-- <el-table-column label="规格状态" align="center" prop="status" />-->
<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">
@ -113,6 +118,15 @@
<el-form-item label="规格名称" prop="name">
<el-input v-model="form.name" 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="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
</el-form-item>
@ -169,6 +183,7 @@ import { listRule, getRule, delRule, addRule, updateRule } from "@/api/product/r
export default {
name: "Rule",
dicts: ['sys_yes_no'],
data() {
return {
// 遮罩层

2
vue.config.js
View File

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