support gift

src/pages/fulfillment/OrderFulfillmentCreate.vue

@@ -26,6 +26,7 @@
 						<div class="title">
 							<div class="heading">
 								<strong v-text="item.productNameSnapshot || '未命名产品'" />
+								<t-tag v-if="item.gifted" size="small" theme="success" content="赠送" />
 								<span v-text="getItemDescription(item)" />
 							</div>
 							<div

src/pages/fulfillment/OrderFulfillmentDetail.vue

@@ -34,6 +34,7 @@
 				>
 					<template #description>
 						<div class="item-description">
+							<t-tag v-if="isGiftedFulfillmentItem(item)" size="small" theme="success" content="赠送" />
 							<product-sku-snapshot-tags
 								:product-name="item.productNameSnapshot"
 								:snapshot="item.skuSpecSnapshot"
@@ -200,6 +201,10 @@ function getFulfillmentQuantityText(item: OrderFulfillmentItem): string {
 	return `履约数量 ${getPackageQuantityText(item.quantity)} ${item.unitSnapshot || "单位"}`;
 }
 
+function isGiftedFulfillmentItem(item: OrderFulfillmentItem): boolean {
+	return Boolean(order.value?.itemList?.find(orderItem => orderItem.id === item.sourceOrderItemId)?.gifted);
+}
+
 async function loadData(): Promise<void> {
 	const id = String(route.params.id || "");
 	if (!id) return;

src/pages/package/PackagePurchase.vue

@@ -44,20 +44,19 @@
 				:customer="selectedCustomer"
 				v-entrance-transition
 			/>
-			<t-form-item v-if="isCustomerPackageCreate" label="套餐" required-mark>
-				<t-input
-					:model-value="config?.name || ''"
-					readonly
-					borderless
-					placeholder="请选择套餐"
-					@click="configSelectorVisible = true"
-				/>
-			</t-form-item>
+			<t-form-item
+				v-if="isCustomerPackageCreate"
+				label="套餐"
+				required-mark
+				content-align="right"
+				arrow
+				@click="configSelectorVisible = true"
+			>选择套餐</t-form-item>
 			<div v-if="config && !isSaleable" class="saleable-tip red">套餐当前不可购买，请检查套餐状态和有效期</div>
-			<section class="package-purchase-form">
-				<div v-if="config" class="config-summary">
+			<t-form-item v-if="config" label-width="0">
+				<div class="config-summary">
 					<div class="header">
-						<div class="text-bold" v-text="config.name || '未命名套餐'" />
+						<div class="name text-bold clip-text" v-text="config.name || '未命名套餐'" />
 						<div class="price">
 							<span class="label gray">标准价：</span>
 							<span class="value red text-bold" v-text="formatPackageAmount(config.standardAmount)" />
@@ -65,80 +64,93 @@
 					</div>
 					<div class="description" v-text="config.description" />
 				</div>
-				<div v-else class="center-tips" v-text="'当前套餐未返回，无法完成购买。'" />
-				<t-form-item label="成交价（元）" label-width="6rem" required-mark>
-					<t-input
-						v-model.trim="saleAmountText"
-						type="number"
-						align="right"
-						borderless
-						:readonly="!canPriceOverride"
-						placeholder="请输入成交价"
-					/>
-				</t-form-item>
-				<t-form-item label-width="0">
-					<t-form class="items" label-width="2.5rem">
-						<div class="title">
-							<strong>购买权益明细</strong>
-							<span v-if="!canPriceOverride">当前账号无定制权限，仅可等值转换单位</span>
-						</div>
-						<t-form-item
-							v-for="(item, index) in packagePurchaseItemList"
-							:key="`${index}-${item.skuId}-${item.skuUnitId}`"
-							class="item"
-						>
-							<template #label>
-								<t-image
-									v-if="getItemPhotoURL(item)"
-									:src="getItemPhotoURL(item)"
-									:alt="getItemName(item)"
-									fit="cover"
-									class="avatar"
-								/>
-								<div
-									v-else
-									class="avatar fallback"
-									v-text="getItemName(item).slice(0, 1)"
-								/>
-							</template>
-							<div class="content">
+			</t-form-item>
+			<t-form-item label="成交价（元）" label-width="6rem" required-mark>
+				<t-input
+					v-model.trim="saleAmountText"
+					type="number"
+					align="right"
+					borderless
+					:readonly="!canPriceOverride"
+					placeholder="请输入成交价"
+				/>
+			</t-form-item>
+			<t-form-item v-if="config" label="购买权益明细" label-align="top">
+				<t-form class="items" label-width="2.5rem">
+					<span v-if="!canPriceOverride">当前账号无定制权限，仅可等值转换单位</span>
+					<t-form-item
+						v-for="(item, index) in packagePurchaseItemList"
+						:key="`${index}-${item.skuId}-${item.skuUnitId}-${item.gifted}`"
+						class="item"
+					>
+						<template #label>
+							<t-image
+								v-if="getItemPhotoURL(item)"
+								:src="getItemPhotoURL(item)"
+								:alt="getItemName(item)"
+								fit="cover"
+								class="avatar"
+							/>
+							<div
+								v-else
+								class="avatar fallback"
+								v-text="getItemName(item).slice(0, 1)"
+							/>
+						</template>
+						<div class="content">
+							<div class="main">
 								<span class="name" v-text="getItemLabel(item)" />
+								<t-tag v-if="item.gifted" size="small" theme="success" content="赠" />
 								<t-input
 									class="input"
 									:model-value="item.totalQuantity"
 									type="number"
-									:readonly="!canPriceOverride"
+									:readonly="!canEditItem(item)"
 									placeholder="总权益数量"
 									borderless
 									align="right"
 									@update:model-value="updateItemQuantity(index, $event)"
 								>
-									<template #suffix-icon>
-										<div class="actions">
-											<t-button
-												size="extra-small"
-												variant="outline"
-												:content="getItemUnit(item)?.name || '选择单位'"
-												@click="openItemUnitPicker(index)"
-											/>
-											<t-button
-												v-if="canPriceOverride"
-												class="remove"
-												size="extra-small"
-												theme="danger"
-												variant="text"
-												content="移除"
-												@click="removePurchaseItem(index)"
-											/>
-										</div>
-									</template>
 								</t-input>
+								<div class="actions">
+									<t-button
+										size="extra-small"
+										variant="outline"
+										:content="getItemUnit(item)?.name || '选择单位'"
+										@click="openItemUnitPicker(index)"
+									/>
+									<t-button
+										v-if="canRemoveItem(item)"
+										class="remove"
+										size="extra-small"
+										theme="danger"
+										variant="text"
+										content="移除"
+										@click="removePurchaseItem(index)"
+									/>
+								</div>
 							</div>
-						</t-form-item>
-						<div v-if="!packagePurchaseItemList.length" class="center-tips" v-text="'当前套餐暂无权益明细'" />
-					</t-form>
-				</t-form-item>
-			</section>
+							<t-input
+								v-if="item.gifted"
+								class="gift-remark"
+								:model-value="item.remark || ''"
+								align="right"
+								borderless
+								placeholder="赠送说明（选填）"
+								@update:model-value="updateItemRemark(index, $event)"
+							/>
+						</div>
+					</t-form-item>
+					<product-selector
+						v-if="canGiftCreate"
+						:model-value="undefined"
+						label=""
+						placeholder="添加可售赠送产品"
+						@update:model-value="addGiftProduct"
+					/>
+					<div v-if="!packagePurchaseItemList.length" class="center-tips" v-text="'当前套餐暂无权益明细'" />
+				</t-form>
+			</t-form-item>
 			<t-form-item label="购买时间" content-align="right">
 				<div class="time-actions">
 					<t-button
@@ -254,9 +266,14 @@ import { useSettingStore } from "@/store/settingStore";
 import type { Customer } from "@/types/Customer";
 import type { PhotoItem } from "@/types/Photo";
 import type { GaoPackageConfig, PackageAttachment, PackagePurchaseItem } from "@/types/Package";
-import type { ProductSku, ProductSkuUnit } from "@/types/Product";
+import type { Product, ProductSku, ProductSkuUnit } from "@/types/Product";
 import { getErrorMessage } from "@/utils/error";
-import { addPackageQuantity, convertPackageQuantity, formatPackageAmount, normalizePackageQuantity } from "@/utils/package";
+import {
+	addPackageQuantity,
+	convertPackageQuantity,
+	formatPackageAmount,
+	normalizePackageQuantity
+} from "@/utils/package";
 import { Message } from "@/utils/message";
 import { permissionCodes } from "@/utils/permission";
 import { uploadPhotoList } from "@/utils/photo";
@@ -280,6 +297,7 @@ const config = ref<GaoPackageConfig>();
 const configList = ref<GaoPackageConfig[]>([]);
 const configSelectorVisible = ref(false);
 const skuMap = reactive<Record<string, ProductSku>>({});
+const giftProductMap = reactive<Record<string, Product>>({});
 const unitPickerVisible = ref(false);
 const unitPickerIndex = ref(-1);
 const unitPickerDraft = ref<Array<string | number>>([]);
@@ -417,6 +435,7 @@ function buildAttachments(): PackageAttachment[] {
 const {
 	isSaleable,
 	canPriceOverride,
+	canGiftCreate,
 	saleAmountText,
 	packagePurchaseItemList,
 	applyConfig,
@@ -439,16 +458,19 @@ const unitPickerOptions = computed(() => {
 
 function getItemLabel(item: PackagePurchaseItem): string {
 	const configItem = config.value?.itemList?.find(configItem => configItem.skuId === item.skuId);
-	if (!configItem) {
-		return "产品权益";
-	}
-	const productName = configItem.productNameSnapshot || "未命名产品";
-	const skuText = getProductSkuSnapshotText(productName, configItem.skuNameSnapshot, configItem.specSummarySnapshot);
+	const product = item.gifted ? giftProductMap[item.skuId] : undefined;
+	const productName = item.gifted
+		? product?.name || item.productNameSnapshot || "未命名产品"
+		: configItem?.productNameSnapshot || "未命名产品";
+	const skuName = item.gifted ? item.skuNameSnapshot || getItemSku(item)?.name : configItem?.skuNameSnapshot;
+	const specSummary = item.gifted ? item.specSummarySnapshot || getItemSku(item)?.specSummary : configItem?.specSummarySnapshot;
+	const skuText = getProductSkuSnapshotText(productName, skuName, specSummary);
 	return skuText ? `${productName} · ${skuText}` : productName;
 }
 
 function getItemName(item: PackagePurchaseItem): string {
-	return config.value?.itemList?.find(configItem => configItem.skuId === item.skuId)?.productNameSnapshot || "未命名产品";
+	return item.gifted ? giftProductMap[item.skuId]?.name || item.productNameSnapshot || "未命名产品"
+		: config.value?.itemList?.find(configItem => configItem.skuId === item.skuId)?.productNameSnapshot || "未命名产品";
 }
 
 function getItemPhotoURL(item: PackagePurchaseItem): string {
@@ -464,6 +486,9 @@ function getItemUnit(item: PackagePurchaseItem): ProductSkuUnit | undefined {
 }
 
 function getSelectableUnitList(item: PackagePurchaseItem): ProductSkuUnit[] {
+	if (item.gifted) {
+		return (getItemSku(item)?.unitList || []).filter(unit => unit.allowSale !== false && !!unit.id);
+	}
 	const maxBaseQuantityPerUnit = Math.max(...(config.value?.itemList || [])
 		.filter(configItem => configItem.skuId === item.skuId)
 		.map(configItem => Number(configItem.baseQuantityPerUnitSnapshot || 0)));
@@ -473,7 +498,7 @@ function getSelectableUnitList(item: PackagePurchaseItem): ProductSkuUnit[] {
 
 function openItemUnitPicker(index: number): void {
 	const item = packagePurchaseItemList.value[index];
-	if (!item || !getSelectableUnitList(item).length) {
+	if (!item || !canEditItem(item) || !getSelectableUnitList(item).length) {
 		Message.warning("当前 SKU 没有可用于套餐权益的销售单位");
 		return;
 	}
@@ -488,7 +513,7 @@ function confirmItemUnitPicker(value: Array<string | number>): void {
 	const skuUnitId = String(value[0] || "");
 	const currentUnit = item && getItemUnit(item);
 	const targetUnit = item && getSelectableUnitList(item).find(unit => unit.id === skuUnitId);
-	if (!item || !currentUnit || !targetUnit || !skuUnitId || skuUnitId === item.skuUnitId) {
+	if (!item || !canEditItem(item) || !currentUnit || !targetUnit || !skuUnitId || skuUnitId === item.skuUnitId) {
 		unitPickerVisible.value = false;
 		return;
 	}
@@ -498,7 +523,7 @@ function confirmItemUnitPicker(value: Array<string | number>): void {
 		return;
 	}
 	const duplicateIndex = packagePurchaseItemList.value.findIndex((candidate, candidateIndex) => candidateIndex !== index
-		&& candidate.skuId === item.skuId && candidate.skuUnitId === skuUnitId);
+		&& candidate.skuId === item.skuId && candidate.skuUnitId === skuUnitId && Boolean(candidate.gifted) === Boolean(item.gifted));
 	if (duplicateIndex < 0) {
 		packagePurchaseItemList.value[index] = { ...item, skuUnitId, totalQuantity: convertedQuantity };
 	} else {
@@ -522,7 +547,63 @@ function confirmItemUnitPicker(value: Array<string | number>): void {
 	unitPickerVisible.value = false;
 }
 
+async function addGiftProduct(value?: { skuId: string; skuUnitId: string }): Promise<void> {
+	if (!value || !canGiftCreate.value) {
+		return;
+	}
+	try {
+		const sku = skuMap[value.skuId] || await ProductAPI.skuDetail(value.skuId);
+		skuMap[value.skuId] = sku;
+		const productId = sku.productId || "";
+		const product = productId ? giftProductMap[value.skuId] || await ProductAPI.detail(productId) : undefined;
+		if (!product) {
+			Message.warning("赠送产品信息加载失败，请重新选择");
+			return;
+		}
+		giftProductMap[value.skuId] = product;
+		const existingIndex = packagePurchaseItemList.value.findIndex(item => item.gifted
+			&& item.skuId === value.skuId && item.skuUnitId === value.skuUnitId);
+		if (0 <= existingIndex) {
+			const existingItem = packagePurchaseItemList.value[existingIndex];
+			const totalQuantity = addPackageQuantity(existingItem.totalQuantity, "1");
+			if (!totalQuantity) {
+				Message.warning("赠送数量合并后不能精确保留三位小数");
+				return;
+			}
+			packagePurchaseItemList.value[existingIndex] = { ...existingItem, totalQuantity };
+		} else {
+			const maxSort = Math.max(-1, ...packagePurchaseItemList.value.map(item => item.sort ?? -1));
+			packagePurchaseItemList.value.push({
+				skuId: value.skuId,
+				skuUnitId: value.skuUnitId,
+				totalQuantity: "1",
+				gifted: true,
+				sort: maxSort + 1,
+				remark: null,
+				productNameSnapshot: product.name,
+				skuNameSnapshot: sku.name,
+				specSummarySnapshot: sku.specSummary
+			});
+		}
+		resetRequestNo();
+	} catch (error) {
+		Message.error(getErrorMessage(error, "赠送产品加载失败"));
+	}
+}
+
+function canEditItem(item: PackagePurchaseItem): boolean {
+	return Boolean(item.gifted) ? canGiftCreate.value : canPriceOverride.value;
+}
+
+function canRemoveItem(item: PackagePurchaseItem): boolean {
+	return canEditItem(item);
+}
+
 function updateItemQuantity(index: number, value: string | number): void {
+	const item = packagePurchaseItemList.value[index];
+	if (!item || !canEditItem(item)) {
+		return;
+	}
 	packagePurchaseItemList.value = packagePurchaseItemList.value.map((item, itemIndex) => itemIndex === index ? {
 		...item,
 		totalQuantity: String(value)
@@ -530,8 +611,18 @@ function updateItemQuantity(index: number, value: string | number): void {
 	resetRequestNo();
 }
 
+function updateItemRemark(index: number, value: string | number): void {
+	const item = packagePurchaseItemList.value[index];
+	if (!item?.gifted || !canGiftCreate.value) {
+		return;
+	}
+	packagePurchaseItemList.value[index] = { ...item, remark: String(value) || null };
+	resetRequestNo();
+}
+
 function removePurchaseItem(index: number): void {
-	if (!canPriceOverride.value) {
+	const item = packagePurchaseItemList.value[index];
+	if (!item || !canRemoveItem(item)) {
 		return;
 	}
 	packagePurchaseItemList.value = packagePurchaseItemList.value.filter((_, itemIndex) => itemIndex !== index);
@@ -662,84 +753,86 @@ watch(config, value => {
 			margin: 1rem;
 		}
 
-		.saleable-tip {
-			padding: 0 1rem .5rem;
-			font-size: .8125rem;
-			line-height: 1.5;
-		}
-
-		.time-actions {
-			gap: .5rem;
+		.config-summary {
+			gap: .25rem;
+			width: 100%;
+			padding: .5rem .75rem;
 			display: flex;
-			align-items: center;
-			justify-content: flex-end;
-		}
+			background: var(--td-error-color-1);
+			border-radius: .75rem;
+			flex-direction: column;
 
-		.package-purchase-form {
-			gap: .75rem;
-			display: grid;
-			margin-top: 1rem;
-
-			.config-summary {
-				gap: .25rem;
-				margin: 0 1rem;
-				padding: .5rem .75rem;
+			.header {
 				display: flex;
-				background: var(--td-error-color-1);
-				border-radius: .75rem;
-				flex-direction: column;
+				justify-content: space-between;
 
-				.header {
+				.name {
+					flex: 1;
+				}
+
+				.price {
+					flex: none;
 					display: flex;
-					justify-content: space-between;
+					align-items: baseline;
 
-					.price {
-						display: flex;
-						align-items: baseline;
+					.label {
+						font-size: .75rem;
+					}
 
-						.label {
-							font-size: .75rem;
-						}
-
-						.value {
-							font-size: 1.75rem;
-							line-height: 1;
-						}
+					.value {
+						font-size: 1.75rem;
+						line-height: 1;
 					}
 				}
 			}
 
-			.items {
-				gap: .5rem;
-				margin: 0;
-				display: grid;
+			.description {
+				width: 100%;
+				font-size: .75rem;
+				min-width: 0;
+				max-width: 100%;
+				word-break: break-word;
+				white-space: normal;
+				overflow-wrap: anywhere;
+			}
+		}
 
-				.title {
-					font-size: .8125rem;
-					margin-bottom: .5rem;
+		.items {
+			gap: .5rem;
+			flex: 1;
+			margin: 0;
+			display: grid;
+
+			.title {
+				font-size: .8125rem;
+				margin-bottom: .5rem;
+			}
+
+			.item {
+				padding: 10px;
+				box-shadow: .25rem .25rem 1rem rgba(0, 0, 0, .08);
+				border-radius: 1rem;
+
+				.avatar {
+					width: 2rem;
+					height: 2rem;
+					flex: none;
+					border-radius: .5rem;
 				}
 
-				.item {
-					padding: 10px;
-					box-shadow: .25rem .25rem 1rem rgba(0, 0, 0, .08);
-					border-radius: 1rem;
+				&::after {
+					display: none;
+				}
 
-					.avatar {
-						width: 2rem;
-						height: 2rem;
-						flex: none;
-						border-radius: .5rem;
-					}
+				.content {
+					gap: .25rem;
+					display: flex;
+					flex-direction: column;
 
-					&::after {
-						display: none;
-					}
-
-					.content {
+					.main {
+						gap: .25rem;
 						display: flex;
-						height: 2rem;
 						align-items: center;
-						justify-content: space-between;
 
 						.name {
 							min-width: 0;
@@ -749,13 +842,19 @@ watch(config, value => {
 						}
 
 						.input {
-							min-width: 0;
 							flex: 1;
+							min-width: 0;
+							margin-top: .2rem;
+						}
 
-							.actions {
-								gap: .25rem;
-								display: flex;
-							}
+						.actions {
+							gap: .25rem;
+							margin: .1rem 0 0 .75rem;
+							display: flex;
+						}
+
+						.gift-remark {
+							padding: 0;
 						}
 					}
 				}
@@ -763,6 +862,13 @@ watch(config, value => {
 		}
 	}
 
+	.time-actions {
+		gap: .5rem;
+		display: flex;
+		align-items: center;
+		justify-content: flex-end;
+	}
+
 	.file-input {
 		display: none;
 	}

src/pages/package/usePackagePurchase.ts

@@ -18,6 +18,7 @@ interface UsePackagePurchaseOptions {
 /** 套餐配置直接购买流程，购买请求只依赖套餐配置 ID，不再关联购买事件。 */
 export function usePackagePurchase(options: UsePackagePurchaseOptions) {
 	const canPriceOverride = computed(() => options.hasPermission(permissionCodes.customerPackage.priceOverride));
+	const canGiftCreate = computed(() => options.hasPermission(permissionCodes.customerPackage.giftCreate));
 	const saleAmountText = ref("");
 	const packagePurchaseItemList = ref<PackagePurchaseItem[]>([]);
 	const packageRequestNo = ref("");
@@ -45,6 +46,7 @@ export function usePackagePurchase(options: UsePackagePurchaseOptions) {
 			skuId: item.skuId,
 			skuUnitId: item.skuUnitId,
 			totalQuantity: normalizePackageQuantity(item.defaultQuantity) || "",
+			gifted: false,
 			sort: item.sort ?? index,
 			remark: item.remark ?? null
 		}));
@@ -77,6 +79,7 @@ export function usePackagePurchase(options: UsePackagePurchaseOptions) {
 				skuId: item.skuId,
 				skuUnitId: item.skuUnitId,
 				totalQuantity,
+				gifted: Boolean(item.gifted),
 				sort: item.sort ?? index,
 				remark: item.remark ?? null
 			}] : [];
@@ -124,7 +127,7 @@ export function usePackagePurchase(options: UsePackagePurchaseOptions) {
 			}
 			if (quantity !== "0") {
 				hasPositiveQuantity = true;
-				const key = `${item.skuId}\u0000${item.skuUnitId}`;
+				const key = `${item.skuId}\u0000${item.skuUnitId}\u0000${Boolean(item.gifted)}`;
 				if (keySet.has(key)) {
 					Message.warning("最终套餐权益不能重复相同 SKU 和单位");
 					return false;
@@ -142,6 +145,7 @@ export function usePackagePurchase(options: UsePackagePurchaseOptions) {
 	return {
 		isSaleable,
 		canPriceOverride,
+		canGiftCreate,
 		saleAmountText,
 		packagePurchaseItemList,
 		applyConfig,

src/pages/salesOrder/SalesOrderDetail.vue

@@ -97,6 +97,7 @@
 							<div class="main">
 								<div class="title">
 									<span class="name text-bold" v-text="item.productNameSnapshot || '未命名产品'" />
+									<t-tag v-if="item.gifted" size="small" theme="success" content="赠送" />
 									<t-tag
 										:content="getItemFulfillmentStatus(item).text"
 										:theme="getItemFulfillmentStatus(item).theme"

src/pages/salesOrder/components/SalesOrderListCell.vue

@@ -231,7 +231,8 @@ function sumProductQuantity(field: "quantity" | "fulfilledBaseQuantity"): string
 function getProductText(item: NonNullable<SalesOrder["itemList"]>[number]): string {
 	const quantity = getPackageQuantityText(item.quantity);
 	const skuText = getProductSkuSnapshotText(item.productNameSnapshot, item.skuNameSnapshot, item.specSummarySnapshot);
-	return `${item.productNameSnapshot || "未命名产品"}${skuText ? ` · ${skuText}` : ""} × ${quantity}${item.unitSnapshot ? ` ${item.unitSnapshot}` : ""}`;
+	const giftText = item.gifted ? "赠送 · " : "";
+	return `${giftText}${item.productNameSnapshot || "未命名产品"}${skuText ? ` · ${skuText}` : ""} × ${quantity}${item.unitSnapshot ? ` ${item.unitSnapshot}` : ""}`;
 }
 </script>