perf: 更新文档

This commit is contained in:
就眠仪式 2021-10-24 20:35:43 +08:00
parent 3bd3dbf6cb
commit 3f60aabe19
10 changed files with 146 additions and 115 deletions

View File

@ -119,16 +119,16 @@ export default {
::: field 轮播属性
:::
| Name | Description | Accepted Values |
| --------- | ------ | --- |
| v-model | 当前激活项 | `--` |
| anim | 切换方向 | `default` `updown` |
| indicator | 控制器位置 | `inside` `outside` `none` |
| arrow | 切换按钮状态 | `hover` `always` `none`|
| Name | Description | Accepted Values |
| --------- | ------------ | ------------------------- |
| v-model | 当前激活项 | `--` |
| anim | 切换方向 | `default` `updown` |
| indicator | 控制器位置 | `inside` `outside` `none` |
| arrow | 切换按钮状态 | `hover` `always` `none` |
::: field 轮播事件
:::
| Name | Description | Accepted Values |
| --------- | ------ | --- |
| change | 切换回调 | id |
| Name | Description | Accepted Values |
| ------ | ----------- | --------------- |
| change | 切换回调 | id |

View File

@ -29,18 +29,21 @@ export default {
line-height: 60px;
text-align: center;
background: #87ca9a;
color: white;
}
.lay-code .layui-side {
display: flex;
background: #77c38c;
align-items: center;
justify-content: center;
color: white;
}
.lay-code .layui-body {
display: flex;
background: #5FB878;
align-items: center;
justify-content: center;
color: white;
}
</style>

View File

@ -1,53 +1,51 @@
<template>
<div class="width:100%;height:300px">
<lay-layout>
<lay-header style="background: #393d49; border-bottom: 1px solid #404553"
><lay-logo style="box-shadow: 0 0px 2px 0 rgba(0, 0, 0, 0.15)">
<img src="../assets/logo.png" />
</lay-logo>
<ul
class="layui-nav layui-layout-left"
style="margin-top: 0px; margin-bottom: 0px"
>
<li class="layui-nav-item">
<router-link to="/zh-CN/index"> 首页 </router-link>
</li>
<li class="layui-nav-item">
<router-link to="/zh-CN/guide"> 指南 </router-link>
</li>
<li class="layui-nav-item">
<router-link to="/zh-CN/components"> 组件 </router-link>
</li>
<li class="layui-nav-item">
<lay-form>
<lay-search :datas="menus" />
</lay-form>
</li>
</ul>
<ul
class="layui-nav layui-layout-right"
style="margin-top: 0px; margin-bottom: 0px"
>
<li class="layui-nav-item">
<a href="https://gitee.com/layui-vue">
<lay-icon type="layui-icon-fonts-code" size="14px"></lay-icon>
</a>
</li>
<li class="layui-nav-item">
<a
href="https://gitee.com/layui-vue/layui-vue/issues?assignee_id=&author_id=&branch=&collaborator_ids=&issue_search=&label_ids=&label_text=&milestone_id=&priority=&private_issue=&program_id=&project_id=Jmysy%2Flayui-vue&project_type=&scope=&sort=&state=all&target_project="
>
<lay-icon type="layui-icon-chat" size="14px"></lay-icon>
</a>
</li>
<li class="layui-nav-item">
<a href="javascript:void(0)"> 0.2.0 </a>
</li>
</ul>
</lay-header>
<router-view></router-view>
</lay-layout>
</div>
<lay-layout class="layui-layout-document">
<lay-header
><lay-logo style="box-shadow: 0 0px 2px 0 rgba(0, 0, 0, 0.15)">
<img src="../assets/logo.png" />
</lay-logo>
<ul
class="layui-nav layui-layout-left"
style="margin-top: 0px; margin-bottom: 0px"
>
<li class="layui-nav-item">
<router-link to="/zh-CN/index"> 首页 </router-link>
</li>
<li class="layui-nav-item">
<router-link to="/zh-CN/guide"> 指南 </router-link>
</li>
<li class="layui-nav-item">
<router-link to="/zh-CN/components"> 组件 </router-link>
</li>
<li class="layui-nav-item">
<lay-form>
<lay-search :datas="menus" />
</lay-form>
</li>
</ul>
<ul
class="layui-nav layui-layout-right"
style="margin-top: 0px; margin-bottom: 0px"
>
<li class="layui-nav-item">
<a href="https://gitee.com/layui-vue">
<lay-icon type="layui-icon-fonts-code" size="14px"></lay-icon>
</a>
</li>
<li class="layui-nav-item">
<a
href="https://gitee.com/layui-vue/layui-vue/issues?assignee_id=&author_id=&branch=&collaborator_ids=&issue_search=&label_ids=&label_text=&milestone_id=&priority=&private_issue=&program_id=&project_id=Jmysy%2Flayui-vue&project_type=&scope=&sort=&state=all&target_project="
>
<lay-icon type="layui-icon-chat" size="14px"></lay-icon>
</a>
</li>
<li class="layui-nav-item">
<a href="javascript:void(0)"> 0.2.0 </a>
</li>
</ul>
</lay-header>
<router-view></router-view>
</lay-layout>
</template>
<script>
import { ref, watch } from 'vue'
@ -335,6 +333,29 @@ export default {
}
</script>
<style>
.layui-layout-document > .layui-header {
z-index: 9999;
width: 100%;
position: fixed;
background: #393d49;
border-bottom: 1px solid #404553;
}
.layui-layout-document > .layui-layout > .layui-side {
overflow-x: hidden;
position: fixed;
margin-top: 60px;
height: calc(100% - 60px);
}
.layui-layout-document > .layui-layout > .layui-body {
margin-top: 60px;
left: 200px;
position: absolute;
width: calc(100% - 200px);
height: calc(100% - 60px);
}
.layui-logo img {
height: 31px;
width: 82px;
@ -350,6 +371,9 @@ export default {
.layui-menu-docs .layui-menu-body-title .layui-font-gray {
padding-left: 10px;
}
.layui-side hr {
margin: 8px;
}
@media screen and (max-width: 768px) {
.layui-side {

View File

@ -253,4 +253,4 @@ const zhCN = [
},
]
export default zhCN
export default zhCN

View File

@ -1,36 +1,40 @@
<template>
<lay-layout>
<lay-side>
<ul class="layui-menu layui-menu-lg layui-menu-docs">
<li
v-for="menu in menus"
:key="menu"
class="layui-menu-item-group"
lay-options="{type: 'group', isAllowSpread: true}"
>
<div class="layui-menu-body-title">{{ menu.title }}</div>
<hr />
<ul>
<li
v-for="children in menu.children"
:key="children"
:class="[
currentPath === children.path ? 'layui-menu-item-checked2' : '',
]"
@click="handleClick(children)"
>
<div class="layui-menu-body-title">
<router-link :to="children.path">
<span>{{ children.title }}</span>
<span class="layui-font-12 layui-font-gray">
{{ children.subTitle }}
</span>
</router-link>
</div>
</li>
</ul>
</li>
</ul>
<lay-scroll>
<ul class="layui-menu layui-menu-lg layui-menu-docs">
<li
v-for="menu in menus"
:key="menu"
class="layui-menu-item-group"
lay-options="{type: 'group', isAllowSpread: true}"
>
<div class="layui-menu-body-title">{{ menu.title }}</div>
<hr />
<ul>
<li
v-for="children in menu.children"
:key="children"
:class="[
currentPath === children.path
? 'layui-menu-item-checked2'
: '',
]"
@click="handleClick(children)"
>
<div class="layui-menu-body-title">
<router-link :to="children.path">
<span>{{ children.title }}</span>
<span class="layui-font-12 layui-font-gray">
{{ children.subTitle }}
</span>
</router-link>
</div>
</li>
</ul>
</li>
</ul>
</lay-scroll>
</lay-side>
<lay-body>
<div style="padding: 20px">
@ -160,6 +164,12 @@ export default {
id: 1,
title: '表单',
children: [
{
id: 36,
title: '开关',
subTitle: 'switch',
path: '/zh-CN/components/switch',
},
{
id: 32,
title: '复选框',
@ -184,30 +194,24 @@ export default {
subTitle: 'textarea',
path: '/zh-CN/components/textarea',
},
{
id: 36,
title: '开关',
subTitle: 'switch',
path: '/zh-CN/components/switch',
},
{
id: 39,
title: '下拉选择',
subTitle: 'select',
path: '/zh-CN/components/select',
},
{
id: 29,
title: '图标选择',
subTitle: 'iconPicker',
path: '/zh-CN/components/iconPicker',
},
{
id: 40,
title: '颜色选择器',
subTitle: 'colorPicker',
path: '/zh-CN/components/colorPicker',
},
{
id: 29,
title: '图标选择器',
subTitle: 'iconPicker',
path: '/zh-CN/components/iconPicker',
},
{
id: 26,
title: '评分',

View File

@ -1,6 +1,7 @@
<template>
<lay-layout>
<lay-side>
<lay-scroll>
<ul class="layui-menu layui-menu-lg layui-menu-docs">
<li
v-for="menu in menus"
@ -33,6 +34,7 @@
</ul>
</li>
</ul>
</lay-scroll>
</lay-side>
<lay-body>
<div style="padding: 20px">

View File

@ -1,11 +1,5 @@
<template>
<div
style="
background-color: whitesmoke;
height: 100%;
width: 100%;
"
>
<div style="margin-top:60px;background-color: whitesmoke; height: 100%; width: 100%">
<div class="site-banner">
<div class="site-banner-main">
<div class="site-zfj site-zfj-anim">

View File

@ -24,7 +24,6 @@ html #layuicss-layer {
left: 0;
width: 100%;
height: 100%;
_height: expression(document.body.offsetHeight + 'px');
}
.layui-layer {
@ -839,7 +838,6 @@ html #layuicss-layer {
height: 44px;
margin-top: -22px;
outline: 0;
blr: expression(this.onFocus=this.blur());
}
.layui-layer-imgprev {
@ -873,7 +871,6 @@ html #layuicss-layer {
width: 100%;
height: 40px;
line-height: 40px;
background-color: #000\9;
filter: Alpha(opacity=60);
background-color: rgba(2, 0, 0, 0.35);
color: #fff;

View File

@ -35,7 +35,14 @@
</div>
</template>
<script setup name="LayCarousel" lang="ts">
import { withDefaults, defineProps, provide, useSlots, ref, computed } from 'vue'
import {
withDefaults,
defineProps,
provide,
useSlots,
ref,
computed,
} from 'vue'
const slot = useSlots() as any
const slots = slot.default && (slot.default() as any[])
@ -54,7 +61,7 @@ const props = withDefaults(
height: '280px',
anim: 'default',
arrow: 'hover',
indicator: 'inside'
indicator: 'inside',
}
)
@ -99,4 +106,4 @@ const next = function () {
}
}
}
</script>
</script>

View File

@ -16,4 +16,4 @@ export default {
.layui-footer {
box-sizing: border-box;
}
</style>
</style>