359 lines
9.1 KiB
Vue
359 lines
9.1 KiB
Vue
<template>
|
|
<view>
|
|
<view class="default-box-padding bg-fff border-r-18">
|
|
<view class="u-flex u-row-between">
|
|
<view>商品名称</view>
|
|
<template v-if="isSku">
|
|
<view class="u-flex u-font-24 color-666">
|
|
<view class="u-m-r-20">绑定至规格</view>
|
|
<up-switch :size="18" v-model="isBindGuige" :disabled="!isSku">绑定至规格</up-switch>
|
|
</view>
|
|
</template>
|
|
</view>
|
|
<view class="border-bottom u-m-t-16 u-p-b-32">{{goods.name}}</view>
|
|
<view class="">
|
|
<template v-if="isBindGuige&&isSku">
|
|
<view class="list">
|
|
<view class="u-p-b-32 u-p-t-32 border-bottom" v-for="(item,index) in skuList" :key="index">
|
|
<view>规格名称</view>
|
|
<view class="u-m-t-16">{{item.specSnap}}</view>
|
|
<view class="color-666 u-m-t-24 u-flex">
|
|
<view class="xuhao">序号</view>
|
|
<view class="u-flex u-flex-1 u-p-l-32 gap-20">
|
|
<view class="u-flex-1">耗材名称</view>
|
|
<view class="u-flex-1">单位</view>
|
|
<view class="u-flex-1">用量</view>
|
|
</view>
|
|
</view>
|
|
<view class="u-m-t-32 color-666">
|
|
<view class="u-m-t-24" v-for="(haocai,haocaiIndex) in item.haoaiList"
|
|
:key="haocaiIndex">
|
|
<view class=" u-flex">
|
|
<view class="xuhao">{{haocaiIndex+1}}</view>
|
|
<view class="u-flex u-flex-1 u-p-l-32 gap-20">
|
|
<view class="u-flex-1 ">
|
|
<view class="u-flex input">
|
|
<view>{{item.name}}</view>
|
|
<up-icon :size="10" name="arrow-down-fill"></up-icon>
|
|
</view>
|
|
</view>
|
|
<view class="u-flex-1 ">
|
|
<view class="u-flex input">
|
|
<view>{{item.unit}}</view>
|
|
<up-icon :size="10" name="arrow-down-fill"></up-icon>
|
|
</view>
|
|
</view>
|
|
<view class="u-flex-1 ">
|
|
<view class="u-flex input">
|
|
<up-input border="none"></up-input>
|
|
<up-icon color="#EB4F4F" @click="delGuigeHaocao(index,haocaiIndex)"
|
|
:size="16" name="minus-circle-fill"></up-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="u-flex u-m-t-16 color-666 u-font-24">
|
|
<view class="xuhao">
|
|
</view>
|
|
<view class="u-flex u-flex-1 u-p-l-32 gap-20">库存：{{item.stockNumber}}
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
</view>
|
|
<view class="u-flex">
|
|
<view class=" u-p-t-32 u-flex" @click="addGuigeHaocai(index)">
|
|
<up-icon :size="18" color="#318AFE" name="plus-circle-fill"></up-icon>
|
|
<view class="u-m-l-16">添加耗材</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<view class="list">
|
|
<view class="u-p-b-32 u-p-t-32 border-bottom" v-for="(item,index) in conInfos" :key="index">
|
|
<view class="color-666 u-flex">
|
|
<view class="xuhao">序号</view>
|
|
<view class="u-flex u-flex-1 u-p-l-32 gap-20">
|
|
<view class="u-flex-1">耗材名称</view>
|
|
<view class="u-flex-1">单位</view>
|
|
<view class="u-flex-1">用量</view>
|
|
</view>
|
|
</view>
|
|
<view class="u-m-t-32 color-666">
|
|
<view class=" u-m-t-24 u-flex">
|
|
<view class="xuhao">{{index+1}}</view>
|
|
<view class="u-flex u-flex-1 u-p-l-32 gap-20">
|
|
<view class="u-flex-1 ">
|
|
<choose-haocai @change="conInfosChange($event,item)" :listMap="$haocaiMap"
|
|
:list="haoCaiList" v-model="item.conInfoId"></choose-haocai>
|
|
<!-- <view class="u-flex input">
|
|
<view>{{item.conName}}</view>
|
|
<up-icon :size="10" name="arrow-down-fill"></up-icon>
|
|
</view> -->
|
|
</view>
|
|
<view class="u-flex-1 ">
|
|
<choose-danwei :listMap="$danweiMap" :list="danweiList"
|
|
v-model="item.conUnit"></choose-danwei>
|
|
<!-- <view class="u-flex input">
|
|
<view>{{item.conUnit}}</view>
|
|
<up-icon :size="10" name="arrow-down-fill"></up-icon>
|
|
</view> -->
|
|
</view>
|
|
<view class="u-flex-1 ">
|
|
<view class="u-flex input">
|
|
<up-input border="none" v-model="item.surplusStock"></up-input>
|
|
<up-icon @click="delHaocai(index)" color="#EB4F4F" :size="16"
|
|
name="minus-circle-fill"></up-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="u-flex u-m-t-16 u-font-24" v-if="item.stockNumber">
|
|
<view class="xuhao">
|
|
|
|
</view>
|
|
<view class="u-flex u-flex-1 u-p-l-32 gap-20">库存：{{item.stockNumber}}
|
|
{{item.conUnit}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<template v-if="!isBindGuige">
|
|
<view class="u-flex">
|
|
<view class=" u-p-t-32 u-flex" @click="addHaocai">
|
|
<up-icon :size="18" color="#318AFE" name="plus-circle-fill"></up-icon>
|
|
<view class="u-m-l-16">添加耗材</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
</view>
|
|
</view>
|
|
<view class="default-box-padding bg-fff border-r-18 u-flex u-row-between u-m-t-32">
|
|
<view>当某个耗材的使用库存不足时，商品自动
|
|
售罄。</view>
|
|
<view class="u-flex u-p-l-32">
|
|
<up-switch :size="20"></up-switch>
|
|
</view>
|
|
</view>
|
|
<view class="bottom">
|
|
<my-button type="primary" shape="circle" @click="save">保存</my-button>
|
|
<my-button bgColor="#F9F9F9" shape="circle" color="#999" @click="cancel">取消</my-button>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ref,
|
|
reactive,
|
|
toRefs,
|
|
watch,
|
|
computed,
|
|
onMounted
|
|
}
|
|
from 'vue';
|
|
import {
|
|
getviewConSku,
|
|
gettbProductSpec,
|
|
gettbConsInfo,
|
|
posttbProskuCons,
|
|
puttbProskuCon,
|
|
deletetbProskuCon,
|
|
} from "@/http/yskApi/consumable.js";
|
|
import {
|
|
tbShopCurrencyGet,$hasPermission
|
|
} from '@/http/yskApi/shop.js'
|
|
|
|
import chooseHaocai from './choose-haocai.vue';
|
|
import chooseDanwei from './choose-danwei.vue';
|
|
import {
|
|
$tbProskuConV2
|
|
} from '@/http/yskApi/goods.js'
|
|
const emits=defineEmits(['cancel'])
|
|
function cancel(){
|
|
emits('cancel')
|
|
}
|
|
const props = defineProps({
|
|
goods: {
|
|
type: Object,
|
|
default: () => {
|
|
return {
|
|
conInfos: [],
|
|
skuList: [],
|
|
typeEnum: ''
|
|
}
|
|
}
|
|
}
|
|
})
|
|
|
|
const conInfos = ref(props.goods.conInfos)
|
|
watch(() => props.goods.conInfos, (newval) => {
|
|
console.log(newval);
|
|
conInfos.value = newval
|
|
})
|
|
function conInfosChange(newval, item) {
|
|
console.log(newval);
|
|
item.stockNumber = newval.balance
|
|
item.conUnit = newval.conUnit
|
|
}
|
|
|
|
const skuList = ref(props.goods.skuList)
|
|
watch(() => props.goods.skuList, (newval) => {
|
|
console.log(newval);
|
|
skuList.value = newval
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
function addHaocai() {
|
|
conInfos.value.push({
|
|
conInfoId: '',
|
|
conUnit: '',
|
|
surplusStock: ''
|
|
})
|
|
}
|
|
const popup = reactive({
|
|
haocai: {
|
|
show: true
|
|
}
|
|
})
|
|
|
|
function addGuigeHaocai(index) {
|
|
console.log(index);
|
|
}
|
|
|
|
function delHaocai(index) {
|
|
const item = conInfos.value[index]
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '是否删除该耗材',
|
|
success(res) {
|
|
if (res.confirm) {
|
|
if (item.id) {
|
|
deletetbProskuCon([item.id]).then(res1 => {
|
|
conInfos.value.splice(index, 1)
|
|
})
|
|
} else {
|
|
conInfos.value.splice(index, 1)
|
|
}
|
|
|
|
}
|
|
}
|
|
})
|
|
|
|
}
|
|
|
|
function delGuigeHaocao(guigeIndex, haocaiIndex) {
|
|
skuList.value[guigeIndex].haoaiList.splice(haocaiIndex, 1)
|
|
}
|
|
|
|
// 是否是多规格商品
|
|
const isSku = computed(() => {
|
|
return props.goods.typeEnum == 'sku'
|
|
})
|
|
let isBindGuige = ref(isSku.value)
|
|
watch(() => props.goods.typeEnum, (newval) => {
|
|
isBindGuige.value = isSku.value
|
|
})
|
|
|
|
function save() {
|
|
console.log('save');
|
|
const isPas= conInfos.value.every(v=>{
|
|
return v.conInfoId&&v.conUnit&&v.surplusStock>0
|
|
})
|
|
console.log(isPas);
|
|
return
|
|
let ajaxData = ''
|
|
if (!isBindGuige.value) {
|
|
//绑定至商品
|
|
ajaxData = conInfos.value.map(v => {
|
|
return {
|
|
conInfoId: v.conInfoId,
|
|
productId: props.goods.id,
|
|
shopId: uni.getStorageSync('shopId'),
|
|
productSkuId: 0,
|
|
surplusStock: v.surplusStock
|
|
}
|
|
})
|
|
} else {
|
|
|
|
}
|
|
console.log(ajaxData);
|
|
$tbProskuConV2(ajaxData)
|
|
}
|
|
|
|
let haoCaiList = ref([])
|
|
let $haocaiMap = reactive({})
|
|
let danweiList = ref([])
|
|
let $danweiMap = reactive({})
|
|
|
|
function init() {
|
|
gettbConsInfo({
|
|
page: 0,
|
|
size: 200
|
|
}).then(res => {
|
|
for (let i in res.content) {
|
|
const item = res.content[i]
|
|
$haocaiMap[item.consId] = item
|
|
}
|
|
haoCaiList.value = res.content
|
|
|
|
})
|
|
tbShopCurrencyGet({
|
|
page: 0,
|
|
size: 200
|
|
}).then(res => {
|
|
for (let i in res.content) {
|
|
const item = res.content[i]
|
|
$danweiMap[item.id] = item
|
|
}
|
|
danweiList.value = res.content
|
|
})
|
|
}
|
|
onMounted(() => {
|
|
init()
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.bottom {
|
|
padding: 84rpx 82rpx;
|
|
}
|
|
|
|
.xuhao {
|
|
width: 52rpx;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.input {
|
|
width: 172rpx;
|
|
padding: 10rpx 16rpx;
|
|
height: 60rpx;
|
|
box-sizing: border-box;
|
|
background: #FFFFFF;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border: 2rpx solid #E5E5E5;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.list .border-bottom:last-child {
|
|
border: none;
|
|
}
|
|
</style> |