fix: compact report status record table
This commit is contained in:
hectorzhao
@@ -5018,6 +5018,7 @@ npm run verify:phase8
|
||||
| TC-REPORT-WORKBENCH-008 | 短信通道管理进入报备详情 | 使用后端分页，默认按今日发送条数全量降序后分页；可按关键词、状态、运营商及今日发送区间查询；状态弹窗展示当前上下文和放弃风险 |
|
||||
| TC-REPORT-WORKBENCH-009 | 导入命中已有签名且用途列未映射或为空 | 识别为补资料；未提供字段保持原值，提供的动态字段覆盖同名值并追加新字段；用途不得被空字符串清空；审核前不改真实签名 |
|
||||
| TC-REPORT-WORKBENCH-010 | 在状态记录按批次、操作人、状态、入口、对象和时间搜索 | 返回真实状态记录及操作人；可追溯人工修改来源；分页、空数据、失败和历史无入口记录均正确展示 |
|
||||
| TC-REPORT-WORKBENCH-020 | 1600px大屏PC查看状态记录列表 | 列表合并展示“变更对象”、“变更动作”和“操作人 / 时间”，无需左右滚动；备注、修改入口等完整信息仍可在详情弹窗查看，搜索参数和真实API不变 |
|
||||
| TC-REPORT-WORKBENCH-011 | 桌面及390px窄屏查看四页和状态弹窗 | 桌面表格可扫描；窄屏核心主体、状态、今日发送和操作可访问，无按钮遮挡；控制台无新增错误，所有业务数据来自真实API/PostgreSQL |
|
||||
| TC-REPORT-WORKBENCH-012 | 查看企业签名表头和签名列表 | 签名列不显示升序、降序或其他排序按钮；列表不显示逐行待生成明细字段；默认按创建时间倒序 |
|
||||
| TC-REPORT-WORKBENCH-013 | 通道报备明细当前页有10条数据，点击右上角“全选当页” | 当前页10条全部选中，按钮变为“取消全选”，批量数为10；该按钮与“批量修改状态”保持统一操作区间距；翻页或查询后选择清空，不选中其他页面数据 |
|
||||
|
||||
@@ -192,68 +192,65 @@ export function AdminReportRecordsPage() {
|
||||
{
|
||||
key: 'task',
|
||||
title: '报备任务号',
|
||||
width: '190px',
|
||||
render: (record) => <strong className="admin-task-id">{record.taskId}</strong>,
|
||||
},
|
||||
{ key: 'channel', title: '通道名称', width: '180px', render: (record) => record.channel?.name ?? '-' },
|
||||
{
|
||||
key: 'targetType',
|
||||
title: '变更主体',
|
||||
width: '110px',
|
||||
render: (record) => (
|
||||
<Tag tone={record.task?.reportType === 'drainage' ? 'info' : 'neutral'}>
|
||||
{record.task?.reportType === 'drainage' ? '引流信息' : '签名'}
|
||||
</Tag>
|
||||
),
|
||||
width: '160px',
|
||||
render: (record) => <strong className="admin-task-id admin-report-record-id" title={record.taskId}>{record.taskId}</strong>,
|
||||
},
|
||||
{ key: 'channel', title: '通道名称', width: '130px', render: (record) => record.channel?.name ?? '-' },
|
||||
{
|
||||
key: 'target',
|
||||
title: '主体内容',
|
||||
width: '260px',
|
||||
title: '变更对象',
|
||||
width: '230px',
|
||||
render: (record) =>
|
||||
record.task?.reportType === 'drainage' ? (
|
||||
<div className="admin-task-enterprise">
|
||||
<div className="admin-task-enterprise admin-report-record-target">
|
||||
<Tag tone="info">引流信息</Tag>
|
||||
<strong>{record.task?.signature?.name ?? '-'}</strong>
|
||||
<span>{record.task?.drainageInfo?.url ?? '-'}</span>
|
||||
{record.task?.drainageInfo?.remark ? <span>{record.task.drainageInfo.remark}</span> : null}
|
||||
</div>
|
||||
) : (
|
||||
<div className="admin-task-enterprise">
|
||||
<div className="admin-task-enterprise admin-report-record-target">
|
||||
<Tag tone="neutral">签名</Tag>
|
||||
<strong>{record.task?.signature?.name ?? '-'}</strong>
|
||||
{record.task?.signature?.purpose ? <span>{record.task.signature.purpose}</span> : null}
|
||||
</div>
|
||||
),
|
||||
},
|
||||
{ key: 'source', title: '修改入口', width: '150px', render: (record) => recordSource(record) },
|
||||
{
|
||||
key: 'operator',
|
||||
title: '操作人',
|
||||
width: '140px',
|
||||
render: (record) => record.operator?.displayName ?? record.operator?.username ?? '系统',
|
||||
key: 'action',
|
||||
title: '变更动作',
|
||||
width: '180px',
|
||||
render: (record) => (
|
||||
<div className="admin-report-record-meta">
|
||||
<strong>{actionLabel[record.action] ?? record.action}</strong>
|
||||
<span>{recordSource(record)}</span>
|
||||
</div>
|
||||
),
|
||||
},
|
||||
{ key: 'action', title: '动作', width: '170px', render: (record) => actionLabel[record.action] ?? record.action },
|
||||
{
|
||||
key: 'status',
|
||||
title: '状态变化',
|
||||
width: '210px',
|
||||
width: '150px',
|
||||
render: (record) => (
|
||||
<Tag
|
||||
tone={statusTone[record.statusAfter ?? 'pending'] ?? 'info'}
|
||||
>{`${translateStatus(record.statusBefore)} → ${translateStatus(record.statusAfter)}`}</Tag>
|
||||
),
|
||||
},
|
||||
{ key: 'time', title: '记录时间', width: '190px', render: (record) => record.createdAt ?? '-' },
|
||||
{
|
||||
key: 'reason',
|
||||
title: '备注',
|
||||
width: '320px',
|
||||
render: (record) => <span className="ui-table__long-text">{record.reason ?? '-'}</span>,
|
||||
key: 'operatorTime',
|
||||
title: '操作人 / 时间',
|
||||
width: '175px',
|
||||
render: (record) => (
|
||||
<div className="admin-report-record-meta">
|
||||
<strong>{record.operator?.displayName ?? record.operator?.username ?? '系统'}</strong>
|
||||
<span>{record.createdAt ?? '-'}</span>
|
||||
</div>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: 'actions',
|
||||
title: '操作',
|
||||
align: 'right',
|
||||
width: '120px',
|
||||
width: '76px',
|
||||
render: (record) => (
|
||||
<Button icon={<Eye size={14} />} onClick={() => setDetail(record)} size="sm" variant="ghost">
|
||||
详情
|
||||
|
||||
@@ -4,6 +4,7 @@ import { beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
import { MemoryRouter } from 'react-router-dom';
|
||||
import { AdminReportBatchesPage } from './AdminReportBatchesPage';
|
||||
import { AdminReportMaterialsPage } from './AdminReportMaterialsPage';
|
||||
import { AdminReportRecordsPage } from './AdminReportRecordsPage';
|
||||
import { AdminReportTasksPage } from './AdminReportTasksPage';
|
||||
|
||||
const { adminApi, clipboardWriteText } = vi.hoisted(() => ({
|
||||
@@ -18,6 +19,7 @@ const { adminApi, clipboardWriteText } = vi.hoisted(() => ({
|
||||
listReportDetailsPage: vi.fn(),
|
||||
listReportMaterialBatches: vi.fn(),
|
||||
listReportMaterialBatchTasks: vi.fn(),
|
||||
listReportRecordsPage: vi.fn(),
|
||||
preflightReportMaterialBatch: vi.fn(),
|
||||
},
|
||||
clipboardWriteText: vi.fn(),
|
||||
@@ -171,6 +173,43 @@ describe('report workbench pages', () => {
|
||||
);
|
||||
});
|
||||
|
||||
it('keeps the report record list compact while retaining full details in the dialog', async () => {
|
||||
adminApi.listReportRecordsPage.mockResolvedValue({
|
||||
items: [{
|
||||
id: 'record-1',
|
||||
taskId: 'report-task-with-a-long-identifier-1',
|
||||
channelId: 'channel-1',
|
||||
action: 'manual_status_change',
|
||||
statusBefore: 'pending',
|
||||
statusAfter: 'approved',
|
||||
reason: '通道已确认报备通过',
|
||||
sourceEntry: 'report_task',
|
||||
createdAt: '2026-09-03 15:30:00',
|
||||
channel: { id: 'channel-1', name: '测试通道' },
|
||||
operator: { id: 'operator-1', username: 'operator', displayName: '运营一' },
|
||||
task: task('record-1'),
|
||||
}],
|
||||
total: 1,
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
});
|
||||
|
||||
render(
|
||||
<MemoryRouter>
|
||||
<AdminReportRecordsPage />
|
||||
</MemoryRouter>,
|
||||
);
|
||||
|
||||
expect(await screen.findByRole('columnheader', { name: '变更对象' })).toBeVisible();
|
||||
expect(screen.getByRole('columnheader', { name: '变更动作' })).toBeVisible();
|
||||
expect(screen.getByRole('columnheader', { name: '操作人 / 时间' })).toBeVisible();
|
||||
expect(screen.queryByRole('columnheader', { name: '备注' })).not.toBeInTheDocument();
|
||||
expect(screen.getByText('报备任务修改')).toBeVisible();
|
||||
|
||||
await userEvent.click(screen.getByRole('button', { name: '详情' }));
|
||||
expect((await screen.findAllByText('通道已确认报备通过')).length).toBeGreaterThan(0);
|
||||
});
|
||||
|
||||
it('shows and copies the channel brief returned by the batch detail API', async () => {
|
||||
const batch = {
|
||||
id: 'batch-1',
|
||||
|
||||
@@ -304,6 +304,50 @@
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.report-record-page .report-task-table-card .ui-table {
|
||||
min-width: 1101px;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
.admin-report-record-id {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.admin-report-record-target .ui-tag {
|
||||
justify-self: start;
|
||||
}
|
||||
|
||||
.admin-report-record-target strong,
|
||||
.admin-report-record-target span,
|
||||
.admin-report-record-meta strong,
|
||||
.admin-report-record-meta span {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.admin-report-record-target strong,
|
||||
.admin-report-record-target span {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.admin-report-record-meta {
|
||||
display: grid;
|
||||
gap: var(--space-1);
|
||||
}
|
||||
|
||||
.admin-report-record-meta strong {
|
||||
color: var(--color-text-strong);
|
||||
}
|
||||
|
||||
.admin-report-record-meta span {
|
||||
color: var(--color-text-muted);
|
||||
font-size: var(--font-size-xs);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.admin-task-table-card {
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
|
||||
Reference in New Issue
Block a user