chakcy
5b91548246
新增「参数配置」页（/config），按客户使用场景而非插件边界组织 aibox_sophon_adapter 与 ip_sound_column 的配置： - IP 音柱报警：音柱设备 IP（属 ip_sound_column）+ 启用/音量/播报文案 映射（属 aibox_sophon_adapter）；两个插件在同一页配完，保存时按归属 分别下发并重启对应副本。 - 告警与联动：告警转发、心跳与离线、告警留存、豆包分析、IN2 联动。 - 未开放数据库、数据目录、MediaMTX、MQTT 通道等部署类配置，页面脚注 说明；仍可用 Worker 管理的原始编辑器维护。 关键实现约束（见 src/config/configEdits.ts）： - 后端对 [workers.config] 只做顶层浅合并，被改动的嵌套节必须整节提交， 否则改一个音量会清掉同级的 enabled/tts（已用真实接口复现）。 - 区块开关默认值取自插件代码默认值，避免「配置里没有该键时开关显示为关 且被判为已改动」而在改其它字段时误关功能。 - 数值字段留空直接拦下，不把 NaN 下发成 null 触发插件侧回滚。 其他： - tts 映射的违规类型候选来自历史告警记录（list_alarms），手写拼错不易察觉。 - 登录态抽成 useAdminAuth 与 Worker 管理页共用，token 互通。 - Worker 管理弹窗对这两个插件给出跳转提示，原始编辑器保留为应急通道。
Chongming Web
Chongming-Zenoh 平台的前端应用，基于 Vue 3 + TypeScript + Vite + Element Plus 构建。
技术栈
| 层面 | 技术 |
|---|---|
| 框架 | Vue 3.5（Composition API + <script setup>） |
| 语言 | TypeScript |
| 构建 | Vite |
| UI 组件库 | Element Plus + @element-plus/icons-vue |
| 状态管理 | Pinia |
| 路由 | Vue Router（Hash History） |
| API 客户端 | @hey-api/openapi-ts 自动生成（类型安全） |
| 格式化 | oxfmt |
| 自动导入 | unplugin-auto-import + unplugin-vue-components |
项目结构
src/chongming-web/
├── index.html # 入口 HTML
├── vite.config.ts # Vite 构建配置
├── tsconfig.json # TypeScript 配置
├── package.json # 依赖与脚本
├── .env.development # 开发环境变量
├── .env.production # 生产环境变量
├── public/ # 静态资源
└── src/
├── main.ts # 应用入口（挂载 Pinia + Router）
├── App.vue # 布局框架（Header + Main + Footer）
├── api/
│ └── generated/ # 自动生成的 API 客户端
│ ├── sdk.gen.ts # 类型安全的 API 调用函数
│ ├── types.gen.ts # 请求/响应 TypeScript 类型
│ └── client.gen.ts # HTTP 客户端配置
├── router/
│ └── index.ts # Vue Router 路由定义
├── stores/ # Pinia 状态管理
├── views/ # 页面组件
└── components/ # 公共组件
快速开始
环境要求
- Node.js >= 22
安装与运行
cd src/chongming-web
# 安装依赖
npm install
# 启动开发服务器（http://localhost:5173）
npm run dev
# 类型检查 + 生产构建
npm run build
# 代码格式化
npm run format
开发指南
开发代理
Vite 开发服务器配置了代理：/api 请求自动转发到后端 http://127.0.0.1:8000。
确保后端已启动后再运行前端开发服务器。
生成 API 客户端
当后端接口变更后，重新生成类型安全的 API 客户端：
# 确保后端在 8000 端口运行
npm run openapi
该命令调用 @hey-api/openapi-ts 从 http://127.0.0.1:8000/openapi.json 生成 src/api/generated/ 中的所有文件。
使用 API 客户端
import { endpointApiV1DoubaoAnalyzePost } from "@/api/generated/sdk.gen";
const result = await endpointApiV1DoubaoAnalyzePost({
body: { image_base64: "...", prompt: "描述图片" },
});
所有 API 函数和类型都是自动生成的，具有完整的 TypeScript 类型推断。
添加新页面
- 在
src/views/创建 Vue 组件 - 在
src/router/index.ts添加路由配置 - 在
src/App.vue的导航菜单添加入口
自动导入
项目配置了 unplugin-auto-import 和 unplugin-vue-components，Element Plus 组件无需手动导入：
<template>
<!-- 直接使用，自动按需导入 -->
<el-button type="primary">按钮</el-button>
<el-input v-model="text" />
</template>
部署说明
- Base Path：
/static/— 前端部署在子路径下，后端处理/api，静态资源在/static/ - 生产构建输出目录：
dist/ - 构建命令：
npm run build