统一报销错误提示无障碍样式(08-30-b2-submit-error-ocr-fallback)

这个提交包含在:
2026-08-31 21:38:52 +08:00
父节点 fff360f362
当前提交 8aed72d1bf
共修改 3 个文件,包含 16 行新增和 14 行删除
@@ -925,7 +925,7 @@ export function MobileReimbursementDetailPage() {
if (!reimbursementId) {
return (
<PageScaffold>
<div className="rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-600">缺少报销单 ID。</div>
<div className="rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-700">缺少报销单 ID。</div>
</PageScaffold>
);
}
@@ -943,7 +943,7 @@ export function MobileReimbursementDetailPage() {
if (detailQuery.isError || !detail) {
return (
<PageScaffold className="space-y-4">
<div className="rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-600">
<div className="rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-700">
{resolveErrorMessage(detailQuery.error)}
</div>
<Button asChild variant="secondary">
@@ -1102,7 +1102,7 @@ export function MobileReimbursementDetailPage() {
</div>
{itemError ? (
<div className="mt-3 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600">{itemError}</div>
<div className="mt-3 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">{itemError}</div>
) : null}
{itemForm ? (
@@ -1311,7 +1311,7 @@ export function MobileReimbursementDetailPage() {
) : null}
{invoiceActionError ? (
<p className="mt-3 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600">
<p className="mt-3 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">
{invoiceActionError}
</p>
) : null}
@@ -1525,7 +1525,7 @@ export function MobileReimbursementDetailPage() {
<h2 className="text-base font-semibold text-zinc-900">操作</h2>
{actionError ? (
<div
className="mt-3 whitespace-pre-wrap rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600"
className="mt-3 whitespace-pre-wrap rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700"
role="alert"
aria-live="assertive"
>
@@ -1594,7 +1594,7 @@ export function MobileReimbursementDetailPage() {
</div>
{invoiceActionError ? (
<div className="mt-3 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600">
<div className="mt-3 rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">
{invoiceActionError}
</div>
) : null}
@@ -1706,7 +1706,7 @@ export function MobileReimbursementDetailPage() {
>
{invoiceLibraryLoading ? <div className="text-sm text-zinc-500">加载中...</div> : null}
{invoiceLibraryError ? (
<div className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600">
<div className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">
{resolveErrorMessage(invoiceLibraryError)}
</div>
) : null}
+6 -6
查看文件
@@ -1214,7 +1214,7 @@ export function ReimbursementDetailPage() {
{actionError ? (
<p
className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600"
className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700"
data-testid="reimbursement-action-error"
role="alert"
aria-live="assertive"
@@ -1228,7 +1228,7 @@ export function ReimbursementDetailPage() {
</p>
) : null}
{hasBlockingPrecheck ? (
<p className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600">
<p className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">
请修改超标明细后提交。
</p>
) : null}
@@ -1275,7 +1275,7 @@ export function ReimbursementDetailPage() {
{itemError ? (
<p
className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600"
className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700"
data-testid="reimbursement-item-error"
>
{itemError}
@@ -1471,7 +1471,7 @@ export function ReimbursementDetailPage() {
{invoiceActionError ? (
<p
className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600"
className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700"
data-testid={TEST_IDS.reimbursement.invoiceActionError}
>
{invoiceActionError}
@@ -1762,7 +1762,7 @@ export function ReimbursementDetailPage() {
</div>
{invoiceActionError ? (
<p className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600">
<p className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">
{invoiceActionError}
</p>
) : null}
@@ -1771,7 +1771,7 @@ export function ReimbursementDetailPage() {
{bindableInvoicesQuery.isLoading ? (
<p className="text-sm text-zinc-500">正在加载可添加发票...</p>
) : bindableInvoicesQuery.isError ? (
<p className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600">
<p className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700">
{buildActionErrorMessage(bindableInvoicesQuery.error, "加载可添加发票失败")}
</p>
) : (bindableInvoicesQuery.data?.items ?? []).length ? (
@@ -40,8 +40,10 @@ export function ReimbursementActions({
<div className="space-y-4">
{actionError ? (
<p
className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600"
className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-700"
data-testid="reimbursement-action-error"
role="alert"
aria-live="assertive"
>
{actionError}
</p>