统一报销错误提示无障碍样式(08-30-b2-submit-error-ocr-fallback)
这个提交包含在:
@@ -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}
|
||||
|
||||
@@ -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>
|
||||
|
||||
在新工单中引用
屏蔽一个用户