style: 历史页面样式修改

This commit is contained in:
zhangyh
2025-09-26 13:08:18 +08:00
parent 6e2da909b0
commit ac6f8ea341

View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="table_search_bar flex flex-justify-between flex-align-center"> <div class="table_search_bar flex flex-align-center flex-justify-between">
<div class="search_preset flex flex-1"> <div class="search_preset flex ">
<div <div
class="preset_item gallery_btn white" class="preset_item gallery_btn white"
v-for="item in buttonList" v-for="item in buttonList"
@@ -11,15 +11,15 @@
{{ item.label }} {{ item.label }}
</div> </div>
</div> </div>
<div class="search_input flex flex-align-center"> <div class="search_input flex flex-align-center" :style="{ width: inputWidth }">
<input <input
class="search_input_inner flex-1" class="search_input_inner"
v-model="searchParams.searchText" v-model="searchParams.searchText"
:bordered="false" :bordered="false"
@keydown.enter="handleSearch" @keydown.enter="handleSearch"
:placeholder="placeholder" :placeholder="placeholder"
/> />
<SearchOutlined @click="handleSearch" /> <SearchOutlined class="search_input_icon" @click="handleSearch" />
</div> </div>
</div> </div>
</template> </template>
@@ -36,6 +36,7 @@ interface ButtonItem {
interface Props { interface Props {
buttonList: ButtonItem[] buttonList: ButtonItem[]
placeholder?: string placeholder?: string
inputWidth?: string
} }
interface SearchParams { interface SearchParams {
@@ -91,11 +92,13 @@ const handleSearch = () => {
line-height: 4rem; line-height: 4rem;
min-width: 10rem; min-width: 10rem;
font-weight: normal; font-weight: normal;
border-width: 0.1rem;
} }
} }
.search_input { .search_input {
height: 4rem; height: 4rem;
width: 23rem; // 默认宽度
background-color: #fff; background-color: #fff;
border: 0.1rem solid #000; border: 0.1rem solid #000;
border-radius: 43rem; border-radius: 43rem;
@@ -106,6 +109,10 @@ const handleSearch = () => {
height: 100%; height: 100%;
padding-left: 3rem; padding-left: 3rem;
border-radius: 4rem; border-radius: 4rem;
width: calc(100% - 2rem);
}
.search_input_icon {
font-size: 2rem;
} }
} }
} }