453 lines
28 KiB
HTML
453 lines
28 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
|
<title>AI分析记录 - 指摘管理系统</title>
|
|
<script src="https://modao.cc/agent-py/static/source/js/tailwindcss.js">
|
|
</script>
|
|
<script src="https://modao.cc/agent-py/static/source/js/iconify-icon.min.js">
|
|
</script>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
|
|
body {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
|
}
|
|
.sidebar-active {
|
|
background-color: rgba(26, 115, 232, 0.1);
|
|
color: #1a73e8;
|
|
border-right: 4px solid #1a73e8;
|
|
}
|
|
.glass-card {
|
|
background: rgba(255, 255, 255, 0.8);
|
|
backdrop-filter: blur(10px);
|
|
}
|
|
.modal-overlay {
|
|
background-color: rgba(15, 23, 42, 0.6);
|
|
backdrop-filter: blur(4px);
|
|
}
|
|
.modal-body::-webkit-scrollbar {
|
|
width: 6px;
|
|
}
|
|
.modal-body::-webkit-scrollbar-track {
|
|
background: #f1f1f1;
|
|
border-radius: 3px;
|
|
}
|
|
.modal-body::-webkit-scrollbar-thumb {
|
|
background: #cbd5e1;
|
|
border-radius: 3px;
|
|
}
|
|
.modal-body::-webkit-scrollbar-thumb:hover {
|
|
background: #94a3b8;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body class="bg-gray-50 text-gray-800 flex overflow-hidden h-screen">
|
|
<!-- Sidebar (完全相同于 dashboard.html) -->
|
|
<aside class="w-64 bg-white border-r border-gray-200 flex flex-col flex-none">
|
|
<div class="p-6 flex items-center gap-3">
|
|
<div class="w-10 h-10 bg-blue-600 rounded-xl flex items-center justify-center shadow-lg shadow-blue-200">
|
|
<iconify-icon class="text-white text-2xl" icon="lucide:shield-check"></iconify-icon>
|
|
</div>
|
|
<div>
|
|
<h1 class="font-bold text-lg leading-none text-gray-900">IMS</h1>
|
|
<p class="text-[10px] text-gray-400 mt-1 uppercase tracking-widest font-semibold">AI Assistant</p>
|
|
</div>
|
|
</div>
|
|
<nav class="flex-1 mt-4 px-3 space-y-1 overflow-y-auto">
|
|
<a class="flex items-center gap-3 px-4 py-3 rounded-lg text-gray-600 hover:bg-gray-50 transition-all group" href="dashboard.html">
|
|
<iconify-icon class="text-xl" icon="lucide:layout-dashboard"></iconify-icon>
|
|
<span class="font-medium text-sm">工作台</span>
|
|
</a>
|
|
<a class="flex items-center gap-3 px-4 py-3 rounded-lg text-gray-600 hover:bg-gray-50 transition-all group" href="issues.html">
|
|
<iconify-icon class="text-xl" icon="lucide:list-todo"></iconify-icon>
|
|
<span class="font-medium text-sm">指摘列表</span>
|
|
</a>
|
|
<a class="flex items-center gap-3 px-4 py-3 rounded-lg text-gray-600 hover:bg-gray-50 transition-all group" href="batch-input.html">
|
|
<iconify-icon class="text-xl" icon="lucide:file-up"></iconify-icon>
|
|
<span class="font-medium text-sm">批量录入</span>
|
|
</a>
|
|
<div class="pt-4 pb-2 px-4 text-[10px] font-bold text-gray-400 uppercase tracking-widest">AI 智能分析</div>
|
|
<a class="flex items-center gap-3 px-4 py-3 rounded-lg sidebar-active transition-all group" href="ai-analysis.html">
|
|
<iconify-icon class="text-xl" icon="lucide:brain-circuit"></iconify-icon>
|
|
<span class="font-medium text-sm">AI分析记录</span>
|
|
</a>
|
|
<a class="flex items-center gap-3 px-4 py-3 rounded-lg text-gray-600 hover:bg-gray-50 transition-all group" href="knowledge-base.html">
|
|
<iconify-icon class="text-xl" icon="lucide:database"></iconify-icon>
|
|
<span class="font-medium text-sm">知识库管理</span>
|
|
</a>
|
|
<div class="pt-4 pb-2 px-4 text-[10px] font-bold text-gray-400 uppercase tracking-widest">系统设置</div>
|
|
<a class="flex items-center gap-3 px-4 py-3 rounded-lg text-gray-600 hover:bg-gray-50 transition-all group" href="users.html">
|
|
<iconify-icon class="text-xl" icon="lucide:users"></iconify-icon>
|
|
<span class="font-medium text-sm">用户管理</span>
|
|
</a>
|
|
<a class="flex items-center gap-3 px-4 py-3 rounded-lg text-gray-600 hover:bg-gray-50 transition-all group" href="roles.html">
|
|
<iconify-icon class="text-xl" icon="lucide:key-round"></iconify-icon>
|
|
<span class="font-medium text-sm">角色权限</span>
|
|
</a>
|
|
<a class="flex items-center gap-3 px-4 py-3 rounded-lg text-gray-600 hover:bg-gray-50 transition-all group" href="agent-management.html">
|
|
<iconify-icon class="text-xl" icon="lucide:bot"></iconify-icon>
|
|
<span class="font-medium text-sm">Agent管理</span>
|
|
</a>
|
|
</nav>
|
|
<div class="p-4 border-t border-gray-100">
|
|
<div class="bg-blue-50 rounded-xl p-4">
|
|
<div class="flex items-center gap-3 mb-2">
|
|
<div class="w-8 h-8 bg-blue-600 rounded-full flex items-center justify-center">
|
|
<iconify-icon class="text-white text-sm" icon="lucide:sparkles"></iconify-icon>
|
|
</div>
|
|
<span class="text-xs font-bold text-blue-800 tracking-tight">AI Agent 状态</span>
|
|
</div>
|
|
<div class="flex items-center justify-between">
|
|
<span class="text-[10px] text-blue-600 font-medium italic">正在监控指摘状态...</span>
|
|
<span class="flex h-2 w-2 rounded-full bg-green-500 animate-pulse"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<!-- Main Content -->
|
|
<main class="flex-1 flex flex-col min-w-0 overflow-hidden">
|
|
<!-- Header (与 dashboard 一致) -->
|
|
<header class="h-16 bg-white border-b border-gray-200 flex items-center justify-between px-8 flex-none">
|
|
<div class="flex items-center gap-4">
|
|
<h2 class="text-lg font-semibold text-gray-800">AI 分析记录</h2>
|
|
<span class="text-xs text-gray-400">2026年7月17日 星期五</span>
|
|
</div>
|
|
<div class="flex items-center gap-6">
|
|
<div class="relative">
|
|
<iconify-icon class="text-xl text-gray-500 hover:text-blue-600 cursor-pointer" icon="lucide:bell"></iconify-icon>
|
|
<span class="absolute -top-1 -right-1 w-4 h-4 bg-red-500 text-white text-[10px] flex items-center justify-center rounded-full border-2 border-white font-bold">3</span>
|
|
</div>
|
|
<div class="flex items-center gap-3 pl-6 border-l border-gray-100">
|
|
<div class="text-right">
|
|
<p class="text-xs font-bold text-gray-900 leading-none">李志强</p>
|
|
<p class="text-[10px] text-gray-400 mt-1">系统管理员</p>
|
|
</div>
|
|
<img alt="User Avatar" class="w-9 h-9 rounded-full border border-gray-200" src="https://modao.cc/agent-py/media/generated_images/2026-06-26/3897ae65e7734794adc3fbb56826b171.jpg" />
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Scrollable Content -->
|
|
<div class="flex-1 overflow-y-auto p-8 space-y-8 bg-gray-50">
|
|
<!-- Filter Bar -->
|
|
<div class="bg-white p-6 rounded-2xl border border-gray-100 shadow-sm">
|
|
<div class="grid grid-cols-4 gap-4 mb-4">
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1.5">指摘 ID</label>
|
|
<input class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all" placeholder="输入 ID" type="text" />
|
|
</div>
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1.5">归属部门</label>
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all">
|
|
<option>全部</option>
|
|
<option>生产部</option>
|
|
<option>品质部</option>
|
|
<option>技术部</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1.5">日期范围</label>
|
|
<div class="flex items-center gap-2">
|
|
<input class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all" type="date" />
|
|
<span class="text-gray-400 text-xs">~</span>
|
|
<input class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all" type="date" />
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1.5">分析状态</label>
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all">
|
|
<option>全部</option>
|
|
<option>已完成</option>
|
|
<option>进行中</option>
|
|
<option>失败</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-between items-center border-t border-gray-100 pt-4">
|
|
<div class="flex gap-2">
|
|
<button class="px-6 py-2 bg-gray-900 text-white rounded-lg text-sm font-semibold hover:bg-black transition-all">查询</button>
|
|
<button class="px-4 py-2 text-sm font-semibold text-gray-500 hover:text-gray-700 transition-colors">重置</button>
|
|
</div>
|
|
<div class="flex gap-2">
|
|
<button onclick="openModal()" class="bg-blue-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-blue-700 transition-all flex items-center gap-2 shadow-md shadow-blue-200">
|
|
<iconify-icon icon="lucide:refresh-cw" width="16"></iconify-icon>
|
|
<span>生成 AI 分析</span>
|
|
</button>
|
|
<button class="bg-gray-100 text-gray-700 px-4 py-2 rounded-lg text-sm font-semibold hover:bg-gray-200 transition-all flex items-center gap-2">
|
|
<iconify-icon icon="lucide:file-spreadsheet" width="16"></iconify-icon>
|
|
<span>导出记录</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- AI List Table -->
|
|
<div class="bg-white rounded-2xl border border-gray-100 shadow-sm overflow-hidden">
|
|
<table class="w-full text-left">
|
|
<thead class="bg-gray-50 border-b border-gray-100">
|
|
<tr>
|
|
<th class="px-6 py-4 text-[11px] font-bold text-gray-400 uppercase tracking-wider">ID</th>
|
|
<th class="px-6 py-4 text-[11px] font-bold text-gray-400 uppercase tracking-wider">提取关键词</th>
|
|
<th class="px-6 py-4 text-[11px] font-bold text-gray-400 uppercase tracking-wider">问题分类</th>
|
|
<th class="px-6 py-4 text-[11px] font-bold text-gray-400 uppercase tracking-wider">根因分析</th>
|
|
<th class="px-6 py-4 text-[11px] font-bold text-gray-400 uppercase tracking-wider">AI 整改建议</th>
|
|
<th class="px-6 py-4 text-[11px] font-bold text-gray-400 uppercase tracking-wider">反馈</th>
|
|
<th class="px-6 py-4 text-[11px] font-bold text-gray-400 uppercase tracking-wider text-right">操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-gray-50">
|
|
<tr class="hover:bg-gray-50 transition-colors">
|
|
<td class="px-6 py-4 text-sm font-mono font-bold text-blue-600">ISSUE-001</td>
|
|
<td class="px-6 py-4 text-sm">传感器, 灰尘, 误报</td>
|
|
<td class="px-6 py-4 text-sm">设备故障-电气类</td>
|
|
<td class="px-6 py-4 text-xs text-gray-500">传感器透镜污垢导致光路阻挡...</td>
|
|
<td class="px-6 py-4 text-xs text-gray-500">建议增加防尘罩并定期清洁...</td>
|
|
<td class="px-6 py-4"><span class="px-2 py-0.5 bg-green-100 text-green-700 rounded-full text-[10px] font-bold">有帮助</span></td>
|
|
<td class="px-6 py-4 text-right">
|
|
<div class="flex justify-end gap-3">
|
|
<button class="text-gray-400 hover:text-blue-600"><iconify-icon icon="lucide:eye" width="16"></iconify-icon></button>
|
|
<button class="text-gray-400 hover:text-blue-600"><iconify-icon icon="lucide:refresh-cw" width="16"></iconify-icon></button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr class="hover:bg-gray-50 transition-colors">
|
|
<td class="px-6 py-4 text-sm font-mono font-bold text-blue-600">ISSUE-002</td>
|
|
<td class="px-6 py-4 text-sm">打印, 模糊, 耗材</td>
|
|
<td class="px-6 py-4 text-sm">品质异常-标识类</td>
|
|
<td class="px-6 py-4 text-xs text-gray-500">碳带张力不均或打印头老化...</td>
|
|
<td class="px-6 py-4 text-xs text-gray-500">检查碳带路径，清洁打印头...</td>
|
|
<td class="px-6 py-4"><span class="px-2 py-0.5 bg-green-100 text-green-700 rounded-full text-[10px] font-bold">有帮助</span></td>
|
|
<td class="px-6 py-4 text-right">
|
|
<div class="flex justify-end gap-3">
|
|
<button class="text-gray-400 hover:text-blue-600"><iconify-icon icon="lucide:eye" width="16"></iconify-icon></button>
|
|
<button class="text-gray-400 hover:text-blue-600"><iconify-icon icon="lucide:refresh-cw" width="16"></iconify-icon></button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr class="hover:bg-gray-50 transition-colors">
|
|
<td class="px-6 py-4 text-sm font-mono font-bold text-blue-600">ISSUE-003</td>
|
|
<td class="px-6 py-4 text-sm">螺丝, 松动, 安全</td>
|
|
<td class="px-6 py-4 text-sm">安全隐患-设施类</td>
|
|
<td class="px-6 py-4 text-xs text-gray-500">长期震动导致紧固件失效...</td>
|
|
<td class="px-6 py-4 text-xs text-gray-500">使用防松螺母或增加弹垫...</td>
|
|
<td class="px-6 py-4"><span class="px-2 py-0.5 bg-gray-100 text-gray-500 rounded-full text-[10px] font-bold">未评估</span></td>
|
|
<td class="px-6 py-4 text-right">
|
|
<div class="flex justify-end gap-3">
|
|
<button class="text-gray-400 hover:text-blue-600"><iconify-icon icon="lucide:eye" width="16"></iconify-icon></button>
|
|
<button class="text-gray-400 hover:text-blue-600"><iconify-icon icon="lucide:refresh-cw" width="16"></iconify-icon></button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Modal: 生成 AI 分析 -->
|
|
<div class="fixed inset-0 z-50 hidden flex items-center justify-center p-4" id="issueModal">
|
|
<div class="absolute inset-0 modal-overlay" onclick="closeModal()"></div>
|
|
<div class="relative bg-white rounded-2xl shadow-2xl w-[1200px] max-w-[95vw] max-h-[90vh] flex flex-col overflow-hidden">
|
|
<div class="flex items-center justify-between px-6 py-4 border-b border-gray-100 bg-gray-50/80 flex-none">
|
|
<div class="flex items-center gap-3">
|
|
<div class="w-8 h-8 bg-blue-100 rounded-lg flex items-center justify-center text-blue-600">
|
|
<iconify-icon icon="lucide:list-todo" width="18"></iconify-icon>
|
|
</div>
|
|
<h3 class="text-base font-bold text-gray-800">选择指摘生成 AI 分析</h3>
|
|
<span class="text-xs text-gray-400 bg-gray-200 px-2 py-0.5 rounded-full">可多选</span>
|
|
</div>
|
|
<button onclick="closeModal()" class="text-gray-400 hover:text-gray-600 transition-colors p-1 rounded-lg hover:bg-gray-200">
|
|
<iconify-icon icon="lucide:x" width="22"></iconify-icon>
|
|
</button>
|
|
</div>
|
|
<div class="px-6 py-4 border-b border-gray-100 flex-none bg-white">
|
|
<div class="grid grid-cols-5 gap-3">
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1">指摘状态</label>
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500">
|
|
<option>全部</option>
|
|
<option>待处理</option>
|
|
<option>进行中</option>
|
|
<option>已验证</option>
|
|
<option>已关闭</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1">工程阶段</label>
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500">
|
|
<option>全部</option>
|
|
<option>Phase 1</option>
|
|
<option>Phase 2</option>
|
|
<option>Phase 3</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1">归属部门</label>
|
|
<select class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500">
|
|
<option>全部</option>
|
|
<option>生产部</option>
|
|
<option>品质部</option>
|
|
<option>技术部</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1">搜索</label>
|
|
<input class="w-full bg-gray-50 border border-gray-200 rounded-lg px-3 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="ID / 标题" type="text" />
|
|
</div>
|
|
<div>
|
|
<label class="block text-[10px] font-bold text-gray-400 uppercase mb-1">创建时间</label>
|
|
<div class="flex items-center gap-1">
|
|
<input class="w-full bg-gray-50 border border-gray-200 rounded-lg px-2 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500" type="date" />
|
|
<span class="text-gray-400 text-xs">~</span>
|
|
<input class="w-full bg-gray-50 border border-gray-200 rounded-lg px-2 py-1.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500" type="date" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-end gap-2 mt-4 pt-3 border-t border-gray-100">
|
|
<button class="bg-white text-gray-600 border border-gray-200 px-4 py-1.5 rounded-lg text-sm font-medium hover:bg-gray-50 transition-colors">重置</button>
|
|
<button class="bg-blue-600 text-white px-4 py-1.5 rounded-lg text-sm font-medium hover:bg-blue-700 transition-colors">查询</button>
|
|
</div>
|
|
</div>
|
|
<div class="flex-1 overflow-auto modal-body">
|
|
<table class="w-full text-left border-collapse">
|
|
<thead class="bg-gray-50 text-gray-500 text-xs uppercase sticky top-0">
|
|
<tr>
|
|
<th class="px-4 py-3 border-b border-gray-100 w-10">
|
|
<input type="checkbox" id="selectAll" onchange="toggleAllCheckboxes()" />
|
|
</th>
|
|
<th class="px-4 py-3 border-b border-gray-100 font-semibold">ID</th>
|
|
<th class="px-4 py-3 border-b border-gray-100 font-semibold">标题</th>
|
|
<th class="px-4 py-3 border-b border-gray-100 font-semibold">状态</th>
|
|
<th class="px-4 py-3 border-b border-gray-100 font-semibold">优先级</th>
|
|
<th class="px-4 py-3 border-b border-gray-100 font-semibold">工程阶段</th>
|
|
<th class="px-4 py-3 border-b border-gray-100 font-semibold">对应者</th>
|
|
<th class="px-4 py-3 border-b border-gray-100 font-semibold">截止日期</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-gray-50 text-sm">
|
|
<tr class="hover:bg-gray-50 transition-colors cursor-pointer" onclick="toggleRowCheckbox(this)">
|
|
<td class="px-4 py-3 text-center" onclick="event.stopPropagation()">
|
|
<input type="checkbox" class="row-checkbox" onchange="updateSelectAll()" />
|
|
</td>
|
|
<td class="px-4 py-3 text-xs font-mono font-medium text-blue-600">ISSUE-2026-001</td>
|
|
<td class="px-4 py-3">三号生产线设备异常报警，需排查传感器</td>
|
|
<td class="px-4 py-3"><span class="px-2 py-0.5 bg-blue-100 text-blue-700 rounded-full text-[10px] font-bold">进行中</span></td>
|
|
<td class="px-4 py-3"><span class="px-2 py-0.5 bg-red-100 text-red-700 rounded-full text-[10px] font-bold">高</span></td>
|
|
<td class="px-4 py-3 text-xs">Phase 1</td>
|
|
<td class="px-4 py-3 text-xs">王五</td>
|
|
<td class="px-4 py-3 text-xs">2026-06-25</td>
|
|
</tr>
|
|
<tr class="hover:bg-gray-50 transition-colors cursor-pointer" onclick="toggleRowCheckbox(this)">
|
|
<td class="px-4 py-3 text-center" onclick="event.stopPropagation()">
|
|
<input type="checkbox" class="row-checkbox" onchange="updateSelectAll()" />
|
|
</td>
|
|
<td class="px-4 py-3 text-xs font-mono font-medium text-blue-600">ISSUE-2026-002</td>
|
|
<td class="px-4 py-3">A区成品包装标签打印模糊问题</td>
|
|
<td class="px-4 py-3"><span class="px-2 py-0.5 bg-yellow-100 text-yellow-700 rounded-full text-[10px] font-bold">待处理</span></td>
|
|
<td class="px-4 py-3"><span class="px-2 py-0.5 bg-orange-100 text-orange-700 rounded-full text-[10px] font-bold">中</span></td>
|
|
<td class="px-4 py-3 text-xs">Phase 2</td>
|
|
<td class="px-4 py-3 text-xs">赵六</td>
|
|
<td class="px-4 py-3 text-xs">2026-06-28</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="flex items-center justify-between px-6 py-4 border-t border-gray-100 bg-gray-50/80 flex-none">
|
|
<div class="text-sm text-gray-500">
|
|
已选择 <span class="font-bold text-blue-600" id="selectedCount">0</span> 条指摘
|
|
</div>
|
|
<div class="flex gap-3">
|
|
<button onclick="closeModal()" class="px-4 py-2 bg-white border border-gray-300 text-gray-700 rounded-lg text-sm font-medium hover:bg-gray-50 transition-colors">取消</button>
|
|
<button onclick="generateAI()" class="px-6 py-2 bg-blue-600 text-white rounded-lg text-sm font-medium hover:bg-blue-700 transition-colors shadow-md shadow-blue-100 flex items-center gap-2">
|
|
<iconify-icon icon="lucide:sparkles" width="16"></iconify-icon>
|
|
<span>生成 AI 分析</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function toggleSubmenu(id) {
|
|
const menu = document.getElementById(id);
|
|
const arrow = document.getElementById(id + 'Arrow');
|
|
if (menu.classList.contains('hidden')) {
|
|
menu.classList.remove('hidden');
|
|
arrow.setAttribute('icon', 'lucide:chevron-down');
|
|
} else {
|
|
menu.classList.add('hidden');
|
|
arrow.setAttribute('icon', 'lucide:chevron-right');
|
|
}
|
|
}
|
|
|
|
function openModal() {
|
|
document.getElementById('issueModal').classList.remove('hidden');
|
|
document.body.style.overflow = 'hidden';
|
|
updateSelectedCount();
|
|
}
|
|
|
|
function closeModal() {
|
|
document.getElementById('issueModal').classList.add('hidden');
|
|
document.body.style.overflow = '';
|
|
}
|
|
|
|
function toggleAllCheckboxes() {
|
|
const selectAll = document.getElementById('selectAll');
|
|
const checkboxes = document.querySelectorAll('.row-checkbox');
|
|
checkboxes.forEach(cb => cb.checked = selectAll.checked);
|
|
updateSelectedCount();
|
|
}
|
|
|
|
function toggleRowCheckbox(row) {
|
|
const cb = row.querySelector('.row-checkbox');
|
|
if (cb) {
|
|
cb.checked = !cb.checked;
|
|
updateSelectAll();
|
|
updateSelectedCount();
|
|
}
|
|
}
|
|
|
|
function updateSelectAll() {
|
|
const checkboxes = document.querySelectorAll('.row-checkbox');
|
|
const selectAll = document.getElementById('selectAll');
|
|
const checked = document.querySelectorAll('.row-checkbox:checked');
|
|
selectAll.checked = checkboxes.length > 0 && checked.length === checkboxes.length;
|
|
updateSelectedCount();
|
|
}
|
|
|
|
function updateSelectedCount() {
|
|
const checked = document.querySelectorAll('.row-checkbox:checked');
|
|
document.getElementById('selectedCount').textContent = checked.length;
|
|
}
|
|
|
|
function generateAI() {
|
|
const checked = document.querySelectorAll('.row-checkbox:checked');
|
|
if (checked.length === 0) {
|
|
alert('请至少选择一条指摘进行 AI 分析。');
|
|
return;
|
|
}
|
|
const ids = [];
|
|
checked.forEach(cb => {
|
|
const row = cb.closest('tr');
|
|
const idCell = row.querySelector('td:nth-child(2)');
|
|
if (idCell) {
|
|
ids.push(idCell.textContent.trim());
|
|
}
|
|
});
|
|
if (confirm(`确认对以下 ${ids.length} 条指摘生成 AI 分析？\n\n${ids.join('\n')}`)) {
|
|
alert(`✅ AI 分析生成已启动！\n\n正在对 ${ids.length} 条指摘进行分析，请稍后查看结果。`);
|
|
closeModal();
|
|
}
|
|
}
|
|
|
|
document.addEventListener('keydown', function(e) {
|
|
if (e.key === 'Escape') {
|
|
closeModal();
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |