开发百宝箱 (devbox)

一款集成在 ZTools 中的实用工具箱，提供随机生成、编码转换、开发辅助等常用工具。

最近更新

v2.7.2 (2026-09-17)

• 修复 JSON 工具 两类粘贴报错：①「无外层引号、内部全是 \" 转义」的 JSON（从日志/字符串字面量复制的常见形态）自动还原转义；②「多个对象/数组拼接、缺外层 []」——逗号分隔（{...},{...}）或无逗号直连（{...}{...}）均可，自动补全逗号与外层数组，直接可格式化、压缩、去转义。状态栏三态显示：有效 JSON（绿）/ 非标准 JSON 可自动修复（黄）/ 无效 JSON（红）。

v2.7.1 (2026-09-16)

• 增强 HTML 预览 工具：编辑区上方新增「插入片段」按钮条（图片 / 链接 / 段落 / 容器 / 列表 / 表格），点击在光标处插入模板、光标自动定位到待填位置，选中文本时直接包裹成对应标签；新增「粘贴为图片标签」按钮，剪贴板里的 data:image 前缀、图片 URL、SVG 源码或裸 Base64（自动嗅探 PNG/JPEG/GIF/WebP/BMP/ICO 格式补全 MIME）一键包成 <img src="...">。触发指令：html HTML预览 预览。

v2.7.0 (2026-09-14)

• 新增 URL 编解码 工具：percent-encoding 编码与解码，编码支持整段转义（encodeURIComponent）/ 仅不安全字符（encodeURI）/ 仅参数值（只转义查询参数的值，结构与参数名保留）三种范围、+ 还原为空格，解码时自动解析 URL 结构（协议/主机/路径/锚点）与查询参数表，解析不到时回退到解码结果上解析（标注「基于解码结果」），点击即复制。触发指令：url URL编码 URL解码。

v2.5.1 (2026-07-23)

• 重构 文本转换 工具：8 个原子操作按钮（添加/去除包裹符、按分隔符拆分/合并、替换分隔符/包裹符），操作可叠加，支持每行/每个两种包裹符。触发指令：文本转换 合并行 加引号。

v2.5.0 (2026-07-22)

• 新增 文本转换 工具：多行与单行文本互转，每行加引号/逗号合并，或按分隔符拆分，支持自定义分隔符和包裹符。触发指令：文本转换 合并行 加引号。

v2.4.0 (2026-07-18)

• 新增 JSON 工具：支持编辑、格式化、压缩、转义与去转义、删除注释、字段排序，能自动识别并解析被转义的 JSON 字符串，带语法高亮和树形查看。触发指令：json JSON json格式化。

v2.3.3 (2026-05-20)

• 新增 压缩文本 工具：将多行文本的换行和多余空格压缩为单个空格，支持移除代码注释、保留引号内空格、按指定宽度智能折行。触发指令：压缩文本 compress。

工具列表

| 分类 | 工具 | 触发指令 | |------|------|----------| | 随机生成 | 随机身份 | 身份 身份证 identity | | | 随机密码 | 密码 password | | | 随机数字 | 随机数字 number | | | UUID生成 | UUID guid | | | 随机颜色 | 颜色 color | | 编码转换 | 加密签名 | 签名 hash md5 sha | | | Base64 编解码 | base64 b64 编解码 | | | URL 编解码 | url URL编码 URL解码 | | | 中文转拼音 | 拼音 pinyin | | | 二维码 | 二维码 qrcode qr | | | 时间转换 | 时间 时间戳 time | | 开发工具 | HTML预览 | html HTML预览 | | | 压缩文本 | 压缩文本 compress | | | 文本转换 | 文本转换 合并行 加引号 | | | JSON工具 | json JSON json格式化 |

使用方式

1. 在 ZTools 搜索栏输入上述任意触发指令
2. 或在 ZTools 主界面点击「开发百宝箱」图标进入

开发者说明

以下内容面向插件开发者，普通用户无需关注。

技术栈

• Vue 3 + Vite + TypeScript
• Element Plus UI 组件库

项目结构

src/
├── tools/                    # 工具组件目录
│   ├── Identity/            # 随机身份
│   ├── RandomPassword/      # 随机密码
│   ├── RandomNumber/        # 随机数字
│   ├── UUID/                # UUID 生成
│   ├── RandomColor/         # 随机颜色
│   ├── Signature/           # 加密签名
│   ├── Base64/              # Base64 编解码
│   ├── UrlCodec/            # URL 编解码
│   ├── Pinyin/             # 中文转拼音
│   ├── Qrcode/              # 二维码
│   ├── HTMLPreview/         # HTML 预览
│   ├── TimeConvert/         # 时间转换
│   ├── TextCompress/        # 压缩文本
│   ├── TextTransform/       # 文本转换
│   └── JsonTool/            # JSON 工具
├── toolbox/
│   ├── ToolboxLayout.vue   # 布局组件
│   └── tools.ts            # 工具注册表
└── App.vue                  # 根组件

public/
├── plugin.json              # 插件配置
├── logo.png                # 插件图标
└── preload/
    └── services.js         # Node.js 桥接服务

开发命令

npm install     # 安装依赖
npm run dev     # 启动开发服务器（http://localhost:5173）
npm run build   # 构建生产版本

添加新工具

1. 在 src/tools/<ToolName>/index.vue 创建 Vue 组件
2. 在 src/toolbox/tools.ts 的 categories 数组中注册
3. 在 public/plugin.json 的 features 数组中添加配置

配置文件

编辑 public/plugin.json 可修改插件名称、描述、版本及功能配置。每个功能的 cmds 数组定义了触发指令列表。