fix: 修复搜索偶尔无效的情况

This commit is contained in:
Pang 2024-03-10 11:03:34 +08:00
parent b53462cf6e
commit b4f2da66be
10 changed files with 98 additions and 64 deletions

View File

@ -52,12 +52,13 @@
</li>
</ul>
</Scrollbar>
<Input class="search-input" v-model="searchKey" :placeholder="localPlaceholder" clearable>
<div class="search-pre" slot="prefix">
<div class="search-input">
<div class="search-pre">
<Loading v-if="loadIng > 0"/>
<Icon v-else type="ios-search" />
</div>
</Input>
<Input v-model="searchKey" :placeholder="localPlaceholder" clearable/>
</div>
</div>
<!-- 切换 -->

View File

@ -173,12 +173,11 @@
<div
v-if="(projectSearchShow || projectTotal > 20) && windowHeight > 600"
class="manage-project-search">
<Input v-model="projectKeyValue" :placeholder="$L(`共${projectTotal || cacheProjects.length}个项目,搜索...`)" clearable>
<div class="search-pre" slot="prefix">
<Loading v-if="projectKeyLoading > 0"/>
<Icon v-else type="ios-search" />
</div>
</Input>
<div class="search-pre">
<Loading v-if="projectKeyLoading > 0"/>
<Icon v-else type="ios-search" />
</div>
<Input v-model="projectKeyValue" :placeholder="$L(`共${projectTotal || cacheProjects.length}个项目,搜索...`)" clearable/>
</div>
<ButtonGroup class="manage-box-new-group">
<Button class="manage-box-new" type="primary" icon="md-add" @click="onAddShow">{{$L('新建项目')}}</Button>

View File

@ -122,13 +122,12 @@
<i class="taskfont" @click="onSearchSwitch('next')">&#xe705;</i>
</div>
<div class="search-input">
<Input ref="searchInput" v-model="searchKey" :placeholder="$L('搜索消息')" @on-keyup="onSearchKeyup" clearable>
<div class="search-pre" slot="prefix">
<Loading v-if="searchLoad > 0"/>
<Icon v-else type="ios-search" />
</div>
</Input>
<div v-if="searchLoad === 0 && searchResult.length > 0" class="search-total" slot="append">{{searchLocation}}/{{searchResult.length}}</div>
<div class="search-pre">
<Loading v-if="searchLoad > 0"/>
<Icon v-else type="ios-search" />
</div>
<Input ref="searchInput" v-model="searchKey" :placeholder="$L('搜索消息')" @on-keyup="onSearchKeyup" clearable/>
<div v-if="searchLoad === 0 && searchResult.length > 0" class="search-total">{{searchLocation}}/{{searchResult.length}}</div>
</div>
<div class="search-cancel" @click="onSearchKeyup(null)">{{$L('取消')}}</div>
</div>

View File

@ -3,12 +3,11 @@
<PageTitle :title="$L('项目')"/>
<div class="list-search">
<div class="search-wrapper">
<Input v-model="projectKeyValue" :placeholder="$L(loadProjects > 0 ? '更新中...' : '搜索')" clearable>
<div class="search-pre" slot="prefix">
<Loading v-if="loadProjects > 0"/>
<Icon v-else type="ios-search" />
</div>
</Input>
<div class="search-pre">
<Loading v-if="loadProjects > 0"/>
<Icon v-else type="ios-search" />
</div>
<Input v-model="projectKeyValue" :placeholder="$L(loadProjects > 0 ? '更新中...' : '搜索')" clearable/>
</div>
</div>
<ul @touchstart="onTouchStart" @scroll="onScroll">

View File

@ -5,30 +5,24 @@
<div class="messenger-select">
<div class="messenger-search">
<div class="search-wrapper">
<div class="search-pre">
<Loading v-if="searchLoading"/>
<Icon v-else type="ios-search" />
</div>
<Input
v-if="tabActive==='dialog'"
v-model="dialogSearchKey"
ref="searchInput"
:placeholder="$L(loadDialogs > 0 ? '更新中...' : '搜索')"
@on-keydown="onKeydown"
clearable>
<div class="search-pre" slot="prefix">
<Loading v-if="dialogLoading"/>
<Icon v-else type="ios-search" />
</div>
</Input>
clearable/>
<Input
v-else
v-model="contactsKey"
ref="contactInput"
:placeholder="$L('搜索')"
@on-keydown="onKeydown"
clearable>
<div class="search-pre" slot="prefix">
<Loading v-if="contactsLoad"/>
<Icon v-else type="ios-search" />
</div>
</Input>
clearable/>
</div>
</div>
<div v-if="tabActive==='dialog' && !dialogSearchKey" class="messenger-nav">
@ -496,9 +490,13 @@ export default {
}
},
dialogLoading({loadDialogs, dialogSearchLoad}) {
return loadDialogs > 0 || dialogSearchLoad > 0
}
searchLoading({tabActive, loadDialogs, dialogSearchLoad, contactsLoad}) {
if (tabActive==='dialog') {
return loadDialogs > 0 || dialogSearchLoad > 0
} else {
return contactsLoad > 0
}
},
},
watch: {

View File

@ -152,15 +152,21 @@
}
.search-input {
.ivu-input {
height: 36px;
border-color: #f4f5f7;
background-color: #f4f5f7;
}
flex: 1;
display: flex;
align-items: center;
justify-content: center;
background-color: #f4f5f7;
border-radius: 6px;
height: 36px;
padding: 0 6px;
.search-pre {
width: 100%;
height: 100%;
width: 32px;
height: 32px;
margin-right: -6px;
font-size: 16px;
color: #808695;
display: flex;
align-items: center;
justify-content: center;
@ -171,6 +177,15 @@
margin: 0;
}
}
.ivu-input {
border-color: transparent;
background-color: transparent;
&:hover,
&:focus {
box-shadow: none;
}
}
}
}

View File

@ -390,6 +390,7 @@
}
.search-input {
flex: 1;
padding: 0 6px;
margin-left: 12px;
border-radius: 12px;
background-color: #F7F7F7;
@ -397,13 +398,18 @@
position: relative;
display: flex;
align-items: center;
justify-content: center;
.search-pre {
width: 100%;
height: 100%;
width: 32px;
height: 32px;
margin-right: -6px;
font-size: 16px;
color: #808695;
display: flex;
align-items: center;
justify-content: center;
.common-loading {
width: 14px;
height: 14px;

View File

@ -18,14 +18,20 @@
.search-wrapper {
flex: 1;
background-color: #ffffff;
padding: 0 8px;
padding: 0 6px;
margin: 0 4px;
border-radius: 12px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
.search-pre {
width: 100%;
height: 100%;
width: 32px;
height: 32px;
margin-right: -6px;
font-size: 16px;
color: #808695;
display: flex;
align-items: center;
justify-content: center;

View File

@ -216,23 +216,20 @@
}
.manage-project-search {
width: 80%;
padding: 0 3px;
padding: 0 6px;
margin: 8px 0 -2px;
border-radius: 12px;
background-color: #ffffff;
overflow: hidden;
.ivu-input {
padding-left: 30px;
border-color: transparent;
background-color: transparent;
&:hover,
&:focus {
box-shadow: none;
}
}
display: flex;
align-items: center;
justify-content: center;
.search-pre {
width: 100%;
height: 100%;
width: 32px;
height: 32px;
margin-right: -6px;
font-size: 16px;
color: #808695;
display: flex;
align-items: center;
justify-content: center;
@ -242,6 +239,14 @@
margin: 0;
}
}
.ivu-input {
border-color: transparent;
background-color: transparent;
&:hover,
&:focus {
box-shadow: none;
}
}
}
.manage-box-new-group {
width: 80%;

View File

@ -33,13 +33,19 @@
.search-wrapper {
flex: 1;
background-color: #F7F7F7;
padding: 0 8px;
padding: 0 6px;
margin: 0 4px;
border-radius: 12px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
.search-pre {
width: 100%;
height: 100%;
width: 32px;
height: 32px;
margin-right: -6px;
font-size: 16px;
color: #808695;
display: flex;
align-items: center;
justify-content: center;