fix:用户管理用户信息界面

src/views/user-center/user/index.vue

@@ -9,57 +9,52 @@ import { doGetUserList } from '@/service/api/user';
 import type { UserInfo, SearchModel } from '@/views/user-center/user/type';
 
 // 修改API函数实现
-const doGetUserInfo: AntDesign.TableApiFn<UserInfo, SearchModel> = async (params: SearchModel) => {
+const doGetUserInfo = async (params: SearchModel) => {
   try {
-    console.log('Search params received in API function:', params);
+    console.log('API function received params:', params);
 
-    // 构造API请求参数
-    const apiParams = {
+    const apiParams: Api.SystemManage.UserSearchParams = {
       userName: params.username,
       email: params.email,
       pageNum: params.pageNum,
       pageSize: params.pageSize
     };
 
-    console.log('Sending to API:', apiParams);
+    console.log('Sending API request with params:', apiParams);
 
-    const { data, error } = await doGetUserList(apiParams);
-    console.log('Response:', data, error);
+    const response = await doGetUserList(apiParams);
 
-    if (error) {
+    if (!response.data) {
       return {
         data: {
           rows: [],
           total: 0
-        },
-        error: null
+        }
       };
     }
 
     return {
       data: {
-        rows: data.rows.map(user => ({
+        rows: response.data.rows.map(user => ({
           userId: user.userId,
           username: user.userName,
           fullname: user.nickName,
           sex: user.sex === '1' ? 'M' : 'F',
           birthdate: user.createTime?.split(' ')[0] || '-',
-          age: 0, // 如果后端没有提供年龄字段，可以设为0或者根据生日计算
+          age: calculateAge(user.createTime),
           email: user.email,
           phonenumber: user.phonenumber,
-          isKYC: user.status === '0' // 假设status为'0'表示已验证
+          isKYC: user.status === '0'
         })),
-        total: data.total
-      },
-      error: null
+        total: response.data.total
+      }
     };
   } catch (err) {
     return {
       data: {
         rows: [],
         total: 0
-      },
-      error: null
+      }
     };
   }
 };
@@ -83,7 +78,7 @@ const {
   mobilePagination,
   searchParams,
   updateSearchParams,
-  resetSearchParams
+
 } = useTable({
   apiFn: doGetUserInfo,
   immediate: true,
@@ -166,26 +161,53 @@ const {
   ]
 });
 
+const handUpdateModel = (item: SearchModel) => {
+  console.log('Received updated model:', item);
+  // 更新搜索参数
+  updateSearchParams({
+    ...item,
+    pageNum: 1  // 每次搜索条件改变时重置页码
+  });
+};
+
 // 处理搜索
 const handleSearch = () => {
-  // 使用 updateSearchParams 更新搜索参数
-  updateSearchParams({
-    ...searchParams,
-    pageNum: 1 // 搜索时重置页码
-  });
+  // 直接使用已更新的搜索参数
+  console.log('Executing search with params:', searchParams.value);
   getData();
 };
 
 // 处理重置
 const handleReset = () => {
-  const defaultParams = {
+  // 定义默认参数
+  const defaultParams: SearchModel = {
     pageNum: 1,
     pageSize: 10,
     username: undefined,
     email: undefined
   };
+
+  console.log('Resetting search params to:', defaultParams);
+
+  // 更新搜索参数到默认值
   updateSearchParams(defaultParams);
-  resetSearchParams();
+
+  // 重新获取数据
+  getData();
+};
+
+const calculateAge = (birthDate: string): number => {
+  if (!birthDate) return 0;
+  const birth = new Date(birthDate);
+  const today = new Date();
+  let age = today.getFullYear() - birth.getFullYear();
+  const monthDiff = today.getMonth() - birth.getMonth();
+
+  if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birth.getDate())) {
+    age--;
+  }
+
+  return age;
 };
 </script>
 
@@ -194,6 +216,7 @@ const handleReset = () => {
     <div class="min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
       <UserSearch
         v-model:model="searchParams"
+        @updateModel="handUpdateModel"
         @reset="handleReset"
         @search="handleSearch"
       />

src/views/user-center/user/modules/user-search.vue

@@ -8,60 +8,69 @@ const props = defineProps<{
 }>();
 
 const emit = defineEmits<{
-  'update:model': [value: SearchModel];
+  'updateModel': [value: SearchModel];
   'reset': [];
   'search': [];
 }>();
 
 const formRef = ref<FormInstance>();
-const localSearchParams = ref<SearchModel>({
-  pageNum: props.model.pageNum,
-  pageSize: props.model.pageSize,
-  username: props.model.username,
-  email: props.model.email
-});
+
 
 // 修改计算属性的实现
 const formModel = computed({
   get: () => ({
-    username: props.model.username,
-    email: props.model.email
+    username: props.model.username ?? '',
+    email: props.model.email ?? ''
   }),
-  set: (val: Partial<SearchModel>) => {
-    emit('update:model', {
+  set: (val: Partial<{ username: string; email: string }>) => {
+    emit('updateModel', {
       ...props.model,
-      ...val
+      username: val.username || undefined,
+      email: val.email || undefined
     });
   }
 });
 
 const handleReset = () => {
+  // 重置表单字段
   formRef.value?.resetFields();
-  localSearchParams.value = {
+
+  // 重置表单模型的值
+  formModel.value = {
+    username: '',
+    email: ''
+  };
+
+  // 定义默认参数
+  const defaultParams: SearchModel = {
     pageNum: 1,
     pageSize: 10,
     username: undefined,
     email: undefined
   };
-  emit('update:model', localSearchParams.value);
+
+  console.log('Emitting reset with params:', defaultParams);
+
+  // 发送更新事件
+  emit('updateModel', defaultParams);
+  // 发送重置事件
   emit('reset');
 };
 
 const handleSearch = () => {
-  // 确保搜索时更新所有参数
+  console.log('Search form values:', formModel.value);
+
+  // 确保所有必要的字段都存在
   const updatedParams: SearchModel = {
-    ...props.model,
-    pageNum: 1,
-    pageSize: 10,
-    username: formModel.value.username,
-    email: formModel.value.email
+    pageNum: props.model.pageNum || 1,
+    pageSize: props.model.pageSize || 10,
+    username: formModel.value.username || undefined,
+    email: formModel.value.email || undefined
   };
 
-  console.log('Search triggered with params:', updatedParams);
+  console.log('Emitting updated params:', updatedParams);
 
-  // 直接更新父组件的参数
-  emit('update:model', updatedParams);
-  // 触发搜索
+  emit('updateModel', updatedParams);
   emit('search');
 };
 </script>

src/views/user-center/user/type.ts

@@ -1,3 +1,10 @@
+export interface SearchModel {
+  pageNum: number;
+  pageSize: number;
+  username?: string;
+  email?: string;
+}
+
 export interface UserInfo {
   userId: number;
   username: string;
@@ -10,9 +17,22 @@ export interface UserInfo {
   isKYC: boolean;
 }
 
-export type SearchModel = {
-  pageNum: number;
-  pageSize: number;
-  username?: string;
-  email?: string;
-};
+// 添加后端API返回的用户类型
+export interface ApiUser {
+  userId: number;
+  userName: string;
+  nickName: string;
+  email: string;
+  phonenumber: string;
+  sex: string;
+  status: '0' | '1';
+  createTime: string;
+}
+
+// API响应类型
+export interface ApiResponse<T> {
+  rows: T[];
+  total: number;
+  code: number;
+  msg: string;
+}