2024-06-04 18:43:13 +08:00
|
|
|
|
<template>
|
2024-08-29 18:06:05 +08:00
|
|
|
|
<div class="sku-item">
|
|
|
|
|
<uni-forms label-width="176rpx" label-position="left">
|
|
|
|
|
<template v-if="specType">
|
|
|
|
|
<template v-for="item in formData.properties">
|
|
|
|
|
<uni-forms-item :label="item.propertyName">
|
|
|
|
|
<uni-easyinput type="text" :value="item.valueName" disabled />
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
</template>
|
|
|
|
|
</template>
|
2024-06-07 02:05:33 +08:00
|
|
|
|
|
2024-08-29 18:06:05 +08:00
|
|
|
|
<uni-forms-item label="商品封面图" name="picUrl" label-position="top">
|
|
|
|
|
<p-uploader
|
|
|
|
|
v-model:url="formData.picUrl"
|
|
|
|
|
:readonly="!canEdit"
|
|
|
|
|
fileMediatype="image"
|
|
|
|
|
limit="1"
|
|
|
|
|
mode="grid"
|
|
|
|
|
:imageStyles="{ width: '168rpx', height: '168rpx' }"
|
|
|
|
|
/>
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
<uni-forms-item label="商品条码" name="barCode">
|
|
|
|
|
<uni-easyinput
|
|
|
|
|
type="text"
|
|
|
|
|
trim="all"
|
|
|
|
|
v-model="formData.barCode"
|
|
|
|
|
:disabled="!canEdit"
|
|
|
|
|
placeholder="请输入商品条码"
|
|
|
|
|
/>
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
<uni-forms-item label="销售价" name="price">
|
|
|
|
|
<uni-easyinput
|
|
|
|
|
type="digit"
|
|
|
|
|
trim="all"
|
|
|
|
|
v-model="formData.price"
|
|
|
|
|
:disabled="!canEdit"
|
|
|
|
|
placeholder="请输入商品销售价"
|
|
|
|
|
/>
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
<uni-forms-item label="市场价" name="marketPrice">
|
|
|
|
|
<uni-easyinput
|
|
|
|
|
type="digit"
|
|
|
|
|
trim="all"
|
|
|
|
|
v-model="formData.marketPrice"
|
|
|
|
|
:disabled="!canEdit"
|
|
|
|
|
placeholder="请输入商品销售价"
|
|
|
|
|
/>
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
<uni-forms-item label="成本价" name="costPrice">
|
|
|
|
|
<uni-easyinput
|
|
|
|
|
type="digit"
|
|
|
|
|
trim="all"
|
|
|
|
|
v-model="formData.costPrice"
|
|
|
|
|
:disabled="!canEdit"
|
|
|
|
|
placeholder="请输入商品销售价"
|
|
|
|
|
/>
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
<uni-forms-item label="库存" name="stock">
|
|
|
|
|
<uni-easyinput
|
|
|
|
|
type="number"
|
|
|
|
|
trim="all"
|
|
|
|
|
v-model="formData.stock"
|
|
|
|
|
:disabled="!canEdit"
|
|
|
|
|
placeholder="请输入商品库存"
|
|
|
|
|
/>
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
<uni-forms-item label="重量(kg)" name="weight">
|
|
|
|
|
<uni-easyinput
|
|
|
|
|
type="digit"
|
|
|
|
|
trim="all"
|
|
|
|
|
v-model="formData.weight"
|
|
|
|
|
:disabled="!canEdit"
|
|
|
|
|
placeholder="请输入商品重量"
|
|
|
|
|
/>
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
<uni-forms-item label="体积(m³)" name="volume">
|
|
|
|
|
<uni-easyinput
|
|
|
|
|
type="digit"
|
|
|
|
|
trim="all"
|
|
|
|
|
v-model="formData.volume"
|
|
|
|
|
:disabled="!canEdit"
|
|
|
|
|
placeholder="请输入商品体积"
|
|
|
|
|
/>
|
|
|
|
|
</uni-forms-item>
|
|
|
|
|
</uni-forms>
|
|
|
|
|
</div>
|
2024-06-04 18:43:13 +08:00
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup>
|
2024-06-07 02:05:33 +08:00
|
|
|
|
import { ref, watch, computed, defineProps } from 'vue'
|
|
|
|
|
import peach from '@/peach'
|
2024-06-11 18:33:56 +08:00
|
|
|
|
import { canEdit } from '../js/sku'
|
2024-06-07 02:05:33 +08:00
|
|
|
|
const props = defineProps({
|
2024-08-29 18:06:05 +08:00
|
|
|
|
skus: {
|
|
|
|
|
type: Array,
|
|
|
|
|
default: () => [],
|
|
|
|
|
},
|
2024-06-07 02:05:33 +08:00
|
|
|
|
})
|
2024-06-04 18:43:13 +08:00
|
|
|
|
const formData = ref({})
|
2024-06-12 18:33:39 +08:00
|
|
|
|
const specType = computed(() => peach.$store('trade').specType)
|
2024-06-07 02:05:33 +08:00
|
|
|
|
|
2024-06-11 18:33:56 +08:00
|
|
|
|
watch(
|
2024-08-29 18:06:05 +08:00
|
|
|
|
() => props.skus,
|
|
|
|
|
(newVal) => {
|
|
|
|
|
// 如果是单规格,取 sku 第一条数据
|
|
|
|
|
if (!specType.value) {
|
|
|
|
|
if (newVal) formData.value = newVal[0] ?? {}
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
formData.value = newVal ?? {}
|
|
|
|
|
},
|
|
|
|
|
{ immediate: true }
|
2024-06-11 18:33:56 +08:00
|
|
|
|
)
|
2024-06-04 18:43:13 +08:00
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.sku-item {
|
2024-08-29 18:06:05 +08:00
|
|
|
|
margin: 40rpx;
|
|
|
|
|
padding-top: 40rpx;
|
2024-06-07 02:05:33 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.sku-item:first-child {
|
2024-08-29 18:06:05 +08:00
|
|
|
|
border-top: 1px solid var(--ui-BG-Main);
|
2024-06-04 18:43:13 +08:00
|
|
|
|
}
|
|
|
|
|
</style>
|