{"_id":"c-admin-kit","_rev":"3-5096b1ae264558463fa9fff99d6e099a","name":"c-admin-kit","dist-tags":{"latest":"1.0.2"},"versions":{"1.0.0":{"name":"c-admin-kit","version":"1.0.0","keywords":["vue3","element-plus","components","table","search-box","crud","admin","hooks"],"author":{"name":"wllcyg"},"license":"MIT","_id":"c-admin-kit@1.0.0","maintainers":[{"name":"wllcyg001","email":"wllcyg163@gmail.com"}],"homepage":"https://github.com/wllcyg/admin-kit#readme","bugs":{"url":"https://github.com/wllcyg/admin-kit/issues"},"dist":{"shasum":"52af236242a46e34e5b8587e1766fda979b6bedf","tarball":"https://registry.npmjs.org/c-admin-kit/-/c-admin-kit-1.0.0.tgz","fileCount":56,"integrity":"sha512-qViQS5zqId9tzvnBYtKauI54GZv5sI0aFaDnqiS0KrxqHAx593pCGNy1J7bLbPBWHyEivuQS2gcJmjnll/n62g==","signatures":[{"sig":"MEYCIQC1S6xHj5ddVfXHMAb71gI2pFMLAbXRW62OjBwRrBLIawIhAIZxdedJ1d+K3JH2qesdxs3Pzt64jT6w6QkU31eQ33qD","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":304189},"main":"./dist/c-admin-kit.umd.cjs","type":"module","_from":"file:c-admin-kit-1.0.0.tgz","style":"./dist/c-admin-kit.css","types":"./dist/index.d.ts","module":"./dist/c-admin-kit.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/c-admin-kit.js","require":"./dist/c-admin-kit.umd.cjs"},"./hooks":{"types":"./dist/composables/index.d.ts","import":"./src/composables/index.ts"},"./utils":{"types":"./dist/utils/index.d.ts","import":"./src/utils/index.ts"},"./components":{"types":"./dist/components/index.d.ts","import":"./src/components/index.ts"},"./composables":{"types":"./dist/composables/index.d.ts","import":"./src/composables/index.ts"},"./dist/c-admin-kit.css":"./dist/c-admin-kit.css"},"scripts":{"build":"vue-tsc --noEmit && vite build","typecheck":"vue-tsc --noEmit"},"_npmUser":{"name":"wllcyg001","email":"wllcyg163@gmail.com"},"_resolved":"C:\\Users\\ADMINI~1\\AppData\\Local\\Temp\\2b70a2d61eb2fefd88d81b24ad1c9e72\\c-admin-kit-1.0.0.tgz","_integrity":"sha512-qViQS5zqId9tzvnBYtKauI54GZv5sI0aFaDnqiS0KrxqHAx593pCGNy1J7bLbPBWHyEivuQS2gcJmjnll/n62g==","repository":{"url":"git+https://github.com/wllcyg/admin-kit.git","type":"git"},"_npmVersion":"11.6.0","description":"基于 Vue 3 + Element Plus 的中后台企业级高阶通用组件与 Hooks 套件（强制使用 c- 前缀）","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"24.9.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0 || ^6.0.0","dayjs":"^1.11.23","vue-tsc":"^3.3.11","sortablejs":"^1.15.7","typescript":"^5.7.3","@types/node":"^26.6.2","element-plus":"^2.14.6","vite-plugin-dts":"^5.1.1","@types/sortablejs":"^1.15.9","@vitejs/plugin-vue":"^5.0.0","@element-plus/icons-vue":"^2.3.2"},"peerDependencies":{"vue":"^3.3.0","dayjs":"^1.11.0","sortablejs":"^1.15.0","element-plus":"^2.3.0","@element-plus/icons-vue":"^2.0.0"},"_npmOperationalInternal":{"tmp":"tmp/c-admin-kit_1.0.0_1790142338539_0.2853601497950924","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"c-admin-kit","version":"1.0.1","keywords":["vue3","element-plus","components","table","search-box","crud","admin","hooks"],"author":{"name":"wllcyg"},"license":"MIT","_id":"c-admin-kit@1.0.1","maintainers":[{"name":"wllcyg001","email":"wllcyg163@gmail.com"}],"homepage":"https://github.com/wllcyg/admin-kit#readme","bugs":{"url":"https://github.com/wllcyg/admin-kit/issues"},"dist":{"shasum":"5bc1b3166ec6d253c4012d9e13d57ca2323bae2c","tarball":"https://registry.npmjs.org/c-admin-kit/-/c-admin-kit-1.0.1.tgz","fileCount":58,"integrity":"sha512-N2AIOnKMXMR7qWwHyxXua/d7dfpJdgA7B0jiHVNYBTSvOmkSjPrXcsKxIKvyOGrdp4nD1ZgYc8QlphUlQ4eFsw==","signatures":[{"sig":"MEQCIGzo1EMfAFtAFswN3DhL8gCPF3n8mUJmdg0eHN+gkwCAAiAE0u356IbdEdIcee414Ji/OF0DZzE2K/qtEeIGHJPoLg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"sig":"MEUCIEFyFRSozPK7fZDb/dbE8rPPnjN6eACmVhyamz1VSyDzAiEA6aAmhBpxiIjN6py2T+WmWCYjiZc2vmgfkuhGGqZqWeU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":318300},"main":"./dist/c-admin-kit.umd.cjs","type":"module","_from":"file:c-admin-kit-1.0.1.tgz","style":"./dist/c-admin-kit.css","types":"./dist/index.d.ts","module":"./dist/c-admin-kit.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/c-admin-kit.js","require":"./dist/c-admin-kit.umd.cjs"},"./hooks":{"types":"./dist/composables/index.d.ts","import":"./src/composables/index.ts"},"./utils":{"types":"./dist/utils/index.d.ts","import":"./src/utils/index.ts"},"./components":{"types":"./dist/components/index.d.ts","import":"./src/components/index.ts"},"./composables":{"types":"./dist/composables/index.d.ts","import":"./src/composables/index.ts"},"./dist/c-admin-kit.css":"./dist/c-admin-kit.css"},"scripts":{"build":"vue-tsc --noEmit && vite build","typecheck":"vue-tsc --noEmit"},"_npmUser":{"name":"wllcyg001","email":"wllcyg163@gmail.com"},"_resolved":"C:\\Users\\ADMINI~1\\AppData\\Local\\Temp\\1f6291ad23ba501651998ef4cd3630c0\\c-admin-kit-1.0.1.tgz","_integrity":"sha512-N2AIOnKMXMR7qWwHyxXua/d7dfpJdgA7B0jiHVNYBTSvOmkSjPrXcsKxIKvyOGrdp4nD1ZgYc8QlphUlQ4eFsw==","repository":{"url":"git+https://github.com/wllcyg/admin-kit.git","type":"git"},"_npmVersion":"11.6.0","description":"基于 Vue 3 + Element Plus 的中后台企业级高阶通用组件与 Hooks 套件（强制使用 c- 前缀）","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"24.9.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0 || ^6.0.0","dayjs":"^1.11.23","vue-tsc":"^3.3.11","sortablejs":"^1.15.7","typescript":"^5.7.3","@types/node":"^26.6.2","element-plus":"^2.14.6","vite-plugin-dts":"^5.1.1","@types/sortablejs":"^1.15.9","@vitejs/plugin-vue":"^5.0.0","@element-plus/icons-vue":"^2.3.2"},"peerDependencies":{"vue":"^3.3.0","dayjs":"^1.11.0","sortablejs":"^1.15.0","element-plus":"^2.3.0","@element-plus/icons-vue":"^2.0.0"},"_npmOperationalInternal":{"tmp":"tmp/c-admin-kit_1.0.1_1790143466682_0.5129692090384719","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"_id":"c-admin-kit@1.0.2","bugs":{"url":"https://github.com/wllcyg/admin-kit/issues"},"dist":{"shasum":"c72183c33750d13ab90bab581d2e55fc01837b71","tarball":"https://registry.npmjs.org/c-admin-kit/-/c-admin-kit-1.0.2.tgz","fileCount":58,"integrity":"sha512-uqJJ6AIsZ2veT9p2+3zKgtmLzYK/iu0H8nRo2kuBASOPCv2NN7lu3YKfVyBjPlKF/nnqAoBDbTe9CvB+Jcj9XA==","signatures":[{"sig":"MEQCIB2x+1NBMGD00X3OQ8lFzEbscVYEY/FfxvCGbIedJGSwAiBph9y/CFaHkrTIzAfAJdyv8DAcAP9Pg/RRsq5knTbWCA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIE5epRbpX4nVUa1j0r81Ra5rLz8S1DQa4V8oIbznOvBaAiEAkTJ005KKBeu1Q5490g3eE0XHFDdTucpAty+yQM9pBNE="}],"unpackedSize":319845},"main":"./dist/c-admin-kit.umd.cjs","name":"c-admin-kit","type":"module","_from":"file:c-admin-kit-1.0.2.tgz","style":"./dist/c-admin-kit.css","types":"./dist/index.d.ts","author":{"name":"wllcyg"},"module":"./dist/c-admin-kit.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/c-admin-kit.js","require":"./dist/c-admin-kit.umd.cjs"},"./hooks":{"types":"./dist/composables/index.d.ts","import":"./src/composables/index.ts"},"./utils":{"types":"./dist/utils/index.d.ts","import":"./src/utils/index.ts"},"./components":{"types":"./dist/components/index.d.ts","import":"./src/components/index.ts"},"./composables":{"types":"./dist/composables/index.d.ts","import":"./src/composables/index.ts"},"./dist/c-admin-kit.css":"./dist/c-admin-kit.css"},"license":"MIT","scripts":{"build":"vue-tsc --noEmit && vite build","typecheck":"vue-tsc --noEmit","dev:playground":"npm --prefix playground run dev","build:playground":"npm --prefix playground run build","preview:playground":"npm --prefix playground run preview"},"version":"1.0.2","_npmUser":{"name":"wllcyg001","email":"wllcyg163@gmail.com"},"homepage":"https://github.com/wllcyg/admin-kit#readme","keywords":["vue3","element-plus","components","table","search-box","crud","admin","hooks"],"_resolved":"C:\\Users\\ADMINI~1\\AppData\\Local\\Temp\\376eec3c91a3460ab9a83d1b14f88a31\\c-admin-kit-1.0.2.tgz","_integrity":"sha512-uqJJ6AIsZ2veT9p2+3zKgtmLzYK/iu0H8nRo2kuBASOPCv2NN7lu3YKfVyBjPlKF/nnqAoBDbTe9CvB+Jcj9XA==","repository":{"url":"git+https://github.com/wllcyg/admin-kit.git","type":"git"},"_npmVersion":"11.6.0","description":"基于 Vue 3 + Element Plus 的中后台企业级高阶通用组件与 Hooks 套件（强制使用 c- 前缀）","directories":{},"maintainers":[{"name":"wllcyg001","email":"wllcyg163@gmail.com"}],"sideEffects":["**/*.css"],"_nodeVersion":"24.9.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0 || ^6.0.0","dayjs":"^1.11.23","vue-tsc":"^3.3.11","sortablejs":"^1.15.7","typescript":"^5.7.3","@types/node":"^26.6.2","element-plus":"^2.14.6","vite-plugin-dts":"^5.1.1","@types/sortablejs":"^1.15.9","@vitejs/plugin-vue":"^5.0.0","@element-plus/icons-vue":"^2.3.2"},"peerDependencies":{"vue":"^3.3.0","dayjs":"^1.11.0","sortablejs":"^1.15.0","element-plus":"^2.3.0","@element-plus/icons-vue":"^2.0.0"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/c-admin-kit_1.0.2_1790147147630_0.9678682983546998"}}},"time":{"created":"2026-09-23T05:45:38.468Z","modified":"2026-09-23T07:05:47.945Z","1.0.0":"2026-09-23T05:45:38.692Z","1.0.1":"2026-09-23T06:04:26.779Z","1.0.2":"2026-09-23T07:05:47.732Z"},"bugs":{"url":"https://github.com/wllcyg/admin-kit/issues"},"author":{"name":"wllcyg"},"license":"MIT","homepage":"https://github.com/wllcyg/admin-kit#readme","keywords":["vue3","element-plus","components","table","search-box","crud","admin","hooks"],"repository":{"url":"git+https://github.com/wllcyg/admin-kit.git","type":"git"},"description":"基于 Vue 3 + Element Plus 的中后台企业级高阶通用组件与 Hooks 套件（强制使用 c- 前缀）","maintainers":[{"name":"wllcyg001","email":"wllcyg163@gmail.com"}],"readme":"# C-Admin-Kit\n\n<p align=\"center\">\n  <img src=\"https://img.shields.io/npm/v/c-admin-kit?color=409EFF&label=npm\" alt=\"npm version\" />\n  <img src=\"https://img.shields.io/npm/dm/c-admin-kit?color=67C23A&label=downloads\" alt=\"downloads\" />\n  <img src=\"https://img.shields.io/badge/Vue-3.3+-42b883?logo=vue.js\" alt=\"vue\" />\n  <img src=\"https://img.shields.io/badge/Element--Plus-2.3+-409EFF?logo=element\" alt=\"element-plus\" />\n  <img src=\"https://img.shields.io/badge/TypeScript-100%25-3178c6?logo=typescript\" alt=\"typescript\" />\n  <img src=\"https://img.shields.io/badge/license-MIT-blue.svg\" alt=\"license\" />\n</p>\n\n`c-admin-kit` 是一套专为企业级中后台打造的高阶通用组件与 Hooks 套件。基于 **Vue 3 + Element Plus + TypeScript** 构建，提供成熟的标准 CRUD 流程封装、配置化高级表格、多条件搜索工厂、异步防重按钮、平滑拖拽分栏及常用树形数据工具函数。\n\n> 🌐 **在线预览与交互演练场**：[https://admin-kit.cheatppf.xyz](https://admin-kit.cheatppf.xyz)  \n> 📌 **团队规范约束**：为彻底避免多工程复用时的组件同名冲突，所有组件**统一且固定强制使用 `c-` / `C` 前缀**（如 `<c-simple-table>`、`<c-search-box>`），开箱即用，代码风格统一。\n\n---\n\n## ✨ 核心特性\n\n- 🛡️ **100% TypeScript**：源码全量 TS 编写，严格类型定义，类型提示精确到组件 Props、Emits、Slots 及 Hook 泛型。\n- ⚡ **轻量纯净**：以 `peerDependencies` 消费宿主环境的 `vue`、`element-plus`，打包体积仅几十 KB，无多余冗余包，完美继承宿主主题变量。\n- 🎯 **开箱即用**：自带企业级增删改查最佳实践，配合 `useListPage` 与 `SearchFieldFactory`，10 余行代码即可完成完整页面。\n- 🌲 **Tree-Shaking**：支持全量安装与细粒度子路径按需导入，生产构建零多余冗余代码。\n\n---\n\n## 📥 安装\n\n在您的 Vue 3 + Element Plus 工程中执行：\n\n```bash\n# 推荐使用 pnpm\npnpm add c-admin-kit\n\n# 或者 npm / yarn\nnpm install c-admin-kit\nyarn add c-admin-kit\n```\n\n> ⚠️ **前置依赖**：请确保项目已安装 `vue (>= 3.3.0)` 与 `element-plus (>= 2.3.0)`。\n\n---\n\n## 🚀 快速上手\n\n### 1. 全局完整引入 (`main.ts` / `main.js`)\n\n```typescript\nimport { createApp } from 'vue'\nimport ElementPlus from 'element-plus'\nimport 'element-plus/dist/index.css'\n\nimport CAdminKit from 'c-admin-kit'\nimport 'c-admin-kit/dist/c-admin-kit.css'\n\nimport App from './App.vue'\n\nconst app = createApp(App)\napp.use(ElementPlus)\napp.use(CAdminKit) // 自动全局注册所有 c- 开头组件\napp.mount('#app')\n```\n\n### 2. 按需局部引入 (推荐)\n\n组件与 Hooks 均支持解构引入或子路径导入：\n\n```vue\n<template>\n  <c-search-box :fields=\"searchFields\" @search=\"handleSearch\" @reset=\"handleReset\" />\n  <c-simple-table ref=\"tableRef\" :api=\"getUserListApi\" :columns=\"columns\" auto-height />\n</template>\n\n<script setup lang=\"ts\">\nimport { CSearchBox, CSimpleTable, SearchFieldFactory, useListPage } from 'c-admin-kit'\nimport 'c-admin-kit/dist/c-admin-kit.css'\n\n// 亦支持按子路径引用：\n// import { CSimpleTable } from 'c-admin-kit/components'\n// import { useListPage } from 'c-admin-kit/composables'\n// import { SearchFieldFactory } from 'c-admin-kit/utils'\n</script>\n```\n\n---\n\n## 典型用法：标准 CRUD 页面\n\n结合 `SearchFieldFactory`、`useListPage`、`CSearchBox` 与 `CSimpleTable` 快速构建后台列表页：\n\n```vue\n<template>\n  <div class=\"page-container\">\n    <!-- 1. 结构化搜索栏 -->\n    <c-search-box\n      :fields=\"searchFields\"\n      @search=\"handleSearch\"\n      @reset=\"handleReset\"\n    />\n\n    <!-- 2. 高阶自适应表格 -->\n    <c-simple-table\n      ref=\"tableRef\"\n      :api=\"getUserListApi\"\n      :columns=\"columns\"\n      table-key=\"user_management_table\"\n      auto-height\n    >\n      <!-- 头部操作区 -->\n      <template #headerLeft>\n        <el-button type=\"primary\" @click=\"handleAdd\">新增用户</el-button>\n        <el-button type=\"danger\" @click=\"handleBatchDelete\">批量删除</el-button>\n      </template>\n\n      <!-- 操作列插槽 -->\n      <template #actions=\"{ row }\">\n        <el-button link type=\"primary\" @click=\"handleEdit(row)\">编辑</el-button>\n        <el-button link type=\"danger\" @click=\"handleDelete(row)\">删除</el-button>\n      </template>\n    </c-simple-table>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport {\n  CSearchBox,\n  CSimpleTable,\n  SearchFieldFactory,\n  useListPage,\n  type TableColumn\n} from 'c-admin-kit'\nimport {\n  getUserListApi,\n  deleteUserApi,\n  batchDeleteUserApi,\n  changeUserStatusApi\n} from '@/api/user'\n\n// 1. 标准流程控制 Hook (集成搜索联动、分页维护、单条/批量删除、状态切换、详情/新增路由)\nconst {\n  tableRef,\n  handleSearch,\n  handleReset,\n  handleDelete,\n  handleBatchDelete,\n  handleAdd,\n  handleEdit\n} = useListPage({\n  apiList: getUserListApi,\n  apiDelete: deleteUserApi,\n  apiBatchDelete: batchDeleteUserApi,\n  apiChangeState: changeUserStatusApi,\n  addPath: '/user/add',\n  editPath: '/user/edit'\n})\n\n// 2. 搜索字段快速配置工厂 (支持 input、select、dateRange、cascader、级联联动等)\nconst searchFields = computed(() => [\n  SearchFieldFactory.input({ prop: 'keyword', label: '关键词' }),\n  SearchFieldFactory.select({\n    prop: 'status',\n    label: '状态',\n    options: [\n      { label: '启用', value: 1 },\n      { label: '停用', value: 0 }\n    ]\n  }),\n  SearchFieldFactory.dateRange({ prop: 'createTime', label: '创建时间' })\n])\n\n// 3. 表格列配置 (原生支持 user.name 深度路径取值、空值 '-' 占位、拖拽排序、自定义列持久化)\nconst columns: TableColumn[] = [\n  { type: 'selection' },\n  { type: 'index', label: '序号' },\n  { prop: 'username', label: '用户名' },\n  { prop: 'department.name', label: '所属部门' }, // 支持嵌套深度字段\n  { prop: 'status', label: '状态', type: 'status' },\n  { prop: 'createTime', label: '创建时间' },\n  { label: '操作', slot: 'actions', width: 150, fixed: 'right' }\n]\n</script>\n```\n\n---\n\n## 🧩 组件清单 (Components)\n\n| 组件名 | 标签名称 | 功能特性 |\n| :--- | :--- | :--- |\n| **`CSimpleTable`** | `<c-simple-table>` | **高阶企业级表格**：集成拖拽排序、列自定义显隐（本地缓存/API持久化）、动态视口全屏自适应高度、嵌套属性链式取值（`dept.name`）、空单元格占位、分页联动。 |\n| **`CSearchBox`** | `<c-search-box>` | **配置化多条件搜索栏**：响应式栅格自适应、一键展开/收起、级联下拉异步联动、回车快捷搜索、自定义插槽扩展。 |\n| **`CAsyncButton`** | `<c-async-button>` | **异步防重按钮**：自动感知 Promise / Thenable 异步任务并开启 loading，阻断连续点击，结束自动恢复。 |\n| **`CCollapsibleContainer`** | `<c-collapsible-container>` | **左右双栏拖拽折叠布局**：支持鼠标拖拽分隔线缩放面板宽度（消除了微动效冲突，拖拽丝滑），支持一键折叠收起。 |\n| **`CCustomDrawer`** | `<c-custom-drawer>` | **标准化企业级抽屉**：统一底部确定/取消操作栏，内置确定按钮 `confirmLoading` 状态与 `computed` 双向绑定。 |\n| **`CImagePreview`** | `<c-image-preview>` | **缩略图与大图预览**：支持单图 URL、逗号分隔多图字符串及数组入参，内置安全容错清洗与缩略图悬浮动效。 |\n| **`CDiff`** | `<c-diff>` | **文本代码 Diff 视图**：纯前端实现基于编辑距离与相似度的字符级与行级差异可视化高亮。 |\n| **`CSelectWithAll`** | `<c-select-with-all>` | **全选下拉选择器**：支持一键全选/全不选、半选状态判断及防抖远程搜索。 |\n| **`CSelectWithPage`**| `<c-select-with-page>`| **大数据分页下拉**：支持自定义键值字段、关键词远程搜索与海量选项分页加载。 |\n\n---\n\n## 🛠️ 组合式函数 (Composables / Hooks)\n\n### 1. `useListPage` (标准列表页流程控制)\n管理列表搜索、刷新、分页、状态切换、单条/批量删除及路由跳转：\n```typescript\nconst {\n  tableRef,\n  searchParams,\n  handleSearch,\n  handleReset,\n  handleDelete,\n  handleBatchDelete,\n  changeState,\n  exportExcel\n} = useListPage({\n  apiList: getListApi,\n  apiDelete: deleteApi,\n  apiBatchDelete: batchDeleteApi, // 可选独立批量删除接口\n  apiChangeState: updateStatusApi,\n  apiExport: exportApi\n})\n```\n\n### 2. `useForm` (表单状态与提交流程)\n封装表单数据响应式模型、自动校验拦截与提交状态：\n```typescript\nconst { formRef, formData, loading, submit, reset, setFormData } = useForm({\n  initFormData: { name: '', roleId: null }\n})\n\n// 提交时自动触发 form.validate()，校验失败自动提示并阻断，成功触发 loading 并调用 API\nawait submit(async (data) => await saveApi(data), '保存成功')\n```\n\n### 3. `useDownload` (安全文件导出与下载)\n安全导出二进制文件，导出 `downloading` 响应式状态，自动从响应头提取文件名：\n```typescript\nconst { download, downloading } = useDownload(exportApi, {\n  filename: '用户报表'\n})\n\n// 外部按钮可直接绑定 loading\n// <el-button :loading=\"downloading\" @click=\"download({ deptId: 1 })\">导出</el-button>\n```\n\n### 4. `useConfirmAction` & `useConfirmSubmit` (操作二次确认)\n消除重复的 `ElMessageBox.confirm` 模板代码：\n```typescript\nconst handleRemove = useConfirmSubmit(\n  async (id) => await deleteApi(id),\n  () => tableRef.value.refresh(),\n  { message: '确定要永久删除该记录吗？' }\n)\n```\n\n### 5. `useDialog` (弹窗显隐与上下文传递)\n优雅管理模态弹窗的开启、关闭与行数据传递：\n```typescript\nconst { visible, dialogData, openDialog, closeDialog } = useDialog()\n```\n\n---\n\n## 🧰 实用工具库 (Utils)\n\n### 1. `SearchFieldFactory` (搜索字段工厂)\n规范化、声明式生成搜索栏配置：\n```typescript\nimport { SearchFieldFactory, CommonSearchFields } from 'c-admin-kit'\n\nconst fields = [\n  SearchFieldFactory.input({ prop: 'title', label: '标题' }),\n  SearchFieldFactory.select({ prop: 'status', label: '状态', options: [...] }),\n  SearchFieldFactory.dateRange({ prop: 'createTime', label: '创建时间' }),\n  SearchFieldFactory.cascader({ prop: 'deptId', label: '部门', options: [...] }),\n  // 常用预设快捷字段\n  CommonSearchFields.keyword(),\n  CommonSearchFields.status([...])\n]\n```\n\n### 2. `treeManager` (高性能树结构处理)\n```typescript\nimport {\n  listToTree,\n  treeToList,\n  findTreeNode,\n  findParentNodes,\n  filterTree,\n  mapTree\n} from 'c-admin-kit'\n\n// 1. 扁平数组一键转树 (时间复杂度 O(n) Hash Map 算法)\nconst tree = listToTree(flatList, { id: 'id', pid: 'parentId', children: 'children' })\n\n// 2. 根据节点 ID 查找包含自身和所有上级父节点的完整链条\nconst parentNodes = findParentNodes(tree, targetId)\n\n// 3. 树结构过滤（保留命中节点及其祖先链路）\nconst filteredTree = filterTree(tree, (node) => node.name.includes('技术部'))\n```\n\n---\n\n## 🎮 Playground 交互演练台\n\n> 🔗 **线上演示地址**：[https://admin-kit.cheatppf.xyz](https://admin-kit.cheatppf.xyz)\n\n本项目包含同仓物理隔离的独立演练工程 `playground/`，**100% 消费并运行 NPM 官方已发布的真实 `c-admin-kit` 远端包与产物**，包含 6 大核心场景 Demo（CRUD 页面、左右拖拽容器、文本代码比对、抽屉组件、增强选择器、树算法测试台）：\n\n```bash\n# 启动本地演练场（真实加载 npm 已发布的 c-admin-kit）\npnpm run dev:playground\n\n# 打包纯静态 SPA 站点（输出至 playground/dist/）\npnpm run build:playground\n\n# 本地快速预览打包产物\npnpm run preview:playground\n```\n\n### 🚀 部署至 Cloudflare Pages 步骤：\n1. 登录 Cloudflare 控制台，进入 **Workers & Pages** -> **Create application** -> **Pages** -> **Connect to Git**；\n2. 选择本仓库，配置构建设置：\n   - **Root directory**: `playground`\n   - **Framework preset**: `Vite`\n   - **Build command**: `pnpm run build`\n   - **Build output directory**: `dist`\n3. 点击 **Save and Deploy**，即可自动从 NPM 官方拉取最新发布的 `c-admin-kit` 并部署为全球 CDN 静态网页。\n\n---\n\n## 📄 授权协议\n\n[MIT License](file:///e:/售后项目/admin-kit/LICENSE) © 2026 [wllcyg](https://github.com/wllcyg)\n","readmeFilename":"README.md"}