|
|
|
@ -1,30 +1,31 @@ |
|
|
|
<template> |
|
|
|
<div style="margin-top: 50px"> |
|
|
|
<el-form :model="value" :rules="rules" ref="productInfoForm" label-width="120px" style="width: 600px" size="small"> |
|
|
|
<el-form ref="productInfoForm" :model="value" :rules="rules" label-width="120px" style="width: 600px" size="small"> |
|
|
|
<el-form-item label="商品分类：" prop="productCategoryId"> |
|
|
|
<el-cascader |
|
|
|
change-on-select |
|
|
|
v-model="selectProductCateValue" |
|
|
|
:options="productCateOptions"> |
|
|
|
</el-cascader> |
|
|
|
change-on-select |
|
|
|
:options="productCateOptions" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="商品名称：" prop="name"> |
|
|
|
<el-input v-model="value.name"></el-input> |
|
|
|
<el-input v-model="value.name" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="副标题：" prop="subTitle"> |
|
|
|
<el-input v-model="value.subTitle"></el-input> |
|
|
|
<el-input v-model="value.subTitle" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="商品品牌：" prop="brandId"> |
|
|
|
<el-select |
|
|
|
v-model="value.brandId" |
|
|
|
placeholder="请选择品牌" |
|
|
|
@change="handleBrandChange" |
|
|
|
placeholder="请选择品牌"> |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in brandOptions" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value"> |
|
|
|
</el-option> |
|
|
|
:value="item.value" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<!-- <el-form-item label="店内分类：" prop="storeClassId"> |
|
|
|
@ -46,7 +47,7 @@ |
|
|
|
v-model="selectAreaValue" |
|
|
|
:options="areaOptions"> |
|
|
|
</el-cascader> |
|
|
|
</el-form-item> --> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="标签" prop="tags"> |
|
|
|
<el-select |
|
|
|
v-model="value.tagList" |
|
|
|
@ -64,42 +65,44 @@ |
|
|
|
:value="item.id" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-form-item> --> |
|
|
|
<el-form-item label="商品介绍："> |
|
|
|
<el-input |
|
|
|
:autoSize="true" |
|
|
|
v-model="value.description" |
|
|
|
:auto-size="true" |
|
|
|
type="textarea" |
|
|
|
placeholder="请输入内容"></el-input> |
|
|
|
placeholder="请输入内容" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="商品货号："> |
|
|
|
<el-input v-model="value.productSn"></el-input> |
|
|
|
<el-input v-model="value.productSn" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="商品售价："> |
|
|
|
<el-input v-model="value.price"></el-input> |
|
|
|
<el-input v-model="value.price" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="惠农价："> |
|
|
|
<el-input v-model="value.originalPrice"></el-input> |
|
|
|
<el-input v-model="value.originalPrice" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="商品库存："> |
|
|
|
<el-input v-model="value.stock"></el-input> |
|
|
|
<el-input v-model="value.stock" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="计量单位："> |
|
|
|
<el-select |
|
|
|
v-model="value.unit" |
|
|
|
|
|
|
|
placeholder="请选择计量单位"> |
|
|
|
placeholder="请选择计量单位" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in unitOptions" |
|
|
|
:key="item.id" |
|
|
|
:label="item.id" |
|
|
|
:value="item.id"> |
|
|
|
</el-option> |
|
|
|
:value="item.id" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="商品重量："> |
|
|
|
<el-input v-model="value.weight" style="width: 300px"></el-input> |
|
|
|
<el-input v-model="value.weight" style="width: 300px" /> |
|
|
|
<span style="margin-left: 20px">千克</span> |
|
|
|
</el-form-item> |
|
|
|
<!-- <el-form-item label="固定运费："> |
|
|
|
@ -120,7 +123,7 @@ |
|
|
|
</el-form-item> --> |
|
|
|
|
|
|
|
<el-form-item label="排序"> |
|
|
|
<el-input v-model="value.sort"></el-input> |
|
|
|
<el-input v-model="value.sort" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item style="text-align: center"> |
|
|
|
<el-button type="primary" size="medium" @click="handleNext('productInfoForm')">下一步</el-button> |
|
|
|
@ -136,11 +139,11 @@ |
|
|
|
import { fetchList as fetchBrandList } from '@/api/brand' |
|
|
|
import { fetchList as fetchStoreClassList } from '@/api/sys/sysStoreClass' |
|
|
|
|
|
|
|
import {fetchList as fetchFeightTemplateList} from '@/api/pms/feightTemplate'; |
|
|
|
import {getProduct} from '@/api/product'; |
|
|
|
import { fetchList as fetchFeightTemplateList } from '@/api/pms/feightTemplate' |
|
|
|
import { getProduct } from '@/api/product' |
|
|
|
let userRoles = [] |
|
|
|
export default { |
|
|
|
name: "ProductInfoDetail", |
|
|
|
name: 'ProductInfoDetail', |
|
|
|
props: { |
|
|
|
value: Object, |
|
|
|
isEdit: { |
|
|
|
@ -164,42 +167,42 @@ let userRoles = [] |
|
|
|
areaList: [], |
|
|
|
feightTemplateOptions: [], |
|
|
|
unitOptions: [{ |
|
|
|
id: "个", |
|
|
|
name: "个", |
|
|
|
id: '个', |
|
|
|
name: '个' |
|
|
|
}, { |
|
|
|
id: "袋", |
|
|
|
name: "袋", |
|
|
|
id: '袋', |
|
|
|
name: '袋' |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: "箱", |
|
|
|
name: "箱", |
|
|
|
id: '箱', |
|
|
|
name: '箱' |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: "条", |
|
|
|
name: "条", |
|
|
|
id: '条', |
|
|
|
name: '条' |
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
id: "盒", |
|
|
|
name: "盒", |
|
|
|
id: '盒', |
|
|
|
name: '盒' |
|
|
|
}, { |
|
|
|
id: "包", |
|
|
|
name: "包", |
|
|
|
id: '包', |
|
|
|
name: '包' |
|
|
|
}, { |
|
|
|
id: "斤", |
|
|
|
name: "斤", |
|
|
|
id: '斤', |
|
|
|
name: '斤' |
|
|
|
}, { |
|
|
|
id: "两", |
|
|
|
name: "两", |
|
|
|
id: '两', |
|
|
|
name: '两' |
|
|
|
}, { |
|
|
|
id: "件", |
|
|
|
name: "件", |
|
|
|
id: '件', |
|
|
|
name: '件' |
|
|
|
}, { |
|
|
|
id: "瓶", |
|
|
|
name: "瓶", |
|
|
|
id: '瓶', |
|
|
|
name: '瓶' |
|
|
|
}, { |
|
|
|
id: "千克", |
|
|
|
name: "千克", |
|
|
|
id: '千克', |
|
|
|
name: '千克' |
|
|
|
}], |
|
|
|
rules: { |
|
|
|
name: [ |
|
|
|
@ -213,56 +216,53 @@ let userRoles = [] |
|
|
|
description: [{ required: true, message: '请输入商品介绍', trigger: 'blur' }], |
|
|
|
requiredProp: [{ required: true, message: '该项为必填项', trigger: 'blur' }] |
|
|
|
} |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
this.getProductCateList(); |
|
|
|
this.getAreaList(); |
|
|
|
this.getBrandList(); |
|
|
|
this.getTagList(); |
|
|
|
this.getFeightTemplateList(); |
|
|
|
this.getStoreClassList(); |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
// 商品的编号 |
|
|
|
productId() { |
|
|
|
return this.value.id; |
|
|
|
return this.value.id |
|
|
|
} |
|
|
|
}, |
|
|
|
watch: { |
|
|
|
productId: function(newValue) { |
|
|
|
if(!this.isEdit)return; |
|
|
|
if(this.hasEditCreated)return; |
|
|
|
if (!this.isEdit) return |
|
|
|
if (this.hasEditCreated) return |
|
|
|
console.log(newValue) |
|
|
|
if(newValue===undefined||newValue==null||newValue===0)return; |
|
|
|
this.handleEditCreated(); |
|
|
|
if (newValue === undefined || newValue == null || newValue === 0) return |
|
|
|
this.handleEditCreated() |
|
|
|
}, |
|
|
|
selectProductCateValue: function(newValue) { |
|
|
|
if (newValue != null) { |
|
|
|
this.value.productCategoryId = newValue[newValue.length-1 >0?newValue.length-1:0]; |
|
|
|
this.value.productCategoryName= this.getCateNameById(this.value.productCategoryId); |
|
|
|
this.value.productCategoryId = newValue[newValue.length - 1 > 0 ? newValue.length - 1 : 0] |
|
|
|
this.value.productCategoryName = this.getCateNameById(this.value.productCategoryId) |
|
|
|
} else { |
|
|
|
this.value.productCategoryId = null; |
|
|
|
this.value.productCategoryName=null; |
|
|
|
this.value.productCategoryId = null |
|
|
|
this.value.productCategoryName = null |
|
|
|
} |
|
|
|
}, |
|
|
|
selectAreaValue: function(newValue) { |
|
|
|
|
|
|
|
if (newValue != null) { |
|
|
|
console.log(newValue) |
|
|
|
this.value.areaId = newValue[newValue.length-1 >0?newValue.length-1:0]; |
|
|
|
this.value.areaId = newValue[newValue.length - 1 > 0 ? newValue.length - 1 : 0] |
|
|
|
getArea(this.value.areaId).then(response => { |
|
|
|
this.value.areaName = response.data.name; |
|
|
|
}); |
|
|
|
this.value.areaName = response.data.name |
|
|
|
}) |
|
|
|
} else { |
|
|
|
this.value.areaId = null; |
|
|
|
this.value.areaName=null; |
|
|
|
this.value.areaId = null |
|
|
|
this.value.areaName = null |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
created() { |
|
|
|
this.getProductCateList() |
|
|
|
// this.getAreaList() |
|
|
|
this.getBrandList() |
|
|
|
// this.getTagList() |
|
|
|
// this.getFeightTemplateList() |
|
|
|
// this.getStoreClassList() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
changeRole(value) { |
|
|
|
userRoles = [] |
|
|
|
@ -288,23 +288,21 @@ let userRoles = [] |
|
|
|
}, |
|
|
|
// 处理编辑逻辑 |
|
|
|
handleEditCreated() { |
|
|
|
|
|
|
|
console.log(this.value) |
|
|
|
|
|
|
|
if (this.value.productCategoryId != null) { |
|
|
|
let seleval = [] |
|
|
|
seleval.push(this.value.cateParentId); |
|
|
|
seleval.push(this.value.productCategoryId); |
|
|
|
const seleval = [] |
|
|
|
seleval.push(this.value.cateParentId) |
|
|
|
seleval.push(this.value.productCategoryId) |
|
|
|
this.selectProductCateValue = seleval |
|
|
|
// this.selectProductCateValue.push(this.value.cateParentId); |
|
|
|
// this.selectProductCateValue.push(this.value.productCategoryId); |
|
|
|
} |
|
|
|
if (this.value.areaId != null) { |
|
|
|
getArea(this.value.areaId).then(response => { |
|
|
|
this.selectAreaValue.push(response.data.pid); |
|
|
|
this.selectAreaValue.push(this.value.areaId); |
|
|
|
}); |
|
|
|
|
|
|
|
this.selectAreaValue.push(response.data.pid) |
|
|
|
this.selectAreaValue.push(this.value.areaId) |
|
|
|
}) |
|
|
|
} |
|
|
|
console.log(this.selectAreaValue) |
|
|
|
userRoles = [] |
|
|
|
@ -317,114 +315,111 @@ let userRoles = [] |
|
|
|
}) |
|
|
|
console.log(this.value.tagList) |
|
|
|
this.value.tagList = roles |
|
|
|
this.hasEditCreated=true; |
|
|
|
this.hasEditCreated = true |
|
|
|
}, |
|
|
|
|
|
|
|
getAreaList() { |
|
|
|
|
|
|
|
fetchAreaListWithChildren().then(response => { |
|
|
|
let list = response.data; |
|
|
|
this.areaList=list; |
|
|
|
this.areaOptions = []; |
|
|
|
const list = response.data |
|
|
|
this.areaList = list |
|
|
|
this.areaOptions = [] |
|
|
|
for (let i = 0; i < list.length; i++) { |
|
|
|
let children = []; |
|
|
|
const children = [] |
|
|
|
if (list[i].children != null && list[i].children.length > 0) { |
|
|
|
for (let j = 0; j < list[i].children.length; j++) { |
|
|
|
children.push({label: list[i].children[j].name, value: list[i].children[j].id}); |
|
|
|
children.push({ label: list[i].children[j].name, value: list[i].children[j].id }) |
|
|
|
} |
|
|
|
} |
|
|
|
this.areaOptions.push({label: list[i].name, value: list[i].id, children: children}); |
|
|
|
this.areaOptions.push({ label: list[i].name, value: list[i].id, children: children }) |
|
|
|
} |
|
|
|
}); |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
getCateNameById(id) { |
|
|
|
let name=null; |
|
|
|
let name = null |
|
|
|
for (let i = 0; i < this.productCateOptions.length; i++) { |
|
|
|
for (let j = 0; j < this.productCateOptions[i].children.length; j++) { |
|
|
|
if (this.productCateOptions[i].children[j].value && this.productCateOptions[i].children[j].value != undefined && this.productCateOptions[i].children[j].value === id) { |
|
|
|
name=this.productCateOptions[i].children[j].label; |
|
|
|
return name; |
|
|
|
name = this.productCateOptions[i].children[j].label |
|
|
|
return name |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
return name; |
|
|
|
return name |
|
|
|
}, |
|
|
|
getProductCateList() { |
|
|
|
fetchListWithChildren().then(response => { |
|
|
|
let list = response.data; |
|
|
|
this.productCateOptions = []; |
|
|
|
const list = response.data |
|
|
|
this.productCateOptions = [] |
|
|
|
for (let i = 0; i < list.length; i++) { |
|
|
|
let children = []; |
|
|
|
const children = [] |
|
|
|
if (list[i].children != null && list[i].children.length > 0) { |
|
|
|
for (let j = 0; j < list[i].children.length; j++) { |
|
|
|
children.push({label: list[i].children[j].name, value: list[i].children[j].id}); |
|
|
|
children.push({ label: list[i].children[j].name, value: list[i].children[j].id }) |
|
|
|
} |
|
|
|
} |
|
|
|
this.productCateOptions.push({label: list[i].name, value: list[i].id, children: children}); |
|
|
|
this.productCateOptions.push({ label: list[i].name, value: list[i].id, children: children }) |
|
|
|
} |
|
|
|
}); |
|
|
|
}) |
|
|
|
}, |
|
|
|
getFeightTemplateList() { |
|
|
|
fetchFeightTemplateList({ pageNum: 1, pageSize: 100 }).then(response => { |
|
|
|
this.feightTemplateOptions = []; |
|
|
|
let feightTemplateList = response.data.records; |
|
|
|
this.feightTemplateOptions = [] |
|
|
|
const feightTemplateList = response.data.records |
|
|
|
for (let i = 0; i < feightTemplateList.length; i++) { |
|
|
|
this.feightTemplateOptions.push({label: feightTemplateList[i].name, value: feightTemplateList[i].id}); |
|
|
|
this.feightTemplateOptions.push({ label: feightTemplateList[i].name, value: feightTemplateList[i].id }) |
|
|
|
} |
|
|
|
}); |
|
|
|
}) |
|
|
|
}, |
|
|
|
getBrandList() { |
|
|
|
fetchBrandList({ pageNum: 1, pageSize: 100 }).then(response => { |
|
|
|
this.brandOptions = []; |
|
|
|
let brandList = response.data.records; |
|
|
|
this.brandOptions = [] |
|
|
|
const brandList = response.data.records |
|
|
|
for (let i = 0; i < brandList.length; i++) { |
|
|
|
this.brandOptions.push({label: brandList[i].name, value: brandList[i].id}); |
|
|
|
this.brandOptions.push({ label: brandList[i].name, value: brandList[i].id }) |
|
|
|
} |
|
|
|
}); |
|
|
|
}) |
|
|
|
}, |
|
|
|
getStoreClassList() { |
|
|
|
fetchStoreClassList({ pageNum: 1, pageSize: 100 }).then(response => { |
|
|
|
this.storeClassOptions = []; |
|
|
|
let brandList = response.data.records; |
|
|
|
this.storeClassOptions = [] |
|
|
|
const brandList = response.data.records |
|
|
|
for (let i = 0; i < brandList.length; i++) { |
|
|
|
this.storeClassOptions.push({label: brandList[i].name, value: brandList[i].id}); |
|
|
|
this.storeClassOptions.push({ label: brandList[i].name, value: brandList[i].id }) |
|
|
|
} |
|
|
|
}); |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
getTagList() { |
|
|
|
fetchTagList({ pageNum: 1, pageSize: 100, type: 2, status: 1 }).then(response => { |
|
|
|
this.TagList = response.data.records; |
|
|
|
}); |
|
|
|
this.TagList = response.data.records |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
handleNext(formName) { |
|
|
|
this.$refs[formName].validate((valid) => { |
|
|
|
if (valid) { |
|
|
|
this.$emit('nextStep'); |
|
|
|
this.$emit('nextStep') |
|
|
|
} else { |
|
|
|
this.$message({ |
|
|
|
message: '验证失败', |
|
|
|
type: 'error', |
|
|
|
duration: 1000 |
|
|
|
}); |
|
|
|
return false; |
|
|
|
}) |
|
|
|
return false |
|
|
|
} |
|
|
|
}); |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
handleBrandChange(val) { |
|
|
|
let brandName = ''; |
|
|
|
let brandName = '' |
|
|
|
for (let i = 0; i < this.brandOptions.length; i++) { |
|
|
|
if (this.brandOptions[i].value === val) { |
|
|
|
brandName = this.brandOptions[i].label; |
|
|
|
break; |
|
|
|
brandName = this.brandOptions[i].label |
|
|
|
break |
|
|
|
} |
|
|
|
} |
|
|
|
this.value.brandName = brandName; |
|
|
|
this.value.brandName = brandName |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
liupopo
1 year ago