feat(template): 完善template文档 (#840)

* feat(template): 完善template文档

* feat(template): 完善文档

* fix(template): 去掉多余空格

* feat(template): 使用具有语义的图片名称

packages/plugins/template/readme.md

@@ -1,3 +1,93 @@
-## TODO
-- 优化
-- 完善文档
+# 模板管理
+功能如下：
+1. 模板类别和模板的增删改查；
+2. 模板搜索；
+3. 3 种可直接使用的模板：基础表单、landing页、中后台管理系统模板；
+4. 基于模板生成页面。
+
+## 模板类别和模板
+
+### 入口
+在左侧工具栏点击“模板管理”图标，进入模板管理页面。
+
+
+![alt text](./assets/entrance.png)
+![alt text](./assets/management-overview.png)
+
+### 模板类别和模板的CRUD
+**新增**
+
+有两种方式新增：
+1. 点击顶部“新增”图标，选择新增类型，输入名称以及选择所属父类别，即可完成新增。
+
+![alt text](./assets/top-add.png)
+2. 在左侧树结构中，点击某一模板类别右侧的操作图标（齿轮图标），点击“新增”选项，进入操作页，所属父类别会自动填充，其余同1方式。
+
+![alt text](./assets/tree-right-add.png)
+
+**修改**
+
+点击某一模板类别或模板的操作图标，点击“编辑”选项，进入操作页，修改名称以及所属父类别，点击“保存”按钮，完成修改。
+
+![alt text](./assets/edit.png)
+
+**删除**
+
+点击某一模板类别或模板的操作图标，点击“删除”选项，完成删除。
+1. 会有弹窗提示是否确认删除；
+
+![alt text](./assets/delete.png)
+2. “全部类别”不允许删除，没有删除按钮；
+
+3. 具有子类别或模板时，提示不能删除。
+
+![alt text](./assets/delete-tips.png)
+
+**搜索**
+
+在搜索框中输入关键词，可以搜索到名称包含该关键词的模板类别或模板。
+![alt text](./assets/search.png)
+
+## 已有模板
+
+### 表单
+支持三种常用表单类型：
+1. 行内表单，可用于查询、搜索等场景；
+
+![alt text](./assets/inline-form-entrance.png)
+![alt text](./assets/inline-form-overview.png)
+2. 基础表单，可用于表单提交、信息展示等场景；
+
+![alt text](./assets/basic-form-entrance.png)
+![alt text](./assets/basic-form-overview.png)
+3. 垂直表单，可用于表单提交、信息展示等场景。
+
+![alt text](./assets/vertical-form-entrance.png)
+![alt text](./assets/vertical-form-overview.png)
+
+### landing页
+使用现代流行的设计风格，可用于官网展示、营销、产品介绍等场景。
+
+![alt text](./assets/landing-entrance.png)
+![alt text](./assets/landing-overview.png)
+![alt text](./assets/landing-overview-2.png)
+### 中后台管理系统
+包含数据统计、图表展示等组件，可用于中后台管理系统。
+
+![alt text](./assets/admin-entrance.png)
+![alt text](./assets/admin-overview.png)
+
+## 基于模板生成页面
+
+### 模板管理中生成页面
+1. 点击模板右侧的操作图标，点击“生成页面”选项，生成页面。
+
+![alt text](./assets/generate-pate.png)
+2. 点击模板类别右侧的操作图标，点击“生成页面”选项，选择该类别下的模板，进行批量生成页面。
+
+![alt text](./assets/batch-generate-page.png)
+
+### 页面管理中生成页面
+新增页面时，选择模板，即可基于模板生成页面。
+
+![alt text](./assets/select-template.png)