feat: 完成代码编写
This commit is contained in:
@@ -34,10 +34,22 @@ export default function ChangePassword() {
|
||||
}
|
||||
|
||||
return (
|
||||
<Card className='min-w-80 rounded-[20px] border border-[#D9D9D9] p-6 text-[#666666] shadow-[0px_0px_52.6px_1px_rgba(15,44,83,0.05)]'>
|
||||
<Card className='min-w-80 rounded-[20px] border border-[#D9D9D9] p-4 text-[#666666] shadow-[0px_0px_52.6px_1px_rgba(15,44,83,0.05)] sm:p-6'>
|
||||
<div className={'mb-3'}>
|
||||
<div className={'text-xl font-bold'}>{t('accountSettings')}</div>
|
||||
<div className={'text-[15px] font-light'}>修改登录密码</div>
|
||||
<div className={'flex items-center justify-between font-bold sm:text-xl'}>
|
||||
{t('accountSettings')}
|
||||
<Button
|
||||
type='submit'
|
||||
size='sm'
|
||||
form='password-form'
|
||||
className={
|
||||
'h-[32px] w-[110px] rounded-[50px] border-0 border-[#0F2C53] bg-[#0F2C53] text-center text-base font-medium leading-[32px] text-white transition hover:bg-[#225BA9] hover:text-white sm:hidden'
|
||||
}
|
||||
>
|
||||
保存
|
||||
</Button>
|
||||
</div>
|
||||
<div className={'text-xs font-light sm:text-[15px]'}>修改登录密码</div>
|
||||
</div>
|
||||
<Form {...form}>
|
||||
<form id='password-form' onSubmit={form.handleSubmit(onSubmit)} className='space-y-4'>
|
||||
@@ -49,7 +61,7 @@ export default function ChangePassword() {
|
||||
<FormControl>
|
||||
<Input
|
||||
className={
|
||||
'h-[60px] rounded-[20px] text-xl shadow-[inset_0_0_7.6px_0_#00000040]'
|
||||
'h-[60px] rounded-[20px] text-base shadow-[inset_0_0_7.6px_0_#00000040] sm:text-xl md:text-xl'
|
||||
}
|
||||
type='password'
|
||||
placeholder={t('newPassword')}
|
||||
@@ -68,7 +80,7 @@ export default function ChangePassword() {
|
||||
<FormControl>
|
||||
<Input
|
||||
className={
|
||||
'h-[60px] rounded-[20px] text-xl shadow-[inset_0_0_7.6px_0_#00000040]'
|
||||
'h-[60px] rounded-[20px] text-base shadow-[inset_0_0_7.6px_0_#00000040] sm:text-xl md:text-xl'
|
||||
}
|
||||
type='password'
|
||||
placeholder={t('repeatNewPassword')}
|
||||
@@ -81,7 +93,7 @@ export default function ChangePassword() {
|
||||
/>
|
||||
</form>
|
||||
</Form>
|
||||
<div className={'mt-8 flex justify-center'}>
|
||||
<div className={'mt-8 hidden justify-center sm:flex'}>
|
||||
<Button
|
||||
type='submit'
|
||||
size='sm'
|
||||
|
||||
@@ -39,14 +39,30 @@ export default function NotifySettings() {
|
||||
}
|
||||
|
||||
return (
|
||||
<Card className='flex h-full flex-col justify-between rounded-[20px] border border-[#D9D9D9] p-6 text-[#666666] shadow-[0px_0px_52.6px_1px_rgba(15,44,83,0.05)]'>
|
||||
<Card className='flex h-full flex-col justify-between rounded-[20px] border border-[#D9D9D9] p-4 text-[#666666] shadow-[0px_0px_52.6px_1px_rgba(15,44,83,0.05)] sm:p-6'>
|
||||
<div className={'mb-3'}>
|
||||
<div className={'text-xl font-bold'}>{t('notify.notificationSettings')}</div>
|
||||
<div className={'text-[15px] font-light'}>是否邮箱通知推送</div>
|
||||
<div className={'flex items-center justify-between font-bold sm:text-xl'}>
|
||||
{t('notify.notificationSettings')}
|
||||
<Button
|
||||
type='submit'
|
||||
size='sm'
|
||||
form='notify-form'
|
||||
className={
|
||||
'h-[32px] w-[110px] rounded-[50px] border-0 border-[#0F2C53] bg-[#0F2C53] text-center text-base font-medium leading-[32px] text-white transition hover:bg-[#225BA9] hover:text-white sm:hidden'
|
||||
}
|
||||
>
|
||||
保存
|
||||
</Button>
|
||||
</div>
|
||||
<div className={'text-xs font-light sm:text-[15px]'}>是否邮箱通知推送</div>
|
||||
</div>
|
||||
<Form {...form}>
|
||||
<form id='notify-form' onSubmit={form.handleSubmit(onSubmit)} className='space-y-4'>
|
||||
<div className='space-y-4'>
|
||||
<form
|
||||
id='notify-form'
|
||||
onSubmit={form.handleSubmit(onSubmit)}
|
||||
className='space-y-2 sm:space-y-4'
|
||||
>
|
||||
<div className='grid grid-cols-2 gap-2.5 sm:grid-cols-1 sm:gap-4'>
|
||||
{[
|
||||
{ name: 'enable_balance_notify', label: 'balanceChange' },
|
||||
{ name: 'enable_login_notify', label: 'login' },
|
||||
@@ -58,7 +74,7 @@ export default function NotifySettings() {
|
||||
control={form.control}
|
||||
name={name as any}
|
||||
render={({ field }) => (
|
||||
<FormItem className='flex flex-col items-center justify-between space-x-4 rounded-[20px] bg-[#EAEAEA] py-2.5'>
|
||||
<FormItem className='flex flex-col items-center justify-center rounded-[20px] bg-[#EAEAEA] py-2.5'>
|
||||
<FormLabel className='text-muted-foreground text-sm text-[#848484]'>
|
||||
{t(`notify.${label}`)}
|
||||
</FormLabel>
|
||||
@@ -79,7 +95,7 @@ export default function NotifySettings() {
|
||||
</div>
|
||||
</form>
|
||||
</Form>
|
||||
<div className={'mt-8 flex justify-center'}>
|
||||
<div className={'mt-8 hidden justify-center sm:flex'}>
|
||||
<Button
|
||||
type='submit'
|
||||
size='sm'
|
||||
|
||||
@@ -4,8 +4,8 @@ import ThirdPartyAccounts from './third-party-accounts';
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<div className='flex flex-col gap-[30px] lg:flex-row lg:flex-wrap lg:*:flex-auto'>
|
||||
<div className={'flex max-w-[543px] flex-auto flex-col gap-[30px]'}>
|
||||
<div className='flex flex-col gap-[10px] sm:gap-[30px] lg:flex-row lg:flex-wrap lg:*:flex-auto'>
|
||||
<div className={'flex max-w-[543px] flex-auto flex-col gap-[10px] sm:gap-[30px]'}>
|
||||
<ThirdPartyAccounts />
|
||||
<ChangePassword />
|
||||
</div>
|
||||
|
||||
@@ -235,25 +235,34 @@ export default function ThirdPartyAccounts() {
|
||||
<>
|
||||
<Card
|
||||
className={
|
||||
'rounded-[20px] border border-[#D9D9D9] p-6 text-[#666666] shadow-[0px_0px_52.6px_1px_rgba(15,44,83,0.05)]'
|
||||
'rounded-[20px] border border-[#D9D9D9] p-4 text-[#666666] shadow-[0px_0px_52.6px_1px_rgba(15,44,83,0.05)] sm:p-6'
|
||||
}
|
||||
>
|
||||
<div className={'text-xl font-bold'}>{t('title')}</div>
|
||||
<div className='mb-4 mt-1 text-sm text-[#666666]'>
|
||||
<div className={'flex items-center justify-between text-base font-bold sm:text-xl'}>
|
||||
<span>{t('title')}</span>
|
||||
<div
|
||||
className={
|
||||
'h-[32px] w-[110px] rounded-full bg-[#D9D9D9] text-center font-medium leading-[32px] text-white sm:hidden'
|
||||
}
|
||||
>
|
||||
保存
|
||||
</div>
|
||||
</div>
|
||||
<div className='mb-2 text-xs text-[#666666] sm:mb-4 sm:mt-1 sm:text-sm'>
|
||||
{user?.auth_methods?.[0]?.auth_identifier}
|
||||
</div>
|
||||
<div className={'mb-3'}>Email</div>
|
||||
<div className={'mb-1 sm:mb-3'}>Email</div>
|
||||
<div className={'flex items-center gap-2'}>
|
||||
<div
|
||||
className={
|
||||
'line-clamp-1 h-[60px] flex-1 rounded-[20px] bg-[#EAEAEA] px-5 text-xl leading-[60px] shadow-[inset_0px_0px_7.6px_0px_rgba(0,0,0,0.25)]'
|
||||
'line-clamp-1 h-[60px] flex-1 rounded-[20px] bg-[#EAEAEA] px-5 text-base !leading-[60px] shadow-[inset_0px_0px_7.6px_0px_rgba(0,0,0,0.25)] sm:text-xl'
|
||||
}
|
||||
>
|
||||
{user?.auth_methods?.[0]?.auth_identifier}
|
||||
</div>
|
||||
<div
|
||||
className={
|
||||
'h-[32px] w-[110px] rounded-full bg-[#D9D9D9] text-center text-[16px] font-medium leading-[32px] text-white'
|
||||
'hidden h-[32px] w-[110px] rounded-full bg-[#D9D9D9] text-center text-[16px] font-medium leading-[32px] text-white sm:block'
|
||||
}
|
||||
>
|
||||
保存
|
||||
|
||||
Reference in New Issue
Block a user