Appearance
组件总览
vue3-ep-biz-lib 业务组件列表。使用 $vue3-ep-biz-lib 技能新增组件后,在此表格与侧边栏(按分组)登记。
组件统计:共 186 个 —— 基础组件 16 · 表单组件 56 · 数据展示 46 · 图表组件(ECharts)2 · 反馈与文件 26 · 布局导航 18 · 业务复合 24
第三方依赖说明
绝大多数组件零第三方依赖(仅依赖 vue / element-plus)。以下组件需使用方额外准备依赖或账号,使用前请先按下表安装:
| 组件 | 依赖 | 安装 / 准备方式 | 说明 |
|---|---|---|---|
| BizChart 图表容器 | echarts(可选 peer) | npm i echarts | 首次渲染时动态加载;追求体积可经 echartsLib 注入 echarts/core 按需构建 |
| BizRichEditor 富文本编辑器 | quill(可选 peer) | npm i quill 并 import 'quill/dist/quill.snow.css' | 未安装时组件内显示安装指引 |
| BizCodeEditor 代码编辑器 | codemirror 系(可选 peer) | npm i codemirror @codemirror/lang-json(按语言追加 lang-sql / lang-javascript / lang-yaml,暗色另装 @codemirror/theme-one-dark) | 未安装时组件内显示安装指引;按语言最小化安装 |
| BizFileViewer 文件预览 | pdfjs-dist(可选 peer) | npm i pdfjs-dist,配置 worker 后经 pdfjsLib 注入 | 默认 native 引擎零依赖;office 预览需对接自建服务(kkFileView / onlyoffice) |
| BizMapPicker 地图选点 | 高德 JSAPI(运行时 CDN) | 高德开放平台申请 Web端(JS API) Key | 需传 app-key;建议配置域名白名单;内网 / 海外环境不可用 |
| BizMapTrack 地图轨迹 | 高德 JSAPI(运行时 CDN) | 同上,与 BizMapPicker 共用 Key | 轨迹回放 + 播放控制(倍速 / 进度 / 帧步进);无 Key / 加载失败给出占位提示 |
| BizCode 图码生成 | qrcode(库直接依赖) | 无需额外安装 | 随组件库自动安装(二维码通道;条形码通道零依赖) |
| BizSignature 手写签名 / BizPrintBar 打印条 | — | 无需 | 纯 canvas / 浏览器原生打印,零依赖 |
| BizSharePanel 分享面板 | qrcode(库直接依赖) | 无需额外安装 | 链接一键复制 + 二维码 + 渠道按钮(微博 / QQ 预置分享模板);有效期 / 提取码信息行 |
通用
| 组件 | 说明 | 状态 |
|---|---|---|
| BizAnnouncement 系统公告 | 运营公告弹窗:info / warning / important 三级标帜、今日不再提示(localStorage)、阅读时长 read-report 上报 | ✅ |
| BizAmount 金额文本 | 分转元 / 千分位 / 人民币大写 / 正负着色,财务金额展示规范 | ✅ |
| BizAppointmentPicker 预约选择 | 日期+时段+余量预约:月历(工作日/区间过滤)×时段列表(容量/约满/多选上限),静态/按日/异步三数据通道,booked-slots 占用标注与撞占拦截 | ✅ |
| BizAmountInput 金额输入 | 元/分双单位 v-model、千分位、人民币大写联动、上下限回弹;units 数量单位换算(件↔箱↔吨);percent 费率模式(v-model 即百分数值、0~100 回弹、可改「折」后缀);rate 汇率换算模式(输入外币实时联动本位币 + 人民币大写) | ✅ |
| BizExpenseClaim 费用报销单 | 单据头 + 费用明细行(增删复制/单笔上限)+ 合计大写 + 发票夹(代码+号码重复拦截/查验标记)+ 附件 + 提交审批/暂存;readonly 审批快照回显 | ✅ |
| BizI18nInput 多语言输入 | 一个字段多语言录入:页签/堆叠布局、主语言必填、缺译标记、一键翻译钩子 | ✅ |
| BizAmountKeyboard 金额数字键盘 | 收银 4 列键盘:千分位实时预览、前导 0 / 双点 / 小数位 / 整数位规则、上限拦截抖动、乱序防偷窥、inline / 底部弹层 | ✅ |
| BizBankBranchSelect 联行号选择 | 银行分组网格 + 网点拼音(全拼/首字母)/ 联行号检索(内置示例数据,支持 data 注入与远程),v-model 结构化 { bank, branch, cnaps } 三元组 | ✅ |
| BizBankCardInput 银行卡号输入 | 仅数字录入 + 4 位分组展示,位数区间与 Luhn 模 10 校验 | ✅ |
| BizAddressInput 地址输入 | 省市区级联 + 详细地址 + 邮编组合件,v-model 结构化(region/detail/zip),getFullText 拼完整地址 | ✅ |
| BizApprovalActions 审批操作条 | 同意 / 驳回(必填原因)/ 转交 / 加签 统一出口,与流程/时间线组成审批页 | ✅ |
| BizAuditLog 操作记录 | 审计日志时间轴:筛选条 + 按天分组 + 成功/失败标记 + 可展开明细,本地过滤 + filter-change 外抛 | ✅ |
| BizAuthButton 权限按钮 | 权限码对照权限集合,无权隐藏/禁用,配套 v-auth 指令 + useAuth 编程式判定,RBAC 收口 | ✅ |
| BizAttachmentList 附件组 | 附件组展示与轻管理:list/grid 双形态、扩展名图标、预览下载、删除+拖拽排序、敏感掩码、折叠骨架 | ✅ |
| BizBatchActionsBar 批量操作条 | 已选计数 + 批量按钮组 + 取消选择,count=0 自动隐藏(表格多选联动) | ✅ |
| BizButton 按钮 | el-button 全量透传 + only-icon 图标按钮(hover tooltip)+ 图标三通道(组件/字体 class/插槽) | ✅ |
| BizCalendarBoard 日期排版 | 月/周双模式按天排版:上/下一月(周)切换、今天回跳、单元格插槽自定义、当天之前禁用;events 日程事件模式(事件条/跨日铺满/溢出折叠 +N/点击交互);exportIcs 导出标准 .ics 日历 | ✅ |
| BizCertUpload 资质证照管理 | 类型清单配置驱动的证照管理:上传即建卡、发证/到期登记与长期有效、临期/过期预警、审核驳回重传、只读审查、完备性校验与本地 CSV 清单导出、变更记录 | ✅ |
| BizContractLedger 合同台账 | 合同实体台账:登记校验/扫描件、到期预警(阈值窗口/汇总条/CSV 清单)、履约节点维护、回款计划(分期核销/逾期红警/回款进度条)、续签带出(失效日+1 预填)、归档;data/request 双通道 | ✅ |
| BizCameraCapture 摄像头采集 | getUserMedia 现场拍照:连拍管理、前后切换、镜像、引导框(人脸/证件/三分线)、倒计时、压缩输出、环境降级 | ✅ |
| BizCaptchaInput 图形验证码 | 图形验证码:本地 SVG 生成 / 远程图+captchaId 双模式,输满自动校验、连续失败自动换图 | ✅ |
| BizDateRange 快捷日期范围 | 业务时间窗:预设快捷项(今日/本周/近7天…相对语义)+ 自定义范围,picker/segmented 双形态、跨度守护 | ✅ |
| BizWorkdayCalendar 法定工作日历 | 内置 2024~2026 法定节假日/调休数据包、三态标记、工作日计算纯函数(count/add/disabled) | ✅ |
| BizPivotTable 透视表 | 行列维度交叉汇总(多级行列/多指标/小计总计/下钻/CSV 导出,纯前端聚合零依赖) | ✅ |
| BizConfirmButton 二次确认按钮 | 点击弹确认,confirm 后触发事件;danger 操作防误触,继承 BizButton 全部能力 | ✅ |
| BizCopyText 复制文本 | 一键复制(Clipboard + execCommand 降级)、成功变对勾、多行省略 + tooltip 全文 | ✅ |
| BizCreditCodeInput 信用代码输入 | GB 32100-2015 字符集与模 31 校验位,解析部门 / 区划 / 主体标识码 | ✅ |
| BizCronInput 定时表达式输入 | 5 字段可视化 Cron 配置,表达式双向同步,未来 N 次执行预览 | ✅ |
| BizCurrencySelect 货币选择 | 内置 36 种常用货币(ISO 4217),国旗+名称+代码+符号富选项,中文/代码检索 | ✅ |
| BizCountdownButton 倒计时按钮 | 点击进入倒计时禁用态,验证码发送 / 重试冷却防连点 | ✅ |
| BizCountdown 倒计时文本 | 目标时间戳/剩余时长双模式、finish 事件、暂停恢复重置,订单支付·活动倒计时 | ✅ |
| BizDashboardGrid 仪表盘网格 | x/y/w/h 网格单位布局(v-model),编辑态拖拽+缩放+碰撞回弹,#item 插槽渲染内容 | ✅ |
| BizCrudPage 增删改查页 | 搜索 + 工具栏 + 表格 + 弹窗表单 + 删除确认一页式编排,request 注入即成管理页;aside-tree 左树右表(静态/懒加载/树搜索/选中联动查询/可折叠) | ✅ |
| BizDescriptions 详情描述 | items + data 声明式 label-value 详情(空值占位 / formatter / 字段插槽) | ✅ |
| BizDiffViewer 文本对比 | 行级 LCS diff:split 分栏 / unified 单栏、增删着色统计,配置·版本对比 | ✅ |
| BizDivideTitle 分块标题 | 装饰竖条 + 尺寸档位 + 右侧操作区 + 分割线 + 可折叠内容区(v-model:collapsed) | ✅ |
| BizDragSort 拖拽排序列表 | 原生 DnD 拖拽排序:把手约束 / 放置指示线 / 纵横双向 / v-model 回写 | ✅ |
| BizEditableTable 可编辑表格 | 列声明编辑控件,新增 / 复制 / 删除行,单元格校验与数值合计;kv 键值对模式(键唯一/值类型/锁定行/Record 互转)+ Excel 粘贴批量填充 | ✅ |
| BizErrorBoundary 错误边界 | 捕获子树渲染异常给出兜底视图与重试,防整页白屏 | ✅ |
| BizEllipsis 溢出省略 | 单行 / 多行 line-clamp 省略 + tooltip 全文 + 可展开收起 | ✅ |
| BizEmpty 空态 | 统一空数据展示(文案 / 图标尺寸 / 底部操作插槽) | ✅ |
| BizEnvBadge 环境标识 | dev / test / uat / gray 环境丝带或徽标(prod 自动隐藏),fixed 视口角落或容器角落,防生产误判环境 | ✅ |
| BizFileViewer 文件预览 | PDF/图片在线预览(native 零依赖;pdfjs 引擎页码缩放,office 对接自建服务) | ✅ |
| BizFilterTags 已选筛选条 | 筛选条件 tag 回显:单条删除联动、清空、+N 折叠 | ✅ |
| BizCardList 卡片列表 | 响应式卡片墙(本地 / 远程分页)+ 单/多选 + 空态,一卡一物的列表形态 | ✅ |
| BizChart 图表容器 | ECharts 声明式渲染:option 深度更新 / loading / 空态 / 自适应(需自装 echarts,懒加载) | ✅ |
| BizChat 对话流 | 气泡流:流式光标/打字指示/失败重试/历史加载/回底控制/内置输入区,render-html 注入 markdown;paste-image 输入区 Ctrl+V 粘贴图片(File[] 外抛) | ✅ |
| BizChunkUpload 分片上传 | init 探测秒传/续传 → 并发分片 → finish 合并,暂停续传取消,大文件断点续传 | ✅ |
| BizCommentList 沟通记录 | 头像/引用回复/系统备注/加载more 的意见流 | ✅ |
| BizUploadVideo 视频上传 | 格式/大小/时长校验、本地封帧封面(v-model:poster)、video 预览卡,request 注入式 | ✅ |
| BizMediaPlayer 媒体播放器 | 原生 audio / video 统一封装:进度含缓冲 / 倍速 / 循环 / 音量、封面与断点续播、compact 语音条、全屏、失败重试 | ✅ |
| BizUserGroup 用户头像组 | 头像堆叠 +N 折叠、悬浮明细、成员点击 | ✅ |
| BizExportButton 导出按钮 | 确认 → loading → 下载 → 反馈;三通道:request Blob 注入 / task-request 异步任务轮询 / rows 纯前端本地 CSV(BOM 防 Excel 乱码,零后端) | ✅ |
| BizFeedbackPanel 意见反馈 | 类型级联 + 紧急程度 + 描述 + 截图粘贴上传 + 匿名联系方式 + 我的反馈历史(状态流转/官方回复),panel/dialog/drawer 三形态,零接口注入 | ✅ |
| BizWorkOrder 工单中心 | 提交→受理分派→处理(对外回复/内部备注)→评价关单→重新打开全生命周期,SLA 时限倒计时(临期/超期),assignees 选人、动作级 request 注入 | ✅ |
| BizHelpCenter 帮助中心 | 分类导航 + FAQ 手风琴 + 关键词高亮检索 + 有用/无用反馈 + 空态反馈引导 + 深链接定位,articles 静态或 request 分类懒加载 | ✅ |
| BizPoster 分享海报 | canvas 模板合成(主图/标题/简介自动缩排/头像昵称/二维码复用 BizCode),2x 高清导出 PNG、剪贴板复制、批量生成、远程模板配置 | ✅ |
| BizResourceBooking 资源预约 | 会议室/车辆/设备的时段网格预约:占用三态、点选圈区、冲突拦截、时长与容量校验、我的预约取消与变更、周期预约(每周/每两周整组冲突检测与整组取消) | ✅ |
| BizVisitorPass 访客预约通行 | 邀访登记(手机号强校验)→二维码通行证→到访/离场/作废状态流转、邀访统计,本地或三接口远程 | ✅ |
| BizSalarySlip 工资条 | 期间导航、应发/扣减明细、实发合计、敏感金额脱敏明示、银行卡尾号、异议反馈、年度汇总、readonly 审计水印 | ✅ |
| BizCouponCard 优惠券 | 满减/折扣/兑换三形态券卡,五态派生(未开始/领取中/已领完/已结束/暂停)、库存进度、临期红标、每人限领 | ✅ |
| BizMemberCard 会员卡与积分 | 会员档案+成长值晋级进度+积分/储值余额+等级权益+积分流水三态+储值充值(本地或服务端余额回填) | ✅ |
| BizAfterSale 售后退款单 | 仅退款/退货退款双类型状态机(审核→寄回→收货→退款),驳回原因必填、运费口径可退上限、凭证图、退货物流轨迹(签收自动确认收货)、买卖双视角 | ✅ |
| BizWorkbench 个人工作台 | 时段问候+待办勾选(临期红显)+通知速览+今日日程+快捷入口宫格+常用应用,卡片显隐顺序可配可持久化 | ✅ |
| BizGoodsReview 商品评价管理 | 评分汇总(均分/分布/好评率)+六向筛选+审核通过驳回+商家回复+精选置顶+追评与图集 | ✅ |
| BizExpressTrack 物流轨迹 | 快递公司 + 运单号复制头部、轨迹时间线(最新节点高亮 / 签收终态 / 相邻节点耗时)、loading / error / empty 三态 | ✅ |
| BizCompareBoard 多方案对比 | N 方案参数对比矩阵:首列/表头双吸附、行分组、bool/number 类型差异最优高亮、只看差异、推荐列描边 | ✅ |
| BizFullScreen 全屏切换 | 页面级 / 元素级全屏,Esc 状态自动同步,作用域插槽自定义触发器 | ✅ |
| BizFloatButton 悬浮按钮 | 四角停靠 FAB:展开菜单列 + 拖动边缘吸附 + 内置返回顶部,动作事件外抛 | ✅ |
| BizFooterToolbar 吸底操作条 | 长表单/协议页底部常驻保存区,等高占位防遮挡 | ✅ |
| BizFormDialog 弹窗表单 | fields 配置驱动的新增/编辑二合一弹窗表单(15 类控件 / 校验 / 联动 / 提交契约),mode 支持 dialog / drawer 双形态 | ✅ |
| BizForm Schema 表单 | 页面级 Schema 表单:15 类控件、24 栅格、view 只读态、show/disabled 联动,与弹窗/设计器共用渲染内核 BizFormBody | ✅ |
| BizFormDesigner 表单设计器 | 字段面板拖入 + 画布排序 + 属性面板编辑,schema 纯 JSON,预览态渲染可交互表单;survey 问卷模式(题型面板/Q 编号/投放二维码/回收统计) | ✅ |
| BizGuide 新手引导 | 分步高亮遮罩(挖孔 + 说明卡片 + 自动翻转定位),SaaS 开屏 / 新功能引导 | ✅ |
| BizHighlight 关键词高亮 | 多关键词 / 大小写模式 / 三种样式,切片渲染免疫 XSS,搜索列表标红命中词 | ✅ |
| BizTimeText 时间文本 | 相对/绝对/实时时钟三模式:刚刚/N 分钟前/昨天分档+自动刷新+悬浮绝对时间;模板格式化+空值占位+时区口径;clock 秒级走字+星期(顶栏时钟/大屏时间牌) | ✅ |
| BizIconSelect 图标选择器 | icons-vue 全量图标弹窗网格(搜索 / 分页 / 选中高亮),v-model 绑定组件名 | ✅ |
| BizColorSelect 预设色板选择 | 预设色板(随 EP 主题推导 / 业务自定义)+ 最近使用记忆 + 内嵌取色器,标签色 / 日程配色 | ✅ |
| BizIdCardInput 身份证号输入 | 18 位区划 / 生日 / 校验位校验,派生出生日期、性别、年龄、省份 | ✅ |
| BizLinkInput 链接输入 | 邮箱/网址双模式:格式校验(域外/非 https 分档)、@ 后缀建议、协议自动补全、合法后缀新窗口预览 | ✅ |
| BizImageViewer 图片预览 | 缩略图列表 + 全屏预览(字段映射 / 大图分离 / limit 聚合 / 空态与覆盖层插槽) | ✅ |
| BizInfiniteList 无限滚动列表 | 滚动到底自动翻页:加载中/失败重试/没有更多三态,消息·日志·feed 流 | ✅ |
| BizIpInput IP 地址输入 | IPv4 四段式:0-255 逐段校验、自动跳段、粘贴整段解析;show-port 端口段(1-65535,v-model 'a.b.c.d:port') | ✅ |
| BizJsonViewer JSON 查看器 | 树形折叠展开、类型着色、节点路径 / 值 / 全文复制 | ✅ |
| BizLayout 布局壳 | 侧栏递归菜单折叠 + 顶栏操作槽 + tabs 槽接 TabsNav,中后台主框架 | ✅ |
| BizLogViewer 日志查看器 | 等宽流式渲染、级别着色、关键字过滤高亮、自动滚动、虚拟滚动、下载 .log | ✅ |
| BizImport 数据导入 | quick 一键导入(模板→校验→上传→失败明细)/ wizard 三步向导(列映射记忆 + 错误预览回填),全链路业务注入 | ✅ |
| BizMapPicker 地图选点 | 高德 JSAPI 运行时加载,点击/搜索/拖拽选点 + 逆地理地址(需高德 Key) | ✅ |
| BizMentionInput @提及输入 | 文本域 + 候选人弹层:触发符唤起随输随筛、↑↓/Enter 键盘选择、getMentions 提取已提及人员 | ✅ |
| BizModal 业务弹层 | dialog/drawer 双模式壳 + 函数式 openBizDialog/openBizDrawer + 提交契约/脏检查/单例/尺寸预设 | ✅ |
| BizNotificationCenter 通知中心 | 铃铛 + 未读角标 + 下拉列表 + 全部已读/查看全部 | ✅ |
| BizTaskCenter 任务中心 | 任务列表面板双形态:trigger 触发按钮 + 进行中角标弹层 / panel 直出;状态统计 / 进度 / 重试 / 取消 / 移除 / 下载,done 完成回调 | ✅ |
| BizEmojiSelect 表情选择 | 8 组内置 emoji(约 200 个)+ 分类页签 + 中文关键词检索 + 最近使用持久化 | ✅ |
| BizNumberRange 数字区间 | min/max 联动(左大于右自动交换),金额/耗时/年龄区间 | ✅ |
| BizOrgTreeSelect 组织树选择 | 部门树表单件:静态 / 懒加载、单/多选、仅叶子可选、本地搜索 | ✅ |
| BizPageHeader 页头 | 返回 + 标题 + 副标题 + 右侧操作区 | ✅ |
| BizPasswordInput 密码输入 | 四档强度计 + 规则清单逐项打勾 + 自定义合规规则 + 二次输入一致性(BizPasswordMeter 保留为子导出,可独立搭配任意输入源) | ✅ |
| BizPhoneInput 电话号码输入 | 手机号:3-4-4 分段、1[3-9] 号段校验、运营商识别、编辑回显脱敏;座机模式:区号-号码[-分机] 三段、400/800 热线、info 携带 area/number/ext | ✅ |
| BizPrintBar 打印条 | 区域/整页打印门户,横纸与标题可配,打印后原位归还 | ✅ |
| BizPrintPage 打印页面 | A4 纸张预览(方向/边距/缩放)+ 工具条,@media print 精准输出打印内容 | ✅ |
| BizProcess 审批流程 | 审批节点条(状态着色 / running 呼吸)+ 审批意见时间线 | ✅ |
| BizMessageCompose 消息发送面板 | 渠道/模板变量/实时预览/人群插槽/定时发送,send 回传完整 payload(零接口) | ✅ |
| BizCode 图码生成 | 二维码(logo 中心图 / 圆点码点风格)+ Code39 / Code128 条形码多通道:纠错/配色/静区、条高/宽窄比/校验位,下载 PNG 与 toDataURL 导出 | ✅ |
| BizRegionCascader 省市区选择 | 行政区划数据注入 + level 深度 + 代码路径 v-model + 文本回显 | ✅ |
| BizResult 业务结果页 | 成功 / 失败 / 403 / 404 / 500 统一结果反馈与操作区 | ✅ |
| BizRichEditor 富文本编辑器 | Quill 2 封装:v-model HTML / 工具栏预设与自定义 / 图片上传契约(需自装 quill) | ✅ |
| BizRolePermMatrix 角色权限矩阵 | 权限点(模块分组)× 角色列勾选维护 v-model 授权映射,整组半选 / 汇总 / 表头首列双吸附 | ✅ |
| BizCodeEditor 代码编辑器 | CodeMirror 6 封装:JSON/SQL/JS/YAML 高亮、只读、暗色、JSON 格式化(可选 peer 按需安装) | ✅ |
| BizScheduleTime 排班时段 | 按天配置多时段,顺序 / 重叠 / 跨天校验,每日与每周合计 | ✅ |
| BizShortcutInput 快捷键录入 | 点击捕获组合键、ctrl/alt/shift/meta 修饰键标准化键帽、必含修饰键约束、冲突清单红警 | ✅ |
| BizKeyValueEditor 键值对编辑器 | 键值行增删/上下移排序、重复键即时红警、类型列按 string/number/boolean 解析导出、JSON 导入与复制 | ✅ |
| BizWeekPicker 周选择 | 年份翻页 + ISO 周格面板(本周定位)、上周/本周/下周快捷,change 回抛周起止日期 | ✅ |
| BizEditableText 行内编辑文本 | 点击文本就地编辑:单击/双击/受控触发、同步+异步两段校验(失败保持编辑态)、Esc 取消、空占位、textarea/number 形态 | ✅ |
| BizSettingItem 设置项行 | 设置页行式单元:图标+标题+说明+控件插槽+操作插槽、分隔线(末行去线)、hover 操作降噪、紧凑档 | ✅ |
| BizTemplateInput 模板变量输入 | 文案+${变量}:面板点选光标插入(分组聚类)、未注册/未闭合校验、sample 示例值预览高亮、已用变量计数 | ✅ |
| BizCoordinateInput 经纬度输入 | 零地图依赖坐标键入:±180/±90 范围与精度校验、DMS 度分秒换算展示、坐标系标注(wgs84/gcj02/bd09)、复制 lng,lat、粘贴坐标自动分发 | ✅ |
| BizRemoteSelect 远程搜索选择器 | 防抖远程检索 + 同词缓存 + 滚动翻页 + id 回显,万级数据源选人/选物;type=table 下拉内嵌表格多列辨认回填 | ✅ |
| BizSeamlessScroll 无缝滚动 | rAF 无缝滚动列表,hover 暂停,速度/方向可配,大屏榜单 | ✅ |
| BizSearchForm 搜索表单 | schema 驱动、折叠展开、查询 / 重置、与 BizTable 联动 | ✅ |
| BizSearchInput 搜索输入 | 防抖触发 search 的快速过滤输入(回车立即 / 清空重置) | ✅ |
| BizTablePicker 弹窗表格选择器 | 双筛选形态:search 搜索分页表格 / tree 组织树选人(含懒加载),单/多选 + 已选 chips 回删,本地 data 或 request 注入;recent 最近选择留痕、拼音检索与头像列(注入式) | ✅ |
| BizSignature 手写签名 | Pointer Events 跨端签名板,高清导出 PNG,清空/确认操作条;agreement 协议阅读门控(滚动到底 + 倒计时 + 同意勾选);seals 印章盖印(拖拽定位/滚轮缩放/三层合成导出)与 document-image 文档底图 | ✅ |
| BizSliderCaptcha 滑块验证码 | 拖到底校验(request 注入后端风控,含轨迹采样),通过锁定 / 失败抖动回弹 | ✅ |
| BizStatistic 统计指标 | 卡片与 inline 内联双形态:数值格式化 + 趋势涨跌(cn/good/reverse 口径)+ sparkline 迷你走势 + 数字滚动动画 + loading 骨架(合并原 BizTrend) | ✅ |
| BizStatisticGroup 统计栏组 | 默认 3 张可视的横向分页容器:箭头步进(翻页/单卡)、边界置灰/隐藏、页码点、循环 | ✅ |
| BizStatusTag 状态标签 | 码值→标签:手传 status-map / 全局字典 dict-type(useDict 共享缓存),color 实色 + EP 色系,未命中兜底;组模式直传标签对象/字符串数组 + closable 移除 + 弹层触发位置可配 + 空态占位 | ✅ |
| BizStepsForm 分步表单 | el-steps 向导容器,每步独立校验,末步聚合数据 finish;draft-key 草稿箱(防抖暂存/恢复提示/finish 自动清理) | ✅ |
| BizTabsNav 多标签页导航 | 中后台页签栏唯一组件:Chrome 式激活浮起 / 右键菜单(刷新·关闭系)/ affix 固定 / before-close 异步拦截 / 拖拽排序 / 溢出滚动(合并原 BizPageTabs) | ✅ |
| BizTagInput 标签输入 | 回车/逗号成标签、去重、上限、长度截断 | ✅ |
| BizTable 业务表格 | schema 渲染列 / 多选 / 序号 / 分页 / 自适应高度 / 工具栏 / 远程数据源 | ✅ |
| BizThemeSwitch 主题切换 | 明暗一键切换(html.dark + 持久化 + 系统偏好跟随),v-model 受控 | ✅ |
| BizTimeline 业务时间线 | records 驱动 + 状态映射着色 + 空态,订单跟踪 / 审批记录 / 操作日志 | ✅ |
| BizToolbar 工具栏 | 左侧批量操作 + 刷新 / 密度 / 列设置(偏好可持久化) | ✅ |
| BizUploadFile 文件上传 | 列表形态附件上传(校验 / 下载 / 删除 / 失败重传);pasteable 剪贴板截图粘贴上传(Ctrl+V、自动命名、同一校验链路) | ✅ |
| BizUploadImage 图片上传 | 图片墙上传(校验 / 全屏预览 / v-model 地址数组) | ✅ |
| BizVirtualTable 虚拟滚动表格 | el-table-v2 封装,10 万行级虚拟渲染,超大日志/流水列表 | ✅ |
| BizWatermark 水印 | canvas 文字水印铺底 + MutationObserver 防删自愈,可全屏 | ✅ |
| BizLoginPanel 登录面板 | 账号密码+验证码插槽+记住账号+第三方渠道+必填校验,submit 外抛,cover 品牌区;短信/扫码/MFA 登录;forgot-flow 忘记密码三步流、register-flow 内置注册流(邀请码/协议勾选) | ✅ |
| BizUpdateNotification 更新提示 | dialog 弹窗 / banner 顶栏双形态版本更新提示,版本日志列表 + 强制更新模式 | ✅ |
| BizVersionHistory 版本历史 | 版本时间轴(当前版本标记/恢复/两次点选 A/B 对比外抛),note 与操作插槽 | ✅ |
| BizVoiceInput 语音输入 | Web Speech API 封装:实时中间结果 + 终句写回 v-model(追加/替换),不支持自动降级 | ✅ |
| BizTimezoneSelect 时区选择 | 内置 36 时区大区分组,实时 GMT 偏移(夏令时自适应)+ 当地时间预览 | ✅ |
| BizMediaWall 媒体墙 | CSS columns 瀑布流(图片/视频封面)+ 悬浮操作 + 内置灯箱(键盘翻页)+ 加载更多 | ✅ |
| BizTodoCenter 待办事项中心 | 待办/已办/我发起页签 + 计数角标上报、优先级色点、超期红标、行内审批动作(二次确认)、关键字搜索与分页 | ✅ |
| BizVote 投票评选 | 单选/多选限票、匿名与实名名单、截止倒计时自动止投、实时进度条与占比、结果定格排序、撤销重投;本地统计或 request 服务端口径 | ✅ |
| BizUserProfile 个人中心 | 基础资料(头像裁剪复用 BizAvatarCropper)/ 改密(内嵌密码强度计)/ 账号绑定 / 登录设备四板块,动作全外抛 | ✅ |
| BizShiftCalendar 排班日历 | 成员×日期排班网格:点格编辑、拖拽换班(移动/交换)、容量冲突检测、班次与成员统计、跨月保留;attendance 考勤实况模式(六态徽标/异常清单/出勤率) | ✅ |
| BizFlowDesigner 流程设计器 | 钉钉式结构树:审批/抄送/条件分支(嵌套)节点编排、属性面板、JSON 导入导出、结构校验定位、预览态 | ✅ |
| BizEmbedPage 外链嵌入容器 | iframe 受控嵌入(frame/弹窗/抽屉三态)、加载超时兜底重试、postMessage 白名单通信、多地址缓存切换 | ✅ |
组件文档规范
每个组件文档 docs/zh-CN/components/组件名.md 固定包含以下章节,缺一不可:
- 标题 + 组件简介;
- 基础用法(
:::demo 组件名/basic); - 其他用法示例(按需);
- Props 表格:属性名|类型|默认值|说明;
- Events 表格:事件名|参数|说明;
- Slots 表格:插槽名|说明;
- Expose 表格:暴露的实例属性/方法|说明。
文档模板:
md
# BizButton 按钮
常用的操作按钮,基于 el-button 二次封装。
## 基础用法
:::demo biz-button/basic
基本的按钮用法。
:::
## Props
| 属性名 | 类型 | 默认值 | 说明 |
| ------ | ---- | ------ | ---- |
| type | `'primary' \| 'success' \| 'warning' \| 'danger' \| 'info'` | `'primary'` | 按钮类型 |
## Events
| 事件名 | 参数 | 说明 |
| ------ | ---- | ---- |
| click | `(event: MouseEvent)` | 点击时触发 |
## Slots
| 插槽名 | 说明 |
| ------ | ---- |
| default | 按钮内容 |
## Expose
| 属性/方法 | 说明 |
| --------- | ---- |
| ref | 透传 el-button 实例 |