优化

src/modules/finance/pages/FinanceFormalSettlementPage.vue

@@ -10,6 +10,7 @@ import { categoryLabels, listSuppliers, type Supplier } from '@/modules/supplier
 import { getApiErrorDetails, getApiErrorMessage, type ApiErrorDetails } from '@/shared/api/http'
 import AdminPage from '@/shared/components/AdminPage.vue'
 import ApiErrorMeta from '@/shared/components/ApiErrorMeta.vue'
+import OperationErrorToast from '@/shared/components/OperationErrorToast.vue'
 import AppDialog from '@/shared/components/AppDialog.vue'
 import DataTable, { type DataTableColumn } from '@/shared/components/DataTable.vue'
 import DetailPageLayout from '@/shared/components/DetailPageLayout.vue'
@@ -480,6 +481,8 @@ onMounted(() => {
 
 <template>
   <AdminPage as="div" class="finance-settlement-page" spacing="normal">
+    <OperationErrorToast :message="receiptValidationError" />
+    <OperationErrorToast :details="receiptError" />
     <el-result v-if="!canView" icon="warning" :title="`无权访问${title}`" sub-title="请联系管理员开通结算单查看权限" />
     <DetailPageLayout v-else-if="detailMode" class="settlement-detail-page surface-panel" :aria-label="`${title}详情`">
       <template #header><header class="settlement-detail-header">
@@ -631,9 +634,6 @@ onMounted(() => {
 
     <AppDialog v-model="receiptOpen" title="登记收款" width="min(760px, 94vw)" :confirm-loading="receiptBusy" @confirm="submitReceipt">
       <div v-if="detail" class="partial-summary"><div><span>结算单号</span><strong>{{ detail.settlementNo }}</strong></div><div><span>客户公司</span><strong>{{ detailPartyName() }}</strong></div><div><span>应收金额</span><strong>{{ money(detail.amount) }}</strong></div><div><span>已收金额</span><strong class="is-success">{{ money(detail.paidAmount) }}</strong></div><div><span>当前余额</span><strong class="is-danger">{{ money(detail.outstandingAmount) }}</strong></div></div>
-      <el-alert v-if="receiptValidationError" type="error" :title="receiptValidationError" :closable="false" show-icon class="operation-error" />
-      <el-alert v-if="receiptError" type="error" :title="receiptError.message" :closable="false" show-icon class="operation-error" />
-      <ApiErrorMeta v-if="receiptError" :details="receiptError" class="operation-error-meta" />
       <el-form class="settlement-operation-form" label-position="top"><el-form-item label="收款日期"><el-date-picker v-model="receiptForm.receivedDate" type="date" value-format="YYYY-MM-DD" /></el-form-item><el-form-item label="本次收款金额(CNY)"><el-input-number v-model="receiptForm.amount" :min="0.01" :max="detail?.outstandingAmount || 0.01" :precision="2" /></el-form-item><el-form-item label="收款方式"><el-select v-model="receiptForm.paymentMethod"><el-option label="银行转账" value="BANK_TRANSFER" /><el-option label="现金" value="CASH" /><el-option label="其他" value="OTHER" /></el-select></el-form-item><el-form-item label="收款凭证"><el-upload :key="receiptUploadKey" :auto-upload="false" :limit="1" accept="image/*" :on-change="selectReceiptFile"><el-button>选择图片</el-button></el-upload></el-form-item><el-form-item label="备注"><el-input v-model="receiptForm.remark" type="textarea" /></el-form-item></el-form>
       <div v-if="detail" class="remaining-preview"><span>登记后剩余余额</span><strong>{{ remainingAfter(receiptForm.amount) }}</strong></div>
     </AppDialog>