DM-ROW 接口文档

Appearance

设备管理模块 ​

**本文引用的文件** - [设备管理首页 equipment.vue](file://app/devicemate-app/modules/equipment/equipment.vue) - [设备菜单入口 menu.vue](file://app/devicemate-app/modules/equipment/menu.vue) - [设备基础信息 basicInfo.vue](file://app/devicemate-app/modules/equipment/basicInfo.vue) - [设备管理信息 manageInfo.vue](file://app/devicemate-app/modules/equipment/manageInfo.vue) - [设备维护计划 maintenance.vue](file://app/devicemate-app/modules/equipment/maintenance.vue) - [设备配件管理 accessories.vue](file://app/devicemate-app/modules/equipment/accessories.vue) - [设备文档管理 document.vue](file://app/devicemate-app/modules/equipment/document.vue) - [设备事件管理 event.vue](file://app/devicemate-app/modules/equipment/event.vue) - [设备计量管理 meter.vue](file://app/devicemate-app/modules/equipment/meter.vue) - [设备备件管理 spareParts.vue](file://app/devicemate-app/modules/equipment/spareParts.vue) - [设备首页 pages/equipment/index.vue](file://app/devicemate-app/pages/equipment/index.vue) - [设备管理状态 store/modules/equipment.js](file://app/devicemate-app/store/modules/equipment.js) - [字典混入工具 dictMixins.js](file://app/devicemate-app/utils/dictMixins.js) - [上拉加载混入工具 mescroll-mixins.js](file://app/devicemate-app/components/mescroll-uni/mescroll-mixins.js) - [NFC功能模块 nfc.vue](file://app/devicemate-app/modules/equipment/nfc.vue)

目录 ​

  1. 简介
  2. 项目结构
  3. 核心组件
  4. 架构总览
  5. 详细组件分析
  6. 依赖关系分析
  7. 性能考虑
  8. 故障排查指南
  9. 结论
  10. 附录

简介 ​

本文件面向设备管理模块的开发者与使用者，系统化阐述模块的整体架构、功能设计与实现细节。涵盖设备台账展示、设备详情查看、设备信息编辑、设备基础信息管理、设备维护计划、设备配件管理、设备文档管理、设备事件管理、设备管理信息、设备菜单导航、NFC设备管理、计量设备管理等子功能。同时解释设备数据的获取、展示与更新机制（列表渲染、搜索过滤、分页加载、附件上传），并总结组件设计模式、数据绑定方式与事件处理逻辑，提供最佳实践与常见问题解决方案。

项目结构 ​

设备管理模块位于前端应用的 modules/equipment 目录下，采用按功能划分的目录组织方式，每个子功能对应一个独立的页面组件；页面入口位于 pages/equipment/index.vue，提供一级导航与快捷入口；全局状态通过 store/modules/equipment.js 管理关键设备标识；数据字典与上拉加载能力分别由 utils 与 components 提供复用支持。

图表来源

章节来源

核心组件 ​

  • 设备首页与导航
    • pages/equipment/index.vue：提供用户信息与快捷菜单入口，根据权限动态生成菜单项，进入设备模块主入口。
    • modules/equipment/menu.vue：设备二级菜单，承载各子功能入口，传递设备标识与主角色类型。
  • 设备列表与筛选
    • modules/equipment/equipment.vue：设备台账列表，支持状态筛选、搜索、扫码、分页加载与字典展示。
  • 子功能页面
    • basicInfo.vue：设备基础信息、资产信息、规格参数三段式展示。
    • manageInfo.vue：设备管理信息编辑（部门、责任人、产线、工位、状态等）。
    • maintenance.vue：设备维护/巡检/保养计划展示。
    • accessories.vue：设备关联设备与配件信息展示。
    • document.vue：设备文档列表与下载。
    • event.vue：设备相关工单与历史记录，支持多标签切换与分页加载。
    • meter.vue：计量类设备读数与阈值编辑。
    • spareParts.vue：备件与耗材清单展示。
    • nfc.vue：NFC读写与拍照示例入口。
  • 工具与状态
    • utils/dictMixins.js：统一字典获取与名称解析。
    • components/mescroll-uni/mescroll-mixins.js：上拉加载与下拉刷新混入。
    • store/modules/equipment.js：设备标识与图片地址的状态管理。

章节来源

架构总览 ​

设备管理模块采用“页面组件 + 混入工具 + 状态管理”的分层设计：

  • 页面组件负责视图与交互，通过混入获得字典与上拉加载能力。
  • 工具层提供跨页面复用的能力（字典、分页）。
  • 状态层集中管理设备标识等轻量数据。
  • 各子功能页面通过统一的菜单入口与路由参数传递设备标识，保证数据一致性。

图表来源

详细组件分析 ​

设备列表与筛选（equipment.vue） ​

  • 功能要点
    • 支持设备状态与使用状态筛选，筛选项来自字典。
    • 支持关键词搜索与扫码输入设备编码，触发列表重载。
    • 使用 mescroll 实现下拉刷新与上拉加载，分页加载设备列表。
    • 列表项展示设备图片、编号、更新时间与关键字段，点击进入菜单页。
  • 数据流
    • 参数 paramsData：包含搜索词、状态、部门查询状态、设备编码。
    • 字典 device_status/device_use_status 通过 getDict 获取并注入筛选列表。
    • 分页接口：/dm-device/device/main/page，返回 records 与 total。
  • 事件与交互
    • 下拉刷新：调用 resetUpScroll(true)。
    • 上拉加载：upCallback(page) -> loadData(page.num)。
    • 扫码：onNavigationBarButtonTap -> 设置设备编码 -> resetUpScroll(false)。

图表来源

章节来源

设备菜单导航（menu.vue） ​

  • 功能要点
    • 展示设备主图与九宫格菜单，点击跳转至对应子功能页面。
    • 通过路由参数传递设备编码、设备编号与主角色类型，供子页面判断权限与标题。
    • 首次加载获取设备主图，确保菜单页头部展示一致。
  • 导航关系
    • 基础信息、管理信息、维护计划、配件、备件、事件、计量、文档、NFC。

图表来源

章节来源

设备基础信息（basicInfo.vue） ​

  • 功能要点
    • 三段式信息展示：基础信息、资产信息、规格参数。
    • 通过字典混入获取设备分类等枚举名称。
    • 接口：获取设备主信息与参数列表。
  • 组件模式
    • 使用 tabs 切换不同信息段，减少页面复杂度。
    • 通过 getDictName 将枚举值转换为显示名称。

章节来源

设备管理信息（manageInfo.vue） ​

  • 功能要点
    • 编辑设备管理相关字段：部门、责任人、产线、工位、状态等。
    • 根据设备主角色类型控制编辑权限，非主角色隐藏保存按钮。
    • 保存时提交完整设备信息对象，成功后返回上级页面。
  • 数据绑定与事件
    • 输入框与选择器双向绑定到 info 对象。
    • onNavigationBarButtonTap 触发保存请求。

章节来源

设备维护计划（maintenance.vue） ​

  • 功能要点
    • 三类计划：维修计划、巡检计划、保养计划。
    • 通过 tab 切换类型，请求对应计划列表。
    • 显示计划编号、名称、描述、类型、产线、周期等。
  • 字典使用
    • 计划类型、等级、周期单位等通过字典混入获取。

章节来源

设备配件管理（accessories.vue） ​

  • 功能要点
    • 三种视图：父设备、子设备、配件信息。
    • 父/子设备列表支持跳转至对应菜单页。
    • 配件信息展示编码、名称、规格、数量、单位、日期等。
  • 数据加载
    • 关联设备列表与配件列表分别请求不同接口。

章节来源

设备文档管理（document.vue） ​

  • 功能要点
    • 文档列表展示文件名与创建时间，点击触发下载。
    • 根据文件后缀动态选择图标类型。
    • 下载完成后提示并尝试打开文件。
  • 技术实现
    • 使用 plus.downloader 进行离线下载，结合 plus.runtime 打开文件。

章节来源

设备事件管理（event.vue） ​

  • 功能要点
    • 两层标签：相关工单、设备历史。
    • 相关工单支持四类：报修、保养、巡检、巡护。
    • 历史记录展示设备状态、使用状态、位置、模型、时间等。
  • 分页与字典
    • 使用 mescroll 实现分页，根据当前标签切换不同接口。
    • 设备状态、使用状态、工单状态等通过字典混入获取。

图表来源

章节来源

设备计量管理（meter.vue） ​

  • 功能要点
    • 展示计量点名称与单位，并允许编辑当前读数、累计数、最大值等。
    • 非主角色不可编辑，保存按钮根据权限隐藏。
    • 保存时提交计量列表数组，成功后返回上级页面。
  • 权限控制
    • 通过设备主角色类型判断是否禁用输入与保存按钮。

章节来源

设备备件管理（spareParts.vue） ​

  • 功能要点
    • 两类：备件与耗材材料。
    • 展示编码、名称、规格、库存、单位、更新时间等。
    • 通过 dataType 区分两类数据源。

章节来源

NFC设备管理（nfc.vue） ​

  • 功能要点
    • 提供拍照、读卡、写卡三个按钮入口。
    • 读卡与写卡通过 lib/nfc.js 封装的 NFC 方法实现。
  • 注意事项
    • 该页面为示例入口，实际 NFC 流程需结合硬件与平台能力完善。

章节来源

字典与上拉加载工具 ​

  • 字典混入（dictMixins.js）
    • 统一获取字典列表与名称映射，避免重复请求与硬编码。
  • 上拉加载混入（mescroll-mixins.js）
    • 提供下拉刷新与上拉加载的标准生命周期钩子，简化分页逻辑。

章节来源

依赖关系分析 ​

  • 组件耦合
    • 子功能页面均依赖 menu.vue 传递的设备标识，保持数据一致性。
    • 多数页面依赖字典混入进行枚举展示，降低耦合度。
    • event.vue 与 equipment.vue 依赖 mescroll 混入实现分页。
  • 状态管理
    • store/modules/equipment.js 管理设备编码、编号与图片地址，便于跨页面共享。
  • 外部依赖
    • plus.downloader 用于文档下载，plus.runtime 用于打开文件。
    • uni.scanCode 用于扫码输入设备编码。

图表来源

章节来源

性能考虑 ​

  • 列表渲染与分页
    • 使用 mescroll 的 endByPage 控制分页边界，避免一次性渲染大量数据。
    • 在 upCallback 中仅拼接新数据，第一页替换列表，提升滚动体验。
  • 字典缓存
    • 字典列表通过 getDict 获取并缓存在本地，减少重复请求。
  • 图片懒加载
    • 列表项图片使用占位图，避免首屏阻塞。
  • 下拉刷新策略
    • 下拉刷新时重置上拉游标，避免重复加载与数据错乱。

[本节为通用建议，无需特定文件引用]

故障排查指南 ​

  • 文档下载失败
    • 检查文件下载任务状态与 plus.downloader 回调，确认网络与存储权限。
    • 若打开失败，检查 plus.runtime.openFile 是否可用及系统默认应用。
  • 分页数据重复或缺失
    • 确认 endByPage 第二个参数为总页数，第一页替换列表，后续拼接。
    • 检查接口返回字段是否为 rows 或 records。
  • 字典名称显示为占位符
    • 确认 getDict 已正确获取字典列表并在页面加载时赋值。
    • 检查 getDictName 的第二个参数是否为字典值而非显示名称。
  • 权限导致无法编辑
    • 非主角色类型会隐藏保存按钮与输入框，需在管理信息页确认设备主角色类型。
  • NFC 功能无效
    • 确认设备具备 NFC 能力与平台支持，nfc.js 方法是否正确封装。

章节来源

结论 ​

设备管理模块通过清晰的功能划分与工具复用，实现了设备台账、详情、编辑、计划、文档、事件、计量、备件与 NFC 等全链路能力。借助 mescroll 与字典混入，模块在交互体验与可维护性方面表现良好。建议在后续迭代中进一步完善 NFC 与文档下载的错误处理与权限校验，持续优化分页与图片加载策略。

[本节为总结性内容，无需特定文件引用]

附录 ​

  • 最佳实践
    • 使用字典混入统一枚举展示，避免硬编码。
    • 分页场景使用 mescroll 的标准生命周期，确保用户体验一致。
    • 权限控制应贯穿 UI 与接口，非主角色隐藏编辑入口。
    • 文档下载与文件打开需做好异常捕获与用户提示。
  • 常见问题
    • 列表不更新：检查 resetUpScroll 调用时机与参数。
    • 字典未生效：确认 getDict 返回值已赋给本地变量。
    • 下载失败：检查 plus.downloader 配置与系统文件管理器。

[本节为通用建议，无需特定文件引用]