scanner in CustomerSelector.vue

src/pages/event/EventRecordEdit.vue

@@ -147,6 +147,7 @@
 			v-model="selectedCustomerIdList"
 			v-model:visible="selectorVisible"
 			:selection-mode="isEditMode ? 'single' : 'multiple'"
+			:enable-scan="false"
 			@change="handleCustomerChange"
 		/>
 		<t-popup v-model="selectedCustomerListVisible" placement="bottom">

src/pages/event/EventRecordList.vue

@@ -8,7 +8,17 @@
 					type="search"
 					borderless
 					placeholder="搜索客户、姓名拼音、编码、事件、备注、登记人"
-				/>
+				>
+					<template #suffix-icon>
+						<t-button
+							size="extra-small"
+							theme="primary"
+							variant="outline"
+							content="选择客户"
+							@click.stop="customerSelectorVisible = true"
+						/>
+					</template>
+				</t-input>
 				<t-dropdown-menu class="date-filter">
 					<t-dropdown-item
 						v-model="dateFilterType"
@@ -93,6 +103,11 @@
 		</t-pull-down-refresh>
 	</div>
 	<nav-bar-action-menu v-if="canShowActionMenu" :actions="actionList" />
+	<customer-selector
+		v-model="customerId"
+		v-model:visible="customerSelectorVisible"
+		@change="handleCustomerChange"
+	/>
 	<t-popup v-model="startVisible" placement="bottom">
 		<t-date-time-picker
 			v-if="startVisible"
@@ -125,6 +140,7 @@ import { Time, WebToolkit } from "timi-web";
 import { useUserStore } from "timi-web-api";
 import EventAPI from "@/api/EventAPI";
 import EventRecordAPI from "@/api/EventRecordAPI";
+import CustomerSelector from "@/components/CustomerSelector.vue";
 import EventRecordCell from "@/pages/event/component/EventRecordCell.vue";
 import { useNavBarStore } from "@/store/navBarStore";
 import type { EventItem, EventStatus } from "@/types/EventItem";
@@ -161,6 +177,7 @@ const dateOptions: Array<{ label: string; value: DateFilterType }> = [
 
 const keyword = ref(getInitialKeyword());
 const customerId = ref(getQueryText("customerId"));
+const customerSelectorVisible = ref(false);
 const dateFilterType = ref<DateFilterType>(parseDateFilterType(route.query.dateType));
 const dateRange = ref(parseDateRange(dateFilterType.value));
 const startDraft = ref("");
@@ -270,6 +287,12 @@ const actionList = computed<NavBarAction[]>(() => {
 	return list;
 });
 
+async function handleCustomerChange(value: string | string[]): Promise<void> {
+	customerId.value = Array.isArray(value) ? String(value[0] || "") : value;
+	await replaceFilterQuery();
+	await reloadRecords();
+}
+
 watch(keyword, () => {
 	if (!initialized) {
 		return;
@@ -731,12 +754,14 @@ onUnmounted(() => {
 			display: flex;
 
 			.search-input {
+				--td-button-border-radius: .75rem;
 				--td-input-vertical-padding: .25rem 1rem;
 
 				flex: 1;
 				border: 1px solid rgba(148, 163, 184, .28);
 				z-index: 2;
 				background: #f8fbff;
+				padding-right: .3rem;
 				border-radius: 1rem;
 			}
 
@@ -769,20 +794,6 @@ onUnmounted(() => {
 			border-top: none;
 			border-radius: 0 0 1rem 1rem;
 
-			&:after {
-				display: none;
-			}
-
-			:deep(.t-dropdown-menu__item) {
-				min-width: 0;
-			}
-
-			:deep(.t-dropdown-menu__title) {
-				overflow: hidden;
-				white-space: nowrap;
-				text-overflow: ellipsis;
-			}
-
 			.option-empty-tip {
 				color: #64748b;
 				padding: .75rem 1rem;