aps-agent/aps-frontend/pages/logs.html

71 lines
3.1 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>排产日志 - 智能排产系统</title>
<link rel="stylesheet" href="../css/common.css">
</head>
<body>
<div id="app">
<header class="header" id="header"></header>
<div class="body">
<aside class="sidebar" id="sidebar"></aside>
<main class="main">
<h1 class="page-title">排产日志</h1>
<div class="toolbar">
<select id="typeFilter" class="btn" style="padding:7px 10px" onchange="render()">
<option value="">全部类型</option><option value="INFO">信息</option><option value="WARNING">警告</option><option value="ERROR">错误</option>
</select>
<select id="catFilter" class="btn" style="padding:7px 10px" onchange="render()">
<option value="">全部分类</option><option value="ORDER">订单</option><option value="SCHEDULE">排产</option><option value="WO">工单</option><option value="CONSTRAINT">约束</option>
</select>
<button class="btn" onclick="exportLogs()">导出 CSV</button>
</div>
<div class="card">
<div class="card-body table-wrap">
<table id="logTable">
<thead><tr><th>时间</th><th>类型</th><th>分类</th><th>操作</th><th>目标</th><th>描述</th><th>操作人</th></tr></thead>
<tbody></tbody>
</table>
</div>
</div>
</main>
</div>
</div>
<script src="../js/data.js"></script>
<script src="../js/common.js"></script>
<script>
initPage('logs');
function render() {
const type = document.getElementById('typeFilter').value;
const cat = document.getElementById('catFilter').value;
const tbody = document.querySelector('#logTable tbody');
let rows = apsData.logs.filter(l => {
if (type && l.type !== type) return false;
if (cat && l.category !== cat) return false;
return true;
}).slice(0, 200);
tbody.innerHTML = rows.map(l => `
<tr>
<td>${l.createdAt}</td>
<td>${statusBadge(l.type, { INFO:'info', WARNING:'warning', ERROR:'danger' })}</td>
<td>${l.category}</td>
<td>${l.action}</td>
<td>${l.targetType}</td>
<td>${l.description}</td>
<td>${l.operator}</td>
</tr>`).join('') || '<tr><td colspan="7" class="text-center text-muted">无日志</td></tr>';
}
function exportLogs() {
const csv = ['时间,类型,分类,操作,目标,描述,操作人'].concat(apsData.logs.map(l => `${l.createdAt},${l.type},${l.category},${l.action},${l.targetType},"${l.description}",${l.operator}`)).join('\n');
const blob = new Blob(['\uFEFF' + csv], { type: 'text/csv;charset=utf-8;' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a'); a.href = url; a.download = 'aps_logs.csv'; a.click(); URL.revokeObjectURL(url);
showToast('导出成功', '日志已下载');
}
render();
</script>
</body>
</html>