更新文档

docs/docs/zh-CN/components/badge.md

@@ -32,3 +32,8 @@ export default {
 </script>
 
 :::
+
+|  |  |  |
+|--|--|--|
+| type | 类型 | `dot` `rim` |
+| theme| 主题 | `orange` `green` `cyan` `blue` `black` `gray`|

docs/docs/zh-CN/components/cards.md

@@ -48,3 +48,8 @@ export default {
 </script>
 
 :::
+
+|  |  |  |
+|--|--|--|
+| header | 插槽 | `内容` |
+| body | 插槽 | `内容` |

docs/docs/zh-CN/components/collapse.md

@@ -0,0 +1,23 @@
+::: demo
+
+<template>
+  <lay-collapse>
+    <lay-collapse-item title="标题"> 内容 </lay-collapse-item>
+    <lay-collapse-item title="标题"> 内容 </lay-collapse-item>
+    <lay-collapse-item title="标题"> 内容 </lay-collapse-item>
+  </lay-collapse>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+:::

docs/docs/zh-CN/components/color.md

@@ -3,25 +3,25 @@
 <template>
     <ul class="layui-row layui-col-space15">
         <li class="layui-col-sm3">
-            <div style="background-color: #009688;padding:10px;color:whitesmoke;padding-left:30px">
+            <div style="background-color: #009688;padding:10px;color:whitesmoke;padding:30px">
                 <p>#009688</p><p>
                 </p><p tips="">主色调之一</p>
             </div>
         </li>
         <li class="layui-col-sm3">
-            <div style="background-color: #5FB878;padding:10px;color:whitesmoke;padding-left:30px">
+            <div style="background-color: #5FB878;padding:10px;color:whitesmoke;padding:30px">
                 <p>#5FB878</p><p>
                 </p><p tips="">一般用于选中状态</p>
             </div>
         </li>
         <li class="layui-col-sm3">
-            <div style="background-color: #393D49;padding:10px;color:whitesmoke;padding-left:30px">
+            <div style="background-color: #393D49;padding:10px;color:whitesmoke;padding:30px">
                 <p>#393D49</p><p>
                 </p><p tips="">通常用于导航</p>
             </div>
         </li>
         <li class="layui-col-sm3">
-            <div style="background-color: #1E9FFF;padding:10px;color:whitesmoke;padding-left:30px">
+            <div style="background-color: #1E9FFF;padding:10px;color:whitesmoke;padding:30px">
                 <p>#1E9FFF</p><p>
                 </p><p tips="">经典蓝</p>
             </div>
@@ -47,25 +47,25 @@ export default {
 <template>
 <ul class="layui-row layui-col-space15">
       <li class="layui-col-sm3">
-        <div style="background-color: #FFB800;padding:10px;color:whitesmoke;padding-left:30px">
+        <div style="background-color: #FFB800;padding:10px;color:whitesmoke;padding:30px">
           <p>#FFB800</p><p>
           </p><p tips="">暖色系</p>
         </div>
       </li>
       <li class="layui-col-sm3">
-        <div style="background-color: #FF5722;padding:10px;color:whitesmoke;padding-left:30px">
+        <div style="background-color: #FF5722;padding:10px;color:whitesmoke;padding:30px">
           <p>#FF5722</p><p>
           </p><p tips="">比较引人注意的颜色</p>
         </div>
       </li>
       <li class="layui-col-sm3">
-        <div style="background-color: #01AAED;padding:10px;color:whitesmoke;padding-left:30px">
+        <div style="background-color: #01AAED;padding:10px;color:whitesmoke;padding:30px">
           <p>#01AAED</p><p>
           </p><p tips="">文本链接着色</p>
         </div>
       </li>
       <li class="layui-col-sm3">
-        <div style="background-color: #2F4056;padding:10px;color:whitesmoke;padding-left:30px">
+        <div style="background-color: #2F4056;padding:10px;color:whitesmoke;padding:30px">
           <p>#2F4056</p><p>
           </p><p tips="">侧边色</p>
         </div>

docs/docs/zh-CN/components/container.md

@@ -58,3 +58,7 @@ export default {
 </style>
 
 :::
+
+|  |  |  |
+|--|--|--|
+| fluid | 流模式 | `true` `false` |

docs/docs/zh-CN/components/grid.md

@@ -94,3 +94,14 @@ export default {
 </script>
 
 :::
+
+|  |  |  |  |
+|--|--|--|--|
+| xs | 尺寸 | 超小屏幕 (手机<768px) | 12 |
+| sm | 尺寸 | 小屏幕 (平板≥768px) | 12 |
+| md | 尺寸 | 中等屏幕 (桌面≥992px) | 12 |
+| lg | 尺寸 | 大型屏幕 (桌面≥1200px) | 12 |
+| xsOffset | 偏移 | 超小屏幕 (手机<768px) | 12 |
+| smOffset | 偏移 | 小屏幕 (平板≥768px) | 12 |
+| mdOffset | 偏移 | 中等屏幕 (桌面≥992px) | 12 |
+| lgOffset | 偏移 | 大型屏幕 (桌面≥1200px) | 12 |

docs/docs/zh-CN/components/icon.md

@@ -20,4 +20,4 @@ export default {
 
 |  |  |  |
 |--|--|--|
-| type | 图标 | `layui-icon-home` `layui-icon-template`... |
+| type | 图标 | `layui-icon-home` |

docs/docs/zh-CN/components/line.md

@@ -30,3 +30,7 @@ export default {
 </script>
 
 :::
+
+|  |  |  |
+|--|--|--|
+| theme| 主题 | `orange` `green` `cyan` `blue` `black` `gray`|

docs/docs/zh-CN/components/menu.md

@@ -26,3 +26,32 @@ export default {
 </script>
 
 :::
+
+::: demo
+
+<template>
+  <lay-menu tree>
+    <lay-menu-item title="首页"></lay-menu-item>
+    <lay-menu-item title="用户"></lay-menu-item>
+    <lay-menu-item title="角色"></lay-menu-item> 
+    <lay-menu-item title="目录">
+        <lay-menu-child-item title="菜单一"></lay-menu-child-item> 
+        <lay-menu-child-item title="菜单二"></lay-menu-child-item>
+        <lay-menu-child-item title="菜单三"></lay-menu-child-item>
+    </lay-menu-item> 
+  </lay-menu>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+:::

docs/docs/zh-CN/components/panel.md

@@ -17,27 +17,3 @@ export default {
 </script>
 
 :::
-
-::: demo
-
-<template>
-  <lay-collapse>
-    <lay-collapse-item title="标题"> 内容 </lay-collapse-item>
-    <lay-collapse-item title="标题"> 内容 </lay-collapse-item>
-    <lay-collapse-item title="标题"> 内容 </lay-collapse-item>
-  </lay-collapse>
-</template>
-
-<script>
-import { ref } from 'vue'
-
-export default {
-  setup() {
-
-    return {
-    }
-  }
-}
-</script>
-
-:::

docs/docs/zh-CN/components/progress.md

@@ -1,7 +1,7 @@
 ::: demo
 
 <template>
-  <lay-progress percent="80"></lay-progress>
+  <lay-progress percent="70"></lay-progress>
   <br>
   <lay-progress percent="60"></lay-progress>
 </template>
@@ -44,3 +44,36 @@ export default {
 </script>
 
 :::
+
+::: demo
+
+<template>
+  <lay-progress percent="80" showText></lay-progress>
+  <br/>
+  <br/>
+  <lay-progress percent="80" showText text="销售量"></lay-progress>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+:::
+
+
+|  |  |  |
+|--|--|--|
+| percent | 进度 | -- |
+| theme| 主题 | `orange` `green` `cyan` `blue` `black` `gray`|
+| size | 尺寸 | `big` |
+| text | 提示 | -- |
+| color| 颜色 | -- |
+| showText | 展示描述 | -- |

docs/src/layouts/Layout.vue

@@ -79,6 +79,8 @@ export default {
       { id: 18, title: '进度',subTitle:"progress" ,path: '/zh-CN/components/progress' },
       { id: 19, title: '时间线',subTitle:"timeline" ,path: '/zh-CN/components/timeline' },
       { id: 20, title: '颜色',subTitle:"color" ,path: '/zh-CN/components/color' },
+      { id: 21, title: '手风琴',subTitle:"collapse" ,path: '/zh-CN/components/collapse' },
+      { id: 22, title: '表格',subTitle:"table" ,path: '/zh-CN/components/table' },
     ]
 
     const selected = ref(1)

docs/src/router/zh-CN.ts

@@ -106,6 +106,16 @@ const zhCN = [
         path: '/zh-CN/components/timeline',
         component: () => import('../../docs/zh-CN/components/timeline.md'),
         meta: { title: '时间线' },
+      },
+      {
+        path: '/zh-CN/components/collapse',
+        component: () => import('../../docs/zh-CN/components/collapse.md'),
+        meta: { title: '手风琴' },
+      },
+      {
+        path: '/zh-CN/components/table',
+        component: () => import('../../docs/zh-CN/components/table.md'),
+        meta: { title: '表格' },
       }
     ],
   },

docs/src/styles/markdown.css

@@ -88,18 +88,12 @@ h1 {
   line-height: 38px;
 }
 
-p,
 ol,
 ul {
   margin: 1rem 0;
   line-height: 1.7;
 }
 
-p {
-  margin-top: 20px !important;
-  font-size: 14px !important;
-}
-
 a,
 area,
 button,

src/module/collapse/index.vue

@@ -5,5 +5,13 @@
 </template>
 
 <script setup name="LayCollapse" lang="ts">
+import { provide } from "vue";
+
+const props =
+  defineProps<{
+    openKeys?:Array<string>
+  }>()
+
+provide('openKeys',props.openKeys);
 
 </script>

src/module/collapseItem/index.vue

@@ -12,10 +12,14 @@
 </template>
 
 <script setup name="LayCollapseItem" lang="ts">
-import { defineProps } from 'vue'
+import { defineProps, inject } from 'vue'
 
 const props =
   defineProps<{
+    key?: string
     title?: string
   }>()
+
+const openKeys = inject('openKeys');
+
 </script>

src/module/menu/index.vue

@@ -1,9 +1,14 @@
 <template>
-   <ul class="layui-nav layui-nav-tree">
+   <ul class="layui-nav" :class="[tree ? 'layui-nav-tree':'']">
        <slot></slot>
    </ul>
 </template>
 
 <script setup name="LayMenu" lang="ts">
+import { defineProps } from 'vue'
 
+const props =
+  defineProps<{
+    tree: boolean
+  }>()
 </script>