fix EventRecordList.vue style

src/pages/event/EventRecordList.vue

@@ -1,6 +1,7 @@
 <template>
 	<div v-can="permissionCodes.eventRecord.read" class="registration-record-list">
 		<div class="search-bar">
+			<div class="search-status">
 				<t-input
 					v-model.trim="keyword"
 					class="search-input"
@@ -8,14 +9,16 @@
 					borderless
 					placeholder="搜索客户、姓名拼音、编码、事件、备注、登记人"
 				/>
-			<div class="filter-line">
+				<t-dropdown-menu class="date-filter">
-				<t-dropdown-menu class="filter-menu">
 					<t-dropdown-item
 						v-model="dateFilterType"
 						:label="dateFilterLabel"
 						:options="dateOptions"
 						@change="selectDateFilter"
 					/>
+				</t-dropdown-menu>
+			</div>
+			<t-dropdown-menu class="filter-menu">
 				<t-dropdown-item
 					v-model="actionFilter"
 					:label="eventFilterLabel"
@@ -29,16 +32,15 @@
 					:options="verificationOptions"
 				/>
 				<t-dropdown-item
-						v-if="optionFilterOptions.length"
 					v-model="optionFilter"
 					:label="optionFilterLabel"
+					:disabled="!optionFilterOptions.length"
 					options-columns="2"
 					:options="optionFilterOptions"
 					multiple
 				/>
 			</t-dropdown-menu>
 		</div>
-		</div>
 		<t-pull-down-refresh
 			v-model="isRefreshing"
 			:refresh-timeout="30000"
@@ -717,15 +719,36 @@ onUnmounted(() => {
 		box-shadow: var(--td-shadow-1);
 		flex-direction: column;
 
-		.search-input {
+		.search-status {
-			--td-input-vertical-padding: 8px 14px;
+			display: flex;
 
+			.search-input {
+				--td-input-vertical-padding: .25rem 1rem;
+
+				flex: 1;
 				border: 1px solid rgba(148, 163, 184, .28);
-			z-index: 1;
+				z-index: 2;
 				background: #f8fbff;
 				border-radius: 1rem;
 			}
 
+			.date-filter {
+				--td-spacer: 4px;
+				--td-spacer-1: 6px;
+
+				border: 1px solid rgba(148, 163, 184, .18);
+				z-index: 1;
+				margin-left: -2.5rem;
+				padding-left: 3rem;
+				padding-right: .7rem;
+				border-radius: 1rem;
+
+				&:after {
+					display: none;
+				}
+			}
+		}
+
 		.filter-menu {
 			--td-spacer-1: 6px;
 
@@ -735,6 +758,7 @@ onUnmounted(() => {
 			padding-top: .8rem;
 			background: #fff;
 			border: 1px solid rgba(148, 163, 184, .18);
+			border-top: none;
 			border-radius: 0 0 1rem 1rem;
 
 			&:after {
@@ -795,6 +819,7 @@ onUnmounted(() => {
 				border-color: rgba(148, 163, 184, .16);
 			}
 
+			.date-filter,
 			.filter-menu {
 				background: #172033;
 				border-color: rgba(148, 163, 184, .16);