|
|
@@ -1,4 +1,8 @@
|
|
|
-import { useForm } from 'react-hook-form'
|
|
|
+import { useEffect } from 'react'
|
|
|
+import { z } from 'zod'
|
|
|
+import { useForm, useWatch } from 'react-hook-form'
|
|
|
+import { zodResolver } from '@hookform/resolvers/zod'
|
|
|
+import { format, parse } from 'date-fns-jalali'
|
|
|
|
|
|
import {
|
|
|
Dialog,
|
|
|
@@ -18,6 +22,7 @@ import {
|
|
|
|
|
|
import { Input } from '@/components/ui/input'
|
|
|
import { Textarea } from '@/components/ui/textarea'
|
|
|
+
|
|
|
import {
|
|
|
Select,
|
|
|
SelectContent,
|
|
|
@@ -28,9 +33,12 @@ import {
|
|
|
|
|
|
import { Button } from '@/components/ui/button'
|
|
|
|
|
|
+import { useUsers } from './users-provider'
|
|
|
+
|
|
|
import { useCreateUser } from '@/hooks/users/useCreateUser'
|
|
|
import { useUpdateUser } from '@/hooks/users/useUpdateUser'
|
|
|
import { useUserDetail } from '@/hooks/users/useUserDetail'
|
|
|
+
|
|
|
import { useProvinces } from '@/hooks/location/useProvinces'
|
|
|
import { useCities } from '@/hooks/location/useCities'
|
|
|
|
|
|
@@ -41,22 +49,57 @@ import {
|
|
|
skillLevelOptions,
|
|
|
activityHistoryOptions,
|
|
|
} from '@/constants/users/users-constants'
|
|
|
-
|
|
|
-import { useUsers } from './users-provider'
|
|
|
-import type { CreateUserPayload } from '@/types/users.types'
|
|
|
-import { useEffect } from 'react'
|
|
|
+import {
|
|
|
+ Popover,
|
|
|
+ PopoverContent,
|
|
|
+ PopoverTrigger,
|
|
|
+} from '@/components/ui/popover'
|
|
|
+import { Calendar } from '@/components/ui/calendar'
|
|
|
+import { faIR } from 'react-day-picker/persian'
|
|
|
+import { toast } from 'sonner'
|
|
|
+import { useQueryClient } from '@tanstack/react-query'
|
|
|
+import { queryKeys } from '@/core/react-query/keys'
|
|
|
+
|
|
|
+const schema = z.object({
|
|
|
+ username: z.string().min(1, 'نام کاربری الزامی است'),
|
|
|
+ phone: z.string().min(1, 'شماره موبایل الزامی است'),
|
|
|
+ first_name: z.string().min(1, 'نام الزامی است'),
|
|
|
+ last_name: z.string().min(1, 'نام خانوادگی الزامی است'),
|
|
|
+ email: z.string().optional(),
|
|
|
+ province_id: z.number().optional(),
|
|
|
+ city_id: z.number().optional(),
|
|
|
+ gender: z.number(),
|
|
|
+ birth_date: z.date().optional(),
|
|
|
+ weight: z.number().optional(),
|
|
|
+ height: z.number().optional(),
|
|
|
+ foot_specialization: z.string().optional(),
|
|
|
+ post_skill: z.string().optional(),
|
|
|
+ skill_level: z.string().optional(),
|
|
|
+ activity_history: z.boolean().optional(),
|
|
|
+ team_name: z.string().optional(),
|
|
|
+ favorite_iranian_team: z.string().optional(),
|
|
|
+ favorite_foreign_team: z.string().optional(),
|
|
|
+ shirt_number: z.number().optional(),
|
|
|
+ bio: z.string().optional(),
|
|
|
+})
|
|
|
+
|
|
|
+type FormValues = z.infer<typeof schema>
|
|
|
|
|
|
export function UsersActionDialog() {
|
|
|
+ const queryClient = useQueryClient()
|
|
|
const { open, setOpen, currentRow } = useUsers()
|
|
|
+
|
|
|
const isAdd = open === 'add'
|
|
|
const isEdit = open === 'edit'
|
|
|
const isView = open === 'view'
|
|
|
+
|
|
|
const opened = isAdd || isEdit || isView
|
|
|
+
|
|
|
const readOnly = isView
|
|
|
|
|
|
- const { data: user, isLoading } = useUserDetail(currentRow?.id as number)
|
|
|
+ const form = useForm<FormValues>({
|
|
|
+ resolver: zodResolver(schema),
|
|
|
|
|
|
- const form = useForm<CreateUserPayload>({
|
|
|
defaultValues: {
|
|
|
username: '',
|
|
|
phone: '',
|
|
|
@@ -65,10 +108,10 @@ export function UsersActionDialog() {
|
|
|
email: '',
|
|
|
province_id: undefined,
|
|
|
city_id: undefined,
|
|
|
- gender: undefined,
|
|
|
- birth_date: '',
|
|
|
- height: undefined,
|
|
|
+ gender: 0,
|
|
|
+ birth_date: undefined,
|
|
|
weight: undefined,
|
|
|
+ height: undefined,
|
|
|
foot_specialization: '',
|
|
|
post_skill: '',
|
|
|
skill_level: '',
|
|
|
@@ -81,85 +124,143 @@ export function UsersActionDialog() {
|
|
|
},
|
|
|
})
|
|
|
|
|
|
- useEffect(() => {
|
|
|
- if (user && (isEdit || isView)) {
|
|
|
- form.reset({
|
|
|
- username: user.username ?? '',
|
|
|
- phone: user.phone ?? '',
|
|
|
- first_name: user.first_name ?? '',
|
|
|
- last_name: user.last_name ?? '',
|
|
|
- email: user.email ?? '',
|
|
|
- province_id: user.province_id ?? undefined,
|
|
|
- city_id: user.city_id ?? undefined,
|
|
|
- gender: user.gender ?? undefined,
|
|
|
- birth_date: user.birth_date ?? '',
|
|
|
- height: user.height ?? undefined,
|
|
|
- weight: user.weight ?? undefined,
|
|
|
- foot_specialization: user.foot_specialization ?? '',
|
|
|
- post_skill: user.post_skill ?? '',
|
|
|
- skill_level: user.skill_level ?? '',
|
|
|
- activity_history: Boolean(user.activity_history),
|
|
|
- team_name: user.team_name ?? '',
|
|
|
- favorite_iranian_team: user.favorite_iranian_team ?? '',
|
|
|
- favorite_foreign_team: user.favorite_foreign_team ?? '',
|
|
|
- shirt_number: user.shirt_number ?? undefined,
|
|
|
- bio: user.bio ?? '',
|
|
|
- })
|
|
|
- } else if (isAdd) {
|
|
|
- form.reset({
|
|
|
- username: '',
|
|
|
- phone: '',
|
|
|
- first_name: '',
|
|
|
- last_name: '',
|
|
|
- email: '',
|
|
|
- province_id: undefined,
|
|
|
- city_id: undefined,
|
|
|
- gender: undefined,
|
|
|
- birth_date: '',
|
|
|
- height: undefined,
|
|
|
- weight: undefined,
|
|
|
- foot_specialization: '',
|
|
|
- post_skill: '',
|
|
|
- skill_level: '',
|
|
|
- activity_history: false,
|
|
|
- team_name: '',
|
|
|
- favorite_iranian_team: '',
|
|
|
- favorite_foreign_team: '',
|
|
|
- shirt_number: undefined,
|
|
|
- bio: '',
|
|
|
- })
|
|
|
- }
|
|
|
- }, [user, isEdit, isView, isAdd, form])
|
|
|
+ const [provinceId, activity_history] = useWatch({
|
|
|
+ control: form.control,
|
|
|
+ name: ['province_id', 'activity_history'],
|
|
|
+ })
|
|
|
|
|
|
- const provinceId = form.watch('province_id')
|
|
|
+ const { data: provinces = [] } = useProvinces(opened)
|
|
|
|
|
|
- const { data: provinces = [] } = useProvinces()
|
|
|
const { data: cities = [] } = useCities(provinceId as number)
|
|
|
|
|
|
+ const { data: user, isLoading } = useUserDetail(currentRow?.id as number)
|
|
|
+
|
|
|
const createMutation = useCreateUser()
|
|
|
+
|
|
|
const updateMutation = useUpdateUser()
|
|
|
|
|
|
- const onSubmit = (values: CreateUserPayload) => {
|
|
|
+ const handleClose = () => {
|
|
|
+ setOpen(null)
|
|
|
+ form.reset({
|
|
|
+ username: '',
|
|
|
+ phone: '',
|
|
|
+ first_name: '',
|
|
|
+ last_name: '',
|
|
|
+ email: '',
|
|
|
+ province_id: undefined,
|
|
|
+ city_id: undefined,
|
|
|
+ gender: 0,
|
|
|
+ birth_date: undefined,
|
|
|
+ weight: undefined,
|
|
|
+ height: undefined,
|
|
|
+ foot_specialization: '',
|
|
|
+ post_skill: '',
|
|
|
+ skill_level: '',
|
|
|
+ activity_history: false,
|
|
|
+ team_name: '',
|
|
|
+ favorite_iranian_team: '',
|
|
|
+ favorite_foreign_team: '',
|
|
|
+ shirt_number: undefined,
|
|
|
+ bio: '',
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ if ((isEdit || isView) && user && !isLoading) {
|
|
|
+ const timer = setTimeout(() => {
|
|
|
+ form.reset({
|
|
|
+ username: user.username || '',
|
|
|
+ phone: user.phone || '',
|
|
|
+ first_name: user.first_name || '',
|
|
|
+ last_name: user.last_name || '',
|
|
|
+ email: user.email || '',
|
|
|
+ province_id: user.province_id || undefined,
|
|
|
+ gender: user.gender ?? 0,
|
|
|
+ birth_date: user.birth_date
|
|
|
+ ? parse(user.birth_date, 'yyyy-MM-dd', new Date())
|
|
|
+ : undefined,
|
|
|
+ weight: user.weight || undefined,
|
|
|
+ height: user.height || undefined,
|
|
|
+ foot_specialization: user.foot_specialization || '',
|
|
|
+ post_skill: user.post_skill || '',
|
|
|
+ skill_level: user.skill_level || '',
|
|
|
+ activity_history: !!user.activity_history,
|
|
|
+ team_name: user.team_name || '',
|
|
|
+ favorite_iranian_team: user.favorite_iranian_team || '',
|
|
|
+ favorite_foreign_team: user.favorite_foreign_team || '',
|
|
|
+ shirt_number: user.shirt_number || undefined,
|
|
|
+ bio: user.bio || '',
|
|
|
+ })
|
|
|
+ }, 100)
|
|
|
+
|
|
|
+ return () => clearTimeout(timer)
|
|
|
+ }
|
|
|
+ }, [user, isLoading, isEdit, isView, form])
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ if (user && (isEdit || isView) && provinceId && user.city_id) {
|
|
|
+ const timer = setTimeout(() => {
|
|
|
+ form.setValue('city_id', user.city_id)
|
|
|
+ }, 250)
|
|
|
+
|
|
|
+ return () => clearTimeout(timer)
|
|
|
+ }
|
|
|
+ }, [user, isEdit, isView, provinceId, form])
|
|
|
+
|
|
|
+ const onSubmit = (values: FormValues) => {
|
|
|
if (isView) return
|
|
|
|
|
|
+ const payload = {
|
|
|
+ ...values,
|
|
|
+ activity_history: values.activity_history ? 1 : 0,
|
|
|
+ email: values.email || undefined,
|
|
|
+ province_id: values.province_id || undefined,
|
|
|
+ city_id: values.city_id || undefined,
|
|
|
+ weight: values.weight || undefined,
|
|
|
+ height: values.height || undefined,
|
|
|
+ foot_specialization: values.foot_specialization || undefined,
|
|
|
+ post_skill: values.post_skill || undefined,
|
|
|
+ skill_level: values.skill_level || undefined,
|
|
|
+ team_name: values.team_name || undefined,
|
|
|
+ favorite_iranian_team: values.favorite_iranian_team || undefined,
|
|
|
+ favorite_foreign_team: values.favorite_foreign_team || undefined,
|
|
|
+ shirt_number: values.shirt_number || undefined,
|
|
|
+ bio: values.bio || undefined,
|
|
|
+ birth_date: values.birth_date
|
|
|
+ ? format(values.birth_date, 'yyyy-MM-dd')
|
|
|
+ : undefined,
|
|
|
+ }
|
|
|
+
|
|
|
if (isAdd) {
|
|
|
- createMutation.mutate(values, {
|
|
|
- onSuccess: () => setOpen(null),
|
|
|
+ createMutation.mutate(payload, {
|
|
|
+ onSuccess: () => {
|
|
|
+ toast.success('افزودن کاربر با موفقیت انجام شد!')
|
|
|
+ handleClose()
|
|
|
+ },
|
|
|
})
|
|
|
}
|
|
|
|
|
|
if (isEdit && currentRow) {
|
|
|
updateMutation.mutate(
|
|
|
- { id: currentRow.id, payload: values },
|
|
|
{
|
|
|
- onSuccess: () => setOpen(null),
|
|
|
+ id: currentRow.id,
|
|
|
+ payload,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ onSuccess: () => {
|
|
|
+ toast.success('ویرایش کاربر با موفقیت انجام شد!')
|
|
|
+ queryClient.invalidateQueries({
|
|
|
+ queryKey: queryKeys.users.detail(currentRow.id),
|
|
|
+ })
|
|
|
+ handleClose()
|
|
|
+ },
|
|
|
}
|
|
|
)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return (
|
|
|
- <Dialog open={opened} modal={true} onOpenChange={() => setOpen(null)}>
|
|
|
+ <Dialog open={opened} onOpenChange={handleClose}>
|
|
|
<DialogContent className='max-h-[90vh] max-w-5xl overflow-y-auto'>
|
|
|
<DialogHeader>
|
|
|
<DialogTitle>
|
|
|
@@ -169,84 +270,88 @@ export function UsersActionDialog() {
|
|
|
</DialogTitle>
|
|
|
</DialogHeader>
|
|
|
|
|
|
- {isLoading ? (
|
|
|
+ {isLoading && (isEdit || isView) ? (
|
|
|
<div className='py-10 text-center'>در حال دریافت اطلاعات...</div>
|
|
|
) : (
|
|
|
<Form {...form}>
|
|
|
<form onSubmit={form.handleSubmit(onSubmit)} className='space-y-6'>
|
|
|
<div className='grid grid-cols-1 gap-4 md:grid-cols-2'>
|
|
|
+ {/* first name */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='first_name'
|
|
|
- rules={{ required: 'نام الزامی است' }}
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>نام</FormLabel>
|
|
|
+
|
|
|
<FormControl>
|
|
|
<Input {...field} disabled={readOnly} />
|
|
|
</FormControl>
|
|
|
+
|
|
|
<FormMessage />
|
|
|
</FormItem>
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* last name */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='last_name'
|
|
|
- rules={{ required: 'نام خانوادگی الزامی است' }}
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>نام خانوادگی</FormLabel>
|
|
|
+
|
|
|
<FormControl>
|
|
|
<Input {...field} disabled={readOnly} />
|
|
|
</FormControl>
|
|
|
+
|
|
|
<FormMessage />
|
|
|
</FormItem>
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* username */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='username'
|
|
|
- rules={{ required: 'نام کاربری الزامی است' }}
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>نام کاربری</FormLabel>
|
|
|
+
|
|
|
<FormControl>
|
|
|
<Input {...field} disabled={readOnly} />
|
|
|
</FormControl>
|
|
|
+
|
|
|
<FormMessage />
|
|
|
</FormItem>
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* phone */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='phone'
|
|
|
- rules={{
|
|
|
- required: 'شماره موبایل الزامی است',
|
|
|
- minLength: {
|
|
|
- value: 10,
|
|
|
- message: 'شماره موبایل نامعتبر است',
|
|
|
- },
|
|
|
- }}
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>موبایل</FormLabel>
|
|
|
+
|
|
|
<FormControl>
|
|
|
<Input {...field} disabled={readOnly} />
|
|
|
</FormControl>
|
|
|
+
|
|
|
<FormMessage />
|
|
|
</FormItem>
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* email */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='email'
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>ایمیل</FormLabel>
|
|
|
+
|
|
|
<FormControl>
|
|
|
<Input
|
|
|
{...field}
|
|
|
@@ -254,37 +359,71 @@ export function UsersActionDialog() {
|
|
|
value={field.value ?? ''}
|
|
|
/>
|
|
|
</FormControl>
|
|
|
+
|
|
|
<FormMessage />
|
|
|
</FormItem>
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* birth date */}
|
|
|
+
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='birth_date'
|
|
|
- rules={{ required: 'تاریخ تولد الزامی است' }}
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>تاریخ تولد</FormLabel>
|
|
|
<FormControl>
|
|
|
- <Input type='date' {...field} disabled={readOnly} />
|
|
|
+ <Popover>
|
|
|
+ <PopoverTrigger asChild>
|
|
|
+ <Button
|
|
|
+ variant='outline'
|
|
|
+ disabled={readOnly}
|
|
|
+ className={`${field.value ? '' : 'text-muted-foreground'} w-full justify-start font-normal`}
|
|
|
+ size={'lg'}
|
|
|
+ >
|
|
|
+ {field.value
|
|
|
+ ? format(field.value, 'yyyy/MM/dd')
|
|
|
+ : '****/**/**'}
|
|
|
+ </Button>
|
|
|
+ </PopoverTrigger>
|
|
|
+ <PopoverContent
|
|
|
+ className='w-auto overflow-hidden p-0'
|
|
|
+ align='start'
|
|
|
+ >
|
|
|
+ <Calendar
|
|
|
+ mode='single'
|
|
|
+ dir='rtl'
|
|
|
+ locale={faIR}
|
|
|
+ selected={field.value as Date | undefined}
|
|
|
+ defaultMonth={field.value as Date | undefined}
|
|
|
+ captionLayout='dropdown'
|
|
|
+ onSelect={(date) => field.onChange(date)}
|
|
|
+ disabled={readOnly}
|
|
|
+ />
|
|
|
+ </PopoverContent>
|
|
|
+ </Popover>
|
|
|
</FormControl>
|
|
|
<FormMessage />
|
|
|
</FormItem>
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* gender */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='gender'
|
|
|
- rules={{ required: 'جنسیت الزامی است' }}
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>جنسیت</FormLabel>
|
|
|
|
|
|
<Select
|
|
|
disabled={readOnly}
|
|
|
- value={field.value?.toString() ?? ''}
|
|
|
+ value={
|
|
|
+ field.value !== undefined && field.value !== null
|
|
|
+ ? String(field.value)
|
|
|
+ : undefined
|
|
|
+ }
|
|
|
onValueChange={(value) => field.onChange(Number(value))}
|
|
|
>
|
|
|
<FormControl>
|
|
|
@@ -310,18 +449,23 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* province */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='province_id'
|
|
|
- rules={{ required: 'انتخاب استان الزامی است' }}
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>استان</FormLabel>
|
|
|
+
|
|
|
<Select
|
|
|
disabled={readOnly}
|
|
|
- value={field.value ? field.value.toString() : ''}
|
|
|
+ value={
|
|
|
+ field.value !== undefined && field.value !== null
|
|
|
+ ? String(field.value)
|
|
|
+ : undefined
|
|
|
+ }
|
|
|
onValueChange={(value) => {
|
|
|
- field.onChange(value ? Number(value) : undefined)
|
|
|
+ field.onChange(Number(value))
|
|
|
form.setValue('city_id', undefined)
|
|
|
}}
|
|
|
>
|
|
|
@@ -348,17 +492,21 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* city */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='city_id'
|
|
|
- rules={{ required: 'انتخاب شهر الزامی است' }}
|
|
|
render={({ field }) => (
|
|
|
<FormItem>
|
|
|
<FormLabel>شهر</FormLabel>
|
|
|
|
|
|
<Select
|
|
|
disabled={readOnly || !provinceId}
|
|
|
- value={field.value ? String(field.value) : ''}
|
|
|
+ value={
|
|
|
+ field.value !== undefined && field.value !== null
|
|
|
+ ? String(field.value)
|
|
|
+ : undefined
|
|
|
+ }
|
|
|
onValueChange={(value) => field.onChange(Number(value))}
|
|
|
>
|
|
|
<FormControl>
|
|
|
@@ -381,6 +529,7 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* height */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='height'
|
|
|
@@ -391,15 +540,15 @@ export function UsersActionDialog() {
|
|
|
<FormControl>
|
|
|
<Input
|
|
|
type='number'
|
|
|
- value={field.value ?? ''}
|
|
|
+ {...field}
|
|
|
disabled={readOnly}
|
|
|
- onChange={(e) =>
|
|
|
+ value={field.value ?? ''}
|
|
|
+ onChange={(e) => {
|
|
|
+ const value = e.target.value
|
|
|
field.onChange(
|
|
|
- e.target.value === ''
|
|
|
- ? undefined
|
|
|
- : Number(e.target.value)
|
|
|
+ value === '' ? undefined : Number(value)
|
|
|
)
|
|
|
- }
|
|
|
+ }}
|
|
|
/>
|
|
|
</FormControl>
|
|
|
|
|
|
@@ -408,6 +557,7 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* weight */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='weight'
|
|
|
@@ -418,15 +568,15 @@ export function UsersActionDialog() {
|
|
|
<FormControl>
|
|
|
<Input
|
|
|
type='number'
|
|
|
- value={field.value ?? ''}
|
|
|
+ {...field}
|
|
|
disabled={readOnly}
|
|
|
- onChange={(e) =>
|
|
|
+ value={field.value ?? ''}
|
|
|
+ onChange={(e) => {
|
|
|
+ const value = e.target.value
|
|
|
field.onChange(
|
|
|
- e.target.value === ''
|
|
|
- ? undefined
|
|
|
- : Number(e.target.value)
|
|
|
+ value === '' ? undefined : Number(value)
|
|
|
)
|
|
|
- }
|
|
|
+ }}
|
|
|
/>
|
|
|
</FormControl>
|
|
|
|
|
|
@@ -435,6 +585,7 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* foot */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='foot_specialization'
|
|
|
@@ -444,7 +595,7 @@ export function UsersActionDialog() {
|
|
|
|
|
|
<Select
|
|
|
disabled={readOnly}
|
|
|
- value={field.value ?? ''}
|
|
|
+ value={field.value || undefined}
|
|
|
onValueChange={field.onChange}
|
|
|
>
|
|
|
<FormControl>
|
|
|
@@ -467,6 +618,7 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* position */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='post_skill'
|
|
|
@@ -476,7 +628,7 @@ export function UsersActionDialog() {
|
|
|
|
|
|
<Select
|
|
|
disabled={readOnly}
|
|
|
- value={field.value ?? ''}
|
|
|
+ value={field.value || undefined}
|
|
|
onValueChange={field.onChange}
|
|
|
>
|
|
|
<FormControl>
|
|
|
@@ -499,6 +651,7 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* skill level */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='skill_level'
|
|
|
@@ -508,7 +661,7 @@ export function UsersActionDialog() {
|
|
|
|
|
|
<Select
|
|
|
disabled={readOnly}
|
|
|
- value={field.value ?? ''}
|
|
|
+ value={field.value || undefined}
|
|
|
onValueChange={field.onChange}
|
|
|
>
|
|
|
<FormControl>
|
|
|
@@ -531,6 +684,7 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* activity history */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='activity_history'
|
|
|
@@ -541,7 +695,9 @@ export function UsersActionDialog() {
|
|
|
<Select
|
|
|
disabled={readOnly}
|
|
|
value={String(field.value)}
|
|
|
- onValueChange={(v) => field.onChange(v === 'true')}
|
|
|
+ onValueChange={(value) =>
|
|
|
+ field.onChange(value === 'true')
|
|
|
+ }
|
|
|
>
|
|
|
<FormControl>
|
|
|
<SelectTrigger>
|
|
|
@@ -565,8 +721,102 @@ export function UsersActionDialog() {
|
|
|
</FormItem>
|
|
|
)}
|
|
|
/>
|
|
|
+
|
|
|
+ {/* shirt number */}
|
|
|
+ <FormField
|
|
|
+ control={form.control}
|
|
|
+ name='shirt_number'
|
|
|
+ render={({ field }) => (
|
|
|
+ <FormItem>
|
|
|
+ <FormLabel>شماره پیراهن</FormLabel>
|
|
|
+
|
|
|
+ <FormControl>
|
|
|
+ <Input
|
|
|
+ type='number'
|
|
|
+ {...field}
|
|
|
+ disabled={readOnly}
|
|
|
+ value={field.value ?? ''}
|
|
|
+ onChange={(e) => {
|
|
|
+ const value = e.target.value
|
|
|
+ field.onChange(
|
|
|
+ value === '' ? undefined : Number(value)
|
|
|
+ )
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </FormControl>
|
|
|
+
|
|
|
+ <FormMessage />
|
|
|
+ </FormItem>
|
|
|
+ )}
|
|
|
+ />
|
|
|
+
|
|
|
+ {/* team name */}
|
|
|
+ {activity_history && (
|
|
|
+ <FormField
|
|
|
+ control={form.control}
|
|
|
+ name='team_name'
|
|
|
+ render={({ field }) => (
|
|
|
+ <FormItem>
|
|
|
+ <FormLabel>نام تیم</FormLabel>
|
|
|
+
|
|
|
+ <FormControl>
|
|
|
+ <Input
|
|
|
+ {...field}
|
|
|
+ disabled={readOnly}
|
|
|
+ value={field.value ?? ''}
|
|
|
+ />
|
|
|
+ </FormControl>
|
|
|
+
|
|
|
+ <FormMessage />
|
|
|
+ </FormItem>
|
|
|
+ )}
|
|
|
+ />
|
|
|
+ )}
|
|
|
+
|
|
|
+ {/* favorite iranian team */}
|
|
|
+ <FormField
|
|
|
+ control={form.control}
|
|
|
+ name='favorite_iranian_team'
|
|
|
+ render={({ field }) => (
|
|
|
+ <FormItem>
|
|
|
+ <FormLabel>تیم محبوب ایرانی</FormLabel>
|
|
|
+
|
|
|
+ <FormControl>
|
|
|
+ <Input
|
|
|
+ {...field}
|
|
|
+ disabled={readOnly}
|
|
|
+ value={field.value ?? ''}
|
|
|
+ />
|
|
|
+ </FormControl>
|
|
|
+
|
|
|
+ <FormMessage />
|
|
|
+ </FormItem>
|
|
|
+ )}
|
|
|
+ />
|
|
|
+
|
|
|
+ {/* favorite foreign team */}
|
|
|
+ <FormField
|
|
|
+ control={form.control}
|
|
|
+ name='favorite_foreign_team'
|
|
|
+ render={({ field }) => (
|
|
|
+ <FormItem>
|
|
|
+ <FormLabel>تیم محبوب خارجی</FormLabel>
|
|
|
+
|
|
|
+ <FormControl>
|
|
|
+ <Input
|
|
|
+ {...field}
|
|
|
+ disabled={readOnly}
|
|
|
+ value={field.value ?? ''}
|
|
|
+ />
|
|
|
+ </FormControl>
|
|
|
+
|
|
|
+ <FormMessage />
|
|
|
+ </FormItem>
|
|
|
+ )}
|
|
|
+ />
|
|
|
</div>
|
|
|
|
|
|
+ {/* bio */}
|
|
|
<FormField
|
|
|
control={form.control}
|
|
|
name='bio'
|
|
|
@@ -579,6 +829,7 @@ export function UsersActionDialog() {
|
|
|
{...field}
|
|
|
disabled={readOnly}
|
|
|
value={field.value ?? ''}
|
|
|
+ rows={4}
|
|
|
/>
|
|
|
</FormControl>
|
|
|
|
|
|
@@ -587,13 +838,10 @@ export function UsersActionDialog() {
|
|
|
)}
|
|
|
/>
|
|
|
|
|
|
+ {/* buttons */}
|
|
|
{!readOnly && (
|
|
|
- <div className='flex justify-end gap-2'>
|
|
|
- <Button
|
|
|
- type='button'
|
|
|
- variant='outline'
|
|
|
- onClick={() => setOpen(null)}
|
|
|
- >
|
|
|
+ <div className='flex justify-end gap-3'>
|
|
|
+ <Button type='button' variant='outline' onClick={handleClose}>
|
|
|
انصراف
|
|
|
</Button>
|
|
|
|
|
|
@@ -603,7 +851,19 @@ export function UsersActionDialog() {
|
|
|
createMutation.isPending || updateMutation.isPending
|
|
|
}
|
|
|
>
|
|
|
- {isAdd ? 'ایجاد کاربر' : 'ذخیره تغییرات'}
|
|
|
+ {createMutation.isPending || updateMutation.isPending
|
|
|
+ ? 'در حال ارسال...'
|
|
|
+ : isAdd
|
|
|
+ ? 'افزودن'
|
|
|
+ : 'ویرایش'}
|
|
|
+ </Button>
|
|
|
+ </div>
|
|
|
+ )}
|
|
|
+
|
|
|
+ {readOnly && (
|
|
|
+ <div className='flex justify-end'>
|
|
|
+ <Button type='button' variant='outline' onClick={handleClose}>
|
|
|
+ بستن
|
|
|
</Button>
|
|
|
</div>
|
|
|
)}
|
