💄 style(node): Form

This commit is contained in:
web@ppanel 2024-12-02 13:22:43 +07:00
parent bfb6c27028
commit d5f5add61a

View File

@ -452,7 +452,7 @@ export default function NodeForm<T extends { [x: string]: any }>({
control={form.control}
name='vmess.host'
render={({ field }) => (
<FormItem>
<FormItem className='col-span-2'>
<FormLabel>{t('form.Host Name')}</FormLabel>
<FormControl>
<EnhancedInput
@ -486,6 +486,56 @@ export default function NodeForm<T extends { [x: string]: any }>({
</FormItem>
)}
/>
<FormField
control={form.control}
name='vmess.network'
render={({ field }) => (
<FormItem className='col-span-2'>
<FormLabel>{t('form.networkType')}</FormLabel>
<FormControl>
<Select
value={field.value}
onValueChange={(value) => {
form.setValue(field.name, value);
form.setValue('vmess.transport', undefined);
}}
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t('form.networkType')} />
</SelectTrigger>
</FormControl>
<SelectContent>
<SelectItem value='tcp'>TCP</SelectItem>
<SelectItem value='websocket'>WebSocket</SelectItem>
<SelectItem value='grpc'>gRPC</SelectItem>
<SelectItem value='quic'>QUIC</SelectItem>
<SelectItem value='mkcp'>mkcp</SelectItem>
<SelectItem value='httpupgrade'>HTTPUPgrade</SelectItem>
<SelectItem value='splithttp'>SplitHTTP</SelectItem>
</SelectContent>
</Select>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name='vmess.enable_tls'
render={({ field }) => (
<FormItem>
<FormLabel>
{t('form.enableTls')}
<Sheet>
<SheetTrigger asChild>
<a className='text-primary ml-2 cursor-pointer'>{t('form.edit')}</a>
</SheetTrigger>
<SheetContent className='p-4'>
<SheetHeader>
<SheetTitle>{t('form.editSecurity')}</SheetTitle>
</SheetHeader>
<div className='grid grid-cols-1 gap-2 pt-4'>
<FormField
control={form.control}
name='vmess.tls_config.server_name'
@ -504,26 +554,6 @@ export default function NodeForm<T extends { [x: string]: any }>({
</FormItem>
)}
/>
<FormField
control={form.control}
name='vmess.enable_tls'
render={({ field }) => (
<FormItem>
<FormLabel>{t('form.enableTls')}</FormLabel>
<FormControl>
<div className='pt-2'>
<Switch
checked={!!field.value}
onCheckedChange={(value) => {
form.setValue(field.name, value);
}}
/>
</div>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name='vmess.tls_config.allow_insecure'
@ -544,36 +574,19 @@ export default function NodeForm<T extends { [x: string]: any }>({
</FormItem>
)}
/>
<FormField
control={form.control}
name='vmess.network'
render={({ field }) => (
<FormItem>
<FormLabel>{t('form.networkType')}</FormLabel>
</div>
</SheetContent>
</Sheet>
</FormLabel>
<FormControl>
<Select
value={field.value}
onValueChange={(value) => {
<div className='pt-2'>
<Switch
checked={!!field.value}
onCheckedChange={(value) => {
form.setValue(field.name, value);
form.setValue('vmess.transport', undefined);
}}
>
<FormControl>
<SelectTrigger>
<SelectValue placeholder={t('form.networkType')} />
</SelectTrigger>
</FormControl>
<SelectContent>
<SelectItem value='tcp'>TCP</SelectItem>
<SelectItem value='websocket'>WebSocket</SelectItem>
<SelectItem value='grpc'>gRPC</SelectItem>
<SelectItem value='quic'>QUIC</SelectItem>
<SelectItem value='mkcp'>mkcp</SelectItem>
<SelectItem value='httpupgrade'>HTTPUPgrade</SelectItem>
<SelectItem value='splithttp'>SplitHTTP</SelectItem>
</SelectContent>
</Select>
/>
</div>
</FormControl>
<FormMessage />
</FormItem>
@ -1116,7 +1129,7 @@ export default function NodeForm<T extends { [x: string]: any }>({
control={form.control}
name='vless.network'
render={({ field }) => (
<FormItem>
<FormItem className='col-span-2'>
<FormLabel>{t('form.networkType')}</FormLabel>
<FormControl>
<Select
@ -1151,7 +1164,7 @@ export default function NodeForm<T extends { [x: string]: any }>({
control={form.control}
name='vless.xtls'
render={({ field }) => (
<FormItem className='col-span-2'>
<FormItem>
<FormLabel>{t('form.xtls')}</FormLabel>
<FormControl>
<Select