[文档] 调整目录样式
This commit is contained in:
parent
72474af51d
commit
6e996cd3f0
@ -1,23 +1,12 @@
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
```html
|
||||
<lay-layout>
|
||||
<lay-header></lay-header>
|
||||
<lay-header>
|
||||
<lay-logo>Layui Admin</lay-logo>
|
||||
</lay-header>
|
||||
<lay-side></lay-side>
|
||||
<lay-body></lay-body>
|
||||
<lay-body>
|
||||
<router-view></router-view>
|
||||
</lay-body>
|
||||
<lay-footer>pearadmin.com</lay-footer>
|
||||
</lay-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref } from 'vue'
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
return {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
:::
|
||||
```
|
23
docs/docs/zh-CN/components/menu.md
Normal file
23
docs/docs/zh-CN/components/menu.md
Normal file
@ -0,0 +1,23 @@
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
<lay-menu>
|
||||
<lay-menu-item title="首页"></lay-menu-item>
|
||||
<lay-menu-item title="用户"></lay-menu-item>
|
||||
<lay-menu-item title="角色"></lay-menu-item>
|
||||
</lay-menu>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref } from 'vue'
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
return {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
:::
|
@ -0,0 +1,3 @@
|
||||
基于 layui 的 vue-next 组件库
|
||||
|
||||
a component library for Vue 3 base on layui-vue
|
@ -16,24 +16,25 @@
|
||||
</lay-header>
|
||||
<lay-side>
|
||||
<ul class="layui-menu layui-menu-lg">
|
||||
<li><router-link to="/zh-CN/guide">介绍</router-link></li>
|
||||
<li><router-link to="/zh-CN/guide/install">安装</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/layout">布局</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/container">容器</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/button">按钮</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/icon">图标</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/panel">面板</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/card">卡片</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/grid">栅格</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/form">表单</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/badge">徽章</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/block">区块</router-link></li>
|
||||
<li><router-link to="/zh-CN/components/line">分割</router-link></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/guide">介绍</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/guide/install">安装</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/layout">布局</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/container">容器</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/button">按钮</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/icon">图标</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/panel">面板</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/card">卡片</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/grid">栅格</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/form">表单</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/badge">徽章</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/block">区块</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/line">分割</router-link></div></li>
|
||||
<li><div class="layui-menu-body-title"><router-link to="/zh-CN/components/menu">菜单</router-link></div></li>
|
||||
<li>
|
||||
<router-link to="/zh-CN/components/progress">进度</router-link>
|
||||
<div class="layui-menu-body-title"><router-link to="/zh-CN/components/progress">进度</router-link></div>
|
||||
</li>
|
||||
<li>
|
||||
<router-link to="/zh-CN/components/timeline">时间</router-link>
|
||||
<div class="layui-menu-body-title"><router-link to="/zh-CN/components/timeline">时间</router-link></div>
|
||||
</li>
|
||||
</ul>
|
||||
</lay-side>
|
||||
|
@ -79,6 +79,11 @@ const zhCN = [
|
||||
component: () => import('../../docs/zh-CN/components/progress.md'),
|
||||
meta: { title: '进度' },
|
||||
},
|
||||
{
|
||||
path: '/zh-CN/components/menu',
|
||||
component: () => import('../../docs/zh-CN/components/menu.md'),
|
||||
meta: { title: '菜单' },
|
||||
},
|
||||
{
|
||||
path: '/zh-CN/components/timeline',
|
||||
component: () => import('../../docs/zh-CN/components/timeline.md'),
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@layui/layui-vue",
|
||||
"version": "0.0.3",
|
||||
"version": "0.0.4",
|
||||
"description": "a component library for Vue 3 base on layui-vue",
|
||||
"main": "lib/layui-vue.umd.js",
|
||||
"module": "lib/layui-vue.es.js",
|
||||
|
11
src/index.ts
11
src/index.ts
@ -29,6 +29,9 @@ import LayTextarea from "./module/textarea/index"
|
||||
import LaySwitch from "./module/switch/index"
|
||||
import LayCollapse from "./module/collapse/index"
|
||||
import LayContainer from "./module/container/index"
|
||||
import LayMenu from './module/menu/index'
|
||||
import LayMenuItem from './module/menuItem/index'
|
||||
import LayMenuChildItem from './module/menuChildItem/index'
|
||||
|
||||
const components: Record<string, IDefineComponent> = {
|
||||
LayRadio,
|
||||
@ -56,7 +59,10 @@ const components: Record<string, IDefineComponent> = {
|
||||
LayTextarea,
|
||||
LaySwitch,
|
||||
LayCollapse,
|
||||
LayContainer
|
||||
LayContainer,
|
||||
LayMenu,
|
||||
LayMenuItem,
|
||||
LayMenuChildItem
|
||||
}
|
||||
|
||||
const install = (app: App, options?: InstallOptions): void => {
|
||||
@ -96,6 +102,9 @@ export {
|
||||
LaySwitch,
|
||||
LayCollapse,
|
||||
LayContainer,
|
||||
LayMenu,
|
||||
LayMenuItem,
|
||||
LayMenuChildItem,
|
||||
install,
|
||||
}
|
||||
|
||||
|
9
src/module/menu/index.ts
Normal file
9
src/module/menu/index.ts
Normal file
@ -0,0 +1,9 @@
|
||||
import type { App } from 'vue'
|
||||
import Component from './index.vue'
|
||||
import type { IDefineComponent } from '../type/index'
|
||||
|
||||
Component.install = (app: App) => {
|
||||
app.component(Component.name || 'LayMenu', Component)
|
||||
}
|
||||
|
||||
export default Component as IDefineComponent
|
9
src/module/menu/index.vue
Normal file
9
src/module/menu/index.vue
Normal file
@ -0,0 +1,9 @@
|
||||
<template>
|
||||
<ul class="layui-nav layui-nav-tree">
|
||||
<slot></slot>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<script setup name="LayMenu" lang="ts">
|
||||
|
||||
</script>
|
9
src/module/menuChildItem/index.ts
Normal file
9
src/module/menuChildItem/index.ts
Normal file
@ -0,0 +1,9 @@
|
||||
import type { App } from 'vue'
|
||||
import Component from './index.vue'
|
||||
import type { IDefineComponent } from '../type/index'
|
||||
|
||||
Component.install = (app: App) => {
|
||||
app.component(Component.name || 'LayMenuChildItem', Component)
|
||||
}
|
||||
|
||||
export default Component as IDefineComponent
|
7
src/module/menuChildItem/index.vue
Normal file
7
src/module/menuChildItem/index.vue
Normal file
@ -0,0 +1,7 @@
|
||||
<template>
|
||||
<dd><a href="">选项</a></dd>
|
||||
</template>
|
||||
|
||||
<script setup name="LayMenuChildItem" lang="ts">
|
||||
|
||||
</script>
|
9
src/module/menuItem/index.ts
Normal file
9
src/module/menuItem/index.ts
Normal file
@ -0,0 +1,9 @@
|
||||
import type { App } from 'vue'
|
||||
import Component from './index.vue'
|
||||
import type { IDefineComponent } from '../type/index'
|
||||
|
||||
Component.install = (app: App) => {
|
||||
app.component(Component.name || 'LayMenuItem', Component)
|
||||
}
|
||||
|
||||
export default Component as IDefineComponent
|
14
src/module/menuItem/index.vue
Normal file
14
src/module/menuItem/index.vue
Normal file
@ -0,0 +1,14 @@
|
||||
<template>
|
||||
<li class="layui-nav-item">
|
||||
<a href="">{{title}}</a>
|
||||
</li>
|
||||
</template>
|
||||
|
||||
<script setup name="LayMenuItem" lang="ts">
|
||||
import { defineProps } from 'vue'
|
||||
|
||||
const props =
|
||||
defineProps<{
|
||||
title: string
|
||||
}>()
|
||||
</script>
|
Loading…
Reference in New Issue
Block a user