This commit is contained in:
dzc committed 2025-10-23 20:43:43 +08:00
commit 5547ec3c9d
2 files changed
+58 -143

No files matched your search

+31 -102
View File
@@ -30,20 +30,18 @@
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="计量单位" prop="unit">
<el-input v-model="form.unit" placeholder="请输入计量单位" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="定价方式" prop="priceType">
<el-radio-group v-model="form.priceType" @change="onPriceTypeChange">
<el-radio :label="1">多SKU模式</el-radio>
<el-radio :label="2">单价SPU模式</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<!-- <el-col :span="12" class="mb20">-->
<!-- <el-form-item label="计量单位" prop="unit">-->
<!-- <el-input v-model="form.unit" placeholder="请输入计量单位" />-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<el-col :span="8" class="mb20">
<el-form-item label="商品性质" prop="productNature">
<el-select v-model="form.productNature" placeholder="请选择商品性质">
<el-option :value="item.value" :label="item.label" v-for="(item, index) in supermarket_nature" :key="index" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="状态" prop="status">
@@ -54,23 +52,6 @@
</el-form-item>
</el-col>
<!-- 单价SPU模式的价格设置 -->
<template v-if="form.priceType === 2">
<el-col :span="12" class="mb20">
<el-form-item label="SPU售价" prop="spuPrice">
<el-input-number v-model="form.spuPrice" :precision="2" :min="0" placeholder="请输入SPU售价" style="width: 100%" />
<span class="price-tip">单位:元</span>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="划线价" prop="originalPrice">
<el-input-number v-model="form.originalPrice" :precision="2" :min="0" placeholder="请输入划线价" style="width: 100%" />
<span class="price-tip">单位:元</span>
</el-form-item>
</el-col>
</template>
<el-col :span="12" class="mb20">
<el-form-item label="开售时间" prop="saleStartTime">
<el-date-picker v-model="form.saleStartTime" type="datetime" placeholder="请选择开售时间" style="width: 100%" />
@@ -104,13 +85,13 @@
</el-tab-pane>
<!-- SKU信息 -->
<el-tab-pane label="SKU信息" name="sku" v-if="form.priceType === 1">
<el-tab-pane label="SKU信息" name="sku">
<div class="sku-header">
<el-button type="primary" @click="addSku" :disabled="loading">
<el-icon><Plus /></el-icon>
添加SKU
</el-button>
<span class="sku-tip">多SKU模式:支持不同规格的商品(如不同颜色、尺寸、配置等)</span>
<span class="sku-tip">单个商品添加一条SKU,多规格商品添加多条SKU(如不同颜色、尺寸等)</span>
</div>
<div class="sku-table-container">
@@ -240,6 +221,7 @@ import { tree as fetchCategoryTree } from "/@/api/supermarket/mallCategory"
const emit = defineEmits(["refresh"])
// 定义变量内容
const { supermarket_nature } = useDict("supermarket_nature")
const dataFormRef = ref()
const visible = ref(false)
const loading = ref(false)
@@ -269,10 +251,7 @@ const form = reactive({
title: "",
coverImage: "",
carouselImages: "",
priceType: 1, // 默认多SKU模式
spuPrice: 0,
originalPrice: 0,
unit: "",
productNature: "",
status: "0", // 默认上架
saleStartTime: "",
saleEndTime: "",
@@ -294,19 +273,6 @@ const dataRules = ref({
categoryId: [{ required: true, message: "商品分类不能为空", trigger: "change" }],
title: [{ required: true, message: "商品标题不能为空", trigger: "blur" }],
coverImage: [{ required: true, message: "主图不能为空", trigger: "blur" }],
priceType: [{ required: true, message: "定价方式不能为空", trigger: "change" }],
spuPrice: [
{
validator: (rule: any, value: any, callback: any) => {
if (form.priceType === 2 && (!value || value <= 0)) {
callback(new Error("单价SPU模式下,SPU售价不能为空且必须大于0"))
} else {
callback()
}
},
trigger: "blur",
},
],
status: [{ required: true, message: "状态不能为空", trigger: "change" }],
})
@@ -343,19 +309,6 @@ const removeSku = (index: number) => {
}
}
// 定价方式改变
const onPriceTypeChange = (value: number) => {
if (value === 1) {
// 多SKU模式:确保至少有一个SKU
if (form.skuList.length === 0) {
addSku()
}
} else {
// 单价SPU模式:清空SKU列表
form.skuList = []
}
}
// SKU字段验证
const validateSkuField = (index: number, field: string) => {
const sku = form.skuList[index]
@@ -384,10 +337,7 @@ const openDialog = (id: string) => {
title: "",
coverImage: "",
carouselImages: "",
priceType: 1,
spuPrice: 0,
originalPrice: 0,
unit: "",
productNature: "",
status: "0",
saleStartTime: "",
saleEndTime: "",
@@ -411,23 +361,21 @@ const onSubmit = async () => {
const valid = await dataFormRef.value.validate().catch(() => {})
if (!valid) return false
// 多SKU模式下的额外验证
if (form.priceType === 1) {
if (!form.skuList || form.skuList.length === 0) {
useMessage().error("多SKU模式下至少需要添加一个SKU")
// SKU验证
if (!form.skuList || form.skuList.length === 0) {
useMessage().error("至少需要添加一个SKU")
activeTab.value = "sku"
return false
}
// 验证SKU数据
for (let i = 0; i < form.skuList.length; i++) {
const sku = form.skuList[i]
if (!sku.skuCode || !sku.skuName || !sku.price || sku.stock === undefined) {
useMessage().error(`第${i + 1}个SKU信息不完整,请检查必填项`)
activeTab.value = "sku"
return false
}
// 验证SKU数据
for (let i = 0; i < form.skuList.length; i++) {
const sku = form.skuList[i]
if (!sku.skuCode || !sku.skuName || !sku.price || sku.stock === undefined) {
useMessage().error(`第${i + 1}个SKU信息不完整,请检查必填项`)
activeTab.value = "sku"
return false
}
}
}
try {
@@ -451,18 +399,7 @@ const onSubmit = async () => {
submitData.saleEndTime = date.toISOString().slice(0, 19).replace("T", " ")
}
// 如果是单价SPU模式,清空SKU列表
if (form.priceType === 2) {
submitData.skuList = []
}
// 价格转换:元转分
if (submitData.spuPrice) {
submitData.spuPrice = Math.round(submitData.spuPrice * 100)
}
if (submitData.originalPrice) {
submitData.originalPrice = Math.round(submitData.originalPrice * 100)
}
if (submitData.skuList && submitData.skuList.length > 0) {
submitData.skuList = submitData.skuList.map((sku: any) => ({
...sku,
@@ -495,12 +432,6 @@ const getmallProductData = async (id: string) => {
}
// 价格转换:分转元
if (form.spuPrice) {
form.spuPrice = form.spuPrice / 100
}
if (form.originalPrice) {
form.originalPrice = form.originalPrice / 100
}
if (form.skuList && form.skuList.length > 0) {
form.skuList = form.skuList.map((sku: any) => ({
...sku,
@@ -513,11 +444,9 @@ const getmallProductData = async (id: string) => {
form.categoryId = findCategoryPath(categoryOptions.value, res.data.categoryId) as any
}
// 如果没有SKU数据,根据定价方式初始化
// 如果没有SKU数据,默认添加一个
if (!form.skuList || form.skuList.length === 0) {
if (form.priceType === 1) {
addSku()
}
addSku()
}
} finally {
loading.value = false
+27 -41
View File
@@ -58,7 +58,7 @@
<el-table-column type="selection" width="40" align="center" />
<el-table-column type="index" label="#" width="40" />
<el-table-column prop="title" label="商品标题" width="200" show-overflow-tooltip />
<el-table-column prop="title" label="商品标题" show-overflow-tooltip />
<el-table-column prop="merchantId" label="商户" width="150" show-overflow-tooltip>
<template #default="scope">
@@ -72,52 +72,37 @@
</template>
</el-table-column>
<el-table-column prop="priceType" label="定价方式" width="120" align="center">
<template #default="scope">
<el-tag :type="scope.row.priceType === 1 ? 'primary' : 'success'">
{{ scope.row.priceType === 1 ? "多SKU" : "单价SPU" }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="价格信息" width="200">
<template #default="scope">
<div v-if="scope.row.priceType === 1">
<div v-if="scope.row.skuList && scope.row.skuList.length > 0">
<div class="price-range">
<span class="min-price">¥{{ getMinPrice(scope.row.skuList) }}</span>
<span v-if="getMinPrice(scope.row.skuList) !== getMaxPrice(scope.row.skuList)">
- ¥{{ getMaxPrice(scope.row.skuList) }}</span
>
</div>
<div class="sku-count">{{ scope.row.skuList.length }}个SKU</div>
<div v-if="scope.row.skuList && scope.row.skuList.length > 0">
<div class="price-range">
<span class="min-price">¥{{ getMinPrice(scope.row.skuList) }}</span>
<span v-if="getMinPrice(scope.row.skuList) !== getMaxPrice(scope.row.skuList)">
- ¥{{ getMaxPrice(scope.row.skuList) }}</span
>
</div>
<div v-else class="no-sku">暂无SKU</div>
</div>
<div v-else>
<div class="spu-price">¥{{ ((scope.row.spuPrice || 0) / 100).toFixed(2) }}</div>
<div v-if="scope.row.originalPrice" class="original-price">¥{{ ((scope.row.originalPrice || 0) / 100).toFixed(2) }}</div>
<div class="sku-count">{{ scope.row.skuList.length }}个SKU</div>
</div>
<div v-else class="no-sku">暂无SKU</div>
</template>
</el-table-column>
<el-table-column label="库存信息" width="120">
<template #default="scope">
<div v-if="scope.row.priceType === 1">
<div v-if="scope.row.skuList && scope.row.skuList.length > 0">
<div class="total-stock">{{ getTotalStock(scope.row.skuList) }}</div>
<div class="sku-count">{{ scope.row.skuList.length }}个SKU</div>
</div>
<div v-else class="no-stock">0</div>
</div>
<div v-else>
<div class="spu-stock">{{ scope.row.totalStock || 0 }}</div>
<div v-if="scope.row.skuList && scope.row.skuList.length > 0">
<div class="total-stock">{{ getTotalStock(scope.row.skuList) }}</div>
<div class="sku-count">{{ scope.row.skuList.length }}个SKU</div>
</div>
<div v-else class="no-stock">0</div>
</template>
</el-table-column>
<el-table-column prop="unit" label="单位" width="80" align="center" />
<el-table-column prop="productNature" label="商品性质" show-overflow-tooltip width="150">
<template #default="scope">
<dict-tag :options="supermarket_nature" :value="scope.row.productNature" />
</template>
</el-table-column>
<el-table-column prop="status" label="状态" width="100" align="center">
<template #default="scope">
<el-tag :type="scope.row.status === '0' ? 'success' : 'danger'">
@@ -130,10 +115,10 @@
<el-table-column prop="saleEndTime" label="停售时间" width="160" show-overflow-tooltip />
<el-table-column label="SKU详情" width="120" align="center">
<!-- <el-table-column label="SKU详情" width="120" align="center">
<template #default="scope">
<el-button
v-if="scope.row.priceType === 1 && scope.row.skuList && scope.row.skuList.length > 0"
v-if="scope.row.skuList && scope.row.skuList.length > 0"
type="primary"
size="small"
@click="showSkuDetail(scope.row)"
@@ -142,7 +127,7 @@
</el-button>
<span v-else class="no-sku-detail">-</span>
</template>
</el-table-column>
</el-table-column>-->
<el-table-column label="操作" width="180" fixed="right">
<template #default="scope">
@@ -167,7 +152,7 @@
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
<!-- SKU详情弹窗 -->
<el-dialog v-model="skuDetailVisible" title="SKU详情" width="80%" :close-on-click-modal="false">
<!-- <el-dialog v-model="skuDetailVisible" title="SKU详情" width="80%" :close-on-click-modal="false">
<div v-if="currentProduct">
<div class="product-info">
<h3>{{ currentProduct.title }}</h3>
@@ -201,7 +186,7 @@
<el-button @click="skuDetailVisible = false">关闭</el-button>
</span>
</template>
</el-dialog>
</el-dialog>-->
</div>
</template>
@@ -211,7 +196,8 @@ import { fetchList, delObjs } from "/@/api/supermarket/mallProduct"
import { useMessage, useMessageBox } from "/@/hooks/message"
import { tree as fetchCategoryTree } from "/@/api/supermarket/mallCategory"
import { select } from "/@/api/wallet/mch-manage"
import {useDict} from "/@/hooks/dict";
const { supermarket_nature } = useDict("supermarket_nature")
// 引入组件
const FormDialog = defineAsyncComponent(() => import("./form.vue"))