fix: make dashboard metrics display-only
This commit is contained in:
@@ -9,12 +9,21 @@ const [app, index, styles, taskService] = await Promise.all([
|
||||
readFile(new URL('../control-plane/src/task-service.ts', import.meta.url), 'utf8')
|
||||
]);
|
||||
|
||||
test('dashboard summary cards share one visual treatment and expose an accessible selected state', () => {
|
||||
test('dashboard summary cards are uniform display-only totals and leave filtering to the explicit controls', () => {
|
||||
const summaryRenderer = app.slice(
|
||||
app.indexOf('function renderOperationsDashboardSummary()'),
|
||||
app.indexOf('function operationsDashboardRankScale')
|
||||
);
|
||||
assert.match(app, /label: '操作次数'[^\n]+tone: 'total'/);
|
||||
assert.doesNotMatch(app, /tone: 'primary'/);
|
||||
assert.match(app, /card\.setAttribute\('aria-pressed', String\(isSelected\)\)/);
|
||||
assert.match(summaryRenderer, /const card = el\('article', `operations-dashboard-stat operations-dashboard-stat-\$\{item\.tone\}`\)/);
|
||||
assert.doesNotMatch(summaryRenderer, /selectedStatus|isSelected|operationsStatus|aria-pressed/);
|
||||
assert.doesNotMatch(app, /\$\('#operationsDashboardSummary'\)\?\.addEventListener\('click'/);
|
||||
assert.match(index, /<option value="all">全部结果<\/option>/);
|
||||
assert.match(app, /function resetOperationsDashboardFilters\(\)[\s\S]*?\$\('#operationsDashboardStatus'\)\.value = 'all';/);
|
||||
assert.match(styles, /\.operations-dashboard-summary\s*{[\s\S]*?grid-template-columns: repeat\(5, minmax\(0, 1fr\)\)/);
|
||||
assert.match(styles, /\.operations-dashboard-stat\.is-active\s*{[\s\S]*?background: var\(--dashboard-accent-soft\);[\s\S]*?transform: none;/);
|
||||
assert.doesNotMatch(styles, /\.operations-dashboard-stat\[data-operations-status\]/);
|
||||
assert.doesNotMatch(styles, /\.operations-dashboard-stat\.is-active/);
|
||||
assert.doesNotMatch(styles, /operations-dashboard-stat-primary/);
|
||||
});
|
||||
|
||||
|
||||
@@ -1363,22 +1363,14 @@ function renderOperationsDashboardSummary() {
|
||||
container.replaceChildren();
|
||||
const summary = operationsDashboardData?.summary || {};
|
||||
const cards = [
|
||||
{ label: '操作次数', value: summary.total || 0, hint: '全部任务操作', status: 'all', tone: 'total' },
|
||||
{ label: '成功次数', value: summary.completed || 0, hint: '已成功完成', status: 'completed', tone: 'success' },
|
||||
{ label: '进行中', value: Number(summary.active || 0) + Number(summary.attention || 0), hint: '正在处理', status: 'active', tone: 'active' },
|
||||
{ label: '未成功', value: summary.failed || 0, hint: '需要继续处理', status: 'failed', tone: 'failed' },
|
||||
{ label: '操作员工', value: summary.user_count || 0, hint: '参与操作人数', status: '', tone: 'people' }
|
||||
{ label: '操作次数', value: summary.total || 0, hint: '全部任务操作', tone: 'total' },
|
||||
{ label: '成功次数', value: summary.completed || 0, hint: '已成功完成', tone: 'success' },
|
||||
{ label: '进行中', value: Number(summary.active || 0) + Number(summary.attention || 0), hint: '正在处理', tone: 'active' },
|
||||
{ label: '未成功', value: summary.failed || 0, hint: '需要继续处理', tone: 'failed' },
|
||||
{ label: '操作员工', value: summary.user_count || 0, hint: '参与操作人数', tone: 'people' }
|
||||
];
|
||||
const selectedStatus = String($('#operationsDashboardStatus')?.value || 'all');
|
||||
for (const item of cards) {
|
||||
const isSelected = Boolean(item.status && selectedStatus === item.status);
|
||||
const card = el(item.status ? 'button' : 'article', `operations-dashboard-stat operations-dashboard-stat-${item.tone}${isSelected ? ' is-active' : ''}`);
|
||||
if (item.status) {
|
||||
card.type = 'button';
|
||||
card.dataset.operationsStatus = item.status;
|
||||
card.setAttribute('aria-label', `按${item.label}筛选任务`);
|
||||
card.setAttribute('aria-pressed', String(isSelected));
|
||||
}
|
||||
const card = el('article', `operations-dashboard-stat operations-dashboard-stat-${item.tone}`);
|
||||
card.append(el('span', '', item.label));
|
||||
card.append(el('strong', '', String(item.value)));
|
||||
card.append(el('small', '', item.hint));
|
||||
@@ -5579,12 +5571,6 @@ document.addEventListener('DOMContentLoaded', async () => {
|
||||
$('#operationsDashboardActor').value = button.dataset.operationsActorId || '';
|
||||
refreshOperationsDashboardAfterDrilldown();
|
||||
});
|
||||
$('#operationsDashboardSummary')?.addEventListener('click', (event) => {
|
||||
const button = event.target.closest('[data-operations-status]');
|
||||
if (!button) return;
|
||||
$('#operationsDashboardStatus').value = button.dataset.operationsStatus || 'all';
|
||||
refreshOperationsDashboardAfterDrilldown();
|
||||
});
|
||||
$('#operationsDashboardBusinesses')?.addEventListener('click', (event) => {
|
||||
const button = event.target.closest('[data-operations-business]');
|
||||
if (!button?.dataset.operationsBusiness) return;
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||||
<meta name="theme-color" content="#edf2f4">
|
||||
<title>AI操作台 · LianSyn-platform</title>
|
||||
<link rel="stylesheet" href="styles.css?v=20260902-dashboard-mobile-share-1">
|
||||
<link rel="stylesheet" href="styles.css?v=20260902-dashboard-metrics-static-1">
|
||||
</head>
|
||||
<body>
|
||||
<main class="app-shell">
|
||||
@@ -405,6 +405,6 @@
|
||||
</section>
|
||||
|
||||
</main>
|
||||
<script src="app.js?v=20260902-dashboard-mobile-share-1"></script>
|
||||
<script src="app.js?v=20260902-dashboard-metrics-static-1"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -3244,23 +3244,6 @@ textarea {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.operations-dashboard-stat[data-operations-status] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.operations-dashboard-stat[data-operations-status]:not(.is-active):hover {
|
||||
border-color: #8daf9f;
|
||||
box-shadow: 0 9px 24px rgba(32, 79, 67, 0.09);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.operations-dashboard-stat.is-active {
|
||||
border-color: var(--dashboard-accent);
|
||||
background: var(--dashboard-accent-soft);
|
||||
box-shadow: inset 0 0 0 1px var(--dashboard-accent), 0 9px 24px rgba(32, 79, 67, 0.09);
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.operations-dashboard-stat > span {
|
||||
color: var(--dashboard-muted);
|
||||
font-size: 12px;
|
||||
|
||||
Reference in New Issue
Block a user