feat(auth): 更新门户认证页面布局和样式

云

13 小时以前 91bfcf61f44f353dfebc54a57b5b774721de3e9a

 src/views/_core/profile/modules/base-info.vue

@@ -22,12 +22,15 @@
}>();

const [Form, formApi] = useVbenForm({
  wrapperClass: 'grid-cols-1',
  actionPosition: 'left',
  actionLayout: 'newLine',
  commonConfig: {
    labelWidth: 70,
    labelWidth: 84,
  },
  schema: [
    {
      label: '用户昵称',
      label: '显示名称',
      fieldName: 'nickname',
      component: 'Input',
      componentProps: {
@@ -36,22 +39,24 @@
      rules: 'required',
    },
    {
      label: '用户手机',
      label: '手机号码',
      fieldName: 'mobile',
      component: 'Input',
      componentProps: {
        placeholder: '请输入用户手机',
        autocomplete: 'tel',
      },
      rules: z.string(),
      rules: z.string().optional(),
    },
    {
      label: '用户邮箱',
      label: '电子邮箱',
      fieldName: 'email',
      component: 'Input',
      componentProps: {
        placeholder: '请输入用户邮箱',
        autocomplete: 'email',
      },
      rules: z.string().email('请输入正确的邮箱'),
      rules: z.string().email('请输入正确的邮箱').or(z.literal('')).optional(),
    },
    {
      label: '用户性别',
@@ -62,14 +67,14 @@
        buttonStyle: 'solid',
        optionType: 'button',
      },
      rules: z.number(),
      rules: z.number().optional(),
    },
  ],
  resetButtonOptions: {
    show: false,
  },
  submitButtonOptions: {
    content: '更新信息',
    content: '保存修改',
  },
  handleSubmit,
});
@@ -94,7 +99,7 @@
  () => props.profile,
  (newProfile) => {
    if (newProfile) {
      formApi.setValues(newProfile);
      formApi.setValues({ nickname: newProfile.nickname, mobile: newProfile.mobile ?? '', email: newProfile.email ?? '', sex: newProfile.sex });
    }
  },
  { immediate: true },
@@ -102,7 +107,11 @@
</script>

<template>
  <div class="mt-4 md:w-full lg:w-1/2 2xl:w-2/5">
  <div class="profile-form">
    <Form />
    <p class="profile-form-note">账号、部门及岗位由管理员维护。如需调整，请联系管理员。</p>
  </div>
</template>
<style scoped>
.profile-form { max-width: 560px; }.profile-form :deep(.ant-input),.profile-form :deep(.ant-input-affix-wrapper) { min-height: 38px; }.profile-form-note { margin: 18px 0 0 84px; color: var(--portal-muted); font-size: 12px; line-height: 1.8; }@media(max-width:520px) { .profile-form-note { margin-left: 0; } }
</style>