S-VPN/panel-web
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ feat(user): Add telephone input with area code selection and update localization

Browse Source
This commit is contained in:
web@ppanel
2025-01-14 19:24:46 +07:00
parent 39a9ce60de
commit 585b99c2cc
6 changed files with 191 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/admin/app/dashboard/auth-control/phone/page.tsx
+32 -36
View File
@@ -208,48 +208,44 @@ export default function Page() {
/>
</TableCell>
</TableRow>
<TableRow>
<TableCell>
<Label>{t('templateCode')}</Label>
{platformConfig?.sms_template_code && (
{platformConfig?.sms_template_code && (
<TableRow>
<TableCell>
<Label>{t('templateCode')}</Label>
<p className='text-muted-foreground text-xs'>
{t('platformConfigTip', { key: platformConfig?.sms_template_code })}
</p>
)}
</TableCell>
<TableCell className='text-right'>
<EnhancedInput
value={data?.sms_template_code ?? ''}
onValueBlur={(value) => updateConfig('sms_template_code', value)}
disabled={isFetching}
placeholder={
platformConfig?.sms_template_code &&
t('platformConfigTip', { key: platformConfig?.sms_template_code })
}
/>
</TableCell>
</TableRow>
<TableRow>
<TableCell>
<Label>{t('templateParam')}</Label>
{platformConfig?.sms_template_param && (
</TableCell>
<TableCell className='text-right'>
<EnhancedInput
value={data?.sms_template_code ?? ''}
onValueBlur={(value) => updateConfig('sms_template_code', value)}
disabled={isFetching}
placeholder={t('platformConfigTip', { key: platformConfig?.sms_template_code })}
/>
</TableCell>
</TableRow>
)}
{platformConfig?.sms_template_param && (
<TableRow>
<TableCell>
<Label>{t('templateParam')}</Label>
<p className='text-muted-foreground text-xs'>
{t('platformConfigTip', { key: platformConfig?.sms_template_param })}
</p>
)}
</TableCell>
<TableCell className='text-right'>
<EnhancedInput
value={data?.sms_template_param ?? 'code'}
onValueBlur={(value) => updateConfig('sms_template_param', value)}
disabled={isFetching}
placeholder={
platformConfig?.sms_template_param &&
t('platformConfigTip', { key: platformConfig?.sms_template_param })
}
/>
</TableCell>
</TableRow>
</TableCell>
<TableCell className='text-right'>
<EnhancedInput
value={data?.sms_template_param ?? 'code'}
onValueBlur={(value) => updateConfig('sms_template_param', value)}
disabled={isFetching}
placeholder={t('platformConfigTip', {
key: platformConfig?.sms_template_param,
})}
/>
</TableCell>
</TableRow>
)}
<TableRow>
<TableCell>
<Label>{t('template')}</Label>
apps/admin/app/dashboard/user/page.tsx
+8
View File
@@ -75,6 +75,14 @@ export default function Page() {
accessorKey: 'email',
header: t('userName'),
},
{
accessorKey: 'telephone',
header: t('telephone'),
cell: ({ row }) => {
if (!row.original.telephone) return '--';
return `+${row.original.telephone_area_code} ${row.original.telephone}`;
},
},
{
accessorKey: 'balance',
header: t('balance'),
apps/admin/app/dashboard/user/user-form.tsx
+45
View File
@@ -22,6 +22,7 @@ import {
SheetTrigger,
} from '@workspace/ui/components/sheet';
import { Switch } from '@workspace/ui/components/switch';
import { AreaCodeSelect } from '@workspace/ui/custom-components/area-code-select';
import { EnhancedInput } from '@workspace/ui/custom-components/enhanced-input';
import { unitConversion } from '@workspace/ui/utils';
import { useTranslations } from 'next-intl';
@@ -52,6 +53,8 @@ export default function UserForm<T extends Record<string, any>>({
const [open, setOpen] = useState(false);
const formSchema = z.object({
email: z.string().email(t('form.invalidEmailFormat')),
telephone_area_code: z.string().optional(),
telephone: z.string().optional(),
password: z.string().optional(),
referer_id: z.number().optional(),
refer_code: z.string().optional(),
@@ -115,6 +118,48 @@ export default function UserForm<T extends Record<string, any>>({
</FormItem>
)}
/>
<FormField
control={form.control}
name='telephone'
render={({ field }) => (
<FormItem>
<FormLabel>{t('form.telephone')}</FormLabel>
<FormControl>
<EnhancedInput
prefix={
<FormField
control={form.control}
name='telephone_area_code'
render={({ field }) => (
<FormItem>
<FormControl>
<AreaCodeSelect
className='w-32 rounded-none border-y-0 border-l-0'
simple
placeholder={t('form.areaCodePlaceholder')}
value={field.value}
onChange={(value) => {
form.setValue(field.name, value.phone);
}}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
}
placeholder={t('form.telephonePlaceholder')}
{...field}
onValueChange={(value) => {
form.setValue(field.name, value);
}}
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name='password'
apps/admin/locales/en-US/user.json
+5
View File
@@ -33,12 +33,17 @@
"passwordPlaceholder": "Enter new password (optional)",
"refererId": "Referer ID",
"refererIdPlaceholder": "Enter referer ID",
"telephone": "Phone Number",
"telephonePlaceholder": "Enter phone number",
"areaCode": "Area Code",
"areaCodePlaceholder": "Area code",
"userEmail": "User Email",
"userEmailPlaceholder": "Enter user email"
},
"giftAmount": "Gift Amount",
"inviteCode": "Invite Code",
"referer": "Referer",
"telephone": "Phone Number",
"updateSuccess": "Update successful",
"userList": "User List",
"userName": "User Email"