czg_team
/
cashier_admin_app
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

商品管理编辑更新，修复单规格多规格切换保存报错问题，增加部分必填项验证

This commit is contained in:
YeMingfei666 2024-10-15 15:22:37 +08:00
parent 24f34e8f8c
commit a5091f8f2d
5 changed files with 323 additions and 171 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

115
pageProduct/add-Product/add-Product.vue
View File

@ -53,7 +53,8 @@
v-model="FormData.categoryId">
</uni-data-picker>
</uni-forms-item>
<view class="zhezhao u-absolute position-all" @click="canEditGoodsCategory(true)" v-if="option.type=='edit'&&disabledChangeCategory">
<view class="zhezhao u-absolute position-all" @click="canEditGoodsCategory(true)"
v-if="option.type=='edit'&&disabledChangeCategory">
</view>
</view>
@ -129,7 +130,7 @@
:key="index">
<view class="u-flex-1 u-text-left">{{item.specSnap}}</view>
<view class="u-flex-1">￥{{item.salePrice}}</view>
<view class="u-flex-1">{{item.stockNumber}}</view>
<view class="u-flex-1">{{item.stockNumber||0}}</view>
</view>
</view>
@ -216,7 +217,7 @@
<!-- <view class="u-m-t-32 u-font-32 u-m-l-10 u-m-b-32">规格属性</view> -->
<view class="block" v-for="(sku,index) in skuList.list" :key="index">
<view class="border-top-0">
<uni-forms-item label="售价">
<uni-forms-item label="售价" required showRequired >
<uni-easyinput :paddingNone="inputPaddingNone"
@blur="priceFormat(sku,'salePrice')" :placeholderStyle="placeholderStyle"
:inputBorder="inputBorder" v-model="sku.salePrice" type="digit"
@ -241,7 +242,7 @@
:inputBorder="inputBorder" v-model="sku.originPrice" type="digit"
placeholder="请输入原价（元）" />
</uni-forms-item> -->
<uni-forms-item label="起售数量">
<uni-forms-item label="起售数量" required showRequired >
<uni-easyinput @blur="priceFormat(sku,'suit')" :paddingNone="inputPaddingNone"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="sku.suit" type="digit" placeholder="请输入起售数量" />
@ -418,8 +419,7 @@
</uni-forms-item>
<template v-if="FormData.isStock">
<uni-forms-item label="库存数量">
<uni-easyinput :paddingNone="inputPaddingNone"
:disabled="disabledStock"
<uni-easyinput :paddingNone="inputPaddingNone" :disabled="disabledStock"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="FormData.stockNumber" type="digit" placeholder="请输入库存数量" />
</uni-forms-item>
@ -1092,10 +1092,10 @@
}
}
}
res.skuList = (res.skuList.length ? res.skuList : [])
$goodsData = res
console.log(res);
skuList.list = res.skuList
Object.assign(FormData, res)
skuList.list = res.skuList || []
//多规格
if (res.typeEnum === 'sku') {
const selectSpec = JSON.parse(res.selectSpec)
@ -1139,8 +1139,12 @@
}),
specList: [],
}
} else {
// 单规格
}
})
}
@ -1321,14 +1325,23 @@
return infoBox.showToast('请上传商品图片')
}
const skuSnap = []
let submitSkuList = FormData.specificationsGroup ? skuList.list : [{
...$defaultSku,
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`
}];
if (typeEnum == 'normal') {
submitSkuList = skuList.list;
let submitSkuList = skuList.list || []
if(option.type=='edit'){
submitSkuList=submitSkuList.map(v=>{
return{
...v,productId:FormData.id,shopId:uni.getStorageSync('shopId')
}
console.log(submitSkuList);
})
}
// if(typeEnum!=$goodsData.typeEnum){
// if(typeEnum=='normal'){
// submitSkuList = skuList.list;
// }else{
// submitSkuList = skuList.list;
// }
// }else{
// submitSkuList = skuList.list;
// }
if (FormData.specificationsGroup) {
for (let i of FormData.specificationsGroup.selectSpec) {
if (i.selectSpecResult.length) {
@ -1340,8 +1353,8 @@
}
}
console.log(FormData.specificationsGroup);
const selectSpec = FormData.typeEnum != 'sku' ? '' : JSON.stringify(FormData.specificationsGroup
.selectSpec.map(spe => {
const selectSpec = FormData.typeEnum != 'sku' ? '[]' : JSON.stringify((FormData.specificationsGroup
.selectSpec || []).map(spe => {
return {
...spe,
value: spe.value.map(v => {
@ -1349,13 +1362,28 @@
})
}
}))
const lowPrice = submitSkuList[0] ? submitSkuList[0].salePrice : FormData.salePrice
// const lowPrice = submitSkuList[0] ? submitSkuList[0].salePrice : FormData.salePrice
const suit = submitSkuList[0] ? submitSkuList[0].suit : 0
if(typeEnum=='normal'){
if(lowPrice===''){
return infoBox.showToast('请输入售价')
}
if(lowPrice===''){
return infoBox.showToast('请输入售价')
}
if(suit<=0){
return infoBox.showToast('起售数量不能小于0！')
}
}
const submitData = {
...FormData,
images: images,
coverImg: images[0] || '',
skuList: submitSkuList,
specInfo: JSON.stringify(submitSkuList),
lowPrice: submitSkuList[0].salePrice,
lowPrice,
specificationsGroup: undefined,
selectSpec,
skuSnap: JSON.stringify(skuSnap)
@ -1402,6 +1430,7 @@
uni.$off('emitspecificationsSave')
uni.$on('emitspecificationsSave', function(data) {
FormData.specificationsGroup = data
FormData.specId = data.specId
skuList.list = data.result.map(v => {
return {
...v.skus,
@ -1499,23 +1528,35 @@
watch(() => FormData.typeEnum, (newval) => {
if (option.type === 'add') {
if (newval === 'sku') {
skuList.list = []
} else {
skuList.list[0] = {
...$defaultSku,
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`
}
}
}else{
//编辑
if (newval === 'sku') {
skuList.list = []
} else {
if (option.type == 'edit') {
FormData.specId = newval == 'normal' ? '' : ($goodsData.specId || '')
if (newval == $goodsData.typeEnum) {
skuList.list = $goodsData.skuList
} else {
if (newval == 'normal') {
skuList.list = [{
...$defaultSku,
productId: FormData.id,
shopId: uni.getStorageSync('shopId'),
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`
}]
} else {
skuList.list = []
}
}
} else {
FormData.specId = ''
if (newval == 'normal') {
skuList.list = [{
...$defaultSku,
shopId: uni.getStorageSync('shopId'),
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`
}]
} else {
skuList.list = []
}
}
})
/**
@ -1526,7 +1567,10 @@
let disabledStock = ref(false)
async function canEditGoodsStock() {
if (option.type === 'edit') {
const res=await hasPermission({text:'允许修改商品库存',tips:false})
const res = await hasPermission({
text: '允许修改商品库存',
tips: false
})
disabledStock.value = !res
}
}
@ -1539,7 +1583,10 @@
let disabledChangeCategory = ref(false)
async function canEditGoodsCategory(tips = false) {
if (option.type === 'edit') {
const res=await hasPermission({text:'允许修改分类',tips})
const res = await hasPermission({
text: '允许修改分类',
tips
})
disabledChangeCategory.value = !res
}
}

5
pageProduct/add-Product/components/choose-danwei.vue
View File

@ -1,8 +1,11 @@
<template>
<view class="u-relative choose-haocai">
<view class="input u-flex" @click="toggle" >
<!-- <view class="input u-flex" @click="toggle" >
<up-input @blur="blur" @change="filterHaocaiList" border="none" v-model="text" placeholder="请选择"></up-input>
<up-icon :size="10" name="arrow-down-fill"></up-icon>
</view> -->
<view class="input u-flex" >
<up-input @blur="blur" disabled="true" @change="filterHaocaiList" border="none" v-model="text" placeholder="请选择"></up-input>
</view>
<view class="u-absolute" v-if="popShow">
<scroll-view scroll-y="true" class="scroll">

132
pageProduct/add-specifications/choose-specifications.vue
View File

@ -30,20 +30,13 @@
</view>
</view>
<!-- <view class="block u-m-b-32 u-p-30">
<view class="font-bold">批量修改</view>
<view class="u-flex fast-edit u-flex-wrap gap-20 u-m-t-12">
<view class="color-main item u-flex u-row-center u-col-center" v-for="(item,index) in fastEdit.list" :key="index">
<view class="u-flex u-col-center">
<view class="u-m-r-12">{{item.text}}</view>
<up-icon size="16" :color="color.ColorMain" name="edit-pen"></up-icon>
</view>
</view>
</view>
</view> -->
</uni-forms>
<view>
<view class="block u-m-b-32" v-for="(item,index) in FormData.result" :key="index">
<uni-forms :model="item.skus" :rules="rules" :ref="setFormRef(index)" err-show-type="undertext"
validateTrigger="blur" :border="true" :label-width="130">
<view class="">
<view class="u-m-t-16" v-for="(val,key) in item.names" :key="key">
@ -59,16 +52,14 @@
图片
</view>
<view class="u-m-t-24">
<my-upload-file @change="changeResultCover($event,index)" :limit="1" :ref="setRefFile(index)" :images="item.coverImg"></my-upload-file>
<my-upload-file @change="changeResultCover($event,index)" :limit="1"
:ref="setRefFile(index)" :images="item.coverImg"></my-upload-file>
</view>
<!-- <uni-file-picker v-model="FormData.images" file-mediatype="image" mode="grid"
:limit="10" @progress="FileUploadprogress" @success="FileUploadsuccess"
@fail="FileUploadail" @select="FileUploadselect" /> -->
</view>
</view>
<view class="skus u-m-t-32">
<view class="">
<uni-forms-item label="售价" required>
<uni-forms-item label="售价" required name="salePrice">
<uni-easyinput @blur="priceFormat(item.skus,'salePrice')"
:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
:inputBorder="inputBorder" v-model="item.skus.salePrice" type="digit"
@ -76,25 +67,25 @@
</uni-forms-item>
</view>
<uni-forms-item label="会员价（元）" required>
<uni-forms-item label="会员价（元）" required name="memberPrice">
<uni-easyinput @blur="priceFormat(item.skus,'memberPrice')"
:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
:inputBorder="inputBorder" v-model="item.skus.memberPrice" type="digit"
placeholder="请输入会员价（元）" />
</uni-forms-item>
<uni-forms-item label="成本价（元）" required>
<uni-forms-item label="成本价（元）" required name="costPrice">
<uni-easyinput @blur="priceFormat(item.skus,'costPrice')"
:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
:inputBorder="inputBorder" v-model="item.skus.costPrice" type="digit"
placeholder="请输入成本价（元）" />
</uni-forms-item>
<uni-forms-item label="原价（元）" required>
<uni-forms-item label="原价（元）" required name="originPrice">
<uni-easyinput @blur="priceFormat(item.skus,'originPrice')"
:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
:inputBorder="inputBorder" v-model="item.skus.originPrice" type="digit"
placeholder="请输入原价（元）" />
</uni-forms-item>
<uni-forms-item label="起售数量" required>
<uni-forms-item label="起售数量" required name="suit">
<uni-easyinput @blur="priceFormat(item.skus,'suit')" :paddingNone="inputPaddingNone"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.skus.suit" type="digit" placeholder="请输入起售数量" />
@ -116,11 +107,12 @@
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.skus.barCode" placeholder="请输入商品条码" />
</uni-forms-item>
</view>
</view>
</view>
</uni-forms>
</view>
</view>
</view>
<view class="save-btn-box">
<button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button>
@ -141,11 +133,11 @@
</view>
</template>
<script setup>
import myUploadFile from '@/components/my-components/my-upload-file'
import {
formatPrice
} from "@/commons/utils/format.js";
import popFastEdit from "./components/fast-edit.vue"
import infoBox from '@/commons/utils/infoBox.js'
const refFiles = ref([]);
//绑定文件上传元素
function setRefFile(index) {
@ -159,16 +151,40 @@
const fastEdit = reactive({
show: false,
list:[
{text:'会员价',key:'memberPrice',value:''},
{text:'成本价',key:'costPrice',value:''},
{text:'原价',key:'originPrice',value:''},
{text:'起售数量',key:'suit',value:''},
{text:'库存数量',key:'stockNumber',value:''},
{text:'分销金额',key:'firstShared',value:''}
list: [{
text: '会员价',
key: 'memberPrice',
value: ''
},
{
text: '成本价',
key: 'costPrice',
value: ''
},
{
text: '原价',
key: 'originPrice',
value: ''
},
{
text: '起售数量',
key: 'suit',
value: ''
},
{
text: '库存数量',
key: 'stockNumber',
value: ''
},
{
text: '分销金额',
key: 'firstShared',
value: ''
}
],
sel: ''
})
function fastEditShow() {
fastEdit.show = true
}
@ -245,7 +261,16 @@
FormData.result[index].coverImg = val
console.log(FormData.result[index]);
}
const formRefs = ref([]);
//绑定表单元素
function setFormRef(index) {
formRefs.value[index] = null;
return (el) => {
if (el) {
formRefs.value[index] = el;
}
};
}
watch(() => FormData.specId, (newval) => {
FormData.result = []
})
@ -356,7 +381,31 @@
//表单验证
const rules = {
optionPrice: {
salePrice: {
rules: [{
required: true,
errorMessage: '必填'
}]
},
memberPrice: {
rules: [{
required: true,
errorMessage: '必填'
}]
},
costPrice: {
rules: [{
required: true,
errorMessage: '必填'
}]
},
originPrice: {
rules: [{
required: true,
errorMessage: '必填'
}]
},
suit: {
rules: [{
required: true,
errorMessage: '必填'
@ -433,7 +482,6 @@
function returnPromise(prosise) {
return new Promise((resolve, reject) => {
prosise.then(res => {
console.log(res);
resolve({
sucees: true
})
@ -446,14 +494,21 @@
})
}
async function save() {
if (!FormData.result.length) {
return infoBox.showToast('清先选择规格！')
}
let isAllPassForm = 0
const res = await returnPromise(form.value.validate())
for (let i in FormData.result) {
const res = await returnPromise(formRefs.value[i].validate(), i)
isAllPassForm += res.sucees ? 1 : 0
}
if (isAllPassForm < FormData.result.length) {
return infoBox.showToast('清完善规格属性的参数！')
}
//判断验证是否通过
if (res.sucees) {
console.log('pass');
console.log(FormData);
emitspecificationsSave()
}
}
</script>
@ -591,12 +646,14 @@
border-radius: 12rpx;
font-size: 28rpx;
}
.edit-btn {
background-color: #fff;
color: #333;
border-radius: 12rpx;
font-size: 28rpx;
}
.btn-hover-class {
opacity: .6;
}
@ -607,6 +664,7 @@
padding-left: 42rpx;
border-radius: 14rpx 14rpx 14rpx 14rpx;
}
.fast-edit {
.item {
color: #333;
@ -614,11 +672,13 @@
padding: 4rpx 10rpx 8rpx 10rpx;
border-radius: 10rpx;
min-width: 186rpx;
&.active {
color: $my-main-color;
}
}
}
::v-deep .uni-input-placeholder {
font-size: 28rpx;
}

15
pageProduct/goodsData.js
View File

@ -28,16 +28,17 @@ export const $types = [{
// 商品默认sku
export const $defaultSku = {
salePrice: 0,
memberPrice: 0,
costPrice: 0,
originPrice: 0,
stockNumber: 0,
firstShared: 0,
suit: 0,
salePrice: '',
memberPrice: '',
costPrice: '',
originPrice: '',
stockNumber: '',
firstShared: '',
suit: 1,
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`,
}
// 库存记录筛选类型
export const $invoicingType = [{
text: '全部',

45
pageProduct/index/components/goods.vue
View File

@ -46,7 +46,7 @@
</view>
<view class="u-m-t-24">
<template v-if="data.skuList.length>=2">
<view class="u-flex u-flex-wrap w-full gap-10 u-col-top">
<view class="u-flex u-flex-wrap w-full gap-10 u-col-top" :style="skuStyle">
<view class="u-font-24 info-p-l u-m-t-6">规格：</view>
<view class="skd" v-for="(item,index) in data.skuList" :key="index"
@click="guigeClick(index)">
@ -63,6 +63,18 @@
</view>
</view>
<template v-if="skuIsNotOne">
<view class="u-flex u-row-center">
<view class="u-flex u-flex-y-center" @click="toggleIsShowSkuAll" >
<view class="u-font-28 u-m-r-10 u-m-t-10 color-666">{{isShowSkuAll?'收起':'展开'}}</view>
<view class="u-flex u-flex-y-center">
<up-icon :size="14" name="arrow-down" v-if="!isShowSkuAll"></up-icon>
<up-icon :size="14" name="arrow-up" v-else></up-icon>
</view>
</view>
</view>
</template>
</template>
<template v-else>
<view style="height: 44rpx;">
@ -90,7 +102,7 @@
<my-switch disabled v-model="isPauseSale" :openDisabledClass="false" @click="isPauseSaleChange"></my-switch>
</view>
<view class="u-flex u-m-l-30">
<view class="u-m-r-18 color-999">{{data.isGrounding?'下架产品':'上架产品' }}</view>
<view class="u-m-r-18 color-999">上架产品</view>
<my-switch disabled v-model="isGrounding" :openDisabledClass="false" @click="isGroundingChange"></my-switch>
</view>
</view>
@ -109,6 +121,7 @@
<script setup>
import {
computed,
ref,
watch,
watchEffect
@ -146,7 +159,35 @@
}
})
let isShowSkuAll=ref(false)
const skuStyle=computed(()=>{
if(isShowSkuAll.value){
return ''
}else{
return 'height: 30px;overflow: hidden'
}
})
const skuIsNotOne=computed(()=>{
let isOne=true;
let width=0;
const fontSize=12;
const gap=5;
const boxWith=40;
const max=247;
for(let i in props.data.skuList){
const sku=props.data.skuList[i]
width+=(fontSize*sku.name.length+boxWith+gap)
if(width>max){
isOne=false
break;
}
}
return !isOne
})
function toggleIsShowSkuAll(){
isShowSkuAll.value=!isShowSkuAll.value
}
async function upDateGoods(par) {
const res = await $updateProductData([{