🌀(component): 优化inputNumber与button在禁用状态下的样式

This commit is contained in:
0o张不歪o0 2022-07-13 15:11:41 +08:00
parent f1bd2611f9
commit 29afa1114f
4 changed files with 23 additions and 7 deletions

View File

@ -1,6 +1,6 @@
{ {
"name": "@layui/layui-vue", "name": "@layui/layui-vue",
"version": "1.3.0-alpha.1", "version": "1.3.0-alpha.2",
"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",

View File

@ -31,6 +31,9 @@
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
cursor: pointer; cursor: pointer;
}
.layui-btn:not(.layui-btn-disabled){
:hover, :hover,
:active { :active {
color: #333; color: #333;

View File

@ -62,13 +62,23 @@ watch(
const tempValue = ref(0); const tempValue = ref(0);
let timer: any = 0; let timer: any = 0;
const minControl = computed( const minControl = computed(() => {
() => props.min !== -Infinity && Number(props.min) >= num.value if(props.disabled){
); return true;
}
if(props.min !== -Infinity){
return Number(props.min) >= num.value;
}
});
const maxControl = computed( const maxControl = computed(() => {
() => props.max !== Infinity && Number(props.max) <= num.value if(props.disabled){
); return true;
}
if(props.max !== Infinity ){
return Number(props.max) <= num.value;
}
});
const addition = function () { const addition = function () {
num.value += Number(props.step); num.value += Number(props.step);
@ -127,6 +137,7 @@ const isNumber = function (num: any) {
type="number" type="number"
:name="name" :name="name"
@change="inputChange" @change="inputChange"
:disabled="disabledInput||disabled"
/> />
</div> </div>
<lay-button <lay-button

View File

@ -23,6 +23,8 @@
<li>[修复] datePicker 组件 上一次更新带来的Bug。 by @SmallWai</li> <li>[修复] datePicker 组件 上一次更新带来的Bug。 by @SmallWai</li>
<li>[优化] radio 组件 动画效果。 by @SmallWai</li> <li>[优化] radio 组件 动画效果。 by @SmallWai</li>
<li>[新增] formItem 组件 label-width属性用于控制宽度 by @SmallWai</li> <li>[新增] formItem 组件 label-width属性用于控制宽度 by @SmallWai</li>
<li>[优化] inputNumber 组件 禁用状态下的样式 by @SmallWai</li>
<li>[优化] botton 组件 禁用状态下的icon hover样式 by @SmallWai</li>
</ul> </ul>
</li> </li>
</ul> </ul>