✨(all): update
This commit is contained in:
parent
1531321951
commit
e2328de0d6
@ -1,25 +1,25 @@
|
|||||||
.layui-avatar {
|
.layui-avatar {
|
||||||
box-sizing: border-box;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
color: #000000d9;
|
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-variant: tabular-nums;
|
font-variant: tabular-nums;
|
||||||
|
font-feature-settings: tnum;
|
||||||
|
border-radius: var(--global-border-radius);
|
||||||
|
box-sizing: border-box;
|
||||||
|
color: #000000d9;
|
||||||
line-height: 1.5715;
|
line-height: 1.5715;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
font-feature-settings: tnum;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
vertical-align: middle;
|
|
||||||
background: #ccc;
|
background: #ccc;
|
||||||
width: 32px;
|
width: 32px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
line-height: 32px;
|
line-height: 32px;
|
||||||
border-radius: var(--global-border-radius);
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
.layui-avatar.layui-avatar-radius {
|
.layui-avatar.layui-avatar-radius {
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
import { computed } from 'vue';
|
||||||
export default {
|
export default {
|
||||||
name: "LayAvatar",
|
name: "LayAvatar",
|
||||||
};
|
};
|
||||||
@ -11,21 +12,27 @@ export interface LayAvatarProps {
|
|||||||
src?: string;
|
src?: string;
|
||||||
size?: "xs" | "sm" | "md" | "lg";
|
size?: "xs" | "sm" | "md" | "lg";
|
||||||
radius?: boolean;
|
radius?: boolean;
|
||||||
|
alt?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayAvatarProps>(), {
|
const props = withDefaults(defineProps<LayAvatarProps>(), {
|
||||||
size: "md",
|
size: "md",
|
||||||
radius: false,
|
radius: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const classes = computed(() => {
|
||||||
|
return [
|
||||||
|
'layui-avatar',
|
||||||
|
props.radius ? 'layui-avatar-radius' : '',
|
||||||
|
props.size ? `layui-avatar-${props.size}` : '',
|
||||||
|
]
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<img
|
<img
|
||||||
|
:alt="alt"
|
||||||
:src="src"
|
:src="src"
|
||||||
class="layui-avatar"
|
:class="classes"
|
||||||
:class="[
|
|
||||||
radius ? 'layui-avatar-radius' : '',
|
|
||||||
size ? 'layui-avatar-' + size : '',
|
|
||||||
]"
|
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
@ -7,4 +7,4 @@ import Vue from "vue";
|
|||||||
export default {
|
export default {
|
||||||
name: "App",
|
name: "App",
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -132,6 +132,7 @@ export default {
|
|||||||
| src | 图源 | -- |
|
| src | 图源 | -- |
|
||||||
| size | 尺寸 | `xs` `sm` `lg` |
|
| size | 尺寸 | `xs` `sm` `lg` |
|
||||||
| radius | 圆形 | `true` `false` |
|
| radius | 圆形 | `true` `false` |
|
||||||
|
| alt | 描述图像的替换文本 | -- |
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
|
@ -59,7 +59,6 @@ export default {
|
|||||||
::: demo
|
::: demo
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
选中:{{ selectedKey }} 打开: {{ openKeys2 }}
|
|
||||||
<lay-menu :selectedKey="selectedKey" @changeSelectedKey="changeSelectedKey" @changeOpenKeys="changeOpenKeys" v-model:openKeys="openKeys2" :tree="true">
|
<lay-menu :selectedKey="selectedKey" @changeSelectedKey="changeSelectedKey" @changeOpenKeys="changeOpenKeys" v-model:openKeys="openKeys2" :tree="true">
|
||||||
<lay-menu-item id="1">首页</lay-menu-item>
|
<lay-menu-item id="1">首页</lay-menu-item>
|
||||||
<lay-menu-item id="2">首页</lay-menu-item>
|
<lay-menu-item id="2">首页</lay-menu-item>
|
||||||
@ -335,7 +334,7 @@ export default {
|
|||||||
</template>
|
</template>
|
||||||
</lay-menu-item>
|
</lay-menu-item>
|
||||||
<lay-menu-item id="9">
|
<lay-menu-item id="9">
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<lay-icon type="layui-icon-home"></lay-icon>
|
<lay-icon type="layui-icon-home"></lay-icon>
|
||||||
</template>
|
</template>
|
||||||
<template #title>
|
<template #title>
|
||||||
@ -540,6 +539,7 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: title Menu 属性
|
::: title Menu 属性
|
||||||
@ -605,4 +605,4 @@ export default {
|
|||||||
:::
|
:::
|
||||||
|
|
||||||
::: previousNext nav
|
::: previousNext nav
|
||||||
:::
|
:::
|
@ -10,7 +10,7 @@
|
|||||||
::: title 基础使用
|
::: title 基础使用
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: demo
|
::: demo 使用 `lay-select` 标签, 创建下拉选择框
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<lay-select v-model="value">
|
<lay-select v-model="value">
|
||||||
@ -33,6 +33,7 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
:::
|
||||||
|
|
||||||
::: title 数据联动
|
::: title 数据联动
|
||||||
:::
|
:::
|
||||||
|
@ -10,7 +10,7 @@
|
|||||||
::: title 基础使用
|
::: title 基础使用
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: demo
|
::: demo 使用 `lay-timeline` 与 `lay-timeline-item` 标签, 创建时间线
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<lay-timeline>
|
<lay-timeline>
|
||||||
|
@ -4,13 +4,13 @@
|
|||||||
::: title 基本介绍
|
::: title 基本介绍
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: describe 按钮用于开始一个即时操作。
|
::: describe 文件上传
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: title 基础使用
|
::: title 基础使用
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: demo 使用 `lay-upload` 标签, 创建一个按钮上传单文件
|
::: demo 使用 `lay-upload` 标签, 创建一个上传按钮
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<lay-upload @done="getUploadFile" @choose="beginChoose">
|
<lay-upload @done="getUploadFile" @choose="beginChoose">
|
||||||
|
@ -17,6 +17,7 @@
|
|||||||
<h3>1.1.3 <span class="layui-badge-rim">2022-05-21</span></h3>
|
<h3>1.1.3 <span class="layui-badge-rim">2022-05-21</span></h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li>[新增] input 组件 clear 事件, 清空内容时触发的无参事件</li>
|
<li>[新增] input 组件 clear 事件, 清空内容时触发的无参事件</li>
|
||||||
|
<li>[新增] avatar 组件 alt 属性, 用于设置描述图像无法正常显示时的替换文本</li>
|
||||||
<li>[修复] tab 组件初始化时, 因无法监听到 slots 变化, 而导致 layui-tab-title 无法正常显示的问题</li>
|
<li>[修复] tab 组件初始化时, 因无法监听到 slots 变化, 而导致 layui-tab-title 无法正常显示的问题</li>
|
||||||
<li>[优化] input 组件 allow-clear 触发策略, 由始终显示调整为 v-model 不为空显示</li>
|
<li>[优化] input 组件 allow-clear 触发策略, 由始终显示调整为 v-model 不为空显示</li>
|
||||||
<li>[优化] icon-picker 组件 search 功能, 为 input 输入框增加清空操作</li>
|
<li>[优化] icon-picker 组件 search 功能, 为 input 输入框增加清空操作</li>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user