fix(dashboard): 风控/管理层列表精简列+表格横向滚动,避免溢出
- Table 组件统一加横向滚动容器(overflowX:auto),列多时不撑破卡片 - 参考销售列表精简列:风控/管理层待处理去掉「可接受性」「最近处理」, 评估历史去掉「可接受性」(与承接建议重复) - 待处理仍保留指派审批人与操作列
This commit is contained in:
@@ -90,54 +90,56 @@ export function Table<T>({
|
||||
});
|
||||
|
||||
return (
|
||||
<table style={tableStyle}>
|
||||
{caption !== undefined ? (
|
||||
<caption
|
||||
style={{
|
||||
...typographyStyle('caption'),
|
||||
color: colorVar('color.text.secondary'),
|
||||
textAlign: 'left',
|
||||
paddingBottom: `${space(2)}px`,
|
||||
}}
|
||||
>
|
||||
{caption}
|
||||
</caption>
|
||||
) : null}
|
||||
<thead>
|
||||
<tr>
|
||||
{columns.map((column) => (
|
||||
<th key={column.key} scope="col" style={thStyle(column.align ?? 'left')}>
|
||||
{column.header}
|
||||
</th>
|
||||
))}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{data.length === 0 ? (
|
||||
<div style={{ width: '100%', overflowX: 'auto' }}>
|
||||
<table style={tableStyle}>
|
||||
{caption !== undefined ? (
|
||||
<caption
|
||||
style={{
|
||||
...typographyStyle('caption'),
|
||||
color: colorVar('color.text.secondary'),
|
||||
textAlign: 'left',
|
||||
paddingBottom: `${space(2)}px`,
|
||||
}}
|
||||
>
|
||||
{caption}
|
||||
</caption>
|
||||
) : null}
|
||||
<thead>
|
||||
<tr>
|
||||
<td
|
||||
colSpan={columns.length}
|
||||
style={{
|
||||
...tdStyle('center'),
|
||||
color: colorVar('color.text.secondary'),
|
||||
padding: `${space(5)}px ${space(3)}px`,
|
||||
}}
|
||||
>
|
||||
{emptyMessage}
|
||||
</td>
|
||||
{columns.map((column) => (
|
||||
<th key={column.key} scope="col" style={thStyle(column.align ?? 'left')}>
|
||||
{column.header}
|
||||
</th>
|
||||
))}
|
||||
</tr>
|
||||
) : (
|
||||
data.map((row, index) => (
|
||||
<tr key={getRowKey(row, index)}>
|
||||
{columns.map((column) => (
|
||||
<td key={column.key} style={tdStyle(column.align ?? 'left')}>
|
||||
{cellContent(column, row)}
|
||||
</td>
|
||||
))}
|
||||
</thead>
|
||||
<tbody>
|
||||
{data.length === 0 ? (
|
||||
<tr>
|
||||
<td
|
||||
colSpan={columns.length}
|
||||
style={{
|
||||
...tdStyle('center'),
|
||||
color: colorVar('color.text.secondary'),
|
||||
padding: `${space(5)}px ${space(3)}px`,
|
||||
}}
|
||||
>
|
||||
{emptyMessage}
|
||||
</td>
|
||||
</tr>
|
||||
))
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
) : (
|
||||
data.map((row, index) => (
|
||||
<tr key={getRowKey(row, index)}>
|
||||
{columns.map((column) => (
|
||||
<td key={column.key} style={tdStyle(column.align ?? 'left')}>
|
||||
{cellContent(column, row)}
|
||||
</td>
|
||||
))}
|
||||
</tr>
|
||||
))
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -351,12 +351,13 @@ export function Dashboard(): JSX.Element {
|
||||
},
|
||||
};
|
||||
// 销售视图:去掉与「审批进度」重复的列(承接建议/最近处理),插入审批进度,保留操作列。
|
||||
// 风控/管理层视图:去掉冗余的「可接受性」(与承接建议重复),精简列宽避免溢出。
|
||||
const historyColumns = isSales
|
||||
? (() => {
|
||||
const base = columns.filter((col) => col.key !== 'recommendation' && col.key !== 'latest');
|
||||
return [...base.slice(0, -1), approvalProgressCol, base[base.length - 1]!];
|
||||
})()
|
||||
: columns;
|
||||
: columns.filter((col) => col.key !== 'acceptability');
|
||||
const summaryItems = [
|
||||
{ label: isSales ? '我的评估' : '全部评估', value: summary.total, tone: colorVar('color.brand.primary') },
|
||||
{ label: isSales ? '被驳回(待处理)' : '我的待办', value: todoCount, tone: colorVar('color.risk.high') },
|
||||
@@ -584,7 +585,10 @@ export function Dashboard(): JSX.Element {
|
||||
return <span style={{ ...typographyStyle('caption'), fontWeight: 600, color: mine ? '#15803D' : colorVar('color.text.primary') }}>{name}{mine ? '(我)' : ''}</span>;
|
||||
},
|
||||
};
|
||||
const todoColumns = [...columns.slice(0, -1), assignCol, columns[columns.length - 1]!];
|
||||
// 待处理列表精简列(参考销售列表):去掉「可接受性」(与承接建议重复)与「最近处理」
|
||||
//(待审项最近处理即提交动作,对裁决无意义),插入「指派审批人」,保留操作列,避免溢出。
|
||||
const todoBase = columns.filter((col) => col.key !== 'acceptability' && col.key !== 'latest');
|
||||
const todoColumns = [...todoBase.slice(0, -1), assignCol, todoBase[todoBase.length - 1]!];
|
||||
return (
|
||||
<div style={{ marginBottom: `${space(4)}px` }}>
|
||||
<Card title={
|
||||
|
||||
Reference in New Issue
Block a user