Browse Source

feat: add Error component doucment

陈凯龙 3 years ago
parent
commit
5ff2ea5f70

+ 5 - 1
.vitepress/config.js

@@ -196,7 +196,11 @@ function createSidebar() {
           {
             text: 'Infotip 信息提示组件',
             link: '/components/infotip',
-          }
+          },
+          {
+            text: 'Error 缺省组件',
+            link: '/components/error',
+          },
         ],
       },
       {

+ 2 - 0
components/count-to.md

@@ -2,6 +2,8 @@
 
 基于 `vue-count-to` 改造
 
+CountTo 组件位于 [src/components/CountTo](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/CountTo) 内
+
 ## 用法
 
 更复杂点的例子,请[在线预览](https://element-plus-admin.cn/#/components/count-to)

+ 2 - 0
components/descriptions.md

@@ -2,6 +2,8 @@
 
 对 `element-plus` 的 `Descriptions` 组件进行封装。
 
+Descriptions 组件位于 [src/components/Descriptions](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Descriptions) 内
+
 ## 用法
 
 更复杂点的例子,请[在线预览](https://element-plus-admin.cn/#/components/descriptions)

+ 2 - 0
components/dialog.md

@@ -2,6 +2,8 @@
 
 对 `element-plus` 的 `Dialog` 组件进行封装。
 
+Dialog 组件位于 [src/components/Dialog](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Dialog) 内
+
 ## 用法
 
 ```vue

+ 2 - 0
components/echart.md

@@ -2,6 +2,8 @@
 
 对 `echarts` 进行封装,自适应窗口大小。
 
+Echart 组件位于 [src/components/Echart](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Echart) 内
+
 ## 用法
 
 只需传入对应的 `options` 和 `height` 即可展示图表。

+ 2 - 0
components/editor.md

@@ -6,6 +6,8 @@
 
 可自行阅读 [wangeditor文档](https://www.wangeditor.com/v5/)
 
+Editor 组件位于 [src/components/Editor](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Editor) 内
+
 ## 用法
 
 ```vue

+ 36 - 0
components/error.md

@@ -0,0 +1,36 @@
+# Error 缺省组件
+
+用于各种占位图组件,如 `404`、`403`、`500` 等错误页面。
+
+Error 组件位于 [src/components/Error](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Error) 内
+
+## 用法
+
+```vue
+<script setup lang="ts">
+import { Error } from '@/components/Error'
+</script>
+
+<template>
+  <Error />
+</template>
+
+```
+
+## Error 属性
+
+| 属性 | 说明 | 类型 | 可选值 | 默认值 |
+| ---- | ---- | ---- | ---- | ---- |
+| type | 占位图类型 | `string` | - | 404 |
+
+## Error 事件
+
+| 方法名 | 说明 | 回调参数 |
+| ---- | ---- | ---- |
+| errorClick | 点击按钮后的回调 | - |
+
+## 如何扩展新类型
+
+目前只提供了 `404`、`403`、`500` 三种类型,如果不满足实际需求,可自行扩展。
+
+只需在 [src/components/Error/src/Error.vue](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Error/src/Error.vue) 文件的 `errorMap` 对象扩展对应类型即可。

+ 2 - 0
components/highlight.md

@@ -1,5 +1,7 @@
 # Highlight 高亮组件
 
+Highlight 组件位于 [src/components/Highlight](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Highlight) 内
+
 ## 用法
 
 组件只能接收纯文本。

+ 2 - 0
components/image-viewer.md

@@ -2,6 +2,8 @@
 
 将 `element-plus` 的 `ImageViewer` 组件函数化,通过函数方便创建组件。
 
+ImageViewer 组件位于 [src/components/ImageViewer](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/ImageViewer) 内
+
 ## 用法
 
 ```vue

+ 2 - 0
components/infotip.md

@@ -2,6 +2,8 @@
 
 基于 `Highlight` 组件封装。
 
+Infotip 组件位于 [src/components/Infotip](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Infotip) 内
+
 ## 用法
 
 ```vue

+ 2 - 0
components/qrcode.md

@@ -2,6 +2,8 @@
 
 基于 `qrcode` 封装。
 
+Qrcode 组件位于 [src/components/Qrcode](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Qrcode) 内
+
 ## 用法
 
 更复杂点的例子,请[在线预览](https://element-plus-admin.cn/#/components/qrcode)

+ 2 - 0
components/search.md

@@ -2,6 +2,8 @@
 
 基于 `Form` 组件封装,支持收缩展开。
 
+Search 组件位于 [src/components/Search](https://github.com/kailong321200875/vue-element-plus-admin/tree/master/src/components/Search) 内
+
 ## 用法
 
 更复杂例子,请[在线预览](https://element-plus-admin.cn/#/components/search)

+ 5 - 6
guide/introduction.md

@@ -36,18 +36,16 @@
 ├── mock # 自定义 mock 数据及配置
 ├── public # 静态资源
 ├── src # 项目代码
+│   ├── api # api接口管理
 │   ├── assets # 静态资源
-│   ├── axios-config # axios配置
 │   ├── components # 公用组件
-│   ├── directive # 自定义指令
 │   ├── hooks # 常用hooks
 │   ├── layout # 布局组件
+│   ├── locales # 语言文件
 │   ├── plugins # 外部插件
-│   ├── mock # 模拟数据
 │   ├── router # 路由配置
 │   ├── store # 状态管理
 │   ├── styles # 全局样式
-│   ├── types # 全局类型
 │   ├── utils # 全局工具类
 │   ├── views # 路由页面
 │   ├── App.vue # 入口vue文件
@@ -56,6 +54,7 @@
 ├── types # 全局类型
 ├── .env.base # 本地开发环境 环境变量配置
 ├── .env.dev # 打包到开发环境 环境变量配置
+├── .env.gitee # 针对 gitee 的环境变量 可忽略
 ├── .env.pro # 打包到生产环境 环境变量配置
 ├── .env.test # 打包到测试环境 环境变量配置
 ├── .eslintignore # eslint 跳过检测配置
@@ -63,8 +62,8 @@
 ├── .gitignore # git 跳过配置
 ├── .prettierignore # prettier 跳过检测配置
 ├── .stylelintignore # stylelint 跳过检测配置
-├── CHANGELOG.en.md # 英文更新记录
-├── CHANGELOG.zh_CN.md # 中文更新记录
+├── .versionrc 自动生成版本号及更新记录配置
+├── CHANGELOG.md # 更新记录
 ├── commitlint.config.js # git commit 提交规范配置
 ├── index.html # 入口页面
 ├── package.json