diff --git a/src/pages/product/ProductDetail.vue b/src/pages/product/ProductDetail.vue index 491ee63..1e2e931 100644 --- a/src/pages/product/ProductDetail.vue +++ b/src/pages/product/ProductDetail.vue @@ -83,38 +83,13 @@
-
-
- - -
- -
-
-
- 销售规格 - -
-
-
- - -
-
-
-
- + @@ -123,31 +98,80 @@ - - -
-
+
+ +
+
+
销售单位 采购、销售和库存操作共用
-
-
-
- - -
-
-
-
-
+ + + + + + + +
@@ -171,7 +195,6 @@ import { formatProductAmount, getProductPhotoURL, getProductQuantityText, - getProductSkuSpecEntries, getProductStatusText } from "@/utils/product"; import { Message } from "@/utils/message"; @@ -197,7 +220,6 @@ const attachmentItemList = computed(() => (product.value?.attachmen url: getAttachmentReadURL(item.id || "", 90) }))); const attachmentUrlList = computed(() => attachmentItemList.value.map(item => item.url)); -const skuSpecEntries = computed(() => getProductSkuSpecEntries(selectedSku.value || { specValueIdList: [] }, product.value?.specList || [])); const skuPhotoItemList = computed(() => (selectedSku.value?.attachmentList || []) .filter(item => !!item.id) .map(item => ({ @@ -264,12 +286,12 @@ function closeSkuDetail(): void { skuDetailVisible.value = false; } -function getUnitSummary(unit: ProductSkuUnit): string { - const quantityText = unit.isBase ? "基础单位" : `1 ${unit.name || "单位"} = ${getProductQuantityText(unit.baseQuantityPerUnit)} 基础单位`; - const priceText = unit.salePrice === null || unit.salePrice === undefined ? "未定价" : `¥${formatProductAmount(unit.salePrice)}`; - const saleText = unit.allowSale ? "可销售" : "停售"; - const purchaseText = unit.allowPurchase ? "可采购" : "禁采购"; - return `${quantityText} · ${priceText} · ${saleText} · ${purchaseText}`; +function getUnitDescription(unit: ProductSkuUnit, sku: ProductSku): string { + if (unit.isBase) { + return ""; + } + const baseUnitName = sku.unitList?.find(item => item.isBase)?.name || "基础单位"; + return `1 ${unit.name || "单位"} = ${getProductQuantityText(unit.baseQuantityPerUnit)} ${baseUnitName}`; } function getCurrentRouteDepth(): number { @@ -358,153 +380,66 @@ onUnmounted(() => navBarStore.clearRight()); } .sku-popup { - max-height: 100%; padding: 1rem 0 calc(1rem + env(safe-area-inset-bottom, 0px)); + max-height: 100%; overflow-y: auto; - .sku-popup-header { - gap: .75rem; - display: flex; - padding: 0 1rem .75rem; - align-items: center; - justify-content: space-between; + .media-wrap { + margin: 0 1rem; } - .sku-heading { - gap: .5rem; - min-width: 0; - display: flex; - flex-direction: column; - - strong { - font-size: 1.125rem; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - } - - .code { - color: var(--td-text-color-secondary); - font-size: .75rem; - } - } - - .sku-spec-panel { - margin: 0 .75rem .75rem; - padding: .75rem; - background: var(--td-bg-color-secondarycontainer); - border-radius: .875rem; - } - - .section-title { - gap: .5rem; - display: flex; - align-items: baseline; - justify-content: space-between; - - span { - color: var(--td-text-color-secondary); - font-size: .75rem; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - } - } - - .sku-spec-list { - gap: .5rem; - display: grid; - margin-top: .625rem; - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - - .sku-spec-item { - gap: .375rem; - min-width: 0; - display: flex; - padding: .5rem .625rem; - align-items: baseline; - background: var(--td-bg-color-container); - border-radius: .625rem; - - .spec-name { - color: var(--td-text-color-secondary); - font-size: .75rem; - flex: none; - } - - strong { - min-width: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - } - } - - .sku-spec-empty, - .unit-empty { - color: var(--td-text-color-secondary); - font-size: .75rem; - } - - .sku-spec-empty { - margin-top: .5rem; - } - - :deep(.t-cell-group) { - margin: 0 0 .75rem; - } - - :deep(.media-selector) { - margin: 0 .75rem .75rem; - } - - .unit-section { + .unit { margin-top: .75rem; border-top: 1px solid var(--td-component-border); - } - .unit-heading { - gap: .5rem; - display: flex; - padding: .75rem 1rem .5rem; - align-items: baseline; - justify-content: space-between; + .header { + gap: .5rem; + display: flex; + padding: .75rem 1rem .5rem; + align-items: baseline; + justify-content: space-between; - span { - color: var(--td-text-color-secondary); - font-size: .75rem; - text-align: right; + span { + color: var(--td-text-color-secondary); + font-size: .75rem; + text-align: right; + } } - } - .unit-list { - gap: .5rem; - display: flex; - padding: 0 1rem .75rem; - flex-direction: column; - } + .items { - .unit-item { - gap: .375rem; - display: flex; - padding: .625rem .75rem; - background: var(--td-bg-color-secondarycontainer); - border-radius: .75rem; - flex-direction: column; - } + :deep(.t-cell-group) { + margin: 0; + } - .unit-name { - gap: .5rem; - display: flex; - align-items: center; - justify-content: space-between; - } + .item { - .unit-meta { - color: var(--td-text-color-secondary); - font-size: .75rem; - line-height: 1.5; + .title { + gap: .5rem; + display: flex; + align-items: center; + + .transfer { + color: var(--td-text-color-secondary); + font-size: .75rem; + line-height: 1.5; + } + } + } + + .note { + + .price { + color: var(--td-error-color); + font-weight: 600; + } + } + + .description { + gap: .5rem; + display: flex; + } + } } }