|
|
|
@ -21,7 +21,7 @@ |
|
|
|
|
<el-row v-show="currentTab === 0" :gutter="24"> |
|
|
|
|
<!-- 商品信息--> |
|
|
|
|
<el-col v-bind="grid2"> |
|
|
|
|
<el-form-item label="商品分类:" prop="categorys" :rules="[{ required: true, message: '请选择商品分类', trigger: ['blur'] }]"> |
|
|
|
|
<el-form-item label="商品分类:" prop="categorys" :rules="[{ required: true, message: '请选择商品分类', trigger: ['change'] }]"> |
|
|
|
|
<el-cascader |
|
|
|
|
@change="cascaderChange" |
|
|
|
|
v-model="formValidate.categorys" |
|
|
|
@ -35,7 +35,7 @@ |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col v-bind="grid2"> |
|
|
|
|
<el-form-item label="商品名称:" prop="productName" :rules="[{ required: true, message: '请输入商品名称', trigger: ['blur'] }]"> |
|
|
|
|
<el-form-item label="商品名称:" prop="productName" :rules="[{ required: true, message: '请输入商品名称', trigger: ['change'] }]"> |
|
|
|
|
<el-input v-model="formValidate.productName" maxlength="249" placeholder="请输入商品名称" :disabled="isDisabled" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
@ -45,7 +45,7 @@ |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col v-bind="grid2"> |
|
|
|
|
<el-form-item label="商品品牌:" prop="brandId" :rules="[{ required: true, message: '请选择商品品牌', trigger: ['blur'] }]"> |
|
|
|
|
<el-form-item label="商品品牌:" prop="brandId" :rules="[{ required: true, message: '请选择商品品牌', trigger: ['change'] }]"> |
|
|
|
|
<el-select style="width: 100%;" v-model="formValidate.brandId" placeholder="请选择"> |
|
|
|
|
<el-option v-for="item in brandOptions" :key="item.id" :label="item.brandName" :value="item.id"> </el-option> |
|
|
|
|
</el-select> |
|
|
|
@ -57,12 +57,12 @@ |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col v-bind="grid2"> |
|
|
|
|
<el-form-item label="商品售价" prop="price" :rules="[{ required: true, message: '请输入商品售价', trigger: ['blur'] }]"> |
|
|
|
|
<el-form-item label="商品售价" prop="price" :rules="[{ required: true, message: '请输入商品售价', trigger: ['change'] }]"> |
|
|
|
|
<el-input v-model="formValidate.price" maxlength="249" type="number" placeholder="请输入商品售价" :disabled="isDisabled" /> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col v-bind="grid2"> |
|
|
|
|
<el-form-item label="商品类型:" prop="productType" :rules="[{ required: true, message: '请选择商品类型', trigger: ['blur'] }]"> |
|
|
|
|
<el-form-item label="商品类型:" prop="productType" :rules="[{ required: true, message: '请选择商品类型', trigger: ['change'] }]"> |
|
|
|
|
<el-select style="width: 100%;" v-model="formValidate.productType" placeholder="请选择商品类型"> |
|
|
|
|
<el-option label="店铺商品" value="2"> </el-option> |
|
|
|
|
<el-option label="平台商品" value="1"> </el-option> |
|
|
|
@ -76,7 +76,7 @@ |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> --> |
|
|
|
|
<el-col v-bind="grid2"> |
|
|
|
|
<el-form-item label="自提油站" prop="siteIds"> |
|
|
|
|
<el-form-item label="自提油站" prop="siteIds" :rules="[{ validator: validateSiteIds, trigger: ['change'] }]"> |
|
|
|
|
<el-tag |
|
|
|
|
style="margin-left: 10px;" |
|
|
|
|
:key="tagIndex" |
|
|
|
@ -125,11 +125,7 @@ |
|
|
|
|
</el-col> --> |
|
|
|
|
<!-- 多规格添加--> |
|
|
|
|
<el-col v-if="!isDisabled" :span="24" class="noForm"> |
|
|
|
|
<el-form-item |
|
|
|
|
label="选择规格:" |
|
|
|
|
prop="attributesTypeId" |
|
|
|
|
:rules="[{ required: true, message: '请选择规格', trigger: ['blur'] }]" |
|
|
|
|
> |
|
|
|
|
<el-form-item label="选择规格:" prop="attributesTypeId" :rules="[{ required: true, message: '请选择规格', trigger: ['blur'] }]"> |
|
|
|
|
<div class="acea-row"> |
|
|
|
|
<el-select v-model="formValidate.attributesTypeId"> |
|
|
|
|
<el-option v-for="item in ruleList" :key="item.id" :label="item.name" :value="item.id" /> |
|
|
|
@ -201,7 +197,15 @@ |
|
|
|
|
<el-button type="default" @click="showAllSku()" :disabled="isDisabled">展示</el-button> |
|
|
|
|
</el-form-item> --> |
|
|
|
|
<!-- 多规格表格--> |
|
|
|
|
<el-form-item v-if="formValidate.attr.length > 0" label="商品属性:" class="labeltop" :class="isDisabled ? 'disLabel' : 'disLabelmoren'"> |
|
|
|
|
<el-form-item |
|
|
|
|
v-if="formValidate.attr.length > 0" |
|
|
|
|
label="商品属性:" |
|
|
|
|
class="labeltop" |
|
|
|
|
:class="isDisabled ? 'disLabel' : 'disLabelmoren'" |
|
|
|
|
prop="attr" |
|
|
|
|
:rules="[{ validator: validateAttr, trigger: ['change'] }]" |
|
|
|
|
> |
|
|
|
|
<!-- :rules="[{ validator: validateAttr, trigger: ['blur'] }]" --> |
|
|
|
|
<el-table :data="ManyAttrValue" border class="tabNumWidth" size="mini"> |
|
|
|
|
<template v-if="manyTabDate"> |
|
|
|
|
<el-table-column v-for="item in manyTabDate" :key="item" align="center" :label="item" min-width="80"> |
|
|
|
@ -328,7 +332,13 @@ |
|
|
|
|
</el-card> |
|
|
|
|
<CreatTemplates ref="addTemplates" @getList="getShippingList" /> |
|
|
|
|
<el-dialog width="80%" title="选择油站" :visible.sync="isOilStationSelection"> |
|
|
|
|
<OilStationSelection :product-id="this.$route.query.id" ref="selectSites" :OilStationSelectionList="OilStationSelectionList" @submit="oilStationSelectionSubmit"> </OilStationSelection> |
|
|
|
|
<OilStationSelection |
|
|
|
|
:product-id="this.$route.query.id" |
|
|
|
|
ref="selectSites" |
|
|
|
|
:OilStationSelectionList="OilStationSelectionList" |
|
|
|
|
@submit="oilStationSelectionSubmit" |
|
|
|
|
> |
|
|
|
|
</OilStationSelection> |
|
|
|
|
</el-dialog> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
@ -407,7 +417,30 @@ export default { |
|
|
|
|
name: 'ProductProductAdd', |
|
|
|
|
components: { Templates, CreatTemplates, Tinymce, CustomUpload, OilStationSelection }, |
|
|
|
|
data() { |
|
|
|
|
const validateSiteIds = (rule, value, callback) => { |
|
|
|
|
let siteIds = this.OilStationSelectionList.map(item => item.siteId) |
|
|
|
|
if (siteIds.length == 0) { |
|
|
|
|
callback('请选择油站') |
|
|
|
|
} |
|
|
|
|
callback() |
|
|
|
|
} |
|
|
|
|
const validateAttr = (rule, value, callback) => { |
|
|
|
|
// SKU编号,即"skuNum",不需要手填,提交后会自动生成,因此此处略过校验 |
|
|
|
|
let length = this.attrValue.length - 1 |
|
|
|
|
let isCan = this.ManyAttrValue.every(item => { |
|
|
|
|
// 此处返回已填的值 通过长度来判断是否都填了 |
|
|
|
|
let _length = this.attrValue.filter(_item => { |
|
|
|
|
let key = _item.value |
|
|
|
|
if (key != 'skuNum' && item[key]) return _item |
|
|
|
|
}).length |
|
|
|
|
return length != _length |
|
|
|
|
}) |
|
|
|
|
if (isCan) callback('商品属性不可存在空') |
|
|
|
|
callback() |
|
|
|
|
} |
|
|
|
|
return { |
|
|
|
|
validateSiteIds, |
|
|
|
|
validateAttr, |
|
|
|
|
loading: false, |
|
|
|
|
OilStationSelectionList: [], |
|
|
|
|
isOilStationSelection: false, |
|
|
|
@ -529,7 +562,6 @@ export default { |
|
|
|
|
{ |
|
|
|
|
label: 'SKU编号', |
|
|
|
|
name: 'SKU编号', |
|
|
|
|
|
|
|
|
|
value: 'skuNum' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
@ -552,14 +584,14 @@ export default { |
|
|
|
|
if (from.path == '/productList' && to.params.id) { |
|
|
|
|
this.chenkId() |
|
|
|
|
} |
|
|
|
|
console.log(from.path) //从哪来 |
|
|
|
|
console.log(to.path, to.params) //到哪去 |
|
|
|
|
// console.log(from.path) //从哪来 |
|
|
|
|
// console.log(to.path, to.params) //到哪去 |
|
|
|
|
}, |
|
|
|
|
'formValidate.content': function(n) { }, |
|
|
|
|
ManyAttrValue(n) {}, |
|
|
|
|
// 'formValidate.content': function(n) {}, |
|
|
|
|
// ManyAttrValue(n) {}, |
|
|
|
|
'formValidate.attr': { |
|
|
|
|
handler: function(val,o) { |
|
|
|
|
if (this.isAttr) this.watCh(val,o) //重要!!! |
|
|
|
|
handler: function(val, o) { |
|
|
|
|
if (this.isAttr) this.watCh(val, o) //重要!!! |
|
|
|
|
}, |
|
|
|
|
immediate: false, |
|
|
|
|
deep: true |
|
|
|
@ -573,8 +605,8 @@ export default { |
|
|
|
|
}, |
|
|
|
|
mounted() {}, |
|
|
|
|
deactivated() { |
|
|
|
|
this.$destroy(); |
|
|
|
|
}, |
|
|
|
|
this.$destroy() |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
async chenkId() { |
|
|
|
|
if (this.$route.query && this.$route.query.id) { |
|
|
|
@ -587,14 +619,14 @@ export default { |
|
|
|
|
return productApi.productAddGetSites(id) |
|
|
|
|
}) |
|
|
|
|
).then(res => { |
|
|
|
|
console.log(res, 'productAddGetSites') |
|
|
|
|
// console.log(res, 'productAddGetSites') |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
async inverseAnalysis(data) { |
|
|
|
|
let { categoryOneId, categoryTwoId } = data; |
|
|
|
|
let categorys = [categoryOneId, categoryTwoId]; |
|
|
|
|
this.OilStationSelectionList = data.siteInfos; |
|
|
|
|
this.formValidate = { |
|
|
|
|
let { categoryOneId, categoryTwoId } = data |
|
|
|
|
let categorys = [categoryOneId, categoryTwoId] |
|
|
|
|
this.OilStationSelectionList = data.siteInfos |
|
|
|
|
this.formValidate = { |
|
|
|
|
...this.formValidate, |
|
|
|
|
categorys, |
|
|
|
|
...data |
|
|
|
@ -607,7 +639,8 @@ export default { |
|
|
|
|
this.$refs.CustomLBUpload.fileList = [...this.formValidate.images.filter(item => item.mainMark != '1')] |
|
|
|
|
await this.confirm() |
|
|
|
|
this.$nextTick(() => { |
|
|
|
|
this.formValidate.attr = this.formValidate.attr.map(item => { |
|
|
|
|
this.formValidate.attr = this.formValidate.attr |
|
|
|
|
.map(item => { |
|
|
|
|
let align = this.formValidate.checkedList.find(i => item.id == i.attributeId) |
|
|
|
|
if (align) { |
|
|
|
|
return { |
|
|
|
@ -620,34 +653,35 @@ export default { |
|
|
|
|
} else { |
|
|
|
|
return null |
|
|
|
|
} |
|
|
|
|
}).filter(item => item); |
|
|
|
|
}) |
|
|
|
|
.filter(item => item) |
|
|
|
|
setTimeout(() => { |
|
|
|
|
this.ManyAttrValue.forEach((item, index) => { |
|
|
|
|
let data = this.formValidate.stockList.find(i => i.attributeJson == JSON.stringify(item.data)); |
|
|
|
|
let data = this.formValidate.stockList.find(i => i.attributeJson == JSON.stringify(item.data)) |
|
|
|
|
if (data) { |
|
|
|
|
Object.assign(item, data,{delect:false}) |
|
|
|
|
}else{ |
|
|
|
|
Object.assign(item, data,{delect:true}) |
|
|
|
|
Object.assign(item, data, { delect: false }) |
|
|
|
|
} else { |
|
|
|
|
Object.assign(item, data, { delect: true }) |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
this.ManyAttrValue = this.ManyAttrValue.filter(item=>!item.delect) |
|
|
|
|
this.ManyAttrValue = this.ManyAttrValue.filter(item => !item.delect) |
|
|
|
|
}, 1000) |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
async getproductInfo(id) { |
|
|
|
|
await productApi.productAddGetEdit(id).then( async res => { |
|
|
|
|
await productApi.productAddGetEdit(id).then(async res => { |
|
|
|
|
if (res.code == 20000) { |
|
|
|
|
await this.inverseAnalysis(res.data) |
|
|
|
|
await this.inverseAnalysis(res.data) |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
setPreferred(setPreferred) { |
|
|
|
|
console.log(setPreferred, 'setPreferred') |
|
|
|
|
// console.log(setPreferred, 'setPreferred') |
|
|
|
|
}, |
|
|
|
|
delectOilStationSelectionList(e, index) { |
|
|
|
|
this.OilStationSelectionList.splice(index, 1) |
|
|
|
|
if (this.$refs.selectSites&&this.$refs.selectSites.checkedSites){ |
|
|
|
|
this.$refs.selectSites.checkedSites = this.$refs.selectSites.checkedSites.filter(site => e.siteId !== site.siteId); |
|
|
|
|
if (this.$refs.selectSites && this.$refs.selectSites.checkedSites) { |
|
|
|
|
this.$refs.selectSites.checkedSites = this.$refs.selectSites.checkedSites.filter(site => e.siteId !== site.siteId) |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
oilStationSelectionSubmit(e) { |
|
|
|
@ -655,7 +689,7 @@ export default { |
|
|
|
|
this.isOilStationSelection = false |
|
|
|
|
this.formValidate.siteIds = e.map(item => item.siteId) |
|
|
|
|
}, |
|
|
|
|
async brandGetAll() { |
|
|
|
|
async brandGetAll() { |
|
|
|
|
await productApi.brandGetAll().then(res => { |
|
|
|
|
if (res.code == 20000) { |
|
|
|
|
this.brandOptions = res.data |
|
|
|
@ -663,7 +697,7 @@ export default { |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
cascaderChange(e) { |
|
|
|
|
console.log(e, 'cascaderChange') |
|
|
|
|
// console.log(e, 'cascaderChange') |
|
|
|
|
}, |
|
|
|
|
// 校验输入框不能输入0,保留2位小数,库存为正整数 |
|
|
|
|
keyupEvent(key, val, index, num) { |
|
|
|
@ -730,22 +764,24 @@ export default { |
|
|
|
|
this.checkboxGroup.includes('isHot') ? (this.formValidate.isHot = true) : (this.formValidate.isHot = false) |
|
|
|
|
}, |
|
|
|
|
// sku算法 |
|
|
|
|
watCh(val,o) { |
|
|
|
|
watCh(val, o) { |
|
|
|
|
let arr = [] |
|
|
|
|
this.manyTabDate = [] |
|
|
|
|
for (let i = 0; i < val.length; i++) { |
|
|
|
|
arr.push(val[i].sku) |
|
|
|
|
this.manyTabDate.push(val[i].sku.name) |
|
|
|
|
} |
|
|
|
|
console.log('this.manyTabDate', this.manyTabDate) |
|
|
|
|
// console.log('arr', arr) |
|
|
|
|
this.ManyAttrValue = arr.reduce( |
|
|
|
|
(a, b, c) => { |
|
|
|
|
(prev, cur) => { |
|
|
|
|
let res = [] |
|
|
|
|
a.map(x => { |
|
|
|
|
b.value.map(y => { |
|
|
|
|
prev.map(item => { |
|
|
|
|
cur.value.map(_item => { |
|
|
|
|
res.push({ |
|
|
|
|
...x, |
|
|
|
|
[b.name]: y, |
|
|
|
|
data: Object.assign({}, x.data || {}, { [b.name]: y }), |
|
|
|
|
...item, |
|
|
|
|
[cur.name]: _item, |
|
|
|
|
data: Object.assign({}, item.data || {}, { [cur.name]: _item }), |
|
|
|
|
...Object.fromEntries( |
|
|
|
|
this.attrValue.map(item => { |
|
|
|
|
return [item.value, ''] |
|
|
|
@ -757,8 +793,8 @@ export default { |
|
|
|
|
return res |
|
|
|
|
}, |
|
|
|
|
[{}] |
|
|
|
|
); |
|
|
|
|
console.log(this.ManyAttrValue ,"this.ManyAttrValue ") |
|
|
|
|
) |
|
|
|
|
console.log(this.ManyAttrValue, 'this.ManyAttrValue ') |
|
|
|
|
}, |
|
|
|
|
attrFormat(arr) { |
|
|
|
|
let data = [] |
|
|
|
@ -860,10 +896,12 @@ export default { |
|
|
|
|
} |
|
|
|
|
await this.productGetRule() |
|
|
|
|
this.formValidate.attr = JSON.parse(JSON.stringify(this.ruleList.find(item => item.id == this.formValidate.attributesTypeId).attributesList)) |
|
|
|
|
// console.log('this.formValidate.attr ', this.formValidate.attr) |
|
|
|
|
} |
|
|
|
|
// console.log('this.attrValue', this.attrValue) |
|
|
|
|
}, |
|
|
|
|
// 商品分类; |
|
|
|
|
async getCategorySelect() { |
|
|
|
|
async getCategorySelect() { |
|
|
|
|
await productApi.getClassificationTree().then(res => { |
|
|
|
|
if (res.code == 20000) { |
|
|
|
|
this.merCateList = res.data |
|
|
|
@ -940,7 +978,7 @@ export default { |
|
|
|
|
batchAdd() { |
|
|
|
|
// if (!this.oneFormBatch[0].pic || !this.oneFormBatch[0].price || !this.oneFormBatch[0].cost || !this.oneFormBatch[0].ot_price || |
|
|
|
|
// !this.oneFormBatch[0].stock || !this.oneFormBatch[0].bar_code) return this.$Message.warning('请填写完整的批量设置内容!'); |
|
|
|
|
console.log(this.ManyAttrValue, this.oneFormBatch, ' this.ManyAttrValue') |
|
|
|
|
// console.log(this.ManyAttrValue, this.oneFormBatch, ' this.ManyAttrValue') |
|
|
|
|
this.ManyAttrValue.forEach(item => { |
|
|
|
|
Object.assign(item, this.oneFormBatch[0]) |
|
|
|
|
}) |
|
|
|
@ -972,7 +1010,6 @@ export default { |
|
|
|
|
} else { |
|
|
|
|
item.splice(index, 1) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
// 添加规则名称 |
|
|
|
|
createAttrName() { |
|
|
|
@ -1184,8 +1221,8 @@ export default { |
|
|
|
|
if (this.currentTab-- < 0) this.currentTab = 0 |
|
|
|
|
}, |
|
|
|
|
handleSubmitNest(name) { |
|
|
|
|
console.log(this.formValidate,"handleSubmitNest") |
|
|
|
|
if (this.formValidate.attr<1){ |
|
|
|
|
// console.log(this.formValidate, 'handleSubmitNest') |
|
|
|
|
if (this.formValidate.attr < 1) { |
|
|
|
|
this.$message.error('规格属性不能为空') |
|
|
|
|
return |
|
|
|
|
} |
|
|
|
@ -1193,17 +1230,17 @@ export default { |
|
|
|
|
if (valid) { |
|
|
|
|
if (this.currentTab++ > 2) this.currentTab = 0 |
|
|
|
|
} else { |
|
|
|
|
if ( |
|
|
|
|
!this.formValidate.store_name || |
|
|
|
|
!this.formValidate.cate_id || |
|
|
|
|
!this.formValidate.keyword || |
|
|
|
|
!this.formValidate.unit_name || |
|
|
|
|
!this.formValidate.store_info || |
|
|
|
|
!this.formValidate.image || |
|
|
|
|
!this.formValidate.slider_image |
|
|
|
|
) { |
|
|
|
|
this.$message.warning('请填写完整商品信息!') |
|
|
|
|
} |
|
|
|
|
// if ( |
|
|
|
|
// !this.formValidate.store_name || |
|
|
|
|
// !this.formValidate.cate_id || |
|
|
|
|
// !this.formValidate.keyword || |
|
|
|
|
// !this.formValidate.unit_name || |
|
|
|
|
// !this.formValidate.store_info || |
|
|
|
|
// !this.formValidate.image || |
|
|
|
|
// !this.formValidate.slider_image |
|
|
|
|
// ) { |
|
|
|
|
// this.$message.warning('请填写完整商品信息!') |
|
|
|
|
// } |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
@ -1215,10 +1252,10 @@ export default { |
|
|
|
|
let [categoryOneId, categoryTwoId] = this.formValidate.categorys |
|
|
|
|
let isRecommendOrNewMark = this.formValidate.recommendOrNewMark == '1' ? 'newMark' : 'recommend' |
|
|
|
|
let siteIds = this.OilStationSelectionList.map(item => item.siteId) |
|
|
|
|
if(siteIds.length==0){ |
|
|
|
|
this.$message.error('请选择油站') |
|
|
|
|
return |
|
|
|
|
} |
|
|
|
|
// if (siteIds.length == 0) { |
|
|
|
|
// this.$message.error('请选择油站') |
|
|
|
|
// return |
|
|
|
|
// } |
|
|
|
|
let checkedList = this.formValidate.attr.map(item => { |
|
|
|
|
let attributeId = item.id |
|
|
|
|
let checked = item.sku.value.join(',') |
|
|
|
@ -1261,7 +1298,8 @@ export default { |
|
|
|
|
if (res.code == 20000) { |
|
|
|
|
this.$message.success('操作成功') |
|
|
|
|
setTimeout(() => { |
|
|
|
|
this.$router.push({ path: 'productList', query: { refresh: true }}) |
|
|
|
|
this.$bus.$emit('productRefresh') |
|
|
|
|
this.$router.push({ path: 'productList', query: { refresh: true } }) |
|
|
|
|
// this.$destroy() |
|
|
|
|
}, 1000) |
|
|
|
|
} |
|
|
|
|