# 介绍
给 template-vue2-manage 脚手架提供的模板库。
# 安装
安装 ak-snippets (opens new window) 插件:
安装 wy-vscode-kit (opens new window) 插件:
然后执行 command + shift + P 并输入 wyInitSettings
回车。
最后重启 VSCode 即可。
# 使用
在 vue 文件中创建 table 列表页面:
在 vue 文件中创建 form 表单页面:
在 vue 文件中创建 modal 弹框页面:
# 所有模板
# 页面
- ak-modal-empty - 空弹框
- ak-modal-normal - 弹框加单列表单布局
- ak-modal-complex - 弹框加两列列表单布局
- ak-drawer-empty - 空抽屉
- ak-drawer-form - 抽屉加表单布局
- ak-detail-base - 简单的详情展示
- ak-detail-common - 通用的详情展示
- ak-table-base - 简单列表
- ak-table-drag - 拖拽列表
- ak-table-middle - 中等列表
- ak-table-complex - 复杂列表
- ak-table-tabs-nav - 卡片列表
- ak-form-page-base - 页面表单结构
- ak-form-single - 单列的页面表单
- ak-form-horizontal - 单列左对齐表单
- ak-form-double - 双列的页面表单
- ak-form-normal - 三列的页面表单
- ak-form-complex - 复杂的页面表单
- ak-form-step-box - 分布表单容器
- ak-form-step1 - 分布表单 - 第一步
- ak-form-step2 - 分布表单 - 第二步
- ak-form-step3 - 分布表单 - 第三步
- ak-page-default - 空白页面
# 布局
- ak-layout-query-filter1 - 单行筛选项布局 - 简单
- ak-layout-query-filter2 - 单行筛选项布局 - 带展开收起
- ak-layout-card-row1 - 卡片和两行栅格标签
- ak-layout-card-row2 - 多行栅格标签和操作
- ak-layout-card-steps - 卡片和进度条
# 组件
- ak-form-input - a-form-item + a-input
- ak-form-textarea - a-form-item + a-textarea
- ak-form-input-number - a-form-item + a-input-number
- ak-form-select - a-form-item + a-select
- ak-form-switch - a-form-item + a-switch
- ak-form-radio - a-form-item + a-radio
- ak-form-checkbox - a-form-item + a-checkbox
- ak-form-upload - a-form-item + a-upload
- ak-form-date-picker - a-form-item + a-date-picker
- ak-form-range-picker - a-form-item + a-range-picker
- ak-form-cascader - a-form-item + a-cascader
- ak-form-model-base - a-form-item + a-model-base
布局和页面可以跟页面搭配使用,更多方式等你来发现~