update sku tags

src/pages/product/ProductStockRecordDetail.vue

@@ -5,7 +5,12 @@
 			<section class="snapshot-head" v-entrance-transition>
 				<div class="eyebrow">库存 SKU 快照</div>
 				<h2 v-text="record.productNameSnapshot || '未命名产品'" />
-				<div class="sku" v-text="record.skuNameSnapshot || record.specSummarySnapshot || '默认 SKU'" />
+				<product-sku-snapshot-tags
+					class="sku"
+					:snapshot="record.skuSpecSnapshot"
+					:fallback="record.skuNameSnapshot || record.specSummarySnapshot || '默认 SKU'"
+					:unit="record.unitSnapshot"
+				/>
 				<div class="meta">
 					<span v-text="record.skuCodeSnapshot || '无 SKU 编码'" />
 					<t-tag size="small" variant="light-outline" :theme="getOperationTheme(record.onHandDelta)" :content="getStockOperationText(record.operationType)" />
@@ -132,6 +137,7 @@ import { PassTimeLabel } from "timi-web";
 import { useUserStore, type Attachment } from "timi-web-api";
 import ProductAPI from "@/api/ProductAPI";
 import PhotoScroller from "@/components/PhotoScroller.vue";
+import ProductSkuSnapshotTags from "@/components/ProductSkuSnapshotTags.vue";
 import { useNavBarStore } from "@/store/navBarStore";
 import type { PhotoItem } from "@/types/Photo";
 import type { StockBizType, StockRecord } from "@/types/Product";

src/pages/product/ProductStockRecordList.vue

@@ -54,7 +54,12 @@
 				    </template>
 					<template #description>
 						<div class="description">
-							<span v-text="getRecordTitle(record)" />
+							<strong v-text="record.productNameSnapshot || '未命名产品'" />
+							<product-sku-snapshot-tags
+								:snapshot="record.skuSpecSnapshot"
+								:fallback="record.skuNameSnapshot || record.specSummarySnapshot || '默认 SKU'"
+								:unit="record.unitSnapshot"
+							/>
 							<pass-time-label :timestamp="record.occurredAt" underline />
 						</div>
 					</template>
@@ -70,6 +75,7 @@
 import { type DropdownValue } from "tdesign-mobile-vue";
 import { PassTimeLabel } from "timi-web";
 import ProductAPI from "@/api/ProductAPI";
+import ProductSkuSnapshotTags from "@/components/ProductSkuSnapshotTags.vue";
 import { useNavBarStore } from "@/store/navBarStore";
 import type { StockOperationType, StockRecord, StockRecordDirection } from "@/types/Product";
 import { getErrorMessage } from "@/utils/error";
@@ -157,11 +163,6 @@ function getStockQuantityText(record: StockRecord): string {
 	return `${getProductQuantityText(record.quantity)}${unitText}`;
 }
 
-function getRecordTitle(record: StockRecord): string {
-	const skuText = record.skuNameSnapshot || record.specSummarySnapshot;
-	return `${record.productNameSnapshot || "未命名产品"}${skuText ? ` · ${skuText}` : ""}${record.unitSnapshot ? ` / ${record.unitSnapshot}` : ""}`;
-}
-
 function getDeltaText(value?: number | string): string {
   const amount = Number(value || 0);
   const text = String(value || "0").replace(/^-/, "");