From 410b6c40cb08aae980613c00b6b9374cf757c0d6 Mon Sep 17 00:00:00 2001
From: zhongzm <zhongzm@agt.com>
Date: Fri, 14 Feb 2025 14:35:34 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E7=94=A8=E6=88=B7=E4=BF=A1?=
 =?UTF-8?q?=E6=81=AF=E7=95=8C=E9=9D=A2=E6=90=9C=E7=B4=A2=E6=A0=8F=E9=87=8D?=
 =?UTF-8?q?=E7=BD=AE=E5=8A=9F=E8=83=BD=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/user-center/user/index.vue          |  17 +--
 .../user-center/user/modules/user-search.vue  | 124 +++++++-----------
 2 files changed, 50 insertions(+), 91 deletions(-)

diff --git a/src/views/user-center/user/index.vue b/src/views/user-center/user/index.vue
index 9466471..e8c1537 100644
--- a/src/views/user-center/user/index.vue
+++ b/src/views/user-center/user/index.vue
@@ -205,18 +205,13 @@ const handleSearch = () => {
 
 // 处理重置
 const handleReset = () => {
-  // 定义默认参数
-  const defaultParams: SearchModel = {
-    pageNum: 1,
-    pageSize: 10,
-    username: undefined,
-    email: undefined
-  };
+  const currentPageSize = searchParams.pageSize;
 
-  console.log('Resetting search params to:', defaultParams);
-
-  // 更新搜索参数到默认值
-  updateSearchParams(defaultParams);
+  // 重置搜索参数
+  searchParams.username = '';
+  searchParams.email = '';
+  searchParams.pageNum = 1;
+  searchParams.pageSize = currentPageSize;
 
   // 重新获取数据
   getData();
diff --git a/src/views/user-center/user/modules/user-search.vue b/src/views/user-center/user/modules/user-search.vue
index 52194de..c0d1e0b 100644
--- a/src/views/user-center/user/modules/user-search.vue
+++ b/src/views/user-center/user/modules/user-search.vue
@@ -1,113 +1,77 @@
 <script setup lang="ts">
-import { ref, computed } from 'vue';
-import type { FormInstance } from 'ant-design-vue';
-import type { SearchModel } from '@/views/user-center/user/type';
+import { Form as AForm, FormItem as AFormItem, Input as AInput, Button as AButton, Space as ASpace, Card as ACard } from 'ant-design-vue';
 import { useI18n } from 'vue-i18n';
+import { computed } from 'vue';
+
 const { t } = useI18n();
-const props = defineProps<{
-  model: SearchModel;
-}>();
 
-const emit = defineEmits<{
-  'updateModel': [value: SearchModel];
-  'reset': [];
-  'search': [];
-}>();
+interface Props {
+  model: {
+    username?: string;
+    email?: string;
+    pageNum: number;
+    pageSize: number;
+  };
+  loading?: boolean;
+}
 
-const formRef = ref<FormInstance>();
-
-
-// 修改计算属性的实现
-const formModel = computed({
-  get: () => ({
-    username: props.model.username ?? '',
-    email: props.model.email ?? ''
-  }),
-  set: (val: Partial<{ username: string; email: string }>) => {
-    emit('updateModel', {
-      ...props.model,
-      username: val.username || undefined,
-      email: val.email || undefined
-    });
-  }
+const props = withDefaults(defineProps<Props>(), {
+  loading: false
 });
 
-const handleReset = () => {
-  // 重置表单字段
-  formRef.value?.resetFields();
+const emit = defineEmits(['update:model', 'search', 'reset']);
 
-  // 重置表单模型的值
-  formModel.value = {
-    username: '',
-    email: ''
-  };
+// 使用计算属性来处理双向绑定
+const formModel = computed({
+  get: () => props.model,
+  set: (val) => emit('update:model', val)
+});
 
-  // 定义默认参数
-  const defaultParams: SearchModel = {
-    pageNum: 1,
-    pageSize: 10,
-    username: undefined,
-    email: undefined
-  };
-
-  console.log('Emitting reset with params:', defaultParams);
-
-  // 发送更新事件
-  emit('updateModel', defaultParams);
-  // 发送重置事件
-  emit('reset');
+const search = () => {
+  emit('search');
 };
 
-const handleSearch = () => {
-  console.log('Search form values:', formModel.value);
-
-  // 确保所有必要的字段都存在
-  const updatedParams: SearchModel = {
-    pageNum: props.model.pageNum || 1,
-    pageSize: props.model.pageSize || 10,
-    username: formModel.value.username || undefined,
-    email: formModel.value.email || undefined
-  };
-
-  console.log('Emitting updated params:', updatedParams);
-
-  emit('updateModel', updatedParams);
-  emit('search');
+const reset = () => {
+  // 只触发重置事件
+  emit('reset');
 };
 </script>
 
 <template>
-  <ACard :bordered="false">
-    <AForm
-      ref="formRef"
-      :model="formModel"
-      layout="inline"
-      class="flex flex-wrap gap-16px items-center"
-    >
-      <AFormItem :label="t('page.user.username')" name="username">
+  <ACard :bordered="false" class="search-card">
+    <AForm layout="inline">
+      <AFormItem :label="t('page.user.username')">
         <AInput
           v-model:value="formModel.username"
           :placeholder="t('page.user.pleusername')"
           allow-clear
+          class="w-200px"
+          @pressEnter="search"
         />
       </AFormItem>
-      <AFormItem :label="t('page.user.email')" name="email">
+      <AFormItem :label="t('page.user.email')">
         <AInput
           v-model:value="formModel.email"
           :placeholder="t('page.user.pleemail')"
           allow-clear
+          class="w-200px"
+          @pressEnter="search"
         />
       </AFormItem>
-      <AFormItem class="flex-1 justify-end mb-0">
+      <AFormItem>
         <ASpace>
-          <AButton type="primary" ghost @click="handleSearch">
+          <AButton type="primary" ghost :loading="loading" @click="search">
             <template #icon>
-            <icon-mdi-search />
-          </template>{{ t('page.user.search') }}</AButton>
-          <AButton @click="handleReset">
+              <icon-mdi-search />
+            </template>
+            {{ t('page.user.search') }}
+          </AButton>
+          <AButton @click="reset">
             <template #icon>
-            <icon-mdi-refresh />
-          </template>{{ t('page.user.reset') }}</AButton>
+              <icon-mdi-refresh />
+            </template>
+            {{ t('page.user.reset') }}
+          </AButton>
         </ASpace>
       </AFormItem>
     </AForm>