(all): update

This commit is contained in:
就眠儀式 2022-05-25 22:00:30 +08:00
parent 1531321951
commit e2328de0d6
9 changed files with 28 additions and 18 deletions

View File

@ -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 {

View File

@ -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>

View File

@ -7,4 +7,4 @@ import Vue from "vue";
export default { export default {
name: "App", name: "App",
}; };
</script> </script>

View File

@ -132,6 +132,7 @@ export default {
| src | 图源 | -- | | src | 图源 | -- |
| size | 尺寸 | `xs` `sm` `lg` | | size | 尺寸 | `xs` `sm` `lg` |
| radius | 圆形 | `true` `false` | | radius | 圆形 | `true` `false` |
| alt | 描述图像的替换文本 | -- |
::: :::

View File

@ -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
::: :::

View File

@ -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 数据联动
::: :::

View File

@ -10,7 +10,7 @@
::: title 基础使用 ::: title 基础使用
::: :::
::: demo ::: demo 使用 `lay-timeline``lay-timeline-item` 标签, 创建时间线
<template> <template>
<lay-timeline> <lay-timeline>

View File

@ -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">

View File

@ -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>