后端: - Product 实体新增统计字段(deviceCount/propertyCount/eventCount/ mainSwitchCode/mainSwitchName, 非持久化) - ProductServiceImpl.fillProductStats(): 列表批量回填 一次 selectBatchIds, 无 N+1; 让产品-设备-物模型的关系在 UI 层可见 (此前关系在数据层存在但 UI 层完全不可见, 这就是'看起来乱'的根因) - Device 实体新增 productName/productKey 非持久化字段 - DeviceServiceImpl.fillProductInfo(): 设备列表回填所属产品 前端 api/product.ts: - Product/ProductProperty/ControlItem 接口补齐语义与统计字段 - 新增 syncProductSpec(): 从涂鸦云同步物模型 - 新增 listProductDevices(): 复用设备列表按 productId 过滤 产品列表 (ProductList.vue): - 新增'物模型'列: DP 数量 + 主开关名 (未同步显示告警标签) - 新增'设备'列: 挂载台数, 点击跳转设备列表并带 productId 过滤 - 新增'同步'按钮: 从涂鸦云同步物模型 - 新增'详情'按钮 -> 产品详情页 - 删除提示改为动态显示设备数 新增产品详情页 (ProductDetail.vue): - 概览统计卡: 设备数/DP数/事件数/主开关 - 5 Tab: 基本信息 / 物模型 / 设备 / 固件与OTA - 物模型 Tab 展示 semantic/grp/isPrimary/dpId, 并可切换属性/事件/服务 设备列表 (DeviceList.vue): - 新增'所属产品'列, 可点击跳产品详情, 未关联显示'未关联' - 新增'所属产品'筛选下拉(含各产品设备数) - 支持从产品页跳转带 productId 参数自动筛选 MainLayout.vue 修复: - groupedRoutes 未过滤 meta.hidden, 详情页会混进侧边栏菜单 验证: mvn 编译通过; npx vite build 通过(ProductDetail chunk 已产出)
IoT Platform Admin Frontend
物联网平台管理后台前端项目
技术栈
- Vue 3 + TypeScript
- Vite 5.x
- Element Plus
- Pinia
- Vue Router
- Axios
- ECharts
安装依赖
npm install
开发模式
npm run dev
构建
npm run build
项目结构
src/
├── api/ # API接口
├── assets/ # 静态资源
├── components/ # 公共组件
├── layout/ # 布局组件
├── router/ # 路由配置
├── store/ # 状态管理
├── styles/ # 全局样式
├── views/ # 页面组件
├── App.vue # 根组件
└── main.ts # 入口文件
功能模块
- 数据看板
- 设备管理
- 数据采集
- 规则引擎
- 告警管理
- 告警规则