更新多规格商品的添加/编辑
This commit is contained in:
parent
91ada60e6f
commit
fec01de9c0
|
@ -545,7 +545,7 @@
|
|||
// 创建商品
|
||||
submitCreatedGoods() {
|
||||
console.log('创建商品');
|
||||
return console.log('商品规格', this.setFormData.attr);
|
||||
// return console.log('商品规格', this.setFormData.attr);
|
||||
console.log('是否推荐', this.$refs.commodityRef.addGoodsSecoundData);
|
||||
console.log('商品详情', this.$refs.commodityRef.goodsDis, this.$refs.commodityRef.store_name);
|
||||
if(this.setFormData.spec_type==0){
|
||||
|
@ -610,6 +610,8 @@
|
|||
changeSpecType2(){
|
||||
this.showSpecType = false;
|
||||
this.setFormData.spec_type = this.spec_type + '';
|
||||
this.setFormData.attrValue = [];
|
||||
this.setFormData.attr = [];
|
||||
},
|
||||
// 跳转多规格页面
|
||||
navToSpecGood(){
|
||||
|
@ -621,8 +623,9 @@
|
|||
attrValue: JSON.parse(JSON.stringify(this.setFormData.attrValue)),
|
||||
attr: JSON.parse(JSON.stringify(this.setFormData.attr))
|
||||
});
|
||||
uni.$once('updateSpecType', (attr)=>{
|
||||
this.setFormData.attrValue = JSON.parse(JSON.stringify(attr));
|
||||
uni.$once('updateSpecType', (e)=>{
|
||||
this.setFormData.attrValue = JSON.parse(JSON.stringify(e.attrValue));
|
||||
this.setFormData.attr = JSON.parse(JSON.stringify(e.attr));
|
||||
})
|
||||
}
|
||||
})
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="page">
|
||||
<view class="mode">
|
||||
<view class="line">
|
||||
<view class="title">规格模板</view>
|
||||
|
@ -12,7 +12,7 @@
|
|||
<view class="line-warp">
|
||||
|
||||
</view>
|
||||
<view class="btn-box" @click="test()">
|
||||
<view class="btn-box" @click="settingSpec()">
|
||||
<view class="btn">点击设置规格</view>
|
||||
</view>
|
||||
<uni-popup ref="modeRef" type="top">
|
||||
|
@ -32,6 +32,10 @@
|
|||
<view class="delete-spec" @click="deleteAttrOne(index)"><uni-icons type="close" color="#f84221"
|
||||
style="margin-right: 10rpx;"></uni-icons>删除规格</view>
|
||||
</view>
|
||||
<view v-if="attr.length==0" style="color: #ccc;height: 220rpx;text-align: center;display: flex;flex-direction: column;justify-content: center;align-items: center;">
|
||||
<view>暂无规格</view>
|
||||
<view>点击下方按钮添加新规格</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="tab">
|
||||
<view class="add-btn" @click="addSpecOne()">添加新规格</view>
|
||||
|
@ -59,7 +63,7 @@
|
|||
</avatar>
|
||||
<block v-for="(item,index) in attrValue" :key="item.uuid">
|
||||
<view class="popup_group head_close">
|
||||
<view class="popup_group_item " v-for="(value, key) in item.detail" :key="value">
|
||||
<view class="popup_group_item " v-for="(value, key) in item.detail" :key="key">
|
||||
<view class="popup_group_item_label">{{key}}</view>
|
||||
<view class="popup_group_item_value">
|
||||
<input :value="value" type="text" disabled placeholder="请填写规格名称" />
|
||||
|
@ -90,7 +94,7 @@
|
|||
@updateCode="updateCode" :show_sku="true">
|
||||
</priceComponent>
|
||||
</block>
|
||||
<button class="add_btn" @click="addAttrValue">点击添加规格</button>
|
||||
<!-- <button class="add_btn" @click="addAttrValue">点击添加规格</button> -->
|
||||
<view class="submit">
|
||||
<button class="btn" @click="submitAttr">确认<text>({{attrValue.length}})</text></button>
|
||||
</view>
|
||||
|
@ -116,6 +120,18 @@
|
|||
return {
|
||||
attrValue: [],
|
||||
attr: [],
|
||||
attr_mode: {
|
||||
"detail": {},
|
||||
"sku": "",
|
||||
"stock": 0,
|
||||
"image": "",
|
||||
"bar_code": "",
|
||||
"cost": "",
|
||||
"ot_price": "",
|
||||
"price": "",
|
||||
"volume": "",
|
||||
"weight": "",
|
||||
},
|
||||
product_id: '',
|
||||
uuid: '', //选择图片的id
|
||||
deleteIndex: '', //删除图片下标
|
||||
|
@ -133,7 +149,7 @@
|
|||
this.attr = JSON.parse(uni.getStorageSync('attr') || '[]');
|
||||
this.getOpenerEventChannel().once('updateAttrValue', (e) => {
|
||||
e.attrValue.forEach((item, index) => {
|
||||
item.uuid = index + '-' + Math.floor(Math.random() * 10000);
|
||||
item.uuid = Date.now() + '-' + Math.floor(Math.random() * 10000);
|
||||
})
|
||||
this.attrValue = e.attrValue;
|
||||
uni.setStorageSync('attrValue', JSON.stringify(e.attrValue));
|
||||
|
@ -143,51 +159,86 @@
|
|||
this.userInfo = this.$store.state.app.userInfo;
|
||||
if (typeof this.userInfo == 'string') this.userInfo = JSON.parse(this.userInfo);
|
||||
},
|
||||
watch: {
|
||||
attr: {
|
||||
handler(n, o) {
|
||||
let arr = this.computeAttr(n);
|
||||
let t = [];
|
||||
n.forEach(item=>{
|
||||
t.push(item.value)
|
||||
})
|
||||
this.attrValue.forEach((item)=>{
|
||||
t.forEach(key=>{
|
||||
console.log(item.detail[key]);
|
||||
})
|
||||
})
|
||||
console.log(arr);
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
updateCode(e) {
|
||||
console.log(e);
|
||||
},
|
||||
// 点击设置规格
|
||||
test() {
|
||||
settingSpec() {
|
||||
this.$refs.modeRef.open();
|
||||
},
|
||||
// 添加规格二级
|
||||
addSpecTow(index) {
|
||||
this.attrDetail = '';
|
||||
this.addAttrType = 1;
|
||||
this.changeAttr = index;
|
||||
this.$refs.inputModeRef.open();
|
||||
},
|
||||
// 添加规格一级
|
||||
addSpecOne() {
|
||||
this.attrName = '';
|
||||
this.attrDetail = '';
|
||||
this.addAttrType = 2;
|
||||
this.$refs.inputModeRef.open();
|
||||
},
|
||||
// 删除规格二级
|
||||
deleteAttrTow(i, j) {
|
||||
if(this.attr[i].detail.length<=1){
|
||||
return this.deleteAttrOne(i); // 当规格的最后一个属性被删除时,直接删除该规格
|
||||
}
|
||||
this.attrValue = this.attrValue.filter(item=>{
|
||||
return !(item.detail[this.attr[i].value] == this.attr[i].detail[j]);
|
||||
})
|
||||
this.attr[i].detail.splice(j, 1);
|
||||
},
|
||||
// 删除规格一级
|
||||
deleteAttrOne(i) {
|
||||
let attr = this.attr[i];
|
||||
if(this.attr.length==1){ // 如果只有一个规格, 并且删除这个规格时, 直接清空规格
|
||||
this.$set(this, 'attrValue', []);
|
||||
this.attr.splice(i, 1);
|
||||
return ;
|
||||
}
|
||||
// 删除多余的规格值
|
||||
this.attrValue.forEach(item => {
|
||||
let a = item.sku.split(',');
|
||||
a = a.filter(e=>e!=item.detail[attr.value]);
|
||||
item.sku = a.join(',');
|
||||
delete item.detail[attr.value];
|
||||
})
|
||||
// 过滤掉重复的值
|
||||
this.attrValue = Array.from(new Set(this.attrValue.map(item => item.sku))).map(sku => {
|
||||
return this.attrValue.find(item => item.sku === sku);
|
||||
});
|
||||
this.attr.splice(i, 1);
|
||||
},
|
||||
// 添加商品规格卡片
|
||||
addAttrValueCard(){
|
||||
let arr = this.computeAttr(this.attr); // 计算出sku的值
|
||||
let t = [];
|
||||
let keys = this.attr.map(e => { // 获取规格名称
|
||||
return e.value;
|
||||
})
|
||||
let temp = [];
|
||||
arr.forEach((sku) => { // 根据sku遍历当前规格数组
|
||||
if (this.attrValue.find(e => e.sku == sku)) return;
|
||||
else {
|
||||
let detail = {};
|
||||
let t = sku.split(',');
|
||||
keys.forEach((e, i) => { // 设置detail的值
|
||||
detail[e] = t[i];
|
||||
})
|
||||
temp.push(Object.assign({}, this.attr_mode, {
|
||||
sku: sku,
|
||||
detail: detail,
|
||||
uuid: Date.now() + '-' + Math.floor(Math.random() * 10000) // 重设uuid
|
||||
})) // 追加数据
|
||||
}
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.attrValue = [...this.attrValue, ...temp] // 延后追加数据
|
||||
})
|
||||
},
|
||||
// 关闭添加规格
|
||||
closeAddAttr() {
|
||||
this.$refs.inputModeRef.close();
|
||||
|
@ -199,11 +250,11 @@
|
|||
s.push(item.detail);
|
||||
})
|
||||
let t = this.getCombination(s);
|
||||
// t = t.map(item=>{
|
||||
// if(typeof item=='object'){
|
||||
// return item.join(',')
|
||||
// }else return item;
|
||||
// })
|
||||
t = t.map(item => {
|
||||
if (typeof item == 'object') {
|
||||
return item.join(',')
|
||||
} else return item;
|
||||
})
|
||||
return t;
|
||||
},
|
||||
// 递归计算
|
||||
|
@ -224,7 +275,9 @@
|
|||
},
|
||||
// 确认添加规格
|
||||
addAttr() {
|
||||
if (this.addAttrType == 1) {
|
||||
this.attrDetail = this.attrDetail.trim();
|
||||
this.attrDetail = this.attrDetail.trim();
|
||||
if (this.addAttrType == 1) { // 2级
|
||||
if (this.attr[this.changeAttr].detail.find(name => name == this.attrDetail)) {
|
||||
this.closeAddAttr();
|
||||
this.$nextTick(() => {
|
||||
|
@ -233,18 +286,37 @@
|
|||
} else {
|
||||
this.attr[this.changeAttr].detail.push(this.attrDetail);
|
||||
this.closeAddAttr();
|
||||
setTimeout(()=>{
|
||||
this.addAttrValueCard();
|
||||
})
|
||||
}
|
||||
} else {
|
||||
} else { // 1级
|
||||
if (this.attr.find(item => item.value == this.attrName)) {
|
||||
this.closeAddAttr();
|
||||
this.$nextTick(() => {
|
||||
Toast('该规格已存在')
|
||||
})
|
||||
} else {
|
||||
console.log('添加新规格');
|
||||
this.attr.push({
|
||||
value: this.attrName,
|
||||
detail: [this.attrDetail]
|
||||
});
|
||||
if(this.attrValue.length){
|
||||
this.attrValue.forEach((item) => {
|
||||
item.detail[this.attrName] = this.attrDetail;
|
||||
item.sku = item.sku + ',' + this.attrDetail;
|
||||
})
|
||||
}
|
||||
else {
|
||||
let detail = {};
|
||||
detail[this.attrName] = this.attrDetail;
|
||||
this.attrValue.push(Object.assign({}, this.attr_mode, {
|
||||
sku: this.attrDetail,
|
||||
detail: detail,
|
||||
uuid: Date.now() + '-' + Math.floor(Math.random() * 10000)
|
||||
}))
|
||||
}
|
||||
this.closeAddAttr();
|
||||
}
|
||||
}
|
||||
|
@ -257,22 +329,40 @@
|
|||
submitAttr() {
|
||||
if (this.attrValue.length < 1) return Toast('请至少添加一种规格');
|
||||
let flag = true;
|
||||
let str = '请填写完整信息';
|
||||
this.attrValue.forEach((item, index) => {
|
||||
Object.keys(this.$refs.priceRef[index].singleSpecification).forEach(key => {
|
||||
item[key] = this.$refs.priceRef[index].singleSpecification[key];
|
||||
})
|
||||
console.log(item);
|
||||
if (flag) {
|
||||
if (item.sku == undefined || item.sku == null || item.sku == '') flag = false;
|
||||
if (!item.price) flag = false;
|
||||
if (!item.stock) flag = false;
|
||||
if (!item.cost) flag = false;
|
||||
if (!item.procure_price && this.userInfo.mer_info.type_code == 'TypeSupplyChain') flag = false;
|
||||
if (item.sku == undefined || item.sku == null || item.sku == '') {
|
||||
flag = false;
|
||||
str = '规格不能为空';
|
||||
}
|
||||
else if (!item.price) {
|
||||
flag = false;
|
||||
str = '零售价不能小于等于0';
|
||||
}
|
||||
else if (!item.stock) {
|
||||
flag = false;
|
||||
str = '库存不能小于等于0';
|
||||
}
|
||||
else if (!item.cost) {
|
||||
flag = false;
|
||||
str = '成本价不能小于等于0';
|
||||
}
|
||||
else if (!item.procure_price && this.userInfo.mer_info.type_code == 'TypeSupplyChain') {
|
||||
flag = false;
|
||||
str = '批发价不能小于等于0';
|
||||
}
|
||||
}
|
||||
})
|
||||
if (!flag) return Toast('请填写完整信息');
|
||||
if (!flag) return Toast(str);
|
||||
else {
|
||||
uni.$emit('updateSpecType', this.attrValue);
|
||||
uni.$emit('updateSpecType', {
|
||||
attr: this.attr,
|
||||
attrValue: this.attrValue
|
||||
});
|
||||
uni.navigateBack();
|
||||
}
|
||||
},
|
||||
|
@ -318,9 +408,9 @@
|
|||
},
|
||||
// 添加规格
|
||||
addAttrValue() {
|
||||
this.attrValue.push({
|
||||
uuid: this.attrValue.length + '-' + Math.floor(Math.random() * 10000)
|
||||
})
|
||||
this.attrValue.push(Object.assign({}, this.attr_mode, {
|
||||
uuid: Date.now() + '-' + Math.floor(Math.random() * 10000) // 重设uuid
|
||||
}))
|
||||
},
|
||||
// 预删除
|
||||
deleteByIndex(index) {
|
||||
|
@ -342,6 +432,10 @@
|
|||
<style lang="scss">
|
||||
@import './scss/index.scss';
|
||||
|
||||
.page{
|
||||
padding-bottom: 150rpx;
|
||||
}
|
||||
|
||||
.popup_group {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue