|
|
@@ -5,7 +5,7 @@
|
|
|
<el-button type="primary" size="mini" icon="el-icon-plus" @click="showDialog(null)">添加SKU</el-button>
|
|
|
</div>
|
|
|
|
|
|
- <el-table :data="skus" border stripe size="small" :max-height="tableHeight">
|
|
|
+ <el-table :data="effectiveSkus" border stripe size="small" :max-height="tableHeight">
|
|
|
<el-table-column prop="id" label="ID" width="60" />
|
|
|
<el-table-column label="规格" min-width="120">
|
|
|
<template slot-scope="{ row }">
|
|
|
@@ -99,6 +99,7 @@ export default {
|
|
|
data() {
|
|
|
return {
|
|
|
skus: [],
|
|
|
+ pendingSkus: [],
|
|
|
loading: false,
|
|
|
dialogVisible: false,
|
|
|
saving: false,
|
|
|
@@ -122,6 +123,9 @@ export default {
|
|
|
tableHeight() {
|
|
|
return window.innerHeight - 300
|
|
|
},
|
|
|
+ effectiveSkus() {
|
|
|
+ return this.productId ? this.skus : this.pendingSkus
|
|
|
+ },
|
|
|
dialogTitle() {
|
|
|
return this.editingId ? '编辑SKU' : '添加SKU'
|
|
|
},
|
|
|
@@ -137,8 +141,12 @@ const baseURL = process.env.VUE_APP_BASE_API || ''
|
|
|
watch: {
|
|
|
productId: {
|
|
|
immediate: true,
|
|
|
- handler(val) {
|
|
|
+ async handler(val) {
|
|
|
if (val) {
|
|
|
+ // 新建商品时:先用暂存 SKU 创建
|
|
|
+ if (this.pendingSkus.length > 0) {
|
|
|
+ await this.flushPendingSkus()
|
|
|
+ }
|
|
|
this.loadSkus()
|
|
|
}
|
|
|
}
|
|
|
@@ -271,6 +279,16 @@ const baseURL = process.env.VUE_APP_BASE_API || ''
|
|
|
image: this.skuForm.image,
|
|
|
enabled: this.skuForm.enabled
|
|
|
}
|
|
|
+ // 新建商品时productId为空,暂存到本地
|
|
|
+ if (!this.productId) {
|
|
|
+ payload.id = Date.now()
|
|
|
+ delete payload.productId
|
|
|
+ this.pendingSkus.push(payload)
|
|
|
+ this.dialogVisible = false
|
|
|
+ this.$message.success('添加成功,保存商品时将自动创建SKU')
|
|
|
+ this.saving = false
|
|
|
+ return
|
|
|
+ }
|
|
|
let res
|
|
|
if (this.editingId) {
|
|
|
payload.id = this.editingId
|
|
|
@@ -293,7 +311,23 @@ const baseURL = process.env.VUE_APP_BASE_API || ''
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ async flushPendingSkus() {
|
|
|
+ if (!this.productId || this.pendingSkus.length === 0) return
|
|
|
+ const results = await Promise.allSettled(
|
|
|
+ this.pendingSkus.map(sku => createProductSku({ ...sku, productId: this.productId }))
|
|
|
+ )
|
|
|
+ this.pendingSkus = []
|
|
|
+ results.forEach((r, i) => {
|
|
|
+ if (r.status === 'rejected') {
|
|
|
+ console.error('创建SKU失败', i + 1, r.reason)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
async handleDelete(id) {
|
|
|
+ if (!this.productId) {
|
|
|
+ this.pendingSkus = this.pendingSkus.filter(s => s.id !== id)
|
|
|
+ return
|
|
|
+ }
|
|
|
try {
|
|
|
await this.$confirm('确认删除该SKU?', '提示')
|
|
|
const res = await deleteProductSku(id)
|