商品管理更新
This commit is contained in:
@@ -1508,6 +1508,13 @@
|
|||||||
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`
|
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}else{
|
||||||
|
//编辑
|
||||||
|
if (newval === 'sku') {
|
||||||
|
skuList.list = []
|
||||||
|
} else {
|
||||||
|
skuList.list=$goodsData.skuList
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
@@ -1,62 +1,53 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="page">
|
<view class="page">
|
||||||
<view class="box">
|
<view class="box">
|
||||||
|
<view class="block border-top-0">
|
||||||
|
<uni-forms ref="nameFormRef" :model="specifications" :rules="rules" :label-width="350"
|
||||||
|
label-position="top" validateTrigger="blur">
|
||||||
|
<uni-forms-item label="模版名称" required name="name">
|
||||||
|
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
||||||
|
v-model="specifications.name" placeholder="模版名称,如:衣服" />
|
||||||
|
</uni-forms-item>
|
||||||
|
</uni-forms>
|
||||||
|
</view>
|
||||||
<view v-for="(item,index) in specifications.list" :key="index">
|
<view v-for="(item,index) in specifications.list" :key="index">
|
||||||
<uni-forms :model="item" :rules="rules" err-show-type="undertext" validateTrigger="blur"
|
<uni-forms :model="item" :rules="rules" err-show-type="undertext" validateTrigger="blur"
|
||||||
:ref="setFormRef(index)" :border="true" label-position="top" label-width="350">
|
:ref="setFormRef(index)" :border="true" label-position="top" label-width="350">
|
||||||
|
|
||||||
<view class="block">
|
<view class="block">
|
||||||
<view class="border-top-0">
|
<view class="border-top-0">
|
||||||
<uni-forms-item label="规格组名" required name="name" >
|
<uni-forms-item label="规格组名" required name="name">
|
||||||
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
||||||
v-model="item.name" placeholder="规格组名" />
|
v-model="item.name" placeholder="规格组名,如:尺码" />
|
||||||
</uni-forms-item>
|
</uni-forms-item>
|
||||||
</view>
|
</view>
|
||||||
<!-- <uni-forms-item label="最少可选" required name="MinOptional" >
|
<uni-forms-item label="规格值">
|
||||||
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
|
||||||
v-model="item.MinOptional" type="number" placeholder="填写最小数量" />
|
|
||||||
</uni-forms-item>
|
|
||||||
<uni-forms-item label="最大可选" required name="MaxOptional" >
|
|
||||||
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
|
||||||
v-model="item.MaxOptional" type="number" placeholder="填写最大数量" />
|
|
||||||
</uni-forms-item> -->
|
|
||||||
<uni-forms-item label="选项值">
|
|
||||||
<view class="option">
|
<view class="option">
|
||||||
<view class="u-flex">
|
<view class="">
|
||||||
<view class="u-flex-1">名称</view>
|
<view class="u-flex option-item" v-for="(option,optionIndex) in item.options"
|
||||||
<view class="u-flex-1 u-p-l-60">加价</view>
|
:key="optionIndex">
|
||||||
</view>
|
|
||||||
<view class="u-m-t-32">
|
|
||||||
<view class="u-flex option-item"
|
|
||||||
|
|
||||||
v-for="(option,optionIndex) in item.options"
|
|
||||||
:key="optionIndex"
|
|
||||||
>
|
|
||||||
<view class="u-flex-1">
|
<view class="u-flex-1">
|
||||||
<uni-forms-item :key="optionIndex" :name="['options',optionIndex,'optionName']"
|
<uni-forms-item :key="optionIndex" :name="['options',optionIndex,'name']"
|
||||||
:ref="setFormInputRef(index,optionIndex)"
|
:ref="setFormInputRef(index,optionIndex)"
|
||||||
:rules="[{'required': true,errorMessage: '必填'}]"
|
:rules="[{'required': true,errorMessage: '必填'}]" label-width="0"
|
||||||
label-width="0" label="" required :showRequired="false"
|
label="" required :showRequired="false">
|
||||||
>
|
<uni-easyinput
|
||||||
<uni-easyinput v-model="specifications.list[index].options[optionIndex].optionName"
|
v-model="specifications.list[index].options[optionIndex].name"
|
||||||
@input="inpuChange(index,optionIndex)"
|
@input="inpuChange(index,optionIndex)"
|
||||||
|
|
||||||
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
||||||
placeholder="选项名" />
|
placeholder="请输入规格值,如:S、M" />
|
||||||
</uni-forms-item>
|
</uni-forms-item>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="u-p-l-60 u-flex-1 u-flex">
|
<view class=" u-flex">
|
||||||
<uni-forms-item :key="optionIndex"
|
<uni-forms-item :key="optionIndex" label-width="0" label=""
|
||||||
:rules="[{'required': true,errorMessage: '必填'}]"
|
:showRequired="false">
|
||||||
:ref="setFormInputRef(index,optionIndex)"
|
|
||||||
:name="['options',optionIndex,'optionPrice']" label-width="0" label="" required :showRequired="false"
|
|
||||||
>
|
|
||||||
<view class="u-flex">
|
<view class="u-flex">
|
||||||
<uni-easyinput v-model="specifications.list[index].options[optionIndex].optionPrice"
|
<!-- <uni-easyinput v-model="specifications.list[index].options[optionIndex].optionPrice"
|
||||||
@input="inpuChange(index,optionIndex)"
|
@input="inpuChange(index,optionIndex)"
|
||||||
|
|
||||||
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
||||||
type="digit" placeholder="填写价格" />
|
type="digit" placeholder="填写价格" /> -->
|
||||||
|
|
||||||
<view class="icon icon-reduce u-m-l-38"
|
<view class="icon icon-reduce u-m-l-38"
|
||||||
@click="delOption(index,optionIndex)">
|
@click="delOption(index,optionIndex)">
|
||||||
@@ -79,7 +70,7 @@
|
|||||||
|
|
||||||
</view>
|
</view>
|
||||||
</uni-forms-item>
|
</uni-forms-item>
|
||||||
|
|
||||||
<view class="u-flex u-m-t-48 u-m-b-24" @click="delSpecificationsGroup(index)">
|
<view class="u-flex u-m-t-48 u-m-b-24" @click="delSpecificationsGroup(index)">
|
||||||
<view class="icon icon-reduce u-m-r-22 ">
|
<view class="icon icon-reduce u-m-r-22 ">
|
||||||
|
|
||||||
@@ -106,10 +97,14 @@
|
|||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import go from '@/commons/utils/go.js';
|
import go from '@/commons/utils/go.js';
|
||||||
|
import {
|
||||||
|
$productSpec
|
||||||
|
} from '@/http/yskApi/goods.js'
|
||||||
import {
|
import {
|
||||||
onLoad,
|
onLoad,
|
||||||
onReady
|
onReady,
|
||||||
} from '@dcloudio/uni-app';
|
} from '@dcloudio/uni-app';
|
||||||
|
import infoBox from '@/commons/utils/infoBox.js'
|
||||||
import {
|
import {
|
||||||
onMounted,
|
onMounted,
|
||||||
reactive,
|
reactive,
|
||||||
@@ -117,8 +112,9 @@
|
|||||||
ref,
|
ref,
|
||||||
onBeforeMount
|
onBeforeMount
|
||||||
} from 'vue';
|
} from 'vue';
|
||||||
|
const nameFormRef = ref(null)
|
||||||
// 表单样式
|
// 表单样式
|
||||||
const placeholderStyle = ref('font-size:28rpx;')
|
const placeholderStyle = ref('font-size:28rpx;')
|
||||||
//表单边框
|
//表单边框
|
||||||
const inputBorder = ref(false)
|
const inputBorder = ref(false)
|
||||||
const form = ref(null)
|
const form = ref(null)
|
||||||
@@ -143,12 +139,6 @@
|
|||||||
errorMessage: '必填'
|
errorMessage: '必填'
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
optionName: {
|
|
||||||
rules: [{
|
|
||||||
required: true,
|
|
||||||
errorMessage: '必填'
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
optionPrice: {
|
optionPrice: {
|
||||||
rules: [{
|
rules: [{
|
||||||
required: true,
|
required: true,
|
||||||
@@ -157,10 +147,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 构造规格的选项值的基础数据
|
// 构造规格的选项值的基础数据
|
||||||
const specificationsOptionsBasicData = {
|
const specificationsOptionsBasicData = {
|
||||||
optionName: '',
|
name: '',
|
||||||
optionPrice: '0.00'
|
optionPrice: '0.00'
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -172,8 +162,8 @@
|
|||||||
// 构造规格的基础数据
|
// 构造规格的基础数据
|
||||||
const specificationsBasicData = {
|
const specificationsBasicData = {
|
||||||
name: '',
|
name: '',
|
||||||
MinOptional: 1,
|
// MinOptional: 1,
|
||||||
MaxOptional: 1,
|
// MaxOptional: 1,
|
||||||
options: []
|
options: []
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -189,6 +179,7 @@
|
|||||||
}
|
}
|
||||||
// 规格列表
|
// 规格列表
|
||||||
const specifications = reactive({
|
const specifications = reactive({
|
||||||
|
name: '',
|
||||||
list: [returnSpecificationsOptionsBasicData()]
|
list: [returnSpecificationsOptionsBasicData()]
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -235,7 +226,8 @@
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
// 绑定option input元素
|
// 绑定option input元素
|
||||||
const refFormInput=ref([])
|
const refFormInput = ref([])
|
||||||
|
|
||||||
function setFormInputRef(index, index1) {
|
function setFormInputRef(index, index1) {
|
||||||
const newIndex = index * 10000 + index1
|
const newIndex = index * 10000 + index1
|
||||||
return (el) => {
|
return (el) => {
|
||||||
@@ -252,61 +244,104 @@
|
|||||||
console.log(refFormInput.value[newIndex]);
|
console.log(refFormInput.value[newIndex]);
|
||||||
refFormInput.value[newIndex].onFieldChange()
|
refFormInput.value[newIndex].onFieldChange()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let emitName=''
|
|
||||||
function triggerEvent (emitName,data){
|
|
||||||
if(emitName){
|
|
||||||
uni.$emit(emitName,data)
|
const option = {
|
||||||
}
|
type: 'add',
|
||||||
|
id: undefined
|
||||||
}
|
}
|
||||||
onLoad(opt=>{
|
onLoad(opt => {
|
||||||
const arr=uni.getStorageSync('guige')
|
|
||||||
if(arr.length){
|
|
||||||
specifications.list=arr
|
|
||||||
console.log(arr);
|
|
||||||
}
|
|
||||||
console.log(opt);
|
console.log(opt);
|
||||||
if(opt&&JSON.stringify(opt)!=='{}'&&opt.emitName){
|
if (opt && JSON.stringify(opt) !== '{}' && opt.type) {
|
||||||
emitName=opt.emitName
|
option.type = opt.type
|
||||||
|
const data = uni.getStorageSync('spec')
|
||||||
|
uni.removeStorageSync('spec')
|
||||||
|
if(data){
|
||||||
|
specifications.name = data.name
|
||||||
|
specifications.id = data.id
|
||||||
|
specifications.list = data.specList.map(v => {
|
||||||
|
return {
|
||||||
|
...v,
|
||||||
|
options: v.value.map(v => {
|
||||||
|
return {
|
||||||
|
name: v
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
uni.setNavigationBarTitle({
|
uni.setNavigationBarTitle({
|
||||||
title:emitName?'编辑规格模版':'添加规格模版'
|
title: option.type === 'edit' ? '编辑规格模版' : '添加规格模版'
|
||||||
})
|
})
|
||||||
|
|
||||||
})
|
})
|
||||||
function emitspecificationsSave(){
|
|
||||||
// emitspecificationsSave 触发规格保存事件将数据给到添加商品页面
|
function returnPromise(prosise, index) {
|
||||||
// guigeEdit 触发规格保存事件将数据给到添加规格页面
|
return new Promise((resolve, reject) => {
|
||||||
uni.removeStorageSync('guige')
|
prosise.then(res => {
|
||||||
triggerEvent(emitName,specifications.list)
|
|
||||||
}
|
|
||||||
function returnPromise(index,prosise){
|
|
||||||
return new Promise((resolve,reject)=>{
|
|
||||||
prosise.then(res=>{
|
|
||||||
console.log(res);
|
console.log(res);
|
||||||
resolve({sucees:true})
|
resolve({
|
||||||
}).catch(err=>{
|
sucees: true
|
||||||
|
})
|
||||||
|
}).catch(err => {
|
||||||
console.log(err);
|
console.log(err);
|
||||||
resolve({sucees:false})
|
resolve({
|
||||||
|
sucees: false
|
||||||
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
async function save() {
|
|
||||||
let isAllPassForm=0
|
let timer = null
|
||||||
|
|
||||||
|
function settimeoutBack(time) {
|
||||||
|
clearTimeout(timer)
|
||||||
|
timer = setTimeout(() => {
|
||||||
|
uni.navigateBack()
|
||||||
|
}, time)
|
||||||
|
}
|
||||||
|
async function save() {
|
||||||
|
let isAllPassForm = 0
|
||||||
|
const nameFormRes = await returnPromise(nameFormRef.value.validate())
|
||||||
|
console.log(nameFormRes);
|
||||||
|
if (!nameFormRes.sucees) {
|
||||||
|
isAllPassForm -= 1
|
||||||
|
}
|
||||||
for (let i in specifications.list) {
|
for (let i in specifications.list) {
|
||||||
const res=await returnPromise(i,formRefs.value[i].validate())
|
const res = await returnPromise(formRefs.value[i].validate(), i)
|
||||||
isAllPassForm+=res.sucees?1:0
|
isAllPassForm += res.sucees ? 1 : 0
|
||||||
}
|
}
|
||||||
//判断验证是否通过
|
//判断验证是否通过
|
||||||
if(isAllPassForm===specifications.list.length){
|
if (isAllPassForm === specifications.list.length) {
|
||||||
console.log('pass');
|
console.log('pass');
|
||||||
emitspecificationsSave()
|
const data = {
|
||||||
go.back()
|
name: specifications.name,
|
||||||
|
id:specifications.id,
|
||||||
|
specList: specifications.list.map(v => {
|
||||||
|
return {
|
||||||
|
...v,
|
||||||
|
value: v.options.map(v => v.name),
|
||||||
|
options: undefined
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (option.type === 'add') {
|
||||||
|
return $productSpec.add(data).then(res => {
|
||||||
|
infoBox.showSuccessToast('添加成功')
|
||||||
|
settimeoutBack(1500)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
$productSpec.update(data).then(res => {
|
||||||
|
infoBox.showSuccessToast('修改成功')
|
||||||
|
settimeoutBack(1500)
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -124,12 +124,15 @@
|
|||||||
|
|
||||||
<view class="save-btn-box">
|
<view class="save-btn-box">
|
||||||
<button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button>
|
<button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button>
|
||||||
<button class="save-btn edit-btn" hover-class="btn-hover-class" @click="fastEditShow">
|
<view class="u-m-t-20">
|
||||||
<view class="u-flex u-row-center">
|
<button class="save-btn edit-btn" hover-class="btn-hover-class" @click="fastEditShow">
|
||||||
<view class="u-m-r-6">批量修改</view>
|
<view class="u-flex u-row-center">
|
||||||
<up-icon name="edit-pen" :color="color.ColorMain"></up-icon>
|
<view class="u-m-r-6">批量修改</view>
|
||||||
</view>
|
<up-icon name="edit-pen" :color="color.ColorMain"></up-icon>
|
||||||
</button>
|
</view>
|
||||||
|
</button>
|
||||||
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="bottom" ref="bottom"></view>
|
<view class="bottom" ref="bottom"></view>
|
||||||
|
|||||||
@@ -8,16 +8,19 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="u-m-t-36">
|
<view class="u-m-t-36">
|
||||||
<view class="u-m-b-24" v-for="(item,index) in list" :key="index">
|
<scroll-view scroll-y="true" style="max-height: 70vh;">
|
||||||
<view>{{item.text}}:</view>
|
<view class="u-m-b-24" v-for="(item,index) in list" :key="index">
|
||||||
<view class="u-m-t-24">
|
<view>{{item.text}}:</view>
|
||||||
<up-input v-model="item.value">
|
<view class="u-m-t-24">
|
||||||
<template #suffix>
|
<up-input v-model="item.value">
|
||||||
<up-button @click="itemClick(item)" type="primary" text="修改" size="mini"></up-button>
|
<template #suffix>
|
||||||
</template>
|
<up-button @click="itemClick(item)" type="primary" text="修改" size="mini"></up-button>
|
||||||
</up-input>
|
</template>
|
||||||
|
</up-input>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</scroll-view>
|
||||||
|
|
||||||
|
|
||||||
<view class="u-m-t-60">
|
<view class="u-m-t-60">
|
||||||
<my-button type="primary" shape="circle" @tap="save">
|
<my-button type="primary" shape="circle" @tap="save">
|
||||||
|
|||||||
@@ -49,6 +49,7 @@ import { reactive, ref } from 'vue';
|
|||||||
emits('del',props.index)
|
emits('del',props.index)
|
||||||
}
|
}
|
||||||
function edit(){
|
function edit(){
|
||||||
|
uni.$emit('edit:spec',props.data)
|
||||||
uni.setStorageSync('spec',props.data)
|
uni.setStorageSync('spec',props.data)
|
||||||
go.to('PAGES_PRODUCT_GUIGE_ADD', {
|
go.to('PAGES_PRODUCT_GUIGE_ADD', {
|
||||||
type: 'edit'
|
type: 'edit'
|
||||||
|
|||||||
Reference in New Issue
Block a user