From 025e46e11cb2962fd7692adfa401333758cc779b Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 02 九月 2025 14:00:34 +0800
Subject: [PATCH] 修改组件

---
 src/pages/procurementManagement/invoiceEntry/add.vue |  590 ++++++++++++++++++++++++++++++++++++++++------------------
 1 files changed, 407 insertions(+), 183 deletions(-)

diff --git a/src/pages/procurementManagement/invoiceEntry/add.vue b/src/pages/procurementManagement/invoiceEntry/add.vue
index 8b4e229..a68d6fb 100644
--- a/src/pages/procurementManagement/invoiceEntry/add.vue
+++ b/src/pages/procurementManagement/invoiceEntry/add.vue
@@ -6,118 +6,188 @@
 		<!-- 琛ㄥ崟鍐呭 -->
 		<u-form @submit="submitForm" ref="formRef" label-width="110" input-align="right" error-message-align="right">
 			<!-- 鍩烘湰淇℃伅 -->
-			<u-cell-group title="鍩烘湰淇℃伅">
-				<u-form-item label="閲囪喘鍚堝悓鍙�" prop="contractNo" required border-bottom>
-					<u-input v-model="form.contractNo" placeholder="璇疯緭鍏ラ噰璐悎鍚屽彿" clearable />
+			<view class="form-section">
+				<u-form-item label="閲囪喘鍚堝悓鍙�" prop="purchaseLedgerNo" required>
+					<u-input v-model="form.purchaseLedgerNo" placeholder="鑷姩濉厖" disabled />
 				</u-form-item>
-				<u-form-item label="渚涘簲鍟嗗悕绉�" prop="supplierName" required border-bottom>
-					<u-input v-model="form.supplierName" placeholder="璇疯緭鍏ヤ緵搴斿晢鍚嶇О" clearable />
+				<u-form-item label="閿�鍞悎鍚屽彿" prop="salesContractNo" required>
+					<u-input v-model="form.salesContractNo" placeholder="鑷姩濉厖" disabled />
 				</u-form-item>
-				<u-form-item label="鍙戠エ鍙�" prop="invoiceNo" required border-bottom>
-					<u-input v-model="form.invoiceNo" placeholder="璇疯緭鍏ュ彂绁ㄥ彿" clearable />
+				<u-form-item label="渚涘簲鍟嗗悕绉�" prop="supplierName" required>
+					<u-input v-model="form.supplierName" placeholder="鑷姩濉厖" disabled />
 				</u-form-item>
-				<u-form-item label="鍙戠エ閲戦" prop="invoiceAmount" required border-bottom>
-					<u-input v-model="form.invoiceAmount" type="number" placeholder="璇疯緭鍏ュ彂绁ㄩ噾棰�" clearable />
+				<u-form-item label="椤圭洰鍚嶇О" prop="projectName" required>
+					<u-input v-model="form.projectName" placeholder="鑷姩濉厖" disabled />
 				</u-form-item>
-				<u-form-item label="绋庣巼" prop="taxRate" required border-bottom>
-					<u-input v-model="form.taxRate" placeholder="璇疯緭鍏ョ◣鐜�" clearable />
+				<u-form-item label="鍙戠エ鍙�" prop="invoiceNumber" required>
+					<u-input v-model="form.invoiceNumber" placeholder="璇疯緭鍏�" clearable />
 				</u-form-item>
-				<u-form-item label="寮�绁ㄦ棩鏈�" prop="issueDate" required border-bottom>
-					<u-input v-model="form.issueDate" placeholder="璇烽�夋嫨寮�绁ㄦ棩鏈�" readonly @click="showIssueDatePicker = true" clearable />
+				<u-form-item label="鍙戠エ閲戦(鍏�)" prop="invoiceAmount" required>
+					<u-input v-model="form.invoiceAmount" type="number" placeholder="鑷姩濉厖" disabled />
 				</u-form-item>
-				<u-form-item label="褰曞叆浜�" border-bottom>
-					<u-input v-model="form.recorder" placeholder="鑷姩濉厖" readonly />
+				<u-form-item label="褰曞叆浜�">
+					<u-input v-model="form.issUer" placeholder="鑷姩濉厖" disabled />
 				</u-form-item>
-				<u-form-item label="鍒涘缓鏃堕棿" border-bottom>
-					<u-input v-model="form.createTime" placeholder="璇烽�夋嫨鍒涘缓鏃堕棿" readonly @click="showCreateTimePicker = true" clearable />
+				<u-form-item 
+					label="寮�绁ㄦ棩鏈�" 
+					prop="entryDate" 
+					required
+					@click="showEntryDatePicker = true"
+				>
+					<u-input 
+						v-model="form.entryDate" 
+						placeholder="璇烽�夋嫨寮�绁ㄦ棩鏈�" 
+						readonly
+						@click="showEntryDatePicker = true"
+					/>
+					<template #right>
+						<u-icon name="arrow-right" @click="showEntryDatePicker = true"></u-icon>
+					</template>
 				</u-form-item>
-			</u-cell-group>
-			
-			<!-- 浜у搧淇℃伅 -->
-			<view class="product-section" v-if="!productData || productData.length === 0">
-				<u-empty description="鏆傛棤浜у搧鏁版嵁" />
+				<u-form-item 
+					label="褰曞叆鏃ユ湡" 
+					prop="enterDate" 
+					required
+					@click="showEnterDatePicker = true"
+				>
+					<u-input 
+						v-model="form.enterDate" 
+						placeholder="璇烽�夋嫨褰曞叆鏃ユ湡" 
+						readonly
+						@click="showEnterDatePicker = true"
+					/>
+					<template #right>
+						<u-icon name="arrow-right" @click="showEnterDatePicker = true"></u-icon>
+					</template>
+				</u-form-item>
 			</view>
 			
-			<!-- 浜у搧鍒楄〃 -->
-			<view class="product-list" v-if="productData && productData.length > 0">
-				<view class="product-card" v-for="(product, idx) in productData" :key="idx">
-					<view class="product-header">
-						<view class="product-title">
-							<u-icon name="file-text" color="#2979ff" size="15" />
-							<text class="product-name">浜у搧 {{ idx + 1 }}</text>
-						</view>
+			<!-- 浜у搧淇℃伅 -->
+			<view class="product-section">
+				<view class="section-header">
+					<view>
+						<text class="section-title">浜у搧淇℃伅</text>
 					</view>
-					
-					<!-- 浜у搧淇℃伅琛ㄥ崟 -->
-					<view class="product-form">
-						<u-form-item label="浜у搧鍚嶇О" border-bottom>
-							<u-input v-model="product.productName" placeholder="璇疯緭鍏ヤ骇鍝佸悕绉�" />
-						</u-form-item>
-						<u-form-item label="瑙勬牸鍨嬪彿" border-bottom>
-							<u-input v-model="product.specification" placeholder="璇疯緭鍏ヨ鏍煎瀷鍙�" />
-						</u-form-item>
-						<u-form-item label="鍗曚綅" border-bottom>
-							<u-input v-model="product.unit" placeholder="璇疯緭鍏ュ崟浣�" />
-						</u-form-item>
-						<u-form-item label="鏁伴噺" border-bottom>
-							<u-input v-model="product.quantity" type="number" placeholder="璇疯緭鍏ユ暟閲�" />
-						</u-form-item>
-						<u-form-item label="鍗曚环" border-bottom>
-							<u-input v-model="product.unitPrice" type="number" placeholder="璇疯緭鍏ュ崟浠�" />
-						</u-form-item>
-						<u-form-item label="閲戦" border-bottom>
-							<u-input v-model="product.amount" type="number" placeholder="璇疯緭鍏ラ噾棰�" />
-						</u-form-item>
-						<u-form-item label="绋庣巼" border-bottom>
-							<u-input v-model="product.taxRate" placeholder="璇疯緭鍏ョ◣鐜�" />
-						</u-form-item>
-						<u-form-item label="绋庨" border-bottom>
-							<u-input v-model="product.taxAmount" type="number" placeholder="璇疯緭鍏ョ◣棰�" />
-						</u-form-item>
-						<u-form-item label="鍚◣閲戦" border-bottom>
-							<u-input v-model="product.totalAmount" type="number" placeholder="璇疯緭鍏ュ惈绋庨噾棰�" />
-						</u-form-item>
-						<u-form-item label="澶囨敞" border-bottom>
-							<u-textarea v-model="product.remark" placeholder="璇疯緭鍏ュ娉�" :maxlength="200" count :autoHeight="true" />
-						</u-form-item>
+				</view>
+				
+				<view v-if="!productData || productData.length === 0" class="empty-state">
+					<view class="empty-text">鏆傛棤浜у搧鏁版嵁</view>
+				</view>
+				
+				<view v-else class="product-list">
+					<view 
+						v-for="(item, index) in productData" 
+						:key="index" 
+						class="product-card"
+					>
+						<!-- 浜у搧澶撮儴 -->
+						<view class="product-header">
+							<view class="product-title">
+								<view class="document-icon">
+									<u-icon name="file-text" size="16" color="#ffffff"></u-icon>
+								</view>
+								<text class="product-productCategory">浜у搧 {{ index + 1 }}</text>
+							</view>
+						</view>
+						
+						<!-- 浜у搧淇℃伅琛ㄥ崟 -->
+						<view class="product-form">
+							<u-form-item label="浜у搧澶х被" prop="productCategory" border-bottom>
+								<u-input v-model="item.productCategory" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="瑙勬牸鍨嬪彿" prop="specificationModel" border-bottom>
+								<u-input v-model="item.specificationModel" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="鍗曚綅" prop="unit" border-bottom>
+								<u-input v-model="item.unit" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="鏁伴噺" prop="quantity" border-bottom>
+								<u-input v-model="item.quantity" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="绋庣巼(%)" prop="taxRate" border-bottom>
+								<u-input v-model="item.taxRate" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="褰曞叆鏃ユ湡" prop="registerDate" border-bottom>
+								<u-input v-model="item.registerDate" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="鍚◣鍗曚环(鍏�)" prop="taxInclusiveUnitPrice" border-bottom>
+								<u-input v-model="item.taxInclusiveUnitPrice" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="鍚◣鎬讳环(鍏�)" prop="taxInclusiveTotalPrice" border-bottom>
+								<u-input v-model="item.taxInclusiveTotalPrice" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="涓嶅惈绋庢�讳环(鍏�)" prop="taxExclusiveTotalPrice" border-bottom>
+								<u-input v-model="item.taxExclusiveTotalPrice" placeholder="" disabled />
+							</u-form-item>
+							
+							<!-- 鏈鏉ョエ淇℃伅 -->
+							<u-form-item label="鏈鏉ョエ鏁�" prop="ticketsNum" border-bottom>
+								<u-input 
+									v-model="item.ticketsNum" 
+									type="number" 
+									placeholder="璇疯緭鍏ユ潵绁ㄦ暟閲�"
+									@blur="invoiceNumBlur(item)"
+								/>
+							</u-form-item>
+							<u-form-item label="鏈鏉ョエ閲戦(鍏�)" prop="ticketsAmount" border-bottom>
+								<u-input 
+									v-model="item.ticketsAmount" 
+									type="number" 
+									placeholder="璇疯緭鍏ユ潵绁ㄩ噾棰�"
+									@blur="invoiceAmountBlur(item)"
+								/>
+							</u-form-item>
+							
+							<!-- 鏈潵绁ㄤ俊鎭� -->
+							<u-form-item label="鏈潵绁ㄦ暟" prop="futureTickets" border-bottom>
+								<u-input v-model="item.futureTickets" placeholder="" disabled />
+							</u-form-item>
+							<u-form-item label="鏈潵绁ㄩ噾棰�(鍏�)" prop="futureTicketsAmount" border-bottom>
+								<u-input v-model="item.futureTicketsAmount" placeholder="" disabled />
+							</u-form-item>
+						</view>
 					</view>
 				</view>
 			</view>
 			
-			<!-- 鎻愪氦鎸夐挳 -->
-			<view class="footer-btns">
-				<u-button class="cancel-btn" @click="goBack">鍙栨秷</u-button>
-				<u-button class="save-btn" type="primary" @click="submitForm">淇濆瓨</u-button>
-			</view>
+			<!-- 浣跨敤FooterButtons缁勪欢 -->
+			<FooterButtons 
+				@cancel="goBack"
+				@confirm="submitForm"
+				:loading="submitting"
+			/>
+
+			<!-- 涓哄簳閮ㄦ寜閽暀鍑虹┖闂� -->
+			<view style="height: 80px;"></view>
 		</u-form>
 
 		<!-- 寮�绁ㄦ棩鏈熼�夋嫨鍣� -->
-		<u-popup v-model="showIssueDatePicker" mode="bottom">
+		<u-popup :show="showEntryDatePicker" mode="bottom" @close="showEntryDatePicker = false">
 			<u-datetime-picker
-				v-model="issueDateValue"
-				title="閫夋嫨寮�绁ㄦ棩鏈�"
-				@confirm="onIssueDateConfirm"
-				@cancel="showIssueDatePicker = false"
+				:show="true"
+				v-model="entryDateValue"
+				@confirm="onEntryDateConfirm"
+				@cancel="showEntryDatePicker = false"
+				mode="date"
 			/>
 		</u-popup>
 
-		<!-- 鍒涘缓鏃堕棿閫夋嫨鍣� -->
-		<u-popup v-model="showCreateTimePicker" mode="bottom">
+		<!-- 褰曞叆鏃ユ湡閫夋嫨鍣� -->
+		<u-popup :show="showEnterDatePicker" mode="bottom" @close="showEnterDatePicker = false">
 			<u-datetime-picker
-				v-model="createTimeValue"
-				title="閫夋嫨鍒涘缓鏃堕棿"
-				@confirm="onCreateTimeConfirm"
-				@cancel="showCreateTimePicker = false"
+				:show="true"
+				v-model="enterDateValue"
+				@confirm="onEnterDateConfirm"
+				@cancel="showEnterDatePicker = false"
+				mode="date"
 			/>
 		</u-popup>
 	</view>
 </template>
 
 <script setup>
-// 鏇挎崲 Vant 鐨� toast 鏂规硶
-// import { showToast, showLoadingToast, closeToast } from 'vant'
-
-// 鏇挎崲 toast 鏂规硶
+import { ref, onMounted } from 'vue'
+import FooterButtons from '@/components/FooterButtons.vue'
 const showToast = (message) => {
   uni.showToast({
     title: message,
@@ -134,108 +204,262 @@
 const closeToast = () => {
   uni.hideLoading()
 }
+import useUserStore from '@/store/modules/user'
+import {addOrUpdateRegistration, getPurchaseNoById} from "@/api/procurementManagement/invoiceEntry";
+import {getInfo} from "@/api/procurementManagement/invoiceEntry.js";
+import { formatDateToYMD } from '@/utils/ruoyi'
+
+const userStore = useUserStore()
+const editData = ref(null);
+
+// 琛ㄥ崟寮曠敤
+const formRef = ref()
+
+// 琛ㄥ崟鏁版嵁
+let form = ref({
+  purchaseLedgerNo: '',
+  salesContractNo: '',
+  supplierName: '',
+  projectName: '',
+  issUer: '',
+  entryDate: '',
+  enterDate: '',
+  invoiceAmount: '',
+  invoiceNumber: '',
+  fileIds: []
+})
+
+// 浜у搧鏁版嵁
+const productData = ref([])
+
+// 鏂囦欢涓婁紶鐩稿叧
+const action = ref('/dev-api/common/upload')
+const getToken = () => {
+  return userStore.token || ''
+}
+
+// 鏃ユ湡閫夋嫨鍣ㄧ姸鎬�
+const showEntryDatePicker = ref(false)
+const showEnterDatePicker = ref(false)
+const entryDateValue = ref(Date.now())
+const enterDateValue = ref(Date.now())
+
+// 鎻愪氦鐘舵��
+const submitting = ref(false)
+
+// 杩斿洖涓婁竴椤�
+const goBack = () => {
+	// 娓呯悊鏈湴瀛樺偍鐨勬暟鎹�
+	uni.removeStorageSync('editData');
+  uni.navigateBack()
+}
+
+// 鏍煎紡鍖栨暟瀛�
+const formatNumber = (value, precision = 2) => {
+  if (!value && value !== 0) return '0.00'
+  return Number(value).toFixed(precision)
+}
+
+// 鏇存柊鏈潵绁ㄦ暟鎹�
+const updateFutureTicketData = (row) => {
+  const totalQuantity = parseFloat(row.quantity) || 0
+  const currentTicketNum = parseFloat(row.ticketsNum) || 0
+  const totalAmount = parseFloat(row.taxInclusiveTotalPrice) || 0
+  const currentTicketAmount = parseFloat(row.ticketsAmount) || 0
+
+  row.futureTickets = Math.max(0, totalQuantity - currentTicketNum).toFixed(2)
+  row.futureTicketsAmount = Math.max(0, totalAmount - currentTicketAmount).toFixed(2)
+}
+
+// 鏉ョエ鏁伴噺鍙樺寲澶勭悊
+const invoiceNumBlur = (row) => {
+	if (!row.ticketsNum || row.ticketsNum === "") {
+    row.ticketsNum = 0;
+  }
+  if (Number(row.ticketsNum) > Number(row.tempFutureTickets)) {
+    showToast("鏈寮�绁ㄦ暟涓嶅緱澶т簬鏈紑绁ㄦ暟");
+    row.ticketsNum = 0;
+    return;
+  }
+  // 璁$畻鏈鏉ョエ閲戦
+  row.ticketsAmount = row.ticketsNum * row.taxInclusiveUnitPrice;
+  // 璁$畻鏈潵绁ㄦ暟
+  row.futureTickets = row.tempFutureTickets - row.ticketsNum;
+  // 璁$畻鏈潵绁ㄩ噾棰�
+  row.futureTicketsAmount = row.tempFutureTicketsAmount - row.ticketsAmount;
+  calculateinvoiceAmount();
+}
+
+// 鏉ョエ閲戦鍙樺寲澶勭悊
+const invoiceAmountBlur = (row) => {
+	if (!row.ticketsAmount) {
+		row.ticketsAmount = 0;
+	}
+	// 璁$畻鏄惁瓒呰繃鏉ョエ鎬婚噾棰�
+	if (Number(row.ticketsAmount) > Number(row.taxInclusiveTotalPrice)) {
+		showToast('鏈鏉ョエ閲戦涓嶅緱澶т簬鍚◣鎬婚噾棰�');
+		row.ticketsAmount = 0;
+	}
+	// 璁$畻鏈鏉ョエ鏁�
+	row.ticketsNum = Number(
+		(row.ticketsAmount / row.taxInclusiveUnitPrice).toFixed(2)
+	);
+	// 璁$畻鏈潵绁ㄦ暟鍜屾湭鏉ョエ閲戦
+	updateFutureTicketData(row)
+	calculateinvoiceAmount();
+}
+
+const calculateinvoiceAmount = () => {
+	let invoiceAmountTotal = 0;
+	productData.value.forEach((item) => {
+		if (item.ticketsAmount) {
+			invoiceAmountTotal += Number(item.ticketsAmount);
+		}
+	});
+	form.value.invoiceAmount = invoiceAmountTotal.toFixed(2);
+}
+
+// 鏂囦欢涓婁紶鎴愬姛鍥炶皟
+const uploadSuccess = (res) => {
+  if (res && res.data && res.data.fileId) {
+    form.value.fileIds.push(res.data.fileId)
+  }
+}
+
+// 鏂囦欢鍒犻櫎鍥炶皟
+const removeFile = (index, file) => {
+  if (file.fileId) {
+    const fileIndex = form.value.fileIds.indexOf(file.fileId)
+    if (fileIndex > -1) {
+      form.value.fileIds.splice(fileIndex, 1)
+    }
+  }
+}
+
+
+
+// 寮�绁ㄦ棩鏈熺‘璁�
+const onEntryDateConfirm = (e) => {
+	form.value.entryDate = formatDateToYMD(e.value)
+	entryDateValue.value = e.value
+	showEntryDatePicker.value = false;
+};
+
+// 褰曞叆鏃ユ湡纭
+const onEnterDateConfirm = (e) => {
+	form.value.enterDate = formatDateToYMD(e.value)
+	enterDateValue.value = e.value
+	showEnterDatePicker.value = false;
+}
+
+// 鏍煎紡鍖栨棩鏈�
+const formatDate = (date) => {
+  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 getProductList = async () => {
+  try {
+    showLoadingToast('鍔犺浇涓�...')
+    const res = await getPurchaseNoById({ id: editData.value.id })
+		form.value.purchaseLedgerNo = res.data.purchaseContractNumber;
+		form.value.invoiceAmount = res.data.invoiceAmount;
+		form.value.invoiceNumber = res.data.invoiceNumber;
+		const data = await getInfo({ id: editData.value.id });
+		productData.value = data.data.productData;
+		form.value.salesContractNo = data.data.salesContractNo;
+		form.value.projectName = data.data.projectName;
+		form.value.supplierName = data.data.supplierName;
+		form.value.productData = data.data.productData;
+		// 璁剧疆榛樿褰曞叆浜�
+		form.value.issUer = userStore.nickName
+		
+		// 璁剧疆榛樿鏃ユ湡
+		const today = new Date()
+		form.value.enterDate = formatDate(today)
+		form.value.entryDate = formatDate(today)
+    
+    closeToast()
+  } catch (error) {
+    closeToast()
+    showToast('鑾峰彇浜у搧鍒楄〃澶辫触')
+  }
+}
+
+// 鎻愪氦琛ㄥ崟
+const submitForm = async () => {
+  try {
+    submitting.value = true
+    
+    // 楠岃瘉鍙戠エ鍙锋槸鍚﹀~鍐�
+    if (!form.value.invoiceNumber) {
+      showToast('璇疯緭鍏ュ彂绁ㄥ彿')
+      return
+    }
+    
+    // 楠岃瘉浜у搧鏁版嵁
+    if (productData.value.length === 0) {
+      showToast('璇峰厛娣诲姞浜у搧淇℃伅')
+      return
+    }
+
+    // 楠岃瘉鏉ョエ鏁版嵁
+    const hasInvoiceData = productData.value.some(item => {
+      const num = parseFloat(item.ticketsNum) || 0
+      const amount = parseFloat(item.ticketsAmount) || 0
+      return num > 0 || amount > 0
+    })
+
+    if (!hasInvoiceData) {
+      showToast('璇疯嚦灏戣緭鍏ヤ竴涓骇鍝佺殑鏉ョエ淇℃伅')
+      return
+    }
+
+    const submitData = {
+      ...form.value,
+		productData: productData.value
+    }
+
+    await addOrUpdateRegistration(submitData)
+    showToast('鎻愪氦鎴愬姛')
+    
+    // 杩斿洖涓婁竴椤�
+    setTimeout(() => {
+			goBack()
+    }, 800)
+    
+  } catch (error) {
+    showToast('鎻愪氦澶辫触锛岃閲嶈瘯')
+  } finally {
+    submitting.value = false
+  }
+}
+
+// 椤甸潰鍔犺浇鏃跺垵濮嬪寲鏁版嵁
+onMounted(() => {
+  // 浠庨〉闈㈠弬鏁版垨缂撳瓨涓幏鍙栭攢鍞悎鍚屼俊鎭�
+  const contractInfo = uni.getStorageSync('editData')
+  if (contractInfo) {
+		editData.value = JSON.parse(contractInfo);
+    const contract = JSON.parse(contractInfo)
+    form.value.purchaseLedgerNo = contract.purchaseLedgerNo || ''
+    form.value.salesContractNo = contract.salesContractNo || ''
+    form.value.supplierName = contract.supplierName || ''
+    form.value.projectName = contract.projectName || ''
+    form.value.invoiceAmount = contract.invoiceAmount || ''
+    form.value.invoiceNumber = contract.invoiceNumber || ''
+    form.value.purchaseLedgerId = contract.id || ''
+    
+    // 鑾峰彇浜у搧鍒楄〃
+    getProductList()
+  }
+})
 </script>
 
 <style scoped lang="scss">
-.account-detail {
-	min-height: 100vh;
-	background: #f8f9fa;
-	padding-bottom: 5rem;
-}
+@import '@/static/scss/form-common.scss';
 
-.empty-state {
-  padding: 40px 0;
-}
-
-.product-section {
-  background: #fff;
-  margin-top: 1rem;
-  padding: 1rem;
-  box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,0.04);
-}
-
-.section-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 1rem;
-}
-
-.section-title {
-  font-size: 1rem;
-  font-weight: 600;
-  color: #333;
-}
-
-.product-list {
-  .product-card {
-    background: #FFFFFF;
-    box-shadow: 0 0 1.25rem 0 rgba(0,57,117,0.08);
-    border-radius: 0.5rem 0.5rem 0.5rem 0.5rem;
-    padding: 1rem 0.5rem 0 0.5rem;
-    position: relative;
-    margin-bottom: 1rem;
-  }
-}
-
-.product-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 0.5rem 0.75rem 0.5rem;
-  border-bottom: 0.0625rem solid #e8e8e8;
-}
-
-.product-title {
-  display: flex;
-  align-items: center;
-}
-
-.product-productCategory {
-  margin-left: 0.5rem;
-  font-size: 0.875rem;
-  font-weight: 500;
-  color: #333;
-}
-
-.product-form {
-  margin-bottom: 1rem;
-}
-.footer-btns {
-	position: fixed;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background: #fff;
-	display: flex;
-	justify-content: space-around;
-	align-items: center;
-	padding: 0.75rem 0;
-	box-shadow: 0 -0.125rem 0.5rem rgba(0,0,0,0.05);
-	z-index: 1000;
-}
-.cancel-btn {
-	font-weight: 400;
-	font-size: 1rem;
-	color: #FFFFFF;
-	width: 6.375rem;
-	background: #C7C9CC;
-	box-shadow: 0 0.25rem 0.625rem 0 rgba(3,88,185,0.2);
-	border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
-}
-.save-btn {
-	font-weight: 400;
-	font-size: 1rem;
-	color: #FFFFFF;
-	width: 14rem;
-	background: linear-gradient( 140deg, #00BAFF 0%, #006CFB 100%);
-	box-shadow: 0 0.25rem 0.625rem 0 rgba(3,88,185,0.2);
-	border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
-}
-// 鍝嶅簲寮忚皟鏁�
-@media (max-width: 768px) {
-  .submit-section {
-    padding: 12px;
-  }
-}
 </style>

--
Gitblit v1.9.3