hrp-ui-base

hrp-ui-base

项目定位

hrp-ui-base 是各拆分业务系统共同依赖的前端公共能力包，用来承接主仓原 custom-components、custom-utils 中可复用的组件、布局、请求、权限、样式和工具能力。该包本身不是业务应用，不直接对应某一个后端服务。

对接后端服务

• 无独立业务后端。
• 包内保留少量公共接口封装和类型，供业务系统复用：bms、hrms、notice、work-order-pc、common。
• 请求能力由 HttpUtil、业务系统运行时 token、代理和后端网关共同决定。

提供的公共组件

• CustomButton：统一按钮封装。
• CustonSwitch：统一开关封装。
• AnnexUpload：通用附件上传。
• AnnexImgUpload：图片附件上传。
• AnnexUploadWeijian：卫健场景附件上传。
• ListSearchContent：列表页筛选/查询区域容器。
• BaseLayout：基础页面布局。
• LayoutContainer：业务系统主布局，整合菜单、页签、头部、消息、审批、导出中心、主题和字号配置。
• SysHeader、SysHeaderLeft、SysHeaderRight、SysHeaderTabs：系统头部与页签组件。
• SideMenu、SideMenuSonList：侧边菜单与子菜单列表。
• MessageNotificationDrawer：消息通知抽屉。
• ApprovalCenterDrawer：审批中心抽屉。
• ExportCenterDrawer：导出中心抽屉。
• PersonalizationGuideDialog：个性化引导弹窗。
• 布局子组件：暗黑模式、字号、菜单位置、下载、待办、消息、头像等 Header 功能块。

提供的公共工具能力

• 请求与登录：HttpUtil、exitLogin、setExitLoginRouter。
• 权限与路由：isHavePermit、getPagePermit、toNoPermitPage、路由/路径工具。
• 表格与主题：tableHeaderCellStyle、tableFontCellStyle、日夜模式样式配置。
• 文件与下载：download、文件类型判断、钉钉打开/下载相关工具。
• 交互工具：Throttle、Debounce、debounceleading、WebSocket 封装。
• 数据工具：字典、字符串、校验、格式化、过滤、树/列表转换等。
• 公共类型：ResponseBean、ResponseBeanList、ResponseBeanTablePage、TableQueryCriteriaVO、FileBaseInfo。

使用方式

• 全局安装：app.use(HrpUiBase)。
• 按需引用：import { LayoutContainer, ListSearchContent, HttpUtil } from "hrp-ui-base"。
• 包入口：src/index.ts 同时导出组件、API 类型/控制器和工具函数。

技术说明

• 包名：hrp-ui-base，当前版本：1.5.10。
• 技术栈：Vue 3、TypeScript、Vite library mode。
• 构建：pnpm build；类型检查：pnpm typecheck。
• 组件样式入口在 src/styles/main.css，业务系统更新版本后需要重新安装依赖并构建验证。

维护注意

• 新增公共组件时，需要在 src/components.ts 中注册、导出并补充 Vue 全局组件声明。
• 新增工具时，需要在 src/utils.ts 统一导出。
• 影响登录、401、消息通知、审批中心、菜单跳转等能力时，需要在 entry 和主要拆分系统中回归验证。