🌺 增补 load 加载层文档

example/docs/zh-CN/components/load.md

@@ -0,0 +1,77 @@
+::: title 基础使用
+:::
+
+::: demo
+
+<template>
+  <lay-button-container>
+    <lay-button @click="loading0" type="primary">加载一</lay-button>
+    <lay-button @click="loading1" type="primary">加载二</lay-button>
+    <lay-button @click="loading2" type="primary">加载三</lay-button>
+  </lay-button-container>
+</template>
+
+<script>
+import { ref } from 'vue'
+import { layer } from "../../../../src/index.ts"
+
+export default {
+  setup() {
+    
+    const loading0 = function() {
+        layer.load(0, {time: 3000})
+    }
+
+    const loading1 = function() {
+        layer.load(1, {time: 3000})
+    }
+
+    const loading2 = function() {
+        layer.load(2, {time: 3000})
+    }
+    
+    return {
+        loading0,
+        loading1,
+        loading2
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 手动关闭
+:::
+
+::: demo
+
+<template>
+  <lay-button-container>
+    <lay-button @click="loading" type="primary">加载</lay-button>
+  </lay-button-container>
+</template>
+
+<script>
+import { ref } from 'vue'
+import { layer } from "../../../../src/index.ts"
+
+export default {
+  setup() {
+    
+    const loading = function() {
+        let id = layer.load(0)
+
+        setTimeout(() => {
+            layer.close(id)
+        },3000)
+    }
+    
+    return {
+        loading
+    }
+  }
+}
+</script>
+
+:::

example/docs/zh-CN/components/modal.md

@@ -72,9 +72,7 @@ export default {
 <template>
   <lay-button @click="changeVisible3" type="primary">放大缩小</lay-button>
   <lay-modal title="放大缩小" v-model="visible3" move="true" maxmin="true">
-      <div style="padding:10px">
       该弹窗支持放大缩小
-      </div>
   </lay-modal>
 </template>
 
@@ -107,9 +105,7 @@ export default {
 <template>
   <lay-button @click="changeVisible4" type="primary">指定位置</lay-button>
   <lay-modal title="指定位置" v-model="visible4" move="true" :offset="['100px','100px']">
-      <div style="padding:10px">
       指定弹窗显示的默认位置
-      </div>
   </lay-modal>
 </template>
 
@@ -175,9 +171,7 @@ export default {
 <template>
   <lay-button @click="changeVisible6" type="primary">定义操作</lay-button>
   <lay-modal title="定义操作" v-model="visible6" move="true" :btn="btn6">
-    <div style="padding:10px">
     定义一组弹窗操作按钮
-    </div>
   </lay-modal>
 </template>
 
@@ -215,9 +209,7 @@ export default {
 <template>
   <lay-button @click="changeVisible7" type="primary">开启遮盖</lay-button>
   <lay-modal title="开启遮盖" move="true" shade="false" v-model="visible7">
-    <div style="padding:10px">
       允许点击遮盖层关闭弹窗
-    </div>
   </lay-modal>
 </template>
 
@@ -248,9 +240,9 @@ export default {
 ::: demo
 
 <template>
-  <lay-button @click="open" type="primary">open</lay-button>
+  <lay-button @click="open" type="primary">打开</lay-button>
-  <lay-button @click="close" type="primary">close</lay-button>
+  <lay-button @click="close" type="primary">关闭</lay-button>
-  <lay-button @click="closeAll" type="primary">closeAll</lay-button>
+  <lay-button @click="closeAll" type="primary">关闭所有</lay-button>
 </template>
 
 <script>
@@ -296,9 +288,8 @@ export default {
 | move            | 允许拖拽      | `false`                    |
 | maxmin          | 最小化 最大化 | `false`                    |
 | offset          | 位置          | --                         |
-| width           | 宽            | --                         |
+| area            | 尺寸          | --                         |
-| height          | 高            | --                         |
+| v-model         | 展示 隐藏     | false                      |
-| v-model:visible | 展示 隐藏     | false                      |
 | content         | 内容          | --                         |
 | shade           | 开启遮盖      | --                         |
 | shadeClose      | 遮盖点击关闭  | --                         |

example/src/router/zh-CN.ts

@@ -262,6 +262,10 @@ const zhCN = [
             path: '/zh-CN/components/modal',
             component: () => import('../../docs/zh-CN/components/modal.md'),
             meta: { title: '弹层' },
+          },{
+            path: '/zh-CN/components/load',
+            component: () => import('../../docs/zh-CN/components/load.md'),
+            meta: { title: '加载' },
           },
         ],
       },

example/src/view/component.vue

@@ -334,9 +334,14 @@ export default {
         children: [
           {
             id: 90,
-            title: '弹层',
+            title: '模态窗',
             subTitle: 'modal',
             path: '/zh-CN/components/modal',
+          },          {
+            id: 90,
+            title: '加载层',
+            subTitle: 'modal',
+            path: '/zh-CN/components/load',
           },
         ],
       },

example/src/view/hooks.vue

@@ -81,27 +81,27 @@ export default {
             path: '/zh-CN/hooks/useClickOutside',
           },
           {
-            id: 3,
+            id: 2,
             title: '拖拽',
             subTitle: 'useMove',
             path: '/zh-CN/hooks/useMove',
-          },
-          {
-            id: 2,
-            title: '全屏',
-            subTitle: 'useFullScreen',
-            path: '/zh-CN/hooks/useFullScreen',
           },{
             id: 3,
-            title: '状态',
-            subTitle: 'useState',
-            path: '/zh-CN/hooks/useState',
-          },{
-            id: 4,
             title: '布尔',
             subTitle: 'useBoolean',
             path: '/zh-CN/hooks/useBoolean',
+          },{
+            id: 4,
+            title: '状态',
+            subTitle: 'useState',
+            path: '/zh-CN/hooks/useState',
           },
+          {
+            id: 5,
+            title: '全屏',
+            subTitle: 'useFullScreen',
+            path: '/zh-CN/hooks/useFullScreen',
+          }
         ],
       },
     ]

package.json

@@ -30,14 +30,14 @@
   "peerDependencies": {
     "vue": "^3.2.23",
     "vue-router": "^4.0.12",
-    "@layui/layer-vue": "^1.0.6",
+    "@layui/layer-vue": "^1.0.7",
     "@layui/icons-vue": "^1.0.0",
     "@layui/hooks-vue": "^0.1.6"
   },
   "dependencies": {
     "vue": "^3.2.23",
     "vue-router": "^4.0.12",
-    "@layui/layer-vue": "^1.0.6",
+    "@layui/layer-vue": "^1.0.7",
     "@layui/icons-vue": "^1.0.0",
     "@layui/hooks-vue": "^0.1.6"
   },