fix FundRecordRevoke.vue style

src/pages/salesOrder/FundRecordList.vue

@@ -30,9 +30,9 @@
 						<div class="title">
 							<span v-text="getFundOperationText(item.operationType)" />
 							<t-tag
-								:content="getFundStatusText(item.status)"
+								:content="getRecordStatusText(item)"
 								variant="light-outline"
-								:theme="getStatusTheme(item.status)"
+								:theme="getRecordStatusTheme(item)"
 							/>
 						</div>
 					</template>
@@ -48,13 +48,28 @@
 									<span class="text-bold" v-text="getVerifierText(item)" />
 								</span>
 							</div>
-							<pass-time-label :timestamp="item.occurredAt" underline />
+							<div>
+								<pass-time-label :timestamp="item.occurredAt" underline />
+							</div>
 						</div>
 					</template>
 					<template #note>
-						<div class="amount">
-							<span class="red">￥</span>
-							<span class="value red" v-text="formatPackageAmount(item.amount)" />
+						<div class="amounts">
+							<div class="order-amount">
+								<span class="label">订单总价</span>
+								<span>￥</span>
+								<span v-text="formatPackageAmount(item.salesOrderAmount)" />
+							</div>
+							<div class="unpaid-amount">
+								<span class="label">剩余待收</span>
+								<span>￥</span>
+								<span v-text="formatPackageAmount(item.salesOrderUnpaidAmountSnapshot)" />
+							</div>
+							<div class="record-amount">
+								<span class="label">流水金额</span>
+								<span class="red">￥</span>
+								<span class="value red" v-text="formatPackageAmount(item.amount)" />
+							</div>
 						</div>
 					</template>
 				</t-cell>
@@ -72,7 +87,7 @@ import { useNavBarStore } from "@/store/navBarStore";
 import type { FundOperationType, FundRecord, FundRecordStatus } from "@/types/SalesOrder";
 import { getErrorMessage } from "@/utils/error";
 import { formatPackageAmount } from "@/utils/package";
-import { getFundBizTypeText, getFundOperationText, getFundStatusText } from "@/utils/salesOrder";
+import { getFundOperationText, getFundStatusText } from "@/utils/salesOrder";
 import { Message } from "@/utils/message";
 import { permissionCodes } from "@/utils/permission";
 import { PassTimeLabel } from "timi-web";
@@ -166,6 +181,14 @@ function getStatusTheme(statusValue?: FundRecordStatus): "success" | "warning" |
 	return statusValue === "VERIFIED" ? "success" : statusValue === "PENDING" ? "warning" : statusValue === "REJECTED" ? "danger" : "default";
 }
 
+function getRecordStatusText(item: FundRecord): string {
+	return item.revokeRecordId ? "已被冲正" : getFundStatusText(item.status);
+}
+
+function getRecordStatusTheme(item: FundRecord): "success" | "warning" | "danger" | "default" {
+	return item.revokeRecordId ? "danger" : getStatusTheme(item.status);
+}
+
 async function toDetail(item: FundRecord): Promise<void> {
 	if (item.id) {
 		await router.push({
@@ -256,7 +279,7 @@ onUnmounted(() => navBarStore.clearRight());
 			gap: 0;
 			color: var(--td-text-color-secondary);
 			display: flex;
-			font-size: .8125rem;
+			font-size: .75rem;
 			flex-wrap: wrap;
 			line-height: 1.5;
 			flex-direction: column;
@@ -277,9 +300,26 @@ onUnmounted(() => navBarStore.clearRight());
 			}
 		}
 
-		.amount {
+		.amounts {
+			display: flex;
+			font-size: .75rem;
+			align-items: end;
+			flex-direction: column;
 
-			.value {
+			.label {
+				color: var(--td-text-color-placeholder);
+			}
+
+			.order-amount,
+			.unpaid-amount,
+			.record-amount {
+				gap: .125rem;
+				display: flex;
+				align-items: baseline;
+				white-space: nowrap;
+			}
+
+			.record-amount .value {
 				font-size: 1.25rem;
 			}
 		}