From 989d2e51cb7295ab79b285f4682d41ae2164a933 Mon Sep 17 00:00:00 2001
From: gongchunyi <deslre0381@gmail.com>
Date: 星期六, 28 三月 2026 11:08:09 +0800
Subject: [PATCH] feat: 编辑/新增销售台账产品信息数据展示新增

---
 src/views/salesManagement/salesLedger/index.vue |  885 +++++++++++++---------------------------------------------
 1 files changed, 209 insertions(+), 676 deletions(-)

diff --git a/src/views/salesManagement/salesLedger/index.vue b/src/views/salesManagement/salesLedger/index.vue
index dd209c7..6a4f061 100644
--- a/src/views/salesManagement/salesLedger/index.vue
+++ b/src/views/salesManagement/salesLedger/index.vue
@@ -35,18 +35,30 @@
           :bound-route-name="processFlowSelectBoundRouteName"
           @confirm="handleProcessFlowSelectConfirm"
         />
-        <div>
-          <el-button type="primary" @click="openForm('add')">
-            鏂板鍙拌处
-          </el-button>
-		  <el-button type="primary"  @click="handleBulkDelivery">
-            鍙戣揣
-          </el-button>
-          <el-button type="primary" plain @click="handleImport">瀵煎叆</el-button>
-          <el-button @click="handleOut">瀵煎嚭</el-button>
-          <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>
-          <el-button type="primary" plain @click="handlePrint">鎵撳嵃</el-button>
-        </div>
+			<el-space wrap>
+					<el-button type="primary" @click="openForm('add')">鏂板鍙拌处</el-button>
+					<el-button type="primary" @click="handleBulkDelivery">鍙戣揣</el-button>
+					<el-button type="primary" plain @click="handleImport">瀵煎叆</el-button>
+					<el-button @click="handleOut">瀵煎嚭</el-button>
+
+					<el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button>
+
+					<el-dropdown @command="handlePrintCommand">
+						<el-button type="primary" plain>
+							鎵撳嵃鍗曟嵁<el-icon class="el-icon--right">
+								<ArrowDown />
+							</el-icon>
+						</el-button>
+						<template #dropdown>
+							<el-dropdown-menu>
+								<el-dropdown-item command="finishedProcessCard">鐢熶骇娴佺▼鍗★紙鎴愬搧锛�</el-dropdown-item>
+								<el-dropdown-item command="salesOrder">閿�鍞鍗�</el-dropdown-item>
+								<el-dropdown-item command="salesDeliveryNote">閿�鍞彂璐у崟</el-dropdown-item>
+							</el-dropdown-menu>
+						</template>
+					</el-dropdown>
+					<el-button type="primary" plain @click="handlePrintLabel">鎵撳嵃鏍囩</el-button>
+				</el-space>
       </div>
       <el-table :data="tableData" border v-loading="tableLoading" @selection-change="handleSelectionChange"
         :expand-row-keys="expandedRowKeys" :row-key="(row) => row.id" :row-class-name="tableRowClassName" show-summary style="width: 100%"
@@ -56,13 +68,42 @@
           <template #default="props">
             <el-table :data="props.row.children" border show-summary :summary-method="summarizeChildrenTable">
               <el-table-column align="center" label="搴忓彿" type="index"/>
+			<el-table-column label="妤煎眰缂栧彿" prop="floorCode" min-width="100" show-overflow-tooltip />
               <el-table-column label="浜у搧澶х被" prop="productCategory" />
               <el-table-column label="瑙勬牸鍨嬪彿" prop="specificationModel" />
               <el-table-column label="鍘氬害" prop="thickness" min-width="90">
                 <template #default="scope">
                   {{ scope.row.thickness ?? "" }}
                 </template>
-              </el-table-column>
+						</el-table-column>
+							<el-table-column label="瀹�(mm)" prop="width" min-width="80">
+								<template #default="scope">
+									{{ scope.row.width ?? "" }}
+								</template>
+							</el-table-column>
+							<el-table-column label="楂�(mm)" prop="height" min-width="80">
+								<template #default="scope">
+									{{ scope.row.height ?? "" }}
+								</template>
+							</el-table-column>
+							<el-table-column label="鍛ㄩ暱(cm)" prop="perimeter" min-width="90">
+								<template #default="scope">
+									{{ scope.row.perimeter ?? "" }}
+								</template>
+							</el-table-column>
+							<el-table-column label="鎬婚潰绉�(cm虏)" prop="actualTotalArea" min-width="100">
+								<template #default="scope">
+									{{ scope.row.actualTotalArea ?? "" }}
+								</template>
+							</el-table-column>
+							<el-table-column label="鍔犲伐瑕佹眰" prop="processRequirement" min-width="120"
+								show-overflow-tooltip />
+							<el-table-column label="澶囨敞" prop="remark" min-width="120" show-overflow-tooltip />
+							<el-table-column label="閲嶇" prop="heavyBox" min-width="80">
+								<template #default="scope">
+									{{ scope.row.heavyBox ?? "" }}
+								</template>
+							</el-table-column>
 							<el-table-column label="浜у搧鐘舵��"
 															 width="100px"
 															 align="center">
@@ -246,6 +287,21 @@
 					<el-table-column label="鍘氬害" prop="thickness" min-width="90">
 						<template #default="scope">
 							{{ scope.row.thickness ?? "" }}
+						</template>
+					</el-table-column>
+					<el-table-column label="瀹�(mm)" prop="width" min-width="80">
+						<template #default="scope">
+							{{ scope.row.width ?? "" }}
+						</template>
+					</el-table-column>
+					<el-table-column label="楂�(mm)" prop="height" min-width="80">
+						<template #default="scope">
+							{{ scope.row.height ?? "" }}
+						</template>
+					</el-table-column>
+					<el-table-column label="闈㈢Н(m虏)" prop="actualTotalArea" min-width="100">
+						<template #default="scope">
+							{{ scope.row.actualTotalArea ?? "" }}
 						</template>
 					</el-table-column>
 					<el-table-column label="鏁伴噺" prop="quantity" />
@@ -568,7 +624,7 @@
 								style="width: 100%"
 								placeholder="璇疯緭鍏�"
 								clearable
-								@change="recalcAreaTotals"
+								@change="() => { recalcAreaTotals(); calculateFromUnitPrice(true); }"
 							/>
 						</el-form-item>
 					</el-col>
@@ -773,122 +829,6 @@
 			v-model="fileListDialogVisible"
 			title="闄勪欢鍒楄〃"
 		/>
-		<!-- 鎵撳嵃棰勮寮圭獥 -->
-		<el-dialog
-			v-model="printPreviewVisible"
-			title="鎵撳嵃棰勮"
-			width="90%"
-			:close-on-click-modal="false"
-			class="print-preview-dialog"
-		>
-			<div class="print-preview-container">
-				<div class="print-preview-header">
-					<el-button type="primary" @click="executePrint">鎵ц鎵撳嵃</el-button>
-					<el-button @click="printPreviewVisible = false">鍏抽棴棰勮</el-button>
-				</div>
-				<div class="print-preview-content">
-					<div v-if="printData.length === 0" style="text-align: center; padding: 50px; color: #999;">
-						鏆傛棤鎵撳嵃鏁版嵁
-					</div>
-					<div v-else style="text-align: center; padding: 10px; color: #666; font-size: 14px; background: #e8f4fd; margin-bottom: 10px;">
-						鍏� {{ printData.length }} 鏉℃暟鎹緟鎵撳嵃
-					</div>
-					<div v-for="(item, index) in printData" :key="index" class="print-page">
-						<div class="delivery-note">
-							<div class="header">
-								<div class="document-title">闆跺敭鍙戣揣鍗�</div>
-							</div>
-							
-							<div class="info-section">
-								<div class="info-row">
-									<div>
-										<span class="label">鍙戣揣鏃ユ湡锛�</span>
-										<span class="value">{{ formatDate(item.createTime) }}</span>
-									</div>
-									<div>
-										<span class="label">鍙戣揣杞︾墝鍙凤細</span>
-										<span class="value">{{ item.shippingCarNumber }}</span>
-									</div>
-								</div>
-								<div class="info-row">
-									<div>
-										<span class="label">瀹㈡埛鍚嶇О锛�</span>
-										<span class="value">{{ item.customerName }}</span>
-									</div>
-									<span class="label">鍗曞彿锛�</span>
-									<span class="value">{{ item.salesContractNo }}</span>
-								</div>
-							</div>
-							
-							<div class="table-section">
-								<table class="product-table">
-									<thead>
-									<tr>
-										<th>浜у搧鍚嶇О</th>
-										<th>瑙勬牸鍨嬪彿</th>
-										<th>鍘氬害</th>
-										<th>鍗曚环</th>
-										<th>闆跺敭鏁伴噺</th>
-										<th>闆跺敭閲戦</th>
-									</tr>
-									</thead>
-									<tbody>
-									<tr v-for="product in item.products" :key="product.id">
-										<td>{{ product.productCategory || '' }}</td>
-										<td>{{ product.specificationModel || '' }}</td>
-										<td>{{ product.thickness ?? '' }}</td>
-										<td>{{ product.taxInclusiveUnitPrice || '0' }}</td>
-										<td>{{ product.quantity || '0' }}</td>
-										<td>{{ product.taxInclusiveTotalPrice || '0' }}</td>
-									</tr>
-									<tr v-if="!item.products || item.products.length === 0">
-										<td colspan="6" style="text-align: center; color: #999;">鏆傛棤浜у搧鏁版嵁</td>
-									</tr>
-									</tbody>
-									<tfoot>
-									<tr>
-										<td class="label">鍚堣</td>
-										<td class="total-value"></td>
-										<td class="total-value"></td>
-										<td class="total-value"></td>
-										<td class="total-value">{{ getTotalQuantity(item.products) }}</td>
-										<td class="total-value">{{ getTotalAmount(item.products) }}</td>
-									</tr>
-									</tfoot>
-								</table>
-							</div>
-							
-							<div class="footer-section">
-								<div class="footer-row">
-									<div class="footer-item">
-										<span class="label">鏀惰揣鐢佃瘽锛�</span>
-										<span class="value"></span>
-									</div>
-									<div class="footer-item">
-										<span class="label">鏀惰揣浜猴細</span>
-										<span class="value"></span>
-									</div>
-									<div class="footer-item address-item">
-										<span class="label">鏀惰揣鍦板潃锛�</span>
-										<span class="value address-value"></span>
-									</div>
-								</div>
-								<div class="footer-row">
-									<div class="footer-item">
-										<span class="label">鎿嶄綔鍛橈細</span>
-										<span class="value">{{ userStore.nickName || '鎾曞紑鍓�' }}</span>
-									</div>
-									<div class="footer-item">
-										<span class="label">鎵撳嵃鏃ユ湡锛�</span>
-										<span class="value">{{ formatDateTime(new Date()) }}</span>
-									</div>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-		</el-dialog>
 		<!-- 鍙戣揣寮规 -->
 		<el-dialog
 			v-model="deliveryFormVisible"
@@ -973,7 +913,7 @@
 import {onMounted, ref, getCurrentInstance} from "vue";
 import { addShippingInfo } from "@/api/salesManagement/deliveryLedger.js";
 import { ElMessageBox, ElMessage } from "element-plus";
-import { UploadFilled, Download } from "@element-plus/icons-vue";
+import { ArrowDown } from "@element-plus/icons-vue";
 import useUserStore from "@/store/modules/user";
 import { userListNoPage } from "@/api/system/user.js";
 import FileListDialog from '@/components/Dialog/FileListDialog.vue';
@@ -996,11 +936,19 @@
 	salesLedgerProductProcessList,
 	saleProcessBind,
 	getSaleProcessBindInfo,
+	getProcessCard,
+	getSalesOrder,
+	getSalesInvoices,
+	getSalesLabel,
 } from "@/api/salesManagement/salesLedger.js";
 import { modelList, productTreeList } from "@/api/basicData/product.js";
 import useFormData from "@/hooks/useFormData.js";
 import dayjs from "dayjs";
 import { getCurrentDate } from "@/utils/index.js";
+import { printFinishedProcessCard } from "./components/processCardPrint.js";
+import { printSalesOrder } from "./components/salesOrderPrint.js";
+import { printSalesDeliveryNote } from "./components/salesDeliveryPrint.js";
+import { printSalesLabel } from "./components/salesLabelPrint.js";
 // import { salesLedgerProductSetProcessFlowConfig } from "@/api/salesManagement/salesProcessFlowConfig.js";
 
 const userStore = useUserStore();
@@ -1121,10 +1069,6 @@
 	// 璁剧疆涓婁紶鐨勮姹傚ご閮�
 	headers: { Authorization: "Bearer " + getToken() },
 });
-// 鎵撳嵃鐩稿叧
-const printPreviewVisible = ref(false);
-const printData = ref([]);
-
 // 鎶ヤ环鍗曞鍏ョ浉鍏�
 const quotationDialogVisible = ref(false);
 const quotationLoading = ref(false);
@@ -1749,8 +1693,9 @@
 	productData.value = products.map((p) => {
 		const quantity = Number(p.quantity ?? 0) || 0;
 		const unitPrice = Number(p.unitPrice ?? 0) || 0;
+		const settlePieceArea = Number(p.settlePieceArea ?? 0) || 1;
 		const taxRate = "13"; // 榛樿 13%锛屼究浜庣洿鎺ユ彁浜わ紙濡傞渶鍙湪浜у搧涓嚜琛屼慨鏀癸級
-		const taxInclusiveTotalPrice = (unitPrice * quantity).toFixed(2);
+		const taxInclusiveTotalPrice = (unitPrice * settlePieceArea * quantity).toFixed(2);
 		const taxExclusiveTotalPrice = proxy.calculateTaxExclusiveTotalPrice(taxInclusiveTotalPrice, taxRate);
 		return {
 			// 鍙拌处瀛楁
@@ -2131,364 +2076,118 @@
 		});
 };
 
-// 鎵撳嵃鍔熻兘
-const handlePrint = async () => {
-	if (selectedRows.value.length === 0) {
-		proxy.$modal.msgWarning("璇烽�夋嫨瑕佹墦鍗扮殑鏁版嵁");
+const handlePrintCommand = async (command) => {
+	if (command !== "finishedProcessCard" && command !== "salesOrder" && command !== "salesDeliveryNote") return;
+	if (command === "salesDeliveryNote") {
+		if (selectedRows.value.length === 0) {
+			proxy.$modal.msgWarning("璇疯嚦灏戦�夋嫨涓�鏉¢攢鍞彴璐︽暟鎹繘琛屾墦鍗�");
+			return;
+		}
+		const customerNames = Array.from(
+			new Set(selectedRows.value.map((item) => String(item?.customerName ?? "").trim()))
+		);
+		if (customerNames.length > 1) {
+			proxy.$modal.msgWarning("浠呮敮鎸佺浉鍚屽鎴峰悕绉扮殑閿�鍞彴璐﹀悎骞跺彂璐ф墦鍗�");
+			return;
+		}
+	} else if (selectedRows.value.length !== 1) {
+		proxy.$modal.msgWarning("璇烽�夋嫨涓�鏉¢攢鍞彴璐︽暟鎹繘琛屾墦鍗�");
 		return;
 	}
-	
-	// 鏄剧ず鍔犺浇鐘舵��
-	proxy.$modal.loading("姝e湪鑾峰彇浜у搧鏁版嵁锛岃绋嶅��...");
-	
-	try {
-		// 涓烘瘡涓�変腑鐨勯攢鍞彴璐﹁褰曟煡璇㈠搴旂殑浜у搧鏁版嵁
-		const printDataWithProducts = [];
-		
-		for (const row of selectedRows.value) {
-			try {
-				// 璋冪敤productList鎺ュ彛鏌ヨ浜у搧鏁版嵁
-				const productRes = await productList({ salesLedgerId: row.id, type: 1 });
-				
-				// 灏嗕骇鍝佹暟鎹暣鍚堝埌閿�鍞彴璐﹁褰曚腑
-				const rowWithProducts = {
-					...row,
-					products: productRes.data || []
-				};
-				
-				printDataWithProducts.push(rowWithProducts);
-			} catch (error) {
-				console.error(`鑾峰彇閿�鍞彴璐� ${row.id} 鐨勪骇鍝佹暟鎹け璐�:`, error);
-				// 鍗充娇鏌愪釜璁板綍鐨勪骇鍝佹暟鎹幏鍙栧け璐ワ紝涔熻鍖呭惈璇ヨ褰�
-				printDataWithProducts.push({
-					...row,
-					products: []
-				});
-			}
+
+	const selectedRow = selectedRows.value[0];
+	const selectedId = selectedRow?.id;
+	if (command === "salesDeliveryNote") {
+		const selectedIds = selectedRows.value
+			.map((item) => item?.id)
+			.filter((id) => id !== null && id !== undefined && id !== "");
+		if (selectedIds.length !== selectedRows.value.length) {
+			proxy.$modal.msgWarning("褰撳墠閫夋嫨鏁版嵁瀛樺湪缂哄皯ID鐨勮褰曪紝鏃犳硶鎵撳嵃");
+			return;
 		}
-		
-		printData.value = printDataWithProducts;
-		console.log('鎵撳嵃鏁版嵁锛堝寘鍚骇鍝侊級:', printData.value);
-		printPreviewVisible.value = true;
-		
+		const loadingText =
+			command === "salesOrder"
+				? "姝e湪鑾峰彇閿�鍞鍗曟暟鎹紝璇风◢鍊�..."
+				: command === "salesDeliveryNote"
+					? "姝e湪鑾峰彇閿�鍞彂璐у崟鏁版嵁锛岃绋嶅��..."
+					: "姝e湪鑾峰彇鐢熶骇娴佺▼鍗℃暟鎹紝璇风◢鍊�...";
+		proxy.$modal.loading(loadingText);
+		try {
+			const res = await getSalesInvoices(selectedIds);
+			const salesInvoiceData = res?.data ?? {};
+			printSalesDeliveryNote(salesInvoiceData, selectedRow);
+		} catch (error) {
+			console.error("鎵撳嵃閿�鍞彂璐у崟澶辫触:", error);
+			proxy.$modal.msgError("鎵撳嵃澶辫触锛岃绋嶅悗閲嶈瘯");
+		} finally {
+			proxy.$modal.closeLoading();
+		}
+		return;
+	}
+	if (!selectedId) {
+		proxy.$modal.msgWarning("褰撳墠閫夋嫨鏁版嵁缂哄皯ID锛屾棤娉曟墦鍗�");
+		return;
+	}
+
+	const loadingText =
+		command === "salesOrder"
+			? "姝e湪鑾峰彇閿�鍞鍗曟暟鎹紝璇风◢鍊�..."
+			: command === "salesDeliveryNote"
+				? "姝e湪鑾峰彇閿�鍞彂璐у崟鏁版嵁锛岃绋嶅��..."
+				: "姝e湪鑾峰彇鐢熶骇娴佺▼鍗℃暟鎹紝璇风◢鍊�...";
+	proxy.$modal.loading(loadingText);
+	try {
+		if (command === "salesOrder") {
+			const res = await getSalesOrder(selectedId);
+			const salesOrderData = res?.data ?? {};
+			printSalesOrder(salesOrderData);
+		} else {
+			const res = await getProcessCard(selectedId);
+			const processCardData = res?.data ?? {};
+			printFinishedProcessCard(processCardData);
+		}
 	} catch (error) {
-		console.error('鑾峰彇浜у搧鏁版嵁澶辫触:', error);
-		proxy.$modal.msgError("鑾峰彇浜у搧鏁版嵁澶辫触锛岃閲嶈瘯");
+		console.error(
+			command === "salesOrder"
+				? "鎵撳嵃閿�鍞鍗曞け璐�:"
+				: command === "salesDeliveryNote"
+					? "鎵撳嵃閿�鍞彂璐у崟澶辫触:"
+					: "鎵撳嵃鐢熶骇娴佺▼鍗″け璐�:",
+			error
+		);
+		proxy.$modal.msgError("鎵撳嵃澶辫触锛岃绋嶅悗閲嶈瘯");
 	} finally {
 		proxy.$modal.closeLoading();
 	}
 };
-// 鎵ц鎵撳嵃
-const executePrint = () => {
-	console.log('寮�濮嬫墽琛屾墦鍗帮紝鏁版嵁鏉℃暟:', printData.value.length);
-	console.log('鎵撳嵃鏁版嵁:', printData.value);
-	
-	// 鍒涘缓涓�涓柊鐨勬墦鍗扮獥鍙�
-	const printWindow = window.open('', '_blank', 'width=800,height=600');
-	
-	// 鏋勫缓鎵撳嵃鍐呭
-	let printContent = `
-    <!DOCTYPE html>
-    <html>
-    <head>
-      <meta charset="UTF-8">
-      <title>鎵撳嵃棰勮</title>
-      <style>
-        body {
-          margin: 0;
-          padding: 0;
-          font-family: "SimSun", serif;
-          background: white;
-        }
-                                                     .print-page {
-            width: 200mm;
-            height: 75mm;
-            padding: 10mm;
-            padding-left: 20mm;
-            background: white;
-            box-sizing: border-box;
-            page-break-after: always;
-            page-break-inside: avoid;
-          }
-         .print-page:last-child {
-           page-break-after: avoid;
-         }
-        .delivery-note {
-          width: 100%;
-          height: 100%;
-          font-size: 12px;
-          line-height: 1.2;
-          display: flex;
-          flex-direction: column;
-          color: #000;
-        }
-        .header {
-          text-align: center;
-          margin-bottom: 8px;
-        }
-        .company-name {
-          font-size: 18px;
-          font-weight: bold;
-          margin-bottom: 4px;
-        }
-        .document-title {
-          font-size: 16px;
-          font-weight: bold;
-        }
-        .info-section {
-          margin-bottom: 8px;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-        }
-        .info-row {
-          line-height: 20px;
-        }
-        .label {
-          font-weight: bold;
-          width: 60px;
-          font-size: 12px;
-        }
-        .value {
-          margin-right: 20px;
-          min-width: 80px;
-          font-size: 12px;
-        }
-                 .table-section {
-                 margin-bottom: 40px;
-          //  flex: 0.6;
-         }
-        .product-table {
-          width: 100%;
-          border-collapse: collapse;
-          border: 1px solid #000;
-        }
-                 .product-table th, .product-table td {
-           border: 1px solid #000;
-           padding: 6px;
-           text-align: center;
-           font-size: 12px;
-           line-height: 1.4;
-         }
-        .product-table th {
-          font-weight: bold;
-        }
-        .total-value {
-          font-weight: bold;
-        }
-        .footer-section {
-          margin-top: auto;
-        }
-        .footer-row {
-          display: flex;
-          margin-bottom: 3px;
-          line-height: 22px;
-          justify-content: space-between;
-        }
-        .footer-item {
-          display: flex;
-          margin-right: 20px;
-        }
-        .footer-item .label {
-          font-weight: bold;
-          width: 80px;
-          font-size: 12px;
-        }
-        .footer-item .value {
-          min-width: 80px;
-          font-size: 12px;
-        }
-        .address-item .address-value {
-          min-width: 200px;
-        }
-        @media print {
-          body {
-            margin: 0;
-            padding: 0;
-          }
-                     .print-page {
-             margin: 0;
-             padding: 10mm;
-             /* padding-left: 20mm; */
-             page-break-inside: avoid;
-             page-break-after: always;
-           }
-           .print-page:last-child {
-             page-break-after: avoid;
-           }
-        }
-      </style>
-    </head>
-    <body>
-  `;
-	
-	// 涓烘瘡鏉℃暟鎹敓鎴愭墦鍗伴〉闈�
-	printData.value.forEach((item, index) => {
-		printContent += `
-      <div class="print-page">
-        <div class="delivery-note">
-          <div class="header">
-            <div class="document-title">闆跺敭鍙戣揣鍗�</div>
-          </div>
-          
-          <div class="info-section">
-            <div class="info-row">
-              <div>
-                <span class="label">鍙戣揣鏃ユ湡锛�</span>
-                <span class="value">${formatDate(item.createTime)}</span>
-              </div>
-              <div>
-                <span class="label">瀹㈡埛鍚嶇О锛�</span>
-                <span class="value">${item.customerName}</span>
-              </div>
-            </div>
-            <div class="info-row">
-              <span class="label">鍗曞彿锛�</span>
-              <span class="value">${item.salesContractNo || ''}</span>
-            </div>
-          </div>
 
-          <div class="table-section">
-            <table class="product-table">
-              <thead>
-                <tr>
-                  <th>浜у搧鍚嶇О</th>
-                  <th>瑙勬牸鍨嬪彿</th>
-                  <th>鍘氬害</th>
-                  <th>鍗曚环</th>
-                  <th>闆跺敭鏁伴噺</th>
-                  <th>闆跺敭閲戦</th>
-                </tr>
-              </thead>
-              <tbody>
-                ${item.products && item.products.length > 0 ?
-			item.products.map(product => `
-                    <tr>
-                      <td>${product.productCategory || ''}</td>
-                      <td>${product.specificationModel || ''}</td>
-                      <td>${product.thickness ?? ''}</td>
-                      <td>${product.taxInclusiveUnitPrice || '0'}</td>
-                      <td>${product.quantity || '0'}</td>
-                      <td>${product.taxInclusiveTotalPrice || '0'}</td>
-                    </tr>
-                  `).join('') :
-			'<tr><td colspan="6" style="text-align: center; color: #999;">鏆傛棤浜у搧鏁版嵁</td></tr>'
+const handlePrintLabel = async () => {
+	if (selectedRows.value.length !== 1) {
+		proxy.$modal.msgWarning("璇烽�夋嫨涓�鏉¢攢鍞彴璐︽暟鎹繘琛屾爣绛炬墦鍗�");
+		return;
+	}
+
+	const selectedId = selectedRows.value[0]?.id;
+	if (!selectedId) {
+		proxy.$modal.msgWarning("褰撳墠閫夋嫨鏁版嵁缂哄皯ID锛屾棤娉曟墦鍗版爣绛�");
+		return;
+	}
+
+	proxy.$modal.loading("姝e湪鑾峰彇鏍囩鏁版嵁锛岃绋嶅��...");
+	try {
+		const res = await getSalesLabel(selectedId);
+		const labelList = res?.data ?? [];
+		if (!Array.isArray(labelList) || labelList.length === 0) {
+			proxy.$modal.msgWarning("鏆傛棤鍙墦鍗版爣绛炬暟鎹�");
+			return;
 		}
-              </tbody>
-              <tfoot>
-                <tr>
-                  <td class="label">鍚堣</td>
-                  <td class="total-value"></td>
-                  <td class="total-value"></td>
-                  <td class="total-value"></td>
-                  <td class="total-value">${getTotalQuantityForPrint(item.products)}</td>
-                  <td class="total-value">${getTotalAmountForPrint(item.products)}</td>
-                </tr>
-              </tfoot>
-            </table>
-          </div>
-
-          <div class="footer-section">
-            <div class="footer-row">
-              <div class="footer-item">
-                <span class="label">鏀惰揣鐢佃瘽锛�</span>
-                <span class="value"></span>
-              </div>
-              <div class="footer-item">
-                <span class="label">鏀惰揣浜猴細</span>
-                <span class="value"></span>
-              </div>
-              <div class="footer-item address-item">
-                <span class="label">鏀惰揣鍦板潃锛�</span>
-                <span class="value address-value"></span>
-              </div>
-            </div>
-            <div class="footer-row">
-              <div class="footer-item">
-                <span class="label">鎿嶄綔鍛橈細</span>
-                <span class="value">${userStore.nickName || '鎾曞紑鍓�'}</span>
-              </div>
-              <div class="footer-item">
-                <span class="label">鎵撳嵃鏃ユ湡锛�</span>
-                <span class="value">${formatDateTime(new Date())}</span>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-	});
-	
-	printContent += `
-    </body>
-    </html>
-  `;
-	
-	// 鍐欏叆鍐呭鍒版柊绐楀彛
-	printWindow.document.write(printContent);
-	printWindow.document.close();
-	
-	// 绛夊緟鍐呭鍔犺浇瀹屾垚鍚庢墦鍗�
-	printWindow.onload = () => {
-		setTimeout(() => {
-			printWindow.print();
-			printWindow.close();
-			printPreviewVisible.value = false;
-		}, 500);
-	};
-};
-// 鏍煎紡鍖栨棩鏈�
-const formatDate = (dateString) => {
-	if (!dateString) return getCurrentDate();
-	const date = new Date(dateString);
-	const year = date.getFullYear();
-	const month = String(date.getMonth() + 1).padStart(2, "0");
-	const day = String(date.getDate()).padStart(2, "0");
-	return `${year}/${month}/${day}`;
-};
-// 鏍煎紡鍖栨棩鏈熸椂闂�
-const formatDateTime = (date) => {
-	const year = date.getFullYear();
-	const month = String(date.getMonth() + 1).padStart(2, "0");
-	const day = String(date.getDate()).padStart(2, "0");
-	const hours = String(date.getHours()).padStart(2, "0");
-	const minutes = String(date.getMinutes()).padStart(2, "0");
-	const seconds = String(date.getSeconds()).padStart(2, "0");
-	return `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`;
-};
-// 璁$畻浜у搧鎬绘暟閲�
-const getTotalQuantity = (products) => {
-	if (!products || products.length === 0) return '0';
-	const total = products.reduce((sum, product) => {
-		return sum + (parseFloat(product.quantity) || 0);
-	}, 0);
-	return total.toFixed(2);
-};
-
-// 璁$畻浜у搧鎬婚噾棰�
-const getTotalAmount = (products) => {
-	if (!products || products.length === 0) return '0';
-	const total = products.reduce((sum, product) => {
-		return sum + (parseFloat(product.taxInclusiveTotalPrice) || 0);
-	}, 0);
-	return total.toFixed(2);
-};
-
-// 鐢ㄤ簬鎵撳嵃鐨勮绠楀嚱鏁�
-const getTotalQuantityForPrint = (products) => {
-	if (!products || products.length === 0) return '0';
-	const total = products.reduce((sum, product) => {
-		return sum + (parseFloat(product.quantity) || 0);
-	}, 0);
-	return total.toFixed(2);
-};
-
-const getTotalAmountForPrint = (products) => {
-	if (!products || products.length === 0) return '0';
-	const total = products.reduce((sum, product) => {
-		return sum + (parseFloat(product.taxInclusiveTotalPrice) || 0);
-	}, 0);
-	return total.toFixed(2);
+		printSalesLabel(labelList);
+	} catch (error) {
+		console.error("鎵撳嵃鏍囩澶辫触:", error);
+		proxy.$modal.msgError("鎵撳嵃鏍囩澶辫触锛岃绋嶅悗閲嶈瘯");
+	} finally {
+		proxy.$modal.closeLoading();
+	}
 };
 
 const mathNum = () => {
@@ -2499,10 +2198,11 @@
 	if (!productForm.value.quantity) {
 		return;
 	}
-	// 鍚◣鎬讳环璁$畻
+	const settlePieceArea = parseFloat(productForm.value.settlePieceArea) || 1;
+	// 鍚◣鎬讳环璁$畻 = 鍗曚环 * 缁撶畻闈㈢Н * 鏁伴噺
 	productForm.value.taxInclusiveTotalPrice =
 		proxy.calculateTaxIncludeTotalPrice(
-			productForm.value.taxInclusiveUnitPrice,
+			productForm.value.taxInclusiveUnitPrice * settlePieceArea,
 			productForm.value.quantity
 		);
 	if (productForm.value.taxRate) {
@@ -2565,15 +2265,12 @@
 	const computed = Number(computedPieceArea.toFixed(5));
 
 	productForm.value.actualPieceArea = computed;
-
-	// settlePieceArea锛氳嫢鐢ㄦ埛鏈~鍐�/涓�0锛屽垯榛樿浣跨敤瀹介珮璁$畻鍊�
-	const settlePieceRaw = Number(productForm.value.settlePieceArea ?? 0) || 0;
-	if (!settlePieceRaw) {
-		productForm.value.settlePieceArea = computed;
-	}
+	productForm.value.settlePieceArea = computed;
 
 	recalcPerimeterFromWidthHeight();
 	recalcAreaTotals();
+	// 闈㈢Н鏇存柊鍚庯紝閲嶆柊璁$畻鍚◣鎬讳环 = 鍗曚环 * 缁撶畻闈㈢Н * 鏁伴噺
+	calculateFromUnitPrice(true);
 };
 
 // 鏍规嵁鍚◣鎬讳环璁$畻鍚◣鍗曚环鍜屾暟閲�
@@ -2640,19 +2337,20 @@
 		return;
 	}
 	if (isCalculating.value) return;
-	
+
 	const quantity = parseFloat(productForm.value.quantity);
 	const unitPrice = parseFloat(productForm.value.taxInclusiveUnitPrice);
-	
+	const settlePieceArea = parseFloat(productForm.value.settlePieceArea) || 1;
+
 	if (!quantity || quantity <= 0 || !unitPrice) {
 		return;
 	}
-	
+
 	isCalculating.value = true;
-	
-	// 璁$畻鍚◣鎬讳环
-	productForm.value.taxInclusiveTotalPrice = (unitPrice * quantity).toFixed(2);
-	
+
+	// 璁$畻鍚◣鎬讳环 = 鍗曚环 * 缁撶畻闈㈢Н * 鏁伴噺
+	productForm.value.taxInclusiveTotalPrice = (unitPrice * settlePieceArea * quantity).toFixed(2);
+
 	// 濡傛灉鏈夌◣鐜囷紝璁$畻涓嶅惈绋庢�讳环
 	if (productForm.value.taxRate) {
 		productForm.value.taxExclusiveTotalPrice =
@@ -2661,30 +2359,31 @@
 				productForm.value.taxRate
 			);
 	}
-	
+
 	isCalculating.value = false;
 };
 
 // 鏍规嵁鍚◣鍗曚环鍙樺寲璁$畻鎬讳环
-const calculateFromUnitPrice = () => {
+const calculateFromUnitPrice = (silent = false) => {
 	if (!productForm.value.taxRate) {
-		proxy.$modal.msgWarning("璇峰厛閫夋嫨绋庣巼");
+		if (!silent) proxy.$modal.msgWarning("璇峰厛閫夋嫨绋庣巼");
 		return;
 	}
 	if (isCalculating.value) return;
-	
+
 	const quantity = parseFloat(productForm.value.quantity);
 	const unitPrice = parseFloat(productForm.value.taxInclusiveUnitPrice);
-	
+	const settlePieceArea = parseFloat(productForm.value.settlePieceArea) || 1;
+
 	if (!quantity || quantity <= 0 || !unitPrice) {
 		return;
 	}
-	
+
 	isCalculating.value = true;
-	
-	// 璁$畻鍚◣鎬讳环
-	productForm.value.taxInclusiveTotalPrice = (unitPrice * quantity).toFixed(2);
-	
+
+	// 璁$畻鍚◣鎬讳环 = 鍗曚环 * 缁撶畻闈㈢Н * 鏁伴噺
+	productForm.value.taxInclusiveTotalPrice = (unitPrice * settlePieceArea * quantity).toFixed(2);
+
 	// 濡傛灉鏈夌◣鐜囷紝璁$畻涓嶅惈绋庢�讳环
 	if (productForm.value.taxRate) {
 		productForm.value.taxExclusiveTotalPrice =
@@ -2693,7 +2392,7 @@
 				productForm.value.taxRate
 			);
 	}
-	
+
 	isCalculating.value = false;
 };
 
@@ -3031,171 +2730,5 @@
 	display: flex;
 	justify-content: space-between;
 	margin-bottom: 10px;
-}
-.print-preview-dialog {
-	.el-dialog__body {
-		padding: 0;
-		max-height: 80vh;
-		overflow-y: auto;
-	}
-}
-
-.print-preview-container {
-	.print-preview-header {
-		padding: 15px;
-		border-bottom: 1px solid #e4e7ed;
-		text-align: center;
-		
-		.el-button {
-			margin: 0 10px;
-		}
-	}
-	
-	.print-preview-content {
-		padding: 20px;
-		background-color: #f5f5f5;
-		min-height: 400px;
-	}
-}
-
-.print-page {
-	width: 220mm;
-	height: 90mm;
-	padding: 10mm;
-	margin: 0 auto;
-	background: white;
-	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
-	margin-bottom: 10px;
-	box-sizing: border-box;
-}
-
-.delivery-note {
-	width: 100%;
-	height: 100%;
-	font-family: "SimSun", serif;
-	font-size: 10px;
-	line-height: 1.2;
-	display: flex;
-	flex-direction: column;
-}
-
-.header {
-	text-align: center;
-	margin-bottom: 8px;
-	
-	.company-name {
-		font-size: 18px;
-		font-weight: bold;
-		margin-bottom: 4px;
-	}
-	
-	.document-title {
-		font-size: 16px;
-		font-weight: bold;
-	}
-}
-
-.info-section {
-	margin-bottom: 8px;
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	
-	.info-row {
-		line-height: 20px;
-		
-		.label {
-			font-weight: bold;
-			width: 60px;
-			font-size: 14px;
-		}
-		
-		.value {
-			margin-right: 20px;
-			min-width: 80px;
-			font-size: 14px;
-		}
-	}
-}
-
-.table-section {
-	margin-bottom: 4px;
-	flex: 1;
-	
-	.product-table {
-		width: 100%;
-		border-collapse: collapse;
-		border: 1px solid #000;
-		
-		th, td {
-			border: 1px solid #000;
-			padding: 6px;
-			text-align: center;
-			font-size: 14px;
-			line-height: 1.4;
-		}
-		
-		th {
-			font-weight: bold;
-		}
-		
-		.total-label {
-			text-align: right;
-			font-weight: bold;
-		}
-		
-		.total-value {
-			font-weight: bold;
-		}
-	}
-}
-
-.footer-section {
-	.footer-row {
-		display: flex;
-		margin-bottom: 3px;
-		line-height: 20px;
-		justify-content: space-between;
-		
-		.footer-item {
-			display: flex;
-			margin-right: 20px;
-			
-			.label {
-				font-weight: bold;
-				width: 80px;
-				font-size: 14px;
-			}
-			
-			.value {
-				min-width: 80px;
-				font-size: 14px;
-			}
-			
-			&.address-item {
-				.address-value {
-					min-width: 200px;
-				}
-			}
-		}
-	}
-}
-
-@media print {
-	.app-container {
-		display: none;
-	}
-	
-	.print-page {
-		box-shadow: none;
-		margin: 0;
-		padding: 10mm;
-		padding-left: 20mm;
-		page-break-inside: avoid;
-		page-break-after: always;
-	}
-	.print-page:last-child {
-		page-break-after: avoid;
-	}
 }
 </style>

--
Gitblit v1.9.3