V3 Admin Vite is a Vue 3 administrative dashboard template built with Vite, TypeScript, Element Plus, Pinia, Vue Router, and Axios. Developers use it as a starting point for creating web-based administration interfaces, and it is designed to support AI-assisted coding tools. The catalogue entries are skills, rules, and instructions for working with the template.
Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add un-pany/v3-admin-vite --skill v3-create-crudgit clone --depth 1 https://github.com/un-pany/v3-admin-viteWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/un-pany/v3-admin-vite/v3-create-crud)<a href="https://agentmods.dev/skills/un-pany/v3-admin-vite/v3-create-crud"><img src="https://agentmods.dev/badge/skills/un-pany/v3-admin-vite/v3-create-crud/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/un-pany/v3-admin-vite/v3-create-crud"><img src="https://agentmods.dev/badge/skills/un-pany/v3-admin-vite/v3-create-crud.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector pass
What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00108 | $0.03547 |
| Opus 5 | $0.00054 | $0.01774 |
| Sonnet 5 | $0.00022 | $0.00709 |
| Haiku 4.5 | $0.00011 | $0.00355 |
Grade A, and why
v3-create-crud scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 11d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 362 lines — stays where its author put it; the contents beside it link to each section on GitHub.
创建 CRUD 页面
根据用户提供的模块名称和字段信息，生成增删改查页面。
本 Skill 定义的是默认 CRUD 模式，当用户的实际需求与本 Skill 约定冲突时，以用户需求为准，灵活调整。
输入要求
用户需提供：
- 模块名称（如
product、order）— 用于目录名和命名 - 字段列表 — 每个字段需明确：
- 字段名（英文，camelCase）
- 中文标签
- 类型（string / number / boolean / enum / date 等）
- 是否必填
- 是否作为搜索条件
- 是否需要自定义渲染（如 tag 状态展示）
如果用户信息不完整，主动询问补全后再生成。
生成文件
在 src/pages/<模块路径>/ 下生成：
index.vue— 页面主文件apis/index.ts— 接口文件apis/type.ts— 类型定义
设计决策指引
生成代码时需要做出的判断（不要机械套用，根据具体场景决定）：
弹窗宽度 — 默认用 30%，有复杂布局用 50% 或更大的比例。
工具栏按钮 — 按需组合，不必全部包含：
- "新增" 几乎总是需要的
- "批量删除" 仅在有批量操作需求时添加（对应表格 selection 列）
- "下载/导出" 仅在有导出需求时添加
- "刷新当前页" 推荐保留，方便调试和手动刷新
删除确认文案 — 选择对用户最有辨识度的字段作为确认提示（如用户名、订单编号、商品名称），而不是 id。
搜索参数传递 — 保持简单，避免类型体操：
- 字段少（2-3 个）时可以逐个列出
- 字段多时用
...searchData展开更简洁 - 核心原则：不要出现
as any，除非明确要求
表单字段 vs 表格列 — 不是所有字段都同时出现在两处：
- 仅创建时需要的字段（如密码）：表单中有，表格中无
- 系统生成的字段（如创建时间）：表格中有，表单中无
- 用
v-if="formData.id === undefined"控制仅新增时显示的字段
页面结构规范
页面整体包裹在 <div class="app-container"> 中，由搜索区域、表格区域、弹窗三部分组成。
1. 搜索区域
el-card：v-loading="loading"+shadow="never"+class="search-wrapper"- 内含
el-form：ref="searchFormRef"+:inline="true"+:model="searchData" - 每个搜索字段设置
prop（resetFields依赖它）和label - 末尾放查询按钮（
:icon="Search"+type="primary"）和重置按钮（:icon="Refresh"）
2. 表格区域
el-card：v-loading="loading"+shadow="never"- 工具栏（
div.toolbar-wrapper）分左右两侧：- 左侧：文字按钮（新增、批量删除等）
- 右侧：圆形图标按钮 +
el-tooltip（下载、刷新当前页等）
- 表格（
div.table-wrapper>el-table :data="tableData"）：- 需要批量操作时加
type="selection"首列 - 数据列：
prop+label+align="center" - 操作列：
fixed="right"+ 适当width+align="center"，内含修改/删除按钮（text bg size="small"） - 操作列按钮将
scope.row传给强类型 handler 时，使用scope.row as XxxData明确行类型，避免 Element Plus 默认DefaultRow导致vue-tsc报错，不要使用as any
- 需要批量操作时加
- 分页（
div.pager-wrapper>el-pagination）
3. 弹窗
el-dialog：v-model="dialogVisible"+ 通过formData.id === undefined判断新增/修改标题 +@closed="resetForm"- 使用
@closed而非@close（确保关闭动画结束后再重置，避免用户看到表单内容闪烁） - 表单：
ref="formRef"+:model="formData"+:rules="formRules"+label-width="auto" - footer：取消按钮 + 确认按钮（
type="primary"+:loading="loading"）
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 11d ago First seen · 362 lines · 108 tokens per session scan A 7d3031b46da0
v3-create-crud is a skill published in the GitHub repository un-pany/v3-admin-vite (7,058 stars, last pushed 2mo ago), licensed MIT. It adds 108 tokens to every session and 3,547 once invoked, about $0.0005 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
admin-net-frontend
Use when building Vue 3 admin dashboard frontends with dynamic routing, permission-based menus, and CRUD page generation. Admin.NET Frontend: Vue 3 + Vite + TypeScript admin UI for Admin.NET backend.
slidev
Create and present web-based slidedecks for developers using Slidev with Markdown, Vue components, code highlighting, animations, and interactive features. Use when building technical presentations, conference talks, code walkthroughs, teaching materials, or developer decks.
native-to-weapp-vite-wevu-migration
A step-by-step guide for gradually moving native WeChat, Alipay, or Douyin mini-programs to weapp-vite, with an optional later move to Vue single-file components.
weapp-vite-vue-sfc-best-practices
A Chinese-language guide to writing Vue single-file components for weapp-vite mini-program projects. It covers templates, scripts, page metadata, component declarations, and platform differences.
vuestrata-module-organization
Use when deciding where new files belong and how module boundaries should be preserved.
vue
Vue 3 - Progressive JavaScript framework with Composition API, reactivity system, single-file components, Vite integration, TypeScript support.