[新增] panel 组件
This commit is contained in:
parent
5df6cfcbaf
commit
81785521f6
@ -1,5 +1,3 @@
|
|||||||
##### 基础
|
|
||||||
|
|
||||||
::: demo 传入 columns 数据,自动生成表格
|
::: demo 传入 columns 数据,自动生成表格
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -25,8 +23,6 @@ export default {
|
|||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
##### 尺寸
|
|
||||||
|
|
||||||
::: demo 传入 columns 数据,自动生成表格
|
::: demo 传入 columns 数据,自动生成表格
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -51,10 +47,3 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
#### 插槽
|
|
||||||
|
|
||||||
| name | 说明 | |
|
|
||||||
| :------------ | :-------------------------------------------|----------|
|
|
||||||
| type | 按钮类型 | `primary` `normal` `warm` `danger` |
|
|
||||||
| size | 按钮尺寸 | `lg` `sm` `xs`|
|
|
@ -1,6 +1,4 @@
|
|||||||
##### 基础
|
::: demo
|
||||||
|
|
||||||
::: demo 传入 columns 数据,自动生成表格
|
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<lay-icon type="layui-icon-face-smile"></lay-icon>
|
<lay-icon type="layui-icon-face-smile"></lay-icon>
|
||||||
@ -19,10 +17,3 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
#### 插槽
|
|
||||||
|
|
||||||
| name | 说明 | |
|
|
||||||
| :------------ | :-------------------------------------------|----------|
|
|
||||||
| type | 按钮类型 | `primary` `normal` `warm` `danger` |
|
|
||||||
| size | 按钮尺寸 | `lg` `sm` `xs`|
|
|
19
docs/docs/zh-CN/components/panel.md
Normal file
19
docs/docs/zh-CN/components/panel.md
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
::: demo
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<lay-panel><div style="padding: 30px;">面板</div></lay-panel>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
setup() {
|
||||||
|
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
:::
|
@ -1,4 +1,3 @@
|
|||||||
/* eslint-disable @typescript-eslint/no-var-requires */
|
|
||||||
const fs = require('fs')
|
const fs = require('fs')
|
||||||
const path = require('path')
|
const path = require('path')
|
||||||
|
|
||||||
|
@ -1,12 +1,17 @@
|
|||||||
<template>
|
<template>
|
||||||
<lay-layout>
|
<lay-layout>
|
||||||
<lay-header>
|
<lay-header>
|
||||||
<lay-logo>layui-logo</lay-logo>
|
<lay-logo>
|
||||||
|
layui-vue
|
||||||
|
</lay-logo>
|
||||||
</lay-header>
|
</lay-header>
|
||||||
<lay-side>
|
<lay-side>
|
||||||
<router-link to="/zh-CN/components/layout">布局</router-link>
|
<ul>
|
||||||
<router-link to="/zh-CN/components/button">按钮</router-link>
|
<li><router-link to="/zh-CN/components/layout">布局</router-link></li>
|
||||||
<router-link to="/zh-CN/components/icon">图标</router-link>
|
<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>
|
||||||
|
</ul>
|
||||||
</lay-side>
|
</lay-side>
|
||||||
<lay-body>
|
<lay-body>
|
||||||
<div style="padding: 20px">
|
<div style="padding: 20px">
|
||||||
|
@ -28,6 +28,10 @@ const zhCN = [
|
|||||||
path: '/zh-CN/components/icon',
|
path: '/zh-CN/components/icon',
|
||||||
component: () => import('../../docs/zh-CN/components/icon.md'),
|
component: () => import('../../docs/zh-CN/components/icon.md'),
|
||||||
meta: { title: '图标' },
|
meta: { title: '图标' },
|
||||||
|
},{
|
||||||
|
path: '/zh-CN/components/panel',
|
||||||
|
component: () => import('../../docs/zh-CN/components/panel.md'),
|
||||||
|
meta: { title: '面板' },
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
@ -11,6 +11,7 @@ import LayBody from "./module/body/index"
|
|||||||
import LayHeader from "./module/header/index"
|
import LayHeader from "./module/header/index"
|
||||||
import LayFooter from "./module/footer/index"
|
import LayFooter from "./module/footer/index"
|
||||||
import LayLogo from "./module/logo/index"
|
import LayLogo from "./module/logo/index"
|
||||||
|
import LayPanel from "./module/panel/index"
|
||||||
|
|
||||||
const components: Record<string, IDefineComponent> = {
|
const components: Record<string, IDefineComponent> = {
|
||||||
LayRadio,
|
LayRadio,
|
||||||
@ -21,7 +22,8 @@ const components: Record<string, IDefineComponent> = {
|
|||||||
LayHeader,
|
LayHeader,
|
||||||
LayBody,
|
LayBody,
|
||||||
LayFooter,
|
LayFooter,
|
||||||
LayLogo
|
LayLogo,
|
||||||
|
LayPanel
|
||||||
}
|
}
|
||||||
|
|
||||||
const install = (app: App, options?: InstallOptions): void => {
|
const install = (app: App, options?: InstallOptions): void => {
|
||||||
@ -44,6 +46,7 @@ export {
|
|||||||
LayBody,
|
LayBody,
|
||||||
LayFooter,
|
LayFooter,
|
||||||
LayLogo,
|
LayLogo,
|
||||||
|
LayPanel,
|
||||||
install,
|
install,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
9
src/module/panel/index.ts
Normal file
9
src/module/panel/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 || 'LayLogo', Component)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Component as IDefineComponent
|
9
src/module/panel/index.vue
Normal file
9
src/module/panel/index.vue
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
<template>
|
||||||
|
<div class="layui-panel">
|
||||||
|
<slot></slot>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup name="LayPanel" lang="ts">
|
||||||
|
|
||||||
|
</script>
|
Loading…
Reference in New Issue
Block a user