LQAgentPlatform/utils_test/Result_Visual_Observation_Tools

施工方案审查结果可视化工具

简介

这是用于可视化展示施工方案AI审查结果的前端工具，支持卡片式展示、表格展示、数据筛选和导出功能。

文件说明

文件	说明
index.html	基础版本，简洁易用
advanced_viewer.html	高级版本，支持多文件、数据分析、导出功能
README.md	使用说明文档

使用方法

方式一：直接打开文件

1. 用浏览器打开 index.html 或 advanced_viewer.html
2. 点击"选择JSON文件"按钮，选择审查结果JSON文件
3. 查看审查结果卡片

方式二：从默认目录加载

1. 点击"加载默认目录"或"加载示例数据"按钮
2. 工具会自动读取 temp\construction_review\final_result\ 目录中的JSON文件

方式三：启动本地服务器（推荐）

# 进入工具目录
cd utils_test/Result_Visual_Observation_Tools

# 使用Python启动简单HTTP服务器
python -m http.server 8080

# 或使用Node.js的http-server
npx http-server -p 8080

然后访问 http://localhost:8080

功能特性

基础版本 (index.html)

• 📁 单文件上传查看
• 🎴 卡片式结果展示
• 🔍 按风险等级/章节/问题状态筛选
• 🔎 关键词搜索
• 📊 统计面板

高级版本 (advanced_viewer.html)

基础版本所有功能，外加：

• 📁 多文件同时加载
• 📈 风险分布图表
• 📊 章节统计分析
• 🎴📋 卡片/表格视图切换
• 📄 CSV/JSON 数据导出
• 🗂️ 已加载文件管理

卡片字段说明

每张审查卡片展示以下信息：

字段	说明
章节代码	检查项所属章节
风险等级	高/中/低/无风险
检查项	检查项名称
检查项代码	检查项唯一标识
问题位置	问题所在文档位置
修改建议	AI给出的修改建议
审查依据	审查依据说明
问题状态	是否存在问题
来源文件	数据来自哪个JSON文件

风险等级颜色标识

• 🔴 高风险 - 红色边框/标签
• 🟡 中风险 - 橙色边框/标签
• 🟢 低风险 - 绿色边框/标签
• ⚪ 无风险 - 灰色边框/标签

JSON数据结构

工具读取的JSON文件结构如下：

{
  "ai_review_result": {
    "review_results": [
      {
        "unit_id": {
          "review_lists": [
            {
              "check_item": "检查项名称",
              "chapter_code": "章节代码",
              "check_item_code": "检查项代码",
              "check_result": "检查结果描述",
              "exist_issue": true/false,
              "risk_info": {
                "risk_level": "high/medium/low"
              },
              "location": "问题位置",
              "suggestion": "修改建议",
              "reason": "审查依据",
              "review_references": "参考标准",
              "reference_source": "来源规范"
            }
          ]
        }
      }
    ]
  }
}

注意事项

1. JSON文件可能包含控制字符，工具会自动清理
2. 建议通过本地服务器方式使用，以支持文件目录访问
3. 大数据量时表格视图性能更好
4. 导出功能生成的CSV文件使用UTF-8编码，支持中文

浏览器兼容性

• Chrome 80+
• Firefox 75+
• Edge 80+
• Safari 13+

更新日志

v1.0.0 (2026-03-09)

• 初始版本发布
• 支持基础卡片展示
• 支持筛选和搜索
• 支持数据导出