🌀(component): 优化 input 组件 clear 与 password 背景色
This commit is contained in:
parent
73d3bf90de
commit
1e5812e6e7
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@layui/layui-vue",
|
"name": "@layui/layui-vue",
|
||||||
"version": "1.4.0-alpha.1",
|
"version": "1.4.0-alpha.3",
|
||||||
"author": "就眠儀式",
|
"author": "就眠儀式",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"description": "a component library for Vue 3 base on layui-vue",
|
"description": "a component library for Vue 3 base on layui-vue",
|
||||||
|
@ -12,11 +12,11 @@
|
|||||||
<lay-input
|
<lay-input
|
||||||
:name="name"
|
:name="name"
|
||||||
:readonly="readonly"
|
:readonly="readonly"
|
||||||
v-model="dateValue"
|
|
||||||
:placeholder="placeholder"
|
:placeholder="placeholder"
|
||||||
:prefix-icon="prefixIcon"
|
:prefix-icon="prefixIcon"
|
||||||
:suffix-icon="suffixIcon"
|
:suffix-icon="suffixIcon"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
v-model="dateValue"
|
||||||
v-if="!range"
|
v-if="!range"
|
||||||
@change="onChange"
|
@change="onChange"
|
||||||
:allow-clear="!disabled && allowClear"
|
:allow-clear="!disabled && allowClear"
|
||||||
@ -146,7 +146,7 @@ const props = withDefaults(defineProps<LayDatePickerProps>(), {
|
|||||||
allowClear: false,
|
allowClear: false,
|
||||||
size: "md",
|
size: "md",
|
||||||
prefixIcon: "layui-icon-date",
|
prefixIcon: "layui-icon-date",
|
||||||
suffixIcon: ""
|
suffixIcon: "",
|
||||||
});
|
});
|
||||||
|
|
||||||
const dropdownRef = ref(null);
|
const dropdownRef = ref(null);
|
||||||
|
@ -71,8 +71,10 @@
|
|||||||
border-color: #d2d2d2 !important;
|
border-color: #d2d2d2 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.layui-input-clear,
|
||||||
.layui-input-prefix,
|
.layui-input-prefix,
|
||||||
.layui-input-suffix {
|
.layui-input-suffix,
|
||||||
|
.layui-input-password {
|
||||||
background-color: white;
|
background-color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -90,8 +92,8 @@
|
|||||||
padding: 0 15px;
|
padding: 0 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.layui-input-password,
|
.layui-input-clear,
|
||||||
.layui-input-clear {
|
.layui-input-password {
|
||||||
flex: none;
|
flex: none;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -614,7 +614,7 @@ const renderTotalRowCell = (column: any) => {
|
|||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
window.onresize = null;
|
window.onresize = null;
|
||||||
})
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
@ -5,6 +5,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { LayIcon } from "@layui/icons-vue";
|
||||||
import { computed } from "vue";
|
import { computed } from "vue";
|
||||||
import "./index.less";
|
import "./index.less";
|
||||||
|
|
||||||
|
@ -254,15 +254,17 @@ const rangeTime3 = ref(['2022-01-01','2023-02-1']);
|
|||||||
|
|
||||||
::: table
|
::: table
|
||||||
|
|
||||||
| 属性 | 描述 | 类型 | 默认值 | 可选值 |
|
| 属性 | 描述 | 类型 | 默认值 | 可选值 | 版本 |
|
||||||
| ------------- | ------------------------------------------------------------ | -------------- | ------ | -------------- |
|
| ------------- | ------------------------------------------------------------ | -------------- | ------ | -------------- |-------------- |
|
||||||
| v-model | 当前时间 | `string` | -- | — |
|
| v-model | 当前时间 | `string` | -- | -- | -- |
|
||||||
| type | 选择类型 | `string` | `date` | `date` `datetime` `year` `month` `time` `yearmonth` |
|
| type | 选择类型 | `string` | `date` | `date` `datetime` `year` `month` `time` `yearmonth` | -- |
|
||||||
| disabled | 是否禁止修改 | `boolean` | false | — |
|
| disabled | 是否禁止修改 | `boolean` | false | — | — |
|
||||||
| simple | 一次性选择,无需点击确认按钮 | `boolean` | false | — |
|
| simple | 一次性选择,无需点击确认按钮 | `boolean` | false | -- | -- |
|
||||||
| readonly | 只读 | `boolean` | false | — |
|
| readonly | 只读 | `boolean` | false | -- | -- |
|
||||||
| allowClear | 允许清空 | `boolean` | true | — |
|
| allowClear | 允许清空 | `boolean` | true | -- | -- |
|
||||||
| size | 尺寸 | `string` | `lg` `md` `sm` `xs` | `md` |
|
| size | 尺寸 | `string` | `lg` `md` `sm` `xs` | `md` | -- |
|
||||||
|
| prefix-icon | 前置图标 | `string` | `layui-icon-date` | 内置图标集 | `1.4.0` |
|
||||||
|
| suffix-icon | 后置图标 | `string` | -- | 内置图标集 | `1.4.0` |
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
|
@ -25,17 +25,22 @@
|
|||||||
<li>[新增] transfer 组件 datasource 属性 disabled 配置, 允许选项禁用。</li>
|
<li>[新增] transfer 组件 datasource 属性 disabled 配置, 允许选项禁用。</li>
|
||||||
<li>[新增] switch 组件 loading 属性, 开启加载状态, 默认为 false。</li>
|
<li>[新增] switch 组件 loading 属性, 开启加载状态, 默认为 false。</li>
|
||||||
<li>[新增] switch 组件 loading-icon 属性, 允许自定义加载图标, 可选值为内置图标集。</li>
|
<li>[新增] switch 组件 loading-icon 属性, 允许自定义加载图标, 可选值为内置图标集。</li>
|
||||||
|
<li>[新增] date-picker 组件 prefix-icon 属性, 用于自定义输入框前置图标, layui-icon-date 为默认值。</li>
|
||||||
|
<li>[新增] date-picker 组件 suffix-icon 属性, 用于自定义输入框后置图标。</li>
|
||||||
<li>[修复] table 组件 column 属性为 fixed 时, 隐藏该列时不重新计算距离。</li>
|
<li>[修复] table 组件 column 属性为 fixed 时, 隐藏该列时不重新计算距离。</li>
|
||||||
<li>[修复] input 组件 v-model 属性输入拼字阶段触发更新的问题。</li>
|
<li>[修复] input 组件 v-model 属性输入拼字阶段触发更新的问题。</li>
|
||||||
<li>[修复] table 组件 height 属性修改时, 造成单元格错位。</li>
|
<li>[修复] table 组件 height 属性修改时, 造成单元格错位。</li>
|
||||||
<li>[修复] table 组件 demand 模式缺失 radio.css 文件。</li>
|
<li>[修复] table 组件 demand 模式缺失 radio.css 文件。</li>
|
||||||
<li>[修复] menu 组件 demand 模式缺失 dropdown.css 文件。</li>
|
<li>[修复] menu 组件 demand 模式缺失 dropdown.css 文件。</li>
|
||||||
|
<li>[修复] textarea 组件无法解析 lay-icon 的警告。</li>
|
||||||
<li>[优化] input 组件 password 属性开启时的默认图标。</li>
|
<li>[优化] input 组件 password 属性开启时的默认图标。</li>
|
||||||
<li>[优化] table 组件 dropdown 筛选列面板随滚动条移动。</li>
|
<li>[优化] table 组件 dropdown 筛选列面板随滚动条移动。</li>
|
||||||
<li>[优化] table 组件 column 无对应列时仍保持列占位。</li>
|
<li>[优化] table 组件 column 无对应列时仍保持列占位。</li>
|
||||||
<li>[优化] table 组件 skin 属性为 row 时 header 高出 1 像素。</li>
|
<li>[优化] table 组件 skin 属性为 row 时 header 高出 1 像素。</li>
|
||||||
<li>[优化] transfer 组件 title 在特殊分辨率下显示不全。</li>
|
<li>[优化] transfer 组件 title 在特殊分辨率下显示不全。</li>
|
||||||
<li>[优化] notice-bar 组件 width 越界。</li>
|
<li>[优化] notice-bar 组件 width 越界。</li>
|
||||||
|
<li>[优化] input 组件 clear 操作背景透明的问题。</li>
|
||||||
|
<li>[优化] input 组件 password 操作背景透明的问题。</li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
Loading…
Reference in New Issue
Block a user