RMS/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add form create inquiryPrivacyFencing

Browse Source
This commit is contained in:
Amirhossein Mahmoodi
2024-07-13 11:10:53 +03:30
parent 56fbe67483
commit 4efc228d31
5 changed files with 539 additions and 388 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

@@ -28,6 +28,7 @@
"next": "^14.2.3",
"react": "^18",
"react-dom": "^18",
"react-hook-form": "^7.52.1",
"react-leaflet": "^4.2.1",
"react-toastify": "^10.0.5",
"sass": "^1.75.0",
@@ -42,4 +43,4 @@
"eslint-config-prettier": "^9.1.0",
"prettier": "^3.3.2"
}
}
}

4
src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx
View File

@@ -9,12 +9,12 @@ const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
ssr: false,
});
const LocationOnMap = () => {
const LocationOnMap = ({ setValue }) => {
return (
<Stack sx={{ height: "100%", position: "relative" }}>
<Paper sx={{ flexGrow: 1 }} elevation={0}>
<MapLayer style={{ borderRadius: '4px' }}>
<MarkerLocation />
<MarkerLocation setValue={setValue} />
</MapLayer>
</Paper>
</Stack>

903
src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx
View File

@@ -2,415 +2,568 @@ import LtrTextField from "@/core/components/LtrTextField";
import StyledForm from "@/core/components/StyledForm";
import { SET_INQUIRE_PRIVACY_FENCING } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { Autocomplete, Button, Chip, DialogActions, DialogContent, Fade, Grid, InputAdornment, Stack, TextField, Typography } from "@mui/material";
import { Autocomplete, Box, Button, Chip, DialogActions, DialogContent, Fade, Grid, InputAdornment, Stack, TextField, Typography } from "@mui/material";
import { DatePicker, LocalizationProvider, faIR } from "@mui/x-date-pickers";
import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
import { Formik } from "formik";
import moment from "jalali-moment";
import { Controller, useForm } from "react-hook-form";
import LocationOnMap from "./LocationOnMap";
const CreateForm = ({ handleClose }) => {
const { control, watch, register, handleSubmit, setValue } = useForm({
defaultValues: {
dabirkhaneh_number: '',
nameh_date: moment(),
nameh_date_fa: '',
marjae_pasokh: '',
motaghazi_is_legal_id: null,
motaghazi_is_legal: '',
motaghazi_type_id: '',
motaghazi_type: null,
motaghazi_firstname: '',
motaghazi_lastname: '',
national_id: '',
shenase_melli: '',
tel_number: '',
mobile_number: '',
address: '',
edare_kol_id: null,
edare_kol: '',
edare_shahri_id: null,
edare_shahri: '',
rah_type_id: null,
rah_type: '',
name_mehvar_id: '',
name_mehvar_fa: null,
mizan_harim: null,
arze_navar: null,
samt_id: null,
samt: '',
kilometr: '',
lat: '',
lon: '',
zone: null,
karbari_type_id: null,
karbari_type: '',
tarh_title: '',
masahat_zirbana: '',
ehdasat_type_id: [],
ehdasat_type: '',
divarkeshi_distance: '',
mostahadesat_distance: '',
mahale_ejra_id: null,
mahale_ejra: '',
traffic_id: null,
traffic: '',
vaziat_eghtesadi_id: null,
vaziat_eghtesadi: '',
has_access_id: null,
has_access: '',
shomare_estelam_harim: '',
max_month: '',
max_day: '',
shomare_tahaodname: '',
shomare_daftarkhaneh: '',
description: '',
ronevesht: '',
}
});
const request = useRequest()
const onSubmit = async (data) => {
const formData = new FormData()
formData.append('dabirkhaneh_number', data.dabirkhaneh_number)
formData.append('nameh_date', data.nameh_date.format('YYYY-MM-DD'))
formData.append('nameh_date_fa', data.nameh_date)
formData.append('marjae_pasokh', data.marjae_pasokh)
formData.append('motaghazi_is_legal_id', data.motaghazi_is_legal_id)
formData.append('motaghazi_is_legal', data.motaghazi_is_legal_id)
formData.append('motaghazi_type_id', 1)
formData.append('motaghazi_type', data.motaghazi_type)
formData.append('motaghazi_firstname', data.motaghazi_firstname)
formData.append('motaghazi_lastname', data.motaghazi_lastname)
formData.append('national_id', data.national_id)
formData.append('shenase_melli', data.national_id)
formData.append('tel_number', data.tel_number)
formData.append('mobile_number', data.mobile_number)
formData.append('address', data.address)
formData.append('edare_kol_id', data.edare_kol_id)
formData.append('edare_kol', data.edare_kol_id)
formData.append('edare_shahri_id', data.edare_shahri_id)
formData.append('edare_shahri', data.edare_shahri_id)
formData.append('rah_type_id', data.rah_type_id)
formData.append('rah_type', data.rah_type_id)
formData.append('name_mehvar_id', 1)
formData.append('name_mehvar_fa', data.name_mehvar_id)
formData.append('mizan_harim', data.mizan_harim)
formData.append('arze_navar', data.arze_navar)
formData.append('samt_id', data.samt_id)
formData.append('samt', data.samt_id)
formData.append('kilometr', data.kilometr)
formData.append('lat', data.lat)
formData.append('lon', data.lon)
formData.append('zone', data.zone)
formData.append('karbari_type_id', data.karbari_type_id)
formData.append('karbari_type', data.karbari_type_id)
formData.append('tarh_title', data.tarh_title)
formData.append('masahat_zirbana', data.masahat_zirbana)
formData.append('ehdasat_type_id', data.ehdasat_type_id.join("|"))
formData.append('ehdasat_type', data.ehdasat_type_id.join("|"))
formData.append('divarkeshi_distance', data.divarkeshi_distance)
formData.append('mostahadesat_distance', data.mostahadesat_distance)
formData.append('mahale_ejra_id', data.mahale_ejra_id)
formData.append('mahale_ejra', data.mahale_ejra)
formData.append('traffic_id', data.traffic_id)
formData.append('traffic', data.traffic_id)
formData.append('vaziat_eghtesadi_id', data.vaziat_eghtesadi_id)
formData.append('vaziat_eghtesadi', data.vaziat_eghtesadi)
formData.append('has_access_id', data.has_access_id)
formData.append('has_access', data.has_access_id)
formData.append('shomare_estelam_harim', data.shomare_estelam_harim)
formData.append('max_month', data.max_month)
formData.append('max_day', data.max_day)
formData.append('shomare_tahaodname', data.shomare_tahaodname)
formData.append('shomare_daftarkhaneh', data.shomare_daftarkhaneh)
formData.append('description', data.description)
formData.append('ronevesht', data.ronevesht)
try {
await request(SET_INQUIRE_PRIVACY_FENCING, 'post', { data: formData })
handleClose()
} catch (error) {
}
};
return (
<LocalizationProvider
dateAdapter={AdapterDateFnsJalali}
localeText={faIR.components.MuiLocalizationProvider.defaultProps.localeText}
>
<Formik
initialValues={{
dabirkhaneh_number: '',
nameh_date: moment(),
nameh_date_fa: '',
marjae_pasokh: '',
motaghazi_is_legal_id: null,
motaghazi_is_legal: '',
motaghazi_type_id: null,
motaghazi_type: '',
motaghazi_firstname: '',
motaghazi_lastname: '',
national_id: '',
shenase_melli: '',
tel_number: '',
mobile_number: '',
address: '',
edare_kol_id: null,
edare_kol: '',
edare_shahri_id: null,
edare_shahri: '',
rah_type_id: null,
rah_type: '',
name_mehvar_id: null,
name_mehvar_fa: '',
mizan_harim: null,
arze_navar: null,
samt_id: null,
samt: '',
kilometr: '',
lat: '',
lon: '',
zone: null,
karbari_type_id: null,
karbari_type: '',
tarh_title: '',
masahat_zirbana: '',
ehdasat_type_id: [],
ehdasat_type: '',
divarkeshi_distance: '',
mostahadesat_distance: '',
mahale_ejra_id: null,
mahale_ejra: '',
traffic_id: null,
traffic: '',
vaziat_eghtesadi_id: null,
vaziat_eghtesadi: '',
has_access_id: null,
has_access: '',
shomare_estelam_harim: '',
max_month: '',
max_day: '',
shomare_tahaodname: '',
shomare_daftarkhaneh: '',
description: '',
ronevesht: '',
}}
onSubmit={async (values, { setSubmitting }) => {
try {
await request(SET_INQUIRE_PRIVACY_FENCING, 'post', { data: { ...values, ehdasat_type_id: values.ehdasat_type_id.join("|") } })
handleClose()
} catch (error) {
}
finally {
setSubmitting(false);
}
}}
>
{formik => (
<>
<DialogContent>
<StyledForm onSubmit={formik.handleSubmit} id={'InquiryPrivacyFencingCreateForm'}>
<Grid container columns={{ xs: 1, sm: 2, md: 3 }} spacing={4}>
<Grid item xs={1}>
<LtrTextField name="dabirkhaneh_number" value={formik.values.dabirkhaneh_number} onChange={formik.handleChange} required label="شماره دبیرخانه درخواست" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<DatePicker
value={formik.values.nameh_date.toDate()} onChange={(newValue) => formik.setFieldValue('nameh_date', moment(newValue))}
label="تاریخ نامه درخواست"
slotProps={{
textField: { fullWidth: true, size: "small" },
}}
/>
</Grid>
<Grid item xs={1}>
<TextField name="marjae_pasokh" value={formik.values.marjae_pasokh} onChange={formik.handleChange} label="مرجع درخواست کننده پاسخ به استعلام" size="small" fullWidth />
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.motaghazi_is_legal_id}
onChange={(event, newValue) => {
formik.setFieldValue('motaghazi_is_legal_id', newValue)
}}
options={["حقوقی", "حقیقی"]}
renderInput={(params) => <TextField fullWidth {...params} label="متقاضی" required />}
/>
</Grid>
<Grid item xs={1}>
<Fade in={formik.values.motaghazi_is_legal_id === 'حقوقی'} mountOnEnter={true} unmountOnExit={true}>
<DialogContent>
<StyledForm onSubmit={handleSubmit(onSubmit)} id={'InquiryPrivacyFencingCreateForm'}>
<Grid container columns={{ xs: 1, sm: 2, md: 3 }} spacing={4}>
<Grid item xs={1}>
<LtrTextField {...register('dabirkhaneh_number')} required label="شماره دبیرخانه درخواست" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<Controller
name="nameh_date"
control={control}
render={({ field: { onChange, value } }) => (
<DatePicker
value={value.toDate()}
onChange={(newValue) => onChange(moment(newValue))}
label="تاریخ نامه درخواست"
slotProps={{
textField: { fullWidth: true, size: "small" },
}}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<TextField {...register('marjae_pasokh')} label="مرجع درخواست کننده پاسخ به استعلام" size="small" fullWidth />
</Grid>
<Grid item xs={1}>
<Controller
name="motaghazi_is_legal_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["حقوقی", "حقیقی"]}
renderInput={(params) => <TextField fullWidth {...params} label="متقاضی" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Fade in={watch('motaghazi_is_legal_id') === 'حقوقی'} mountOnEnter={true} unmountOnExit={true}>
<Box>
<Controller
name="motaghazi_type"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={formik.values.motaghazi_type_id}
value={value}
onChange={(event, newValue) => {
formik.setFieldValue('motaghazi_type_id', newValue)
onChange(newValue)
}}
options={["دولتی", "خصوصی"]}
renderInput={(params) => <TextField fullWidth {...params} label="نوع متقاضی" required />}
/>
</Fade>
</Grid>
<Grid item xs={1}></Grid>
<Grid item xs={1}>
<TextField name="motaghazi_firstname" value={formik.values.motaghazi_firstname} onChange={formik.handleChange} label="نام متقاضی" size="small" fullWidth required />
</Grid>
<Grid item xs={1}>
<Fade in={formik.values.motaghazi_is_legal_id === 'حقیقی'} mountOnEnter={true} unmountOnExit={true}>
<TextField name="motaghazi_lastname" value={formik.values.motaghazi_lastname} onChange={formik.handleChange} label="نام خانوادگی متقاضی" size="small" fullWidth required />
</Fade>
</Grid>
<Grid item xs={1}>
<LtrTextField name="national_id" value={formik.values.national_id} onChange={formik.handleChange} required label="کد ملی/شناسه ملی" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<LtrTextField name="tel_number" value={formik.values.tel_number} onChange={formik.handleChange} label="تلفن" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<Fade in={formik.values.motaghazi_type_id !== 'دولتی'} mountOnEnter={true} unmountOnExit={true}>
<LtrTextField name="mobile_number" value={formik.values.mobile_number} onChange={formik.handleChange} label="تلفن همراه" size="small" fullWidth type="tel" />
</Fade>
</Grid>
<Grid item xs={1}>
<TextField name="address" value={formik.values.address} onChange={formik.handleChange} label="آدرس" size="small" fullWidth required />
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
options={["تهران"]}
value={formik.values.edare_kol_id}
onChange={(event, newValue) => {
formik.setFieldValue('edare_kol_id', newValue)
}}
renderInput={(params) => (
<TextField
fullWidth
{...params}
label="اداره كل راهداری و حمل و نقل جاده ای"
required
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.edare_shahri_id}
onChange={(event, newValue) => {
formik.setFieldValue('edare_shahri_id', newValue)
}}
options={["تهران"]}
renderInput={(params) => <TextField fullWidth {...params} label="اداره شهرستان" required />}
/>
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.rah_type_id}
onChange={(event, newValue) => {
formik.setFieldValue('rah_type_id', newValue)
}}
options={["آزاد راه", "بزرگراه", 'راه فرعی درجه 3']}
renderInput={(params) => <TextField fullWidth {...params} label="نوع راه" required />}
/>
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.name_mehvar_id}
onChange={(event, newValue) => {
formik.setFieldValue('name_mehvar_id', newValue)
}}
options={["سایر"]}
renderInput={(params) => <TextField fullWidth {...params} label="نام محور" required />}
/>
</Grid>
<Grid item xs={1}>
<Fade in={formik.values.name_mehvar_id === "سایر"} mountOnEnter={true} unmountOnExit={true}>
<TextField label="سایر محورها" size="small" fullWidth />
</Fade>
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.samt_id}
onChange={(event, newValue) => {
formik.setFieldValue('samt_id', newValue)
}}
options={["چپ", "راست"]}
renderInput={(params) => <TextField fullWidth {...params} label="سمت" required />}
/>
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.mizan_harim}
onChange={(event, newValue) => {
formik.setFieldValue('mizan_harim', newValue)
}}
options={["12.5", "17.5"]}
renderInput={(params) => <TextField fullWidth {...params} label="میزان حریم" required />}
/>
</Grid>
<Grid item xs={1}>
<Fade in={formik.values.rah_type_id !== 'راه فرعی درجه 3'} mountOnEnter={true} unmountOnExit={true}>
)}
/>
</Box>
</Fade>
</Grid>
<Grid item xs={1}></Grid>
<Grid item xs={1}>
<TextField {...register('motaghazi_firstname')} label="نام متقاضی" size="small" fullWidth required />
</Grid>
<Grid item xs={1}>
<Fade in={watch('motaghazi_is_legal_id') === 'حقیقی'} mountOnEnter={true} unmountOnExit={true}>
<TextField {...register('motaghazi_lastname')} label="نام خانوادگی متقاضی" size="small" fullWidth required />
</Fade>
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('national_id')} required label="کد ملی/شناسه ملی" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('tel_number')} label="تلفن" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<Fade in={watch('motaghazi_type') !== 'دولتی' || watch('formik.values.motaghazi_is_legal_id') === 'حقیقی'} mountOnEnter={true} unmountOnExit={true}>
<LtrTextField {...register('mobile_number')} label="تلفن همراه" size="small" fullWidth type="tel" />
</Fade>
</Grid>
<Grid item xs={1}>
<TextField {...register('address')} label="آدرس" size="small" fullWidth required />
</Grid>
<Grid item xs={1}>
<Controller
name="edare_kol_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["تهران"]}
renderInput={(params) => (
<TextField
fullWidth
{...params}
label="اداره كل راهداری و حمل و نقل جاده ای"
required
/>
)}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Controller
name="edare_shahri_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["تهران"]}
renderInput={(params) => <TextField fullWidth {...params} label="اداره شهرستان" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Controller
name="rah_type_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["آزاد راه", "بزرگراه", 'راه فرعی درجه 3']}
renderInput={(params) => <TextField fullWidth {...params} label="نوع راه" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Controller
name="name_mehvar_fa"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["سایر"]}
renderInput={(params) => <TextField fullWidth {...params} label="نام محور" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Fade in={watch('name_mehvar_fa') === "سایر"} mountOnEnter={true} unmountOnExit={true}>
<TextField label="سایر محورها" size="small" fullWidth />
</Fade>
</Grid>
<Grid item xs={1}>
<Controller
name="samt_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["چپ", "راست"]}
renderInput={(params) => <TextField fullWidth {...params} label="سمت" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Controller
name="mizan_harim"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["12.5", "17.5"]}
renderInput={(params) => <TextField fullWidth {...params} label="میزان حریم" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Fade in={watch('rah_type_id') !== 'راه فرعی درجه 3'} mountOnEnter={true} unmountOnExit={true}>
<Box>
<Controller
name="arze_navar"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={formik.values.arze_navar}
value={value}
onChange={(event, newValue) => {
formik.setFieldValue('arze_navar', newValue)
onChange(newValue)
}}
options={["15", "30"]}
renderInput={(params) => <TextField fullWidth {...params} label="عرض نوار تاسیساتی زیربنایی" required />}
/>
</Fade>
</Grid>
<Grid item xs={1}>
<LtrTextField name="kilometr" value={formik.values.kilometr} onChange={formik.handleChange} label="كيلومتر" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1} sm={2} sx={{ height: 300 }}>
<LocationOnMap />
</Grid>
<Grid item xs={1}>
<Stack spacing={3}>
<LtrTextField value={formik.values.lat} label="عرض جغرافیایی" size="small" fullWidth InputProps={{
readOnly: true,
}} />
<LtrTextField value={formik.values.lon} label="طول جغرافیایی" size="small" fullWidth InputProps={{
readOnly: true,
}} />
<Autocomplete
size="small"
disablePortal
value={formik.values.zone}
onChange={(event, newValue) => {
formik.setFieldValue('zone', newValue)
}}
options={["38", "39"]}
renderInput={(params) => <TextField fullWidth {...params} label="Zone" required />}
/>
</Stack>
</Grid>
<Grid item xs={1}>
)}
/>
</Box>
</Fade>
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('kilometr')} label="كيلومتر" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1} sm={2} sx={{ height: 300 }}>
<LocationOnMap setValue={setValue} />
</Grid>
<Grid item xs={1}>
<Stack spacing={3}>
<LtrTextField {...register('lat')} label="عرض جغرافیایی" size="small" fullWidth disabled={true} />
<LtrTextField {...register('lon')} label="طول جغرافیایی" size="small" fullWidth disabled={true} />
<Controller
name="zone"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
options={["اتاقک نگهبانی", "دولتی"]}
value={formik.values.karbari_type_id}
value={value}
onChange={(event, newValue) => {
formik.setFieldValue('karbari_type_id', newValue)
onChange(newValue)
}}
renderInput={(params) => <TextField fullWidth {...params} label="نوع کاربری" required />}
options={["38", "39"]}
renderInput={(params) => <TextField fullWidth {...params} label="Zone" required />}
/>
</Grid>
<Grid item xs={1}>
<TextField name="tarh_title" value={formik.values.tarh_title} onChange={formik.handleChange} label="عنوان طرح" size="small" fullWidth />
</Grid>
<Grid item xs={1}>
<LtrTextField name="masahat_zirbana" value={formik.values.masahat_zirbana} label="مساحت زیربنا" size="small" fullWidth type="tel" InputProps={{
endAdornment: <InputAdornment position="end">
مترمربع</InputAdornment>,
}} />
</Grid>
<Grid item xs={1}>
<Autocomplete
multiple
size="small"
disablePortal
value={formik.values.ehdasat_type_id}
onChange={(event, newValue) => {
formik.setFieldValue('ehdasat_type_id', newValue)
}}
renderTags={(value, getTagProps) =>
value.map((option, index) => {
const { key, ...tagProps } = getTagProps({ index });
return (
<Chip label={option} key={key} {...tagProps} />
);
})
}
options={["تعمیرات", "احداث بنا"]}
renderInput={(params) => <TextField fullWidth {...params} label="نوع احداثات" />}
/>
</Grid>
<Grid item xs={1}>
<LtrTextField name="divarkeshi_distance" value={formik.values.divarkeshi_distance} onChange={formik.handleChange} label="فاصله دیوارکشی از آکس محور" size="small" fullWidth type="tel" InputProps={{
endAdornment: <InputAdornment position="end">متر</InputAdornment>,
}} />
</Grid>
<Grid item xs={1}>
<LtrTextField name="mostahadesat_distance" value={formik.values.mostahadesat_distance} onChange={formik.handleChange} label="فاصله مستحدثات از آکس محور" size="small" fullWidth type="tel" InputProps={{
endAdornment: <InputAdornment position="end">متر</InputAdornment>,
}} />
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.mahale_ejra_id}
onChange={(event, newValue) => {
formik.setFieldValue('mahale_ejra_id', newValue)
}}
options={["داخل حریم"]}
renderInput={(params) => <TextField fullWidth {...params} label="محل اجرا" />}
/>
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.traffic_id}
onChange={(event, newValue) => {
formik.setFieldValue('traffic_id', newValue)
}}
options={["سبک (ضریب ۱)"]}
renderInput={(params) => <TextField fullWidth {...params} label="میزان ترافیک" required />}
/>
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.vaziat_eghtesadi_id}
onChange={(event, newValue) => {
formik.setFieldValue('vaziat_eghtesadi_id', newValue)
}}
options={["تست"]}
renderInput={(params) => <TextField fullWidth {...params} label="وضعیت اقتصادی" />}
/>
</Grid>
<Grid item xs={1}>
<Autocomplete
size="small"
disablePortal
value={formik.values.has_access_id}
onChange={(event, newValue) => {
formik.setFieldValue('has_access_id', newValue)
}}
options={["بله", "خیر"]}
renderInput={(params) => <TextField fullWidth {...params} label="آیا راه دسترسی از قبل وجود دارد؟" required />}
/>
</Grid>
<Grid item xs={1}>
<LtrTextField name="shomare_estelam_harim" value={formik.values.shomare_estelam_harim} onChange={formik.handleChange} label="شماره استعلام دفتر ایمنی و حریم" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<Stack direction={'row'} spacing={1} alignItems={'center'}>
<Typography sx={{ flex: 2 }} variant="body2">حداکثر مدت زمان شروع عملیات:</Typography>
<LtrTextField name="max_month" value={formik.values.max_month} onChange={formik.handleChange} sx={{ width: 60 }} label="ماه" size="small" type="tel" />
<LtrTextField name="max_day" value={formik.values.max_day} onChange={formik.handleChange} sx={{ width: 60 }} label="روز" size="small" type="tel" />
</Stack>
</Grid>
<Grid item xs={1}>
<LtrTextField name="shomare_tahaodname" value={formik.values.shomare_tahaodname} onChange={formik.handleChange} label="شماره تعهدنامه" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<LtrTextField name="shomare_daftarkhaneh" value={formik.values.shomare_daftarkhaneh} onChange={formik.handleChange} label="شماره دفترخانه" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}></Grid>
<Grid item xs={1}>
<TextField name="description" value={formik.values.description} onChange={formik.handleChange} multiline rows={2} label="توضیحات" size="small" fullWidth />
</Grid>
<Grid item xs={1}>
<TextField name="ronevesht" value={formik.values.ronevesht} onChange={formik.handleChange} multiline rows={2} label="رونوشت" size="small" fullWidth />
</Grid>
<Grid item xs={1}></Grid>
</Grid>
</StyledForm>
</DialogContent>
<DialogActions sx={{ p: 2 }}>
<Button variant="contained" size="large" type="submit" form={'InquiryPrivacyFencingCreateForm'}>ثبت</Button>
</DialogActions>
</>
)}
</Formik>
)}
/>
</Stack>
</Grid>
<Grid item xs={1}>
<Controller
name="karbari_type_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["اتاقک نگهبانی", "دولتی"]}
renderInput={(params) => <TextField fullWidth {...params} label="نوع کاربری" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<TextField {...register('tarh_title')} label="عنوان طرح" size="small" fullWidth />
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('masahat_zirbana')} label="مساحت زیربنا" size="small" fullWidth type="tel" InputProps={{
endAdornment: <InputAdornment position="end">
مترمربع</InputAdornment>,
}} />
</Grid>
<Grid item xs={1}>
<Controller
name="ehdasat_type_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
multiple
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
renderTags={(value, getTagProps) =>
value.map((option, index) => {
const { key, ...tagProps } = getTagProps({ index });
return (
<Chip label={option} key={key} {...tagProps} />
);
})
}
options={["تعمیرات", "احداث بنا"]}
renderInput={(params) => <TextField fullWidth {...params} label="نوع احداثات" />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('divarkeshi_distance')} label="فاصله دیوارکشی از آکس محور" size="small" fullWidth type="tel" InputProps={{
endAdornment: <InputAdornment position="end">متر</InputAdornment>,
}} />
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('mostahadesat_distance')} label="فاصله مستحدثات از آکس محور" size="small" fullWidth type="tel" InputProps={{
endAdornment: <InputAdornment position="end">متر</InputAdornment>,
}} />
</Grid>
<Grid item xs={1}>
<Controller
name="mahale_ejra_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["داخل حریم"]}
renderInput={(params) => <TextField fullWidth {...params} label="محل اجرا" />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Controller
name="traffic_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["سبک (ضریب ۱)"]}
renderInput={(params) => <TextField fullWidth {...params} label="میزان ترافیک" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Controller
name="vaziat_eghtesadi_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["تست"]}
renderInput={(params) => <TextField fullWidth {...params} label="وضعیت اقتصادی" />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<Controller
name="has_access_id"
control={control}
render={({ field: { onChange, value } }) => (
<Autocomplete
size="small"
disablePortal
value={value}
onChange={(event, newValue) => {
onChange(newValue)
}}
options={["بله", "خیر"]}
renderInput={(params) => <TextField fullWidth {...params} label="آیا راه دسترسی از قبل وجود دارد؟" required />}
/>
)}
/>
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('shomare_estelam_harim')} label="شماره استعلام دفتر ایمنی و حریم" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<Stack direction={'row'} spacing={1} alignItems={'center'}>
<Typography sx={{ flex: 2 }} variant="body2">حداکثر مدت زمان شروع عملیات:</Typography>
<LtrTextField {...register('max_month')} sx={{ width: 60 }} label="ماه" size="small" type="tel" />
<LtrTextField {...register('max_day')} sx={{ width: 60 }} label="روز" size="small" type="tel" />
</Stack>
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('shomare_tahaodname')} label="شماره تعهدنامه" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}>
<LtrTextField {...register('shomare_daftarkhaneh')} label="شماره دفترخانه" size="small" fullWidth type="tel" />
</Grid>
<Grid item xs={1}></Grid>
<Grid item xs={1}>
<TextField {...register('description')} multiline rows={2} label="توضیحات" size="small" fullWidth />
</Grid>
<Grid item xs={1}>
<TextField {...register('ronevesht')} multiline rows={2} label="رونوشت" size="small" fullWidth />
</Grid>
<Grid item xs={1}></Grid>
</Grid>
</StyledForm>
</DialogContent>
<DialogActions sx={{ p: 2 }}>
<Button variant="contained" size="large" type="submit" form={'InquiryPrivacyFencingCreateForm'}>ثبت</Button>
</DialogActions>
</LocalizationProvider >
);
};

14
src/core/components/MapLayer/MarkerLocation/index.jsx
View File

@@ -1,6 +1,5 @@
import { useFormikContext } from "formik";
import { useRef } from "react";
import { Marker, useMapEvents } from "react-leaflet"
import { Marker, useMapEvents } from "react-leaflet";
const prefix = process.env.NODE_ENV === "production" ? "/v3" : "";
@@ -10,21 +9,20 @@ const locationMarker = L.icon({
iconAnchor: [25, 50],
});
const MarkerLocation = () => {
const { setFieldValue } = useFormikContext()
const MarkerLocation = ({ setValue }) => {
const location = useRef();
const map = useMapEvents({
move: (e) => {
const latlon = e.target.getCenter()
location.current?.setLatLng(latlon);
setFieldValue('lat', latlon.lat)
setFieldValue('lon', latlon.lng)
setValue('lat', latlon.lat)
setValue('lon', latlon.lng)
},
zoom: (e) => {
const latlon = e.target.getCenter()
location.current?.setLatLng(latlon);
setFieldValue('lat', latlon.lat)
setFieldValue('lon', latlon.lng)
setValue('lat', latlon.lat)
setValue('lon', latlon.lng)
},
});
return (

3
src/core/components/StyledForm.jsx
View File

@@ -1,6 +1,5 @@
import { styled } from "@mui/material";
import { Form } from "formik";
const StyledForm = styled(Form)``;
const StyledForm = styled('form')``;
export default StyledForm;