模糊搜索ui修改

This commit is contained in:
unknown 2022-11-15 18:23:26 +08:00
parent db469bd53d
commit 6d806547ef
3 changed files with 62 additions and 37 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 398 B

View File

@ -21,21 +21,21 @@
@change="onSearch" @change="onSearch"
class="resultListSearchInput" class="resultListSearchInput"
/> />
<button class="button-reset" @click="chongzhi()">重置</button> <i class="searchImg" aria-hidden="true"></i>
<button <button
class="button-reset" class="button-reset"
style="margin-left: 0.1rem"
@click="globalSearch()" @click="globalSearch()"
> >
全局搜索 全局搜索
</button> </button>
<button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
<button <button
v-if="Cardsname == '应用资源'" v-if="Cardsname == '应用资源'"
class="button-reset" class="button-reset"
@click="applyAll()" @click="applyAll()"
style="margin-left: 0.1rem" style="margin-left: 0.1rem;width:135px"
> >
全部申请 申请全部应用资源
</button> </button>
<div class="hengxian" style="background: transparent"></div> <div class="hengxian" style="background: transparent"></div>
</div> </div>
@ -168,14 +168,14 @@
@change="onSearch" @change="onSearch"
class="resultListSearchInput" class="resultListSearchInput"
/> />
<button class="button-reset" @click="chongzhi()">重置</button> <i class="searchImg" aria-hidden="true"></i>
<button <button
class="button-reset" class="button-reset"
style="margin-left: 0.1rem"
@click="globalSearch()" @click="globalSearch()"
> >
全局搜索 全局搜索
</button> </button>
<button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
<div class="hengxian" style="background: transparent"></div> <div class="hengxian" style="background: transparent"></div>
</div> </div>
</div> </div>
@ -228,14 +228,14 @@
@change="onSearch" @change="onSearch"
class="resultListSearchInput" class="resultListSearchInput"
/> />
<button class="button-reset" @click="chongzhi()">重置</button> <i class="searchImg" aria-hidden="true"></i>
<button <button
class="button-reset" class="button-reset"
style="margin-left: 0.1rem"
@click="globalSearch()" @click="globalSearch()"
> >
全局搜索 全局搜索
</button> </button>
<button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
<div class="hengxian" style="background: transparent"></div> <div class="hengxian" style="background: transparent"></div>
</div> </div>
</div> </div>
@ -334,7 +334,8 @@
@change="onSearch" @change="onSearch"
class="resultListSearchInput" class="resultListSearchInput"
/> />
<button class="button-reset" @click="chongzhi()">重置</button> <i class="searchImg" aria-hidden="true"></i>
<button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
<div class="hengxian"></div> <div class="hengxian"></div>
</div> </div>
</div> </div>
@ -481,7 +482,8 @@
@change="onSearch" @change="onSearch"
class="resultListSearchInput" class="resultListSearchInput"
/> />
<button class="button-reset" @click="chongzhi()">重置</button> <i class="searchImg" aria-hidden="true"></i>
<button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
</div> </div>
</div> </div>
<KnowledgeBase <KnowledgeBase
@ -538,7 +540,8 @@
@change="onSearch" @change="onSearch"
class="resultListSearchInput" class="resultListSearchInput"
/> />
<button class="button-reset" @click="chongzhi()">重置</button> <i class="searchImg" aria-hidden="true"></i>
<button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
<div class="hengxian"></div> <div class="hengxian"></div>
</div> </div>
</div> </div>
@ -703,7 +706,8 @@
@change="onSearch" @change="onSearch"
class="resultListSearchInput" class="resultListSearchInput"
/> />
<button class="button-reset" @click="chongzhi()">重置</button> <i class="searchImg" aria-hidden="true"></i>
<button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
</div> </div>
</div> </div>
<KnowledgeBase <KnowledgeBase
@ -1930,13 +1934,21 @@
.resultListSearchInput-son { .resultListSearchInput-son {
background: #fff; background: #fff;
padding: 0.2rem 0.2rem 0rem 0.3rem; padding: 0.2rem 0.2rem 0rem 0.3rem;
position: relative;
.hengxian { .hengxian {
width: 100%; width: 100%;
height: 0.01rem; height: 0.01rem;
background: rgba(150, 144, 144, 0.3); background: rgba(150, 144, 144, 0.3);
margin-top: 0.2rem; margin-top: 0.2rem;
} }
.searchImg{
width: 17px;
height: 17px;
background: url('~@/assets/home/searchInner.png');
position: absolute;
top: 29px;
left: 480px;
}
} }
} }
@ -1945,20 +1957,20 @@
:deep(.ant-input) { :deep(.ant-input) {
width: 4rem; width: 4rem;
height: 0.36rem; height: 0.32rem;
background: #fff; background: #fff;
border-radius: 0.04rem; border-radius: 0.02rem;
} }
:deep(.ant-input-search-button) { :deep(.ant-input-search-button) {
width: 0.8rem; width: 0.8rem;
height: 0.36rem; height: 0.32rem;
background: #0087ff; background: #0558e1;
border-radius: 0.04rem !important; border-radius: 0.02rem !important;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 400; font-weight: 400;
color: #fff; color: #fff;
line-height: 0.34rem; line-height: 0.32rem;
margin-left: 0.1rem; margin-left: 0.1rem;
} }
@ -1971,13 +1983,15 @@
border: 0; border: 0;
outline: none; outline: none;
width: 0.8rem; width: 0.8rem;
height: 0.36rem; height: 0.32rem;
background: #e1edfa; color: #fff;
border-radius: 0.04rem; //background: #e1edfa;
background: #0558e1;
border-radius: 0.02rem;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 400; font-weight: 400;
color: #0087ff; //color: #0087ff;
line-height: 0.34rem; line-height: 0.32rem;
margin-left: 2.5rem; margin-left: 2.5rem;
cursor: pointer; cursor: pointer;
} }

View File

@ -29,6 +29,7 @@
@change="onSearch" @change="onSearch"
class="resultListSearchInput" class="resultListSearchInput"
/> />
<i class="searchImg" aria-hidden="true"></i>
<button class="button-reset" @click="resetAction()">重置</button> <button class="button-reset" @click="resetAction()">重置</button>
<div class="hengxian"></div> <div class="hengxian"></div>
</div> </div>
@ -342,6 +343,14 @@
background: rgba(150, 144, 144, 0.3); background: rgba(150, 144, 144, 0.3);
margin-top: 0.2rem; margin-top: 0.2rem;
} }
.searchImg{
width: 17px;
height: 17px;
background: url('~@/assets/home/searchInner.png');
position: absolute;
top: 139px;
left: 500px;
}
} }
} }
@ -350,20 +359,20 @@
:deep(.ant-input) { :deep(.ant-input) {
width: 4rem; width: 4rem;
height: 0.36rem; height: 0.32rem;
background: #fff; background: #fff;
border-radius: 0.04rem; border-radius: 0.02rem;
} }
:deep(.ant-input-search-button) { :deep(.ant-input-search-button) {
width: 0.8rem; width: 0.8rem;
height: 0.36rem; height: 0.32rem;
background: #0087ff; background: #0558e1;
border-radius: 0.04rem !important; border-radius: 0.02rem !important;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 400; font-weight: 400;
color: #fff; color: #fff;
line-height: 0.34rem; line-height: 0.32rem;
margin-left: 0.1rem; margin-left: 0.1rem;
} }
@ -376,13 +385,15 @@
border: 0; border: 0;
outline: none; outline: none;
width: 0.8rem; width: 0.8rem;
height: 0.36rem; height: 0.32rem;
background: #e1edfa; //background: #e1edfa;
border-radius: 0.04rem; background: #0558e1;
border-radius: 0.02rem;
font-size: 0.14rem; font-size: 0.14rem;
font-weight: 400; font-weight: 400;
color: #0087ff; //color: #0087ff;
line-height: 0.34rem; color: #fff;
line-height: 0.32rem;
margin-left: 2.5rem; margin-left: 2.5rem;
cursor: pointer; cursor: pointer;
} }