theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🌀(component): 修复 select-input 样式

Browse Source
This commit is contained in:
就眠儀式 2022-07-15 14:47:48 +08:00
parent 1c5a379134
commit 67c4f034ef
3 changed files with 42 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
package/component/src/component/iconPicker/index.vue
View File

@ -136,26 +136,39 @@ const searchList = (str: string, container: any) => {
<template>
<lay-dropdown ref="dropdownRef">
<div class="layui-inline layui-border-box layui-iconpicker layui-iconpicker-split">
<div
class="layui-inline layui-border-box layui-iconpicker layui-iconpicker-split"
>
<div class="layui-inline layui-iconpicker-main">
<i class="layui-inline layui-icon" :class="[selectedIcon]"></i>
</div>
<span class="layui-inline layui-iconpicker-suffix"><i class="layui-icon layui-icon-down layui-anim"></i></span>
<span class="layui-inline layui-iconpicker-suffix"
><i class="layui-icon layui-icon-down layui-anim"></i
></span>
</div>
<template #content>
<div class="layui-iconpicker-view layui-iconpicker-scroll">
<div v-if="showSearch" class="layui-iconpicker-search">
<lay-input @input="search" @clear="clear" autocomplete="true" :allow-clear="true">
<lay-input
@input="search"
@clear="clear"
autocomplete="true"
:allow-clear="true"
>
<template #prefix>
<i class="layui-icon layui-icon-search"></i>
</template>
</lay-input>
</div>
<div class="layui-iconpicker-list">
<lay-scroll style="height:200px;" thumbColor="rgb(238, 238, 238)">
<lay-scroll style="height: 200px" thumbColor="rgb(238, 238, 238)">
<ul>
<li v-for="icon in icones" :key="icon" :class="[selectedIcon === icon.class ? 'layui-this' : '']"
@click="selectIcon(icon.class)">
<li
v-for="icon in icones"
:key="icon"
:class="[selectedIcon === icon.class ? 'layui-this' : '']"
@click="selectIcon(icon.class)"
>
<i class="layui-icon" :class="[icon.class]"></i>
<p class="layui-elip">
{{ icon.name }}
@ -166,13 +179,26 @@ const searchList = (str: string, container: any) => {
</div>
<div v-if="page" class="layui-iconpicker-page">
<div id="layui-laypage-1" class="layui-laypage layui-laypage-default">
<span class="layui-laypage-count">共 {{ total }} 个</span><a href="javascript:;" class="layui-laypage-prev"
:class="[currentPage === 1 ? 'layui-disabled' : '']" @click="prev()"><i
class="layui-icon layui-icon-left"></i></a><span class="layui-laypage-curr"><em
class="layui-laypage-em"></em><em>{{ currentPage }} / {{ totalPage }}</em></span><span
class="layui-laypage-spr">…</span><a href="javascript:;" class="layui-laypage-last" title="尾页">14</a><a
href="javascript:;" :class="[currentPage === totalPage ? 'layui-disabled' : '']"
class="layui-laypage-next" @click="next()"><i class="layui-icon layui-icon-right"></i></a>
<span class="layui-laypage-count">共 {{ total }} 个</span
><a
href="javascript:;"
class="layui-laypage-prev"
:class="[currentPage === 1 ? 'layui-disabled' : '']"
@click="prev()"
><i class="layui-icon layui-icon-left"></i></a
><span class="layui-laypage-curr"
><em class="layui-laypage-em"></em
><em>{{ currentPage }} / {{ totalPage }}</em></span
><span class="layui-laypage-spr">…</span
><a href="javascript:;" class="layui-laypage-last" title="尾页"
>14</a
><a
href="javascript:;"
:class="[currentPage === totalPage ? 'layui-disabled' : '']"
class="layui-laypage-next"
@click="next()"
><i class="layui-icon layui-icon-right"></i
></a>
</div>
</div>
</div>

16
package/component/src/component/select/index.less
View File

@ -64,13 +64,11 @@ dl.layui-anim-upbit > dd .layui-form-checkbox,
}
.layui-form-select {
.layui-input {
border: 1px solid #eeeeee;
}
position: relative;
}
.layui-form-select .layui-input {
.layui-select-title .layui-input {
padding-left: 10px;
padding-right: 30px;
cursor: pointer;
}
@ -158,16 +156,6 @@ dl.layui-anim-upbit > dd .layui-form-checkbox,
padding: 0 10px;
cursor: pointer;
.layui-input-wrapper {
border: unset;
border-bottom: 1px solid var(--input-border-color);
.layui-input {
border: unset;
padding-left: 0;
}
}
.layui-input-wrapper:focus-within {
border-color: var(--input-border-color);
}

5
package/component/src/component/select/index.vue
View File

@ -104,14 +104,12 @@ watch(props, () => {
}
} else {
selectItem.value.value = value;
//
selectItem.value.label = ItemsMap.value[value] || "";
}
});
// 禁止操作子项
const disabledItemMap: { [key: string | number]: boolean } = {};
const txt = ref("");
const disabledItemMap: { [key: string | number]: boolean } = {};
const input = ref(false);
const value = computed({
set(v: any) {
@ -254,7 +252,6 @@ provide("keyword", txt);
:placeholder="placeholder"
prefix-icon="layui-icon-search"
allow-clear
autocomplete
>
</lay-input>
</div>