从脱敏 Excel 到面向管理的 HSE 分析。第二阶段：用 vibe coding 做一个独立的交互式 HSE 仪表板

AI 帮助在脱敏的 Excel 模板上搭好程序外壳，而真实的工作数据库则在用户自己的电脑上、本地载入已经做好的 HTML。

引言

在第一篇文章里，我展示了我们如何解决数据安全准备的问题：我们做了一个本地脱敏工具，学会生成保留工作数据库结构、却不把真实个人数据交给外部 AI 环境的脱敏 Excel 模板。

下一个问题几乎立刻出现：拿到这个模板之后该做什么？

我们的任务并不是简单地画几张图。我们需要一个能实际使用的分析工具，用于准备逐级沟通和安全委员会：更换数据范围，从总体指标逐层下钻到部门、作业区和具体记录，看清瓶颈，并迅速准备与管理者对话所需的材料。

与此同时，第一阶段的核心条件依旧成立：在外部开发阶段，企业真实的工作数据库不会交给 AI。

为什么需要一个自己的仪表板

我们的原始数据早已以数字形式生成。行为安全对话（BSD）和关键风险管控（CRC）由管理者和专业人员通过企业移动应用 CoLab 完成。也就是说，问题不在于缺少数据，而在于下一步：如何把庞大的记录快速变成看得懂的管理分析。

企业系统可以完成观察、填写字段并导出数据。但更深入的分析开发需要单独的 IT 工作。当专业人员、期限和预算都有限时，这类需求可能要等很久。

基于 Superset 的第一批在线仪表板能满足基本的数量统计。对实际工作来说还不够。当管理者看到完成了 500 次检查或发现了 70 项偏差，下一个问题总是相同的：到底发生在哪里、为什么发生、背后是哪些具体记录。

因此，我们把独立运行的 HTML 仪表板视为快速的过渡工具，而不是企业 IT 系统的替代品。它让我们在短时间内把分析放到实际工作中检验，弄清哪些指标真正需要、哪里必须下钻到原始数据，然后再为工业化实现写出更准确的技术任务书。

第一步：先理解数据，而不是先写程序

与 AI 协作时最常见的错误之一，就是一上来就说：“给我做一个仪表板。”漂亮的画面很快就有，但以后未必能用。

所以我们给 AI 的第一条请求不一样。我们上传脱敏 Excel 模板，并要求先不要编程，而是分析文件结构：里面有哪些工作表、列和数据类型，哪些字段彼此关联，哪些可以用作筛选，可以计算哪些指标，原始结构可能存在哪些错误。

这样一来，AI 首先扮演的是数据分析师，而不是程序员。

以行为安全对话为例，重要的是日期、企业、车间、作业区、观察人、员工、行为类型、工序、描述和结果。AI 看到的可以不是真实姓名，而是“员工_00001”。构建仪表板逻辑并不需要真实姓名。

Prompt 1 — 脱敏数据库结构分析：见文末附录。

行为安全对话：从总体数字到具体记录

下一步要确定的不是一组好看的图表，而是仪表板必须回答的管理问题。

对于行为对话，我们需要看到趋势、所发现行为的构成、部门、工序、偏差的重复出现、观察人的工作情况，以及从总体数字走到具体记录的能力。

因此逻辑自上而下构建：企业 → 车间 → 作业区 → 行为类型 → 工序 → 具体记录。点击柱状图或扇形区会改变数据范围，并显示正是构成该指标的那些记录。

此外还加入了按员工或脱敏编号的检索、已发现偏差的历史、部门与 BSD 执行人的排行，以及把当前筛选结果导出到 Excel。

这里我用一条简单的规则：如果看完一张图仍不清楚它帮助做出什么管理决定，那么这张图多半不需要放进仪表板。

Prompt 2 和 Prompt 5 — HSE 仪表板结构与交互式下钻：见文末附录。

接入考勤表：如何看到规定的建议开展频次

随后我们又往前走了一步。为了节省时间、不再另建工具，我们在同一个仪表板上接入了出勤考勤表。

开发时先使用脱敏的考勤表模板，之后在本地使用真实考勤表。这样不仅能看到已完成的 BSD 数量，还能看到规定的建议频次的执行情况。

本质上，我们是把实际出勤的班次数量与实际开展的安全对话数量对照起来。结果就能看出哪里达到了要求的频次，哪里出现了滞后。

这种做法对车间和作业区负责人尤其有用：仪表板呈现的不是总体工作量，而是要求的真实完成度，并可下钻到部门、工种和具体员工。

这项扩展并不需要新的原理。我们只是把已有逻辑向前推进，并接入了又一组数据。

Prompt 6 — 结合实际出勤班次的 BSD 分析：见文末附录。

CRC：同样的思路，但用于关键风险管控

同样的逻辑也适用于 CRC。从原始导出中可以看到完成了多少次 CRC，其中多少次存在偏差。但仅有总量并不能回答核心问题：在每个班次里，要求究竟被执行到什么程度。

为此，同一时期的 CRC 数据和真实考勤表会在本地载入仪表板。对照之后就能看到谁实际在班、应当完成多少次 CRC、实际完成了多少次。

最终得到的不只是数量，还有完成率、缺口、未完成人员名单；如果有更完整的数据库，还能关联到作业区、车间、工序以及偏差原因。

所有图表依然可以点击：从总体指标可以继续向下——到部门，再到作业区，接着到工种，最后到某位员工的卡片或某条具体记录。

为了不让内容过于臃肿，本文没有附上 CRC 的截图。技术上使用的原理与 BSD 完全相同。

Prompt 7 — CRC 与真实考勤表：完成度计算与下钻到员工：见文末附录。

第二步：第一个原型与逐步完善

当数据结构和分析逻辑清楚之后，就可以直接进入 vibe coding。

任务此时已经可以说得相当具体：做出一个独立的 HTML 文件，用普通浏览器即可打开，包含 KPI、筛选、交互式图表和原始记录表，并且无需安装额外软件即可运行。

在这一阶段，程序内部仍然只使用脱敏数据。

第一个版本几乎从来不是最终版本。选择企业——车间列表仍是全量；点击图表——没有下钻到记录；添加新功能——某张图又不能正常工作。这是开发中的常态。

与其重写整个应用，不如把任务提得很具体：“让筛选联动”“增加点击后的明细”“只修第 6 张图，其余逻辑不要动”。

正是在这里，vibe coding 对不是程序员的专业人员特别有用。需要准确说明的不是函数怎么写，而是程序对用户应当如何表现。

Prompt 3、Prompt 5 和 Prompt 8 — 生成第一个 HTML、明细与缺陷修复：见文末附录。

第三步：移除模板，在本地载入真实数据

当界面和逻辑在脱敏模板上验证完毕后，最终版本中的演示数据被删除。HTML 只留下程序外壳。

随后加入 Excel 载入按钮。用户在企业电脑上打开做好的 HTML，选择当前的工作数据库，浏览器读取文件并在本地会话中计算指标。

也就是说，最终方案很简单：做好的 HTML 与工作用 Excel 位于同一台电脑；工作数据在本地载入程序，不再传给外部 AI 环境。

在公开的截图中，真实姓名已做遮盖。这一点很重要：文章应当展示工作原理，而不是披露个人数据。

Prompt 4 — 在本地载入工作用 Excel 数据库：见文末附录。

载入、追加、清空与离线副本

面向用户的功能需要单独用心。实际使用中，重要的不只是打开仪表板，还要能快速管理它的状态。

因此我们加入了独立的操作：载入新表、清空全部数据、保存离线副本，以及在不删除数据的情况下重置筛选。这些是不同的场景，用户一眼就该分得清。

此外我还录制了一段简短的演示视频，展示仪表板在脱敏模板上的运行方式、如何完整清空，以及随后如何载入真实数据。这样的视频附件比任何文字说明都更快解答疑问。

视频附件 1. 屏幕录制：从模板到工作数据库 — 视频在文章末尾。

从分析走向管理对话

仪表板最主要的价值不体现在屏幕上，而体现在会议上。

得到的数据切片用于准备逐级沟通和安全与职业健康委员会：从部门层级一直到每月召开的企业中央委员会。

在作业区层级可以看到具体记录和员工；在车间层级可以看到反复出现的问题；再往上则是各部门之间的比较，以及需要管理者关注的系统性区域。

因此提交到委员会的不再只是一句“完成率 82 %”，而是更具体的图景：哪些作业区造成缺口，哪些班次没有达到要求，哪些类型的偏差在重复，哪些记录需要与负责人一起复盘。

仪表板告诉你到哪里去找。原因和管理决策，仍然由人来确定。

是临时工具，还是未来的工业系统

对我们来说，独立运行的 HTML 仪表板不是终点，也不与企业 IT 架构竞争。

它的任务是快速走完从一线想法到可用分析原型的这段路。在工业化方案开发期间，各部门已经可以用它做分析，专业人员也能获得关于哪些指标真正需要的实际反馈。

如果原型证明了价值，它的逻辑就更容易交给 IT 开发人员，日后用 JavaScript、在 Superset 或其他带自动数据集成的企业环境中实现。

换句话说，vibe coding 并不取代 IT。它在大规模开发开始之前就消除了一部分不确定性：需要哪些筛选、下钻要走到哪一层、需要关联哪些数据、用户最终应当拿到什么管理结果，都已经事先清楚。

最终得到了什么

结果是，脱敏 Excel 模板成为真实工作数据库与 AI 之间的技术桥梁。AI 看到数据结构，帮助设计逻辑和界面，编写并完善代码。真实数据库只有在做好的 HTML 已经放到用户电脑上之后，才会进入这个工具。

对安全专业人员来说，这明显缩短了从想法到可用原型的距离。

主要优势并不在于 AI 会画图。关键在于能够更快地把一线问题变成分析工具，看清瓶颈，并把管理者的注意力引向真正需要行动的地方。

在下一篇文章中，我想从数据分析转到另一个方向：展示 AI 如何从一个普通助手，逐渐变成按多项独立标准评估安全五分钟会和行为对话质量的“第二位专家”。

用于搭建 BSD 与 CRC 独立 HSE 仪表板的现成提示词

实践原则：交给外部 AI 环境的只有经过检查的脱敏模板。真实的工作用 Excel 文件、考勤表和个人数据，都在做好的 HTML 外壳中于本地稍后接入。

提示词与文章的对应关系

Prompt 1. 脱敏 Excel 的结构分析

我上传一个工作用 HSE 数据库的脱敏 Excel 模板。

现在先不要编写任何程序。

请分析：
1. 文件中的工作表；
2. 列标题；
3. 数据类型；
4. 必填字段与选填字段；
5. 企业、车间、作业区及其他层级之间的层次关系；
6. 适合筛选的字段；
7. 适合做 KPI、排行和可视化的字段；
8. 可作为员工稳定脱敏编号的字段；
9. 原始数据库可能存在的问题：空值、同一部门的不同写法、日期格式不统一、重复记录、文字与数字混排、列名含义不清。

对于 BSD 数据库，请单独指出下列信息位于何处：
- 日期与时间；
- 企业；
- 车间；
- 作业区／内部部门；
- BSD 执行人；
- 执行人的岗位；
- 员工／脱敏编号；
- 安全或不安全行为的类型；
- 工序／作业类别；
- 观察描述；
- 结果或反应。

分析之后：
- 简要描述数据结构；
- 提出哪些字段之间的关联必须保留；
- 列出需要与用户确认的存疑之处；
- 只有在确认之后，才提出未来仪表板的架构。

不要试图还原已脱敏的取值，也不要就某位具体员工的身份作出判断。

Prompt 2. 行为安全对话仪表板的架构

请依据已确认的脱敏 Excel 结构，提出一个面向行为安全对话的独立 HSE 仪表板架构。

核心原则：每一张可视化都必须回答一个具体的管理问题。不要为了好看而添加图表。

请考虑：
1. 关于 BSD 与观察数量的核心 KPI；
2. 按时间段的筛选；
3. 联动层级：企业 → 车间 → 作业区／内部部门；
4. 按 BSD 执行人筛选；
5. 按执行人岗位筛选；
6. BSD 的按月和／或按日趋势；
7. 企业之间的比较；
8. 部门／作业区排行；
9. BSD 执行人排行；
10. 安全与不安全行为的构成；
11. 不安全观察的分类；
12. 工序／作业类别分析；
13. 多次被记录不安全行为的员工排行；
14. 按员工或脱敏编号检索；
15. 所选员工的 BSD 历史；
16. 能够看出同一类不安全行为是否在同一员工身上，于不同日期、不同负责人或不同作业区重复出现；
17. 将当前筛选结果导出到 Excel。

对每一张可视化请分别说明：
- 它回答管理者的哪个问题；
- 使用哪些字段；
- 点击图表元素应当跳转到哪里。

请先用文字描述架构。暂时不要生成代码。

Prompt 3. 生成第一个独立 HTML

请依据已商定的架构，生成交互式 HSE 仪表板的第一个独立版本。

要求：
1. 成果是单个 HTML 文件。
2. 用普通浏览器即可打开，无需安装额外软件。
3. 开发阶段只使用脱敏的演示数据。
4. 加入商定的 KPI、筛选、排行、检索、交互式图表和原始记录表。
5. 不使用后端。
6. 不使用外部 API。
7. 不从 CDN 加载库。
8. 所有必要的库都必须内置在 HTML 中。
9. 断网状态下仪表板也要能完整打开并正常工作。
10. 不要加入遥测、访问统计和网络请求。
11. 代码结构要便于日后删除演示数据并在本地接入真实 Excel。
12. 不要无谓地改动已有的员工脱敏编号。

完成后：
- 列出已实现的功能；
- 列出第一个版本的限制；
- 指出在继续完善之前需要人工检查哪些功能。

Prompt 4. 本地载入工作数据库、清空与离线副本

请完善现有的独立 HSE 仪表板。

目标：开发结束后，演示数据必须从 HTML 中删除，真实的工作数据库只能在用户电脑上本地接入。

请加入以下功能。

1.“载入新表”
- 用户在自己的电脑上选择 Excel 文件；
- 文件仅由浏览器在本地读取；
- 数据载入当前会话的内存；
- KPI、筛选、图表、排行和表格全部重建；
- 结构依据列标题判定，而不是固定的列序号；
- 缺少必填字段时显示清晰的错误提示。

2.“应用筛选”
- 按当前数据范围重新计算所有可视化。

3.“重置”
- 只清除已选中的筛选条件；
- 恢复显示全部已载入的数据；
- 不删除数据本身。

4.“彻底清空全部数据”
- 从应用的当前状态中完全移除已载入的工作数据；
- 清空 KPI、图表、排行、表格、姓名／编号和筛选列表；
- 使 HTML 回到空白程序外壳的状态。

5.“将所选数据导出到 Excel”
- 只导出当前筛选后的结果。

6.“保存离线副本”
- 只有在用户明确操作后才执行保存；
- 如果副本中嵌入了当前工作数据库，必须提示：保存的 HTML 含有工作数据，应作为机密文件保管；
- 保存过程中不得通过网络发送任何信息。

如果日后新增追加载入数据的功能：
- 先检查结构；
- 不要自动产生重复记录；
- 向用户显示将新增多少条、剔除多少条。

请从最终版本中彻底删除演示数据。

Prompt 5. 联动筛选、可点击与下钻到记录

请完善现有的 HTML 仪表板，但不要整体重写。

需要做到：
1. 让筛选联动：
   企业 → 车间 → 作业区／内部部门。
2. 选定企业后，只保留属于该企业的车间。
3. 选定车间后，只保留该车间的作业区。
4. 考虑所选时间段、BSD 执行人及其岗位。
5. 让主要图表和排行可以点击。
6. 点击柱形、扇区、数据点、排行行或员工时，把相应的数据范围应用到整个仪表板。
7. 显示构成所选指标的原始记录。
8. 增加返回上一层或重置当前明细的能力。
9. 增加按员工／脱敏编号的检索。
10. 对所选员工，显示所选时间段内的 BSD 历史：日期、部门、执行人、行为类型、工序与原始记录。
11. 单独显示多次被记录不安全行为的员工。
12. 即便由不同负责人或专业人员在不同作业区记录，也要能看出同类不安全行为的重复出现。
13. 将当前筛选结果导出到 Excel。
14. 不要无谓改动已经正常工作的功能。

完善之后请做回归检查：
- 全部筛选；
- 图表点击；
- 检索；
- 明细；
- 导出；
- 返回全量数据。

Prompt 6. BSD + 真实考勤表：规定建议频次的完成情况

请在现有仪表板中增加一个结合实际出勤班次的 BSD 分析模式。

数据来源：
- 来自 Collab 的 BSD 导出；
- 同一时期的工作时间考勤表。

开发阶段只使用脱敏的考勤表模板。真实考勤表只能稍后在本地接入。

重要：
不要自行设定 BSD 的开展标准。计算之前，用户必须给出规定的建议频次，例如：
- 每 N 个实际出勤班次 X 次 BSD；
- 每个日历／报告期 X 次 BSD；
- 企业的其他规则。

逻辑：
1. 依据考勤表确定实际出勤的班次。
2. 休假、病假及其他缺勤不计入实际出勤班次。
3. 依据员工稳定编号、企业、车间、作业区、工种和时间段，把 BSD 数据与考勤表对应起来——具体取决于可用字段。
4. 不要把不同部门中相同的姓名／编号和工种混在一起。
5. 依据用户给定的频次，计算实际出勤时间应当完成的 BSD 数量。
6. 显示：
   - 实际出勤的班次；
   - 规定的建议频次；
   - 实际的 BSD 数量；
   - 与建议频次的偏差；
   - 完成率；
   - 存在滞后的部门和员工。
7. 增加下钻：
   企业 → 车间 → 作业区 → 工种 → 具体员工 → 其 BSD 记录。
8. 允许导出存在偏差的员工／部门清单。

如果考勤表结构或频次规则含糊不清，请先展示存疑的情形并请求确认。在确认之前不要执行计算。

Prompt 7. CRC + 真实考勤表：执行的规律性与偏差

请在仪表板中增加一个单独的关键风险管控（CRC）分析模式。

数据来源：
- 来自 Collab 的 CRC 导出；
- 同一时期的真实工作时间考勤表。

开发阶段使用脱敏模板。真实数据只能在本地接入。

逻辑：
1. 确定每位员工实际出勤的班次。
2. 休假、病假及其他缺勤不计为工作班次。
3. 不要自行设定 CRC 的标准／要求频次，应作为参数由用户提供。
4. 如果某个工序已确认“每个实际出勤班次 1 次 CRC”的要求，也只能在用户确认后才使用。
5. 依据稳定编号、企业、车间、作业区、工种、日期和／或班次，把 CRC 与实际出勤班次对应起来。
6. 不要把不同部门中相同的工种和编号混在一起。
7. 对每位员工显示：
   - 实际出勤的班次；
   - CRC 的数量；
   - 按给定规则缺少 CRC 的班次／时段；
   - 偏差；
   - 完成率。
8. 增加下钻：
   企业 → 车间 → 作业区 → 工种 → 员工 → 具体班次／具体 CRC 记录。
9. 允许导出存在偏差的员工或班次清单。
10. 如果 CRC 导出中含有已识别的危害、关键风险、偏差描述或原因，请另外显示：
   - 按作业区的重复情况；
   - 按工序的重复情况；
   - 按员工的重复情况；
   - 点击后展开的原始记录。

如果数据结构含糊不清，请先展示对应规则和存疑情形。在用户确认之前不要执行最终计算。

Prompt 8. 缺陷诊断与技术自检

请对现有的独立 HTML 仪表板做一次检查。

一开始不要整体重写应用。

如果最近一次完善之后出现了错误：
1. 找出具体原因。
2. 只修改必要的部分。
3. 不要无故删除或重写已经正常工作的功能。
4. 修复之后做回归检查。

务必检查以下场景：
- 断网状态下打开 HTML；
- 载入脱敏的测试 Excel；
- 联动筛选；
- 点击与下钻；
- 按员工检索；
- 导出所选结果；
- 重置筛选；
- 彻底清空数据；
- 再次载入另一张表；
- 保存离线副本。

功能检查之后，请审查独立性以及可能的传输／存储通道：
- fetch；
- XMLHttpRequest；
- WebSocket；
- EventSource；
- sendBeacon；
- 外部 script src；
- CDN；
- 外部 CSS 与字体；
- API；
- iframe；
- Service Worker；
- localStorage；
- sessionStorage；
- IndexedDB；
- cookie；
- 遥测与统计分析。

最终版本必须：
- 在断网状态下完整工作；
- 不通过网络发送所载入 Excel 文件的内容；
- 未经用户明确操作，不隐蔽保存工作数据库；
- 在彻底重置时，从界面的当前状态中移除工作数据。

最后给出一份简短报告：
1. 检查了什么；
2. 发现了哪些缺陷；
3. 修复了什么；
4. 还剩下哪些限制或风险。

建议的使用顺序

1. 执行 Prompt 1，检查 AI 是否正确理解了脱敏 Excel 的结构。
2. 结构确认之后执行 Prompt 2。
3. 执行 Prompt 3，得到第一个独立的 HTML 版本。
4. 在完善过程中，用 Prompt 5 处理筛选、点击和下钻。
5. 逻辑就绪后执行 Prompt 4：删除演示数据，并组织工作数据库的本地载入、清空、导出和离线副本。
6. 如果需要分析建议的 BSD 频次，接入 Prompt 6。
7. 对于 CRC 以及与真实考勤表的对照，使用 Prompt 7。
8. 在重大修改之后、以及发布／交付用户之前，执行 Prompt 8。