优化财务与管理页视觉 Wave4(05-27-pc-finance-admin-visual-wave4)

这个提交包含在:
2026-05-27 22:23:45 +08:00
父节点 8b3db8fa4e
当前提交 c5eb27eac8
共修改 18 个文件,包含 1379 行新增和 96 行删除
+31 -12
查看文件
@@ -169,6 +169,15 @@ export function MasterDataPage() {
const legalEntities = legalEntitiesQuery.data?.items ?? [];
const costCenters = costCentersQuery.data?.items ?? [];
const documentCategories = documentCategoriesQuery.data?.items ?? [];
const masterDataStats = {
legalEntities: legalEntities.length,
costCenters: costCenters.length,
documentCategories: documentCategories.length,
archived:
legalEntities.filter((item) => item.archivedAt).length +
costCenters.filter((item) => item.archivedAt).length +
documentCategories.filter((item) => item.archivedAt).length,
};
const availableParentCostCenters = useMemo(() => {
return costCenters.filter(
@@ -315,8 +324,16 @@ export function MasterDataPage() {
<p className="rounded-lg border border-red-200 bg-red-50 px-3 py-2 text-sm text-red-600">{error}</p>
) : null}
<div className="finance-status-strip" data-testid="master-data-summary">
<div className="finance-metric-card"><div className="finance-metric-card__label">法体</div><div className="finance-metric-card__value">{masterDataStats.legalEntities}</div></div>
<div className="finance-metric-card"><div className="finance-metric-card__label">成本中心</div><div className="finance-metric-card__value">{masterDataStats.costCenters}</div></div>
<div className="finance-metric-card"><div className="finance-metric-card__label">单据分类</div><div className="finance-metric-card__value">{masterDataStats.documentCategories}</div></div>
<div className="finance-metric-card"><div className="finance-metric-card__label">归档项</div><div className="finance-metric-card__value">{masterDataStats.archived}</div></div>
<div className="finance-metric-card"><div className="finance-metric-card__label">当前视图</div><div className="finance-metric-card__value text-base">{includeArchived ? "含归档" : "仅启用"}</div></div>
</div>
<Tabs value={tab} onValueChange={(value) => setTab(value as typeof tab)}>
<TabsList className="flex w-full flex-wrap justify-start gap-1">
<TabsList className="ops-command-bar__tabs !w-full !justify-start">
<TabsTrigger value="legal-entities">法体</TabsTrigger>
<TabsTrigger value="cost-centers">成本中心</TabsTrigger>
<TabsTrigger value="document-categories">单据分类</TabsTrigger>
@@ -325,7 +342,7 @@ export function MasterDataPage() {
</TabsList>
<TabsContent value="legal-entities" className="space-y-6">
<FilterBar className="space-y-4">
<FilterBar className="ops-command-bar !p-3 md:!p-3.5">
<div className="flex flex-wrap items-center justify-between gap-3">
<h3 className="text-base font-semibold text-zinc-900">法体筛选</h3>
<select
@@ -341,7 +358,7 @@ export function MasterDataPage() {
</FilterBar>
{canManage ? (
<div className="card-std space-y-4 p-4 md:p-5">
<div className="admin-command-panel space-y-4">
<h3 className="text-base font-semibold text-zinc-900">新建法体</h3>
<div className="grid gap-3 md:grid-cols-3">
<div className="space-y-1">
@@ -377,11 +394,11 @@ export function MasterDataPage() {
</div>
) : null}
<div className="card-std space-y-3 p-4 md:p-5">
<div className="admin-command-panel space-y-4">
<h3 className="text-base font-semibold text-zinc-900">法体列表</h3>
{legalEntitiesQuery.isLoading ? <TableSkeleton columns={6} rows={4} /> : null}
{!legalEntitiesQuery.isLoading ? (
<PrimaryTable>
<PrimaryTable className="ops-table-focus">
<Table>
<TableHeader>
<TableRow>
@@ -438,7 +455,7 @@ export function MasterDataPage() {
</TabsContent>
<TabsContent value="cost-centers" className="space-y-6">
<FilterBar className="space-y-4">
<FilterBar className="ops-command-bar !p-3 md:!p-3.5">
<div className="grid gap-3 md:grid-cols-3">
<select
className="select-std"
@@ -467,7 +484,7 @@ export function MasterDataPage() {
</FilterBar>
{canManage ? (
<div className="card-std space-y-4 p-4 md:p-5">
<div className="admin-command-panel space-y-4">
<h3 className="text-base font-semibold text-zinc-900">新建成本中心</h3>
<div className="grid gap-3 md:grid-cols-4">
<div className="space-y-1 md:col-span-2">
@@ -534,11 +551,11 @@ export function MasterDataPage() {
</div>
) : null}
<div className="card-std space-y-3 p-4 md:p-5">
<div className="admin-command-panel space-y-4">
<h3 className="text-base font-semibold text-zinc-900">成本中心列表</h3>
{costCentersQuery.isLoading ? <TableSkeleton columns={7} rows={4} /> : null}
{!costCentersQuery.isLoading ? (
<PrimaryTable>
<PrimaryTable className="ops-table-focus">
<Table>
<TableHeader>
<TableRow>
@@ -597,7 +614,7 @@ export function MasterDataPage() {
</TabsContent>
<TabsContent value="document-categories" className="space-y-6">
<FilterBar className="space-y-4">
<FilterBar className="ops-command-bar !p-3 md:!p-3.5">
<div className="grid gap-3 md:grid-cols-3">
<select
className="select-std"
@@ -626,7 +643,7 @@ export function MasterDataPage() {
</FilterBar>
{canManage ? (
<div className="card-std space-y-4 p-4 md:p-5">
<div className="admin-command-panel space-y-4">
<h3 className="text-base font-semibold text-zinc-900">新建单据分类</h3>
<div className="grid gap-3 md:grid-cols-4">
<div className="space-y-1">
@@ -697,10 +714,11 @@ export function MasterDataPage() {
</div>
) : null}
<div className="card-std space-y-3 p-4 md:p-5">
<div className="admin-command-panel space-y-4">
<h3 className="text-base font-semibold text-zinc-900">单据分类列表</h3>
{documentCategoriesQuery.isLoading ? <TableSkeleton columns={7} rows={4} /> : null}
{!documentCategoriesQuery.isLoading ? (
<PrimaryTable className="ops-table-focus">
<Table>
<TableHeader>
<TableRow>
@@ -757,6 +775,7 @@ export function MasterDataPage() {
)}
</TableBody>
</Table>
</PrimaryTable>
) : null}
</div>
</TabsContent>