You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
218 lines
7.1 KiB
218 lines
7.1 KiB
<template>
|
|
<view style="padding: 20rpx;">
|
|
<view style="padding: 20rpx 0;">
|
|
<view v-for="(item, index) in multiSpecData.specList" :key="index">
|
|
<view>
|
|
{{item.spec_name}}
|
|
</view>
|
|
<view v-for="(itm, idx) in item.valueList" :key="idx">
|
|
{{itm.spec_value}}
|
|
</view>
|
|
<view>
|
|
<view class="gui-form-item gui-border-b">
|
|
<text class="gui-form-label">规格名称</text>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="ggtj" placeholder="请输入规格名称"
|
|
@input="onChangeSpecValueIpt" />
|
|
</view>
|
|
<text class="gui-form-icon gui-icons gui-text-center" style="color: #AB1581; "
|
|
@click="handleAddSpecValue(index)">添加</text>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
<view v-for="(item,index) in multiSpecData.skuList">
|
|
<view>
|
|
<view style="text-align: center;">{{multiSpecData.specList[0].valueList[index].spec_value}}</view>
|
|
<view class="gui-flex gui-rows gui-nowrap gui-align-items-center gui-space-between"
|
|
style="text-align: center;">
|
|
<view style="width: 30%;">商品价格</view>
|
|
<view style="width: 30%;">商品划线</view>
|
|
<view style="width: 30%;">库存数量</view>
|
|
</view>
|
|
<view class="gui-flex gui-rows gui-nowrap gui-align-items-center gui-space-between">
|
|
<view style="width: 30%;"><input type="text" class="gui-form-input" v-model="item.goods_price"
|
|
placeholder="请输入商品价格"/></view>
|
|
<view style="width: 30%;"><input type="text" class="gui-form-input" v-model="item.line_price"
|
|
placeholder="请输入商品划线" /></view>
|
|
<view style="width: 30%;"><input type="text" class="gui-form-input" v-model="item.stock_num"
|
|
placeholder="请输入库存数量" /></view>
|
|
</view>
|
|
<view>
|
|
<view>套餐内容</view>
|
|
<view>
|
|
<view>
|
|
<view class="gui-form-item gui-border-b">
|
|
<text class="gui-form-label">规格名称</text>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="item.vname"
|
|
placeholder="请输入规格名称" @input="jianting($event,index,'-1','vname')" />
|
|
</view>
|
|
<text class="gui-form-icon gui-icons gui-text-center" style="color: #AB1581; "
|
|
@click="tianjia(index)">添加</text>
|
|
</view>
|
|
</view>
|
|
<view v-for="(items,indexs) in item.content">
|
|
{{items.name}} <text style="margin-left:30px;color:red" @click="shanchu(index,indexs,-1)">删除</text>
|
|
<view style="margin-left:10px" v-for="(it,inx) in items['chith']" class="gui-flex gui-rows gui-nowrap gui-align-items-center gui-space-between">
|
|
<view style="width: 65%;">{{it.name}}</view>
|
|
<view style="width: 10%;">{{it.sum}}{{it.unit}}</view>
|
|
<view style="width: 15%;">￥{{it.money}}</view>
|
|
<view style="color:red" @click="shanchu(index,indexs,inx)">删除</view>
|
|
</view>
|
|
<view class="gui-flex gui-rows gui-nowrap gui-align-items-center gui-space-between">
|
|
<view style="width: 24%;">名称</view>
|
|
<view style="width: 24%;">数量</view>
|
|
<view style="width: 24%;">单位</view>
|
|
<view style="width: 24%;">价格</view>
|
|
</view>
|
|
<view class="gui-flex gui-rows gui-nowrap gui-align-items-center gui-space-between">
|
|
<view style="width: 20%;">
|
|
<input type="text"
|
|
placeholder="请输入名称" @change="jianting($event,index,indexs,'vname')" v-model="items.vname" />
|
|
</view>
|
|
<view style="width: 20%;">
|
|
<input type="text"
|
|
placeholder="请输入数量" @change="jianting($event,index,indexs,'vsum')" v-model="items.vsum" />
|
|
</view>
|
|
<view style="width: 20%;">
|
|
<input type="text"
|
|
placeholder="请输入单位" @change="jianting($event,index,indexs,'vunit')" v-model="items.vunit" />
|
|
</view>
|
|
<view style="width: 20%;">
|
|
<input type="text"
|
|
placeholder="请输入价格" @change="jianting($event,index,indexs,'vmoney')" v-model="items.vmoney" />
|
|
</view>
|
|
<view @click="tianjia(index,indexs)">
|
|
添加
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view @click="quren">确认</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import MultiSpecModel from './MultiSpec'
|
|
export default {
|
|
|
|
data() {
|
|
return {
|
|
MultiSpecModel: new MultiSpecModel(),
|
|
multiSpecData: {
|
|
// 规格列表
|
|
specList: [],
|
|
// SKU列表
|
|
skuList: []
|
|
},
|
|
ggtj: '',
|
|
}
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面加载
|
|
*/
|
|
onLoad(options) {
|
|
this.getData()
|
|
this.MultiSpecModel.handleAddSpecGroup()
|
|
console.log(this.MultiSpecModel)
|
|
},
|
|
|
|
|
|
methods: {
|
|
quren(){
|
|
let specList = this.multiSpecData.specList
|
|
let skuList = this.multiSpecData.skuList
|
|
let specData = []
|
|
specData['specList'] = specList
|
|
specData['skuList'] = skuList
|
|
let pages = getCurrentPages();
|
|
let prevPage = pages[pages.length - 2]; //上一个页面
|
|
prevPage['specData'] = specData
|
|
prevPage['newSpecList'] = specList
|
|
prevPage['newSkuList'] = skuList
|
|
uni.navigateBack();
|
|
},
|
|
shanchu(index,indexs,inx){
|
|
if(inx > -1){
|
|
this.multiSpecData.skuList[index].content[indexs].chith.splice(inx, 1)
|
|
return false;
|
|
}
|
|
|
|
|
|
this.multiSpecData.skuList[index].content.splice(indexs, 1)
|
|
},
|
|
|
|
jianting(e, index, indexs, type) {
|
|
let _this = this
|
|
if(indexs > -1){
|
|
_this.multiSpecData.skuList[index].content[indexs][type] = e.detail.value
|
|
return false;
|
|
}
|
|
_this.multiSpecData.skuList[index][type] = e.detail.value
|
|
},
|
|
onChangeSpecValueIpt(event, itm) {
|
|
// 更新skuList
|
|
this.MultiSpecModel.onUpdate(true)
|
|
// console.log(this.MultiSpecModel)
|
|
},
|
|
handleAddSpecValue(groupIndex) {
|
|
this.MultiSpecModel.handleAddSpecValue(groupIndex, this.ggtj)
|
|
this.ggtj = ''
|
|
console.log(this.MultiSpecModel)
|
|
},
|
|
getData() {
|
|
const {
|
|
defaultSpecList,
|
|
defaultSkuList
|
|
} = this
|
|
this.multiSpecData = this.MultiSpecModel.getData(defaultSpecList, defaultSkuList)
|
|
},
|
|
ggtjinput(e) {
|
|
this.ggtj = e.detail.value
|
|
},
|
|
tianjia(index,indexs){
|
|
if(indexs > -1){
|
|
this.multiSpecData.skuList[index].content[indexs].chith.push({
|
|
name:this.multiSpecData.skuList[index].content[indexs].vname,
|
|
sum:this.multiSpecData.skuList[index].content[indexs].vsum,
|
|
unit:this.multiSpecData.skuList[index].content[indexs].vunit,
|
|
money:this.multiSpecData.skuList[index].content[indexs].vmoney
|
|
})
|
|
|
|
this.multiSpecData.skuList[index].content[indexs].vname = ''
|
|
this.multiSpecData.skuList[index].content[indexs].vsum = 1
|
|
this.multiSpecData.skuList[index].content[indexs].vunit = ''
|
|
this.multiSpecData.skuList[index].content[indexs].vmoney = 0
|
|
return false;
|
|
}
|
|
console.log(this.multiSpecData.skuList[index])
|
|
this.multiSpecData.skuList[index].content.push({
|
|
name:this.multiSpecData.skuList[index].vname,
|
|
vname:'',
|
|
chith:[],
|
|
vsum:1,
|
|
vunit:'',
|
|
vmoney:0
|
|
})
|
|
this.multiSpecData.skuList[index].vname = ''
|
|
},
|
|
|
|
},
|
|
|
|
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|