From 6bfc1961ce986471cf900385ce8eef2d7df82634 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sun, 20 Apr 2025 08:53:32 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E5=A2=9E=E5=8A=A0=E4=B8=AA?=
 =?UTF-8?q?=E4=BA=BA=E4=B8=AD=E5=BF=83=EF=BC=9A30%=20=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E5=8F=B3=E4=BE=A7=E7=9A=84=E5=9F=BA=E6=9C=AC=E4=BF=A1=E6=81=AF?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/_core/profile/index.vue         |  11 +-
 .../views/_core/profile/modules/base-info.vue | 101 ++++++++++++++++++
 2 files changed, 107 insertions(+), 5 deletions(-)
 create mode 100644 apps/web-antd/src/views/_core/profile/modules/base-info.vue

diff --git a/apps/web-antd/src/views/_core/profile/index.vue b/apps/web-antd/src/views/_core/profile/index.vue
index c74c17b09..e4da531fa 100644
--- a/apps/web-antd/src/views/_core/profile/index.vue
+++ b/apps/web-antd/src/views/_core/profile/index.vue
@@ -1,13 +1,14 @@
 <script setup lang="ts">
 import type { SystemUserProfileApi } from '#/api/system/user/profile';
 
+import { Card, Tabs } from 'ant-design-vue';
+import { Page } from '@vben/common-ui';
+import ProfileUser from './modules/profile-user.vue';
+import BaseInfo from './modules/base-info.vue';
+
 import { onMounted, ref } from 'vue';
 import { getUserProfile } from '#/api/system/user/profile';
 import { useAuthStore } from '#/store';
-import { Card, Tabs } from 'ant-design-vue';
-import { Page } from '@vben/common-ui';
-
-import ProfileUser from './modules/profile-user.vue';
 
 const authStore = useAuthStore();
 const activeName = ref('basicInfo');
@@ -43,7 +44,7 @@ onMounted(loadProfile);
       <Card class="ml-3 w-3/5">
         <Tabs v-model:active-key="activeName" class="-mt-4">
           <Tabs.TabPane key="basicInfo" tab="基本信息">
-            <!-- <BaseSetting :profile="profile" /> -->
+             <BaseInfo :profile="profile" @success="refreshProfile" />
           </Tabs.TabPane>
           <Tabs.TabPane key="resetPwd" tab="修改密码">
             <!-- <ResetPwd /> -->
diff --git a/apps/web-antd/src/views/_core/profile/modules/base-info.vue b/apps/web-antd/src/views/_core/profile/modules/base-info.vue
new file mode 100644
index 000000000..c20728424
--- /dev/null
+++ b/apps/web-antd/src/views/_core/profile/modules/base-info.vue
@@ -0,0 +1,101 @@
+<script setup lang="ts">
+import type { Recordable } from '@vben/types';
+import type { SystemUserProfileApi } from '#/api/system/user/profile';
+
+import { message } from 'ant-design-vue';
+
+import { watch } from 'vue';
+import { useVbenForm, z } from '#/adapter/form';
+import { DICT_TYPE, getDictOptions } from '#/utils/dict';
+import { updateUserProfile } from '#/api/system/user/profile';
+import { $t } from '@vben/locales';
+
+const props = defineProps<{ profile?: SystemUserProfileApi.UserProfileRespVO }>();
+const emit = defineEmits<{
+  (e: 'success'): void;
+}>();
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    labelWidth: 70,
+  },
+  schema: [
+    {
+      label: '用户昵称',
+      fieldName: 'nickname',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户昵称',
+      },
+      rules: 'required',
+    },
+    {
+      label: '用户手机',
+      fieldName: 'mobile',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户手机',
+      },
+      rules: z.string(),
+    },
+    {
+      label: '用户邮箱',
+      fieldName: 'email',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入用户邮箱',
+      },
+      rules: z.string().email('请输入正确的邮箱'),
+    },
+    {
+      label: '用户性别',
+      fieldName: 'sex',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.SYSTEM_USER_SEX, 'number'),
+        buttonStyle: 'solid',
+        optionType: 'button',
+      },
+      rules: z.number(),
+    },
+  ],
+  resetButtonOptions: {
+    show: false,
+  },
+  submitButtonOptions: {
+    content: '更新信息',
+  },
+  handleSubmit,
+});
+
+async function handleSubmit(values: Recordable<any>) {
+  try {
+    formApi.setLoading(true);
+    // 提交表单
+    await updateUserProfile(values as SystemUserProfileApi.UpdateProfileReqVO);
+    // 关闭并提示
+    emit('success');
+    message.success({
+      content: $t('ui.actionMessage.operationSuccess'),
+      key: 'action_process_msg',
+    });
+  } catch (error) {
+    console.error(error);
+  } finally {
+    formApi.setLoading(false);
+  }
+}
+
+/** 监听 profile 变化 */
+watch(() => props.profile, (newProfile) => {
+  if (newProfile) {
+    formApi.setValues(newProfile);
+  }
+}, { immediate: true });
+</script>
+
+<template>
+  <div class="mt-16px md:w-full lg:w-1/2 2xl:w-2/5">
+    <Form />
+  </div>
+</template>