From cdff6458aa931864b4d10f037fb022dc28ccf3fc Mon Sep 17 00:00:00 2001 From: Amirhossein Mahmoodi Date: Sat, 13 Jul 2024 04:53:39 +0330 Subject: [PATCH 1/5] add form create inquiryPrivacyFencing --- .env.local.example | 3 +- package.json | 3 +- public/global.scss | 8 +- public/images/locationMarker.png | Bin 0 -> 1349 bytes .../Create/Form/LocationOnMap/index.jsx | 23 + .../Create/Form/index.jsx | 407 ++++++++++++++++++ .../inquiryPrivacyFencing/Create/index.jsx | 41 ++ src/core/components/DialogTransition.jsx | 8 + .../components/MapLayer/Loading/index.jsx | 17 + .../MapLayer/MarkerLocation/index.jsx | 34 ++ src/core/components/MapLayer/index.jsx | 43 ++ src/core/components/StyledForm.jsx | 6 + src/core/utils/routes.js | 2 + 13 files changed, 590 insertions(+), 5 deletions(-) create mode 100644 public/images/locationMarker.png create mode 100644 src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx create mode 100644 src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx create mode 100644 src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx create mode 100644 src/core/components/DialogTransition.jsx create mode 100644 src/core/components/MapLayer/Loading/index.jsx create mode 100644 src/core/components/MapLayer/MarkerLocation/index.jsx create mode 100644 src/core/components/MapLayer/index.jsx create mode 100644 src/core/components/StyledForm.jsx diff --git a/.env.local.example b/.env.local.example index c93a078..fa80b33 100644 --- a/.env.local.example +++ b/.env.local.example @@ -1,2 +1,3 @@ NEXT_PUBLIC_VERSION="0.2.0" -NEXT_PUBLIC_API_URL="https://rms.witel.ir" \ No newline at end of file +NEXT_PUBLIC_API_URL="https://rms.witel.ir" +NEXT_PUBLIC_MAPTILE_ENDPOINT="https://rmsmap.rmto.ir/141map" \ No newline at end of file diff --git a/package.json b/package.json index 7bec569..9ca9364 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "next": "^14.2.3", "react": "^18", "react-dom": "^18", + "react-leaflet": "^4.2.1", "react-toastify": "^10.0.5", "sass": "^1.75.0", "stylis": "^4.3.1", @@ -41,4 +42,4 @@ "eslint-config-prettier": "^9.1.0", "prettier": "^3.3.2" } -} +} \ No newline at end of file diff --git a/public/global.scss b/public/global.scss index d1d10e3..7b73e7e 100644 --- a/public/global.scss +++ b/public/global.scss @@ -1,8 +1,10 @@ @import "fontiran"; +@import "leaflet/dist/leaflet.css"; @import "react-toastify/dist/ReactToastify.css"; .filter-toast { - box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, - rgba(0, 0, 0, 0.3) 0px 8px 16px -8px; - background-color: #d0dfe8; + box-shadow: + rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, + rgba(0, 0, 0, 0.3) 0px 8px 16px -8px; + background-color: #d0dfe8; } diff --git a/public/images/locationMarker.png b/public/images/locationMarker.png new file mode 100644 index 0000000000000000000000000000000000000000..5e19b953dee1b5f33cb9321b3f62a60dc4f3d617 GIT binary patch literal 1349 zcmV-L1-kl)P)Y>ao5TsELktsoBnmuUIlQK1p-IYoy?XqIiey9V(x$U*T zwfDDw@Q2|H=ddp4eEZvbt-U`e6bgB8GO!R>1-t_61oi^^fg@h~{cG-j8-SJmJttLd zd@jrZo&t6Qe*@B^+(WhSRF25gTQkJ0xliuMPNFa;vCy(Ajs0C-UOzR8Sbb5f`Q;lk6NGG<;(h*AsuKn znQ%>?%N}Ax&WGzroYN!EyhT|D{M;!?28>PmB#^eGI-cBWAb6srn@Mn?@OuM+6D55E z97{qxY9MH$tcOX28Nd$)0wxib?vtpeEH@A=iKL|@z%B!Ul1OruN7GzlAV?Bf7h;&F zBL(3r;8|cEFyhCp8UAng+88hq$(AQD%x-1pzxJipPF7zVzR)zTY}2P0?witFv)br8 zQo6;xXOp5`e*q_AkcEm)ul3*fUTOHx(6Z0uqT?zhXW#La#(rri7RXj$kPS*>Ml+y| z?z1M93Rvd&M8VP973{oI!Ora%WL)9ac2L32X$rT*uEES|0Y^z(lGsoe; zPL3+tIzOquZ*UCF^5TWdV1zlTBA2X=By(bjc=ZFOz3=6EQulM@L|4DZJv3j#YSz#R&9 zE>W=aN(^$gf}@jx@3veo)jkC~Pr)Dq{(ju@^7|$Q``nU|S+*%SEXE5|n=#CjN=}Ra zb~k&xOueOO*CQBao}%O8R|D?rqRC;A(wOmIU4~(X{K}^&Yr@Y{M*XaN*lWa3`qo8i z13I8|YaWy>5dtAb^acsA!a$%TlI|t}E;0}(i6GaHbsCBAxq*O*vfd{lRvHMHD9d%P zB*QtGY=xF7iyE{SV18F7z+fJ&dbf{ZxY?}m~@wT%o} zW+1TAqpl`HhAKWzT>99Dp5%dLx&BH<$(W;nJqCg-9m+M3XU{DL0xccLl@I1p0~-F3 zL}Fa8Q6sK05O8TzfYRLKXp*-L1YV}l8fwV7k(%nHhy8-bQBzhMNPx6xF*Rl=!U1E_ zg?9AWWuFB%8c2lrgAd%9kp<-w-=sr5Q!?@YrzredVKTl<B&4VSM6v@%mxlACSzZU-Ro7eM6u4{ zb_*AboCUn5WTL+g`n>^@vD2543w>~Dpc79I`ok{^0eCP#Lfm8g3IT70-|ZtAua``O zXO^$#b(@Smb*=zvb9tBJ$#1}%s*TQ_d%H-;ZB-jv7oP7R8SbHBg-9IJW*_`VWxf%g zGo~2i-L~aZE3l`)zfB2;S_bhf_5r5Md|wkE_kR}(1#;yd6cEN^ncC#R00000NkvXX Hu0mjfHiT*3 literal 0 HcmV?d00001 diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx new file mode 100644 index 0000000..ce08a88 --- /dev/null +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx @@ -0,0 +1,23 @@ +import MapLoading from "@/core/components/MapLayer/Loading"; +import MarkerLocation from "@/core/components/MapLayer/MarkerLocation"; +import { Paper, Stack } from "@mui/material"; +import { useFormikContext } from "formik"; +import dynamic from "next/dynamic"; + +const MapLayer = dynamic(() => import("@/core/components/MapLayer"), { + loading: () => , + ssr: false, +}); + +const LocationOnMap = () => { + return ( + + + + + + + + ) +} +export default LocationOnMap \ No newline at end of file diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx new file mode 100644 index 0000000..e302b9d --- /dev/null +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx @@ -0,0 +1,407 @@ +import LtrTextField from "@/core/components/LtrTextField"; +import { Autocomplete, Button, Chip, DialogActions, DialogContent, 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 LocationOnMap from "./LocationOnMap"; +import { Formik } from "formik"; +import StyledForm from "@/core/components/StyledForm"; +import moment from "jalali-moment"; +import useRequest from "@/lib/hooks/useRequest"; +import { SET_INQUIRE_PRIVACY_FENCING } from "@/core/utils/routes"; + +const CreateForm = ({ handleClose }) => { + const request = useRequest() + return ( + + { + 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 => ( + <> + + + + + + + + formik.setFieldValue('nameh_date', moment(newValue))} + label="تاریخ نامه درخواست" + slotProps={{ + textField: { fullWidth: true, size: "small" }, + }} + /> + + + + + + { + formik.setFieldValue('motaghazi_is_legal_id', newValue) + }} + options={["حقوقی", "حقیقی"]} + renderInput={(params) => } + /> + + + { + formik.setFieldValue('motaghazi_type_id', newValue) + }} + options={["دولتی", "خصوصی"]} + renderInput={(params) => } + /> + + + + + + + + + + + + + + + + + + + + + + { + formik.setFieldValue('edare_kol_id', newValue) + }} + renderInput={(params) => ( + + )} + /> + + + { + formik.setFieldValue('edare_shahri_id', newValue) + }} + options={["تهران"]} + renderInput={(params) => } + /> + + + { + formik.setFieldValue('rah_type_id', newValue) + }} + options={["آزاد راه", "بزرگراه"]} + renderInput={(params) => } + /> + + + { + formik.setFieldValue('name_mehvar_id', newValue) + }} + options={["تست"]} + renderInput={(params) => } + /> + + + {/* */} + + + { + formik.setFieldValue('samt_id', newValue) + }} + options={["چپ", "راست"]} + renderInput={(params) => } + /> + + + { + formik.setFieldValue('mizan_harim', newValue) + }} + options={["12.5", "17.5"]} + renderInput={(params) => } + /> + + + { + formik.setFieldValue('arze_navar', newValue) + }} + options={["15", "30"]} + renderInput={(params) => } + /> + + + + + + + + + + + + { + formik.setFieldValue('zone', newValue) + }} + options={["38", "39"]} + renderInput={(params) => } + /> + + + + { + formik.setFieldValue('karbari_type_id', newValue) + }} + renderInput={(params) => } + /> + + + + + + + مترمربع, + }} /> + + + { + formik.setFieldValue('ehdasat_type_id', newValue) + }} + renderTags={(value, getTagProps) => + value.map((option, index) => { + const { key, ...tagProps } = getTagProps({ index }); + return ( + + ); + }) + } + options={["تعمیرات", "احداث بنا"]} + renderInput={(params) => } + /> + + + متر, + }} /> + + + متر, + }} /> + + + { + formik.setFieldValue('mahale_ejra_id', newValue) + }} + options={["داخل حریم"]} + renderInput={(params) => } + /> + + + { + formik.setFieldValue('traffic_id', newValue) + }} + options={["سبک (ضریب ۱)"]} + renderInput={(params) => } + /> + + + { + formik.setFieldValue('vaziat_eghtesadi_id', newValue) + }} + options={["تست"]} + renderInput={(params) => } + /> + + + { + formik.setFieldValue('has_access_id', newValue) + }} + options={["بله", "خیر"]} + renderInput={(params) => } + /> + + + + + + + حداکثر مدت زمان شروع عملیات: + + + + + + + + + + + + + + + + + + + + + + + + + + )} + + + ); +}; +export default CreateForm; diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx new file mode 100644 index 0000000..a939113 --- /dev/null +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx @@ -0,0 +1,41 @@ +"use client"; +import { Close } from "@mui/icons-material"; +import { Dialog, DialogTitle, IconButton, Slide } from "@mui/material"; +import { useState } from "react"; +import CreateForm from "./Form"; +import DialogTransition from "@/core/components/DialogTransition"; + +const InquiryPrivacyFencingCreate = () => { + const [open, setOpen] = useState(true); + + const handleClickOpen = () => { + setOpen(true); + }; + + const handleClose = (value) => { + setOpen(false); + }; + return ( + <> + + + ایجاد پاسخ به استعلام + + theme.palette.grey[500], + }} + > + + + + + + ); +}; +export default InquiryPrivacyFencingCreate; diff --git a/src/core/components/DialogTransition.jsx b/src/core/components/DialogTransition.jsx new file mode 100644 index 0000000..f289140 --- /dev/null +++ b/src/core/components/DialogTransition.jsx @@ -0,0 +1,8 @@ +import { Slide } from "@mui/material"; +import React from "react"; + +const DialogTransition = React.forwardRef(function Transition(props, ref) { + return ; +}); + +export default DialogTransition \ No newline at end of file diff --git a/src/core/components/MapLayer/Loading/index.jsx b/src/core/components/MapLayer/Loading/index.jsx new file mode 100644 index 0000000..5d42012 --- /dev/null +++ b/src/core/components/MapLayer/Loading/index.jsx @@ -0,0 +1,17 @@ +import { Box, LinearProgress, Stack } from "@mui/material"; + +function MapLoading() { + return ( + + + + + + ); +} + +export default MapLoading; \ No newline at end of file diff --git a/src/core/components/MapLayer/MarkerLocation/index.jsx b/src/core/components/MapLayer/MarkerLocation/index.jsx new file mode 100644 index 0000000..c12a9d0 --- /dev/null +++ b/src/core/components/MapLayer/MarkerLocation/index.jsx @@ -0,0 +1,34 @@ +import { useFormikContext } from "formik"; +import { useRef } from "react"; +import { Marker, useMapEvents } from "react-leaflet" + +const prefix = process.env.NODE_ENV === "production" ? "/v3" : ""; + +const locationMarker = L.icon({ + iconUrl: prefix + "/images/locationMarker.png", + iconSize: [50, 50], + iconAnchor: [25, 50], +}); + +const MarkerLocation = () => { + const { setFieldValue } = useFormikContext() + 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) + }, + zoom: (e) => { + const latlon = e.target.getCenter() + location.current?.setLatLng(latlon); + setFieldValue('lat', latlon.lat) + setFieldValue('lon', latlon.lng) + }, + }); + return ( + + ) +} +export default MarkerLocation \ No newline at end of file diff --git a/src/core/components/MapLayer/index.jsx b/src/core/components/MapLayer/index.jsx new file mode 100644 index 0000000..52209da --- /dev/null +++ b/src/core/components/MapLayer/index.jsx @@ -0,0 +1,43 @@ +"use client"; +import { MapContainer, TileLayer, useMap } from "react-leaflet"; + +export const IRAN_CENTER = L.latLng(32.4279, 53.6880); + +const MapOptions = ({ options }) => { + const map = useMap(); + if (!options) return; + + if (options.mapDrag) { + map.dragging.enable(); + map.scrollWheelZoom.enable(); + map.touchZoom.enable(); + map.doubleClickZoom.enable(); + } else { + map.dragging.disable(); + map.scrollWheelZoom.disable(); + map.touchZoom.disable(); + map.doubleClickZoom.disable(); + } +}; + +function MapLayer({ children, style, otherLayers, options }) { + return ( + <> + + + + {children} + + {otherLayers} + + ); +} + +export default MapLayer; \ No newline at end of file diff --git a/src/core/components/StyledForm.jsx b/src/core/components/StyledForm.jsx new file mode 100644 index 0000000..1f299bb --- /dev/null +++ b/src/core/components/StyledForm.jsx @@ -0,0 +1,6 @@ +import { styled } from "@mui/material"; +import { Form } from "formik"; + +const StyledForm = styled(Form)``; + +export default StyledForm; diff --git a/src/core/utils/routes.js b/src/core/utils/routes.js index eb14f6c..de863af 100644 --- a/src/core/utils/routes.js +++ b/src/core/utils/routes.js @@ -4,3 +4,5 @@ export const GET_USER_ROUTE = api + "/webapi/user/get-permission"; export const GET_LOGIN_ROUTE = api + "/login_dev"; export const GET_PERMISSIONS_ROUTE = api + "/webapi/user/get-permission"; + +export const SET_INQUIRE_PRIVACY_FENCING = api + "/api/v3/harim/divarkeshi/store"; From 56fbe674839ba2629a07191db09f03ab31ecd9ca Mon Sep 17 00:00:00 2001 From: Amirhossein Mahmoodi Date: Sat, 13 Jul 2024 07:20:02 +0330 Subject: [PATCH 2/5] add form create inquiryPrivacyFencing --- .../Create/Form/index.jsx | 70 +++++++++++-------- .../inquiryPrivacyFencing/Create/index.jsx | 17 ++--- 2 files changed, 44 insertions(+), 43 deletions(-) diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx index e302b9d..c726849 100644 --- a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx @@ -1,13 +1,13 @@ import LtrTextField from "@/core/components/LtrTextField"; -import { Autocomplete, Button, Chip, DialogActions, DialogContent, Grid, InputAdornment, Stack, TextField, Typography } from "@mui/material"; +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 { DatePicker, LocalizationProvider, faIR } from "@mui/x-date-pickers"; import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali"; -import LocationOnMap from "./LocationOnMap"; import { Formik } from "formik"; -import StyledForm from "@/core/components/StyledForm"; import moment from "jalali-moment"; -import useRequest from "@/lib/hooks/useRequest"; -import { SET_INQUIRE_PRIVACY_FENCING } from "@/core/utils/routes"; +import LocationOnMap from "./LocationOnMap"; const CreateForm = ({ handleClose }) => { const request = useRequest() @@ -118,23 +118,27 @@ const CreateForm = ({ handleClose }) => { /> - { - formik.setFieldValue('motaghazi_type_id', newValue) - }} - options={["دولتی", "خصوصی"]} - renderInput={(params) => } - /> + + { + formik.setFieldValue('motaghazi_type_id', newValue) + }} + options={["دولتی", "خصوصی"]} + renderInput={(params) => } + /> + - + + + @@ -143,7 +147,9 @@ const CreateForm = ({ handleClose }) => { - + + + @@ -187,7 +193,7 @@ const CreateForm = ({ handleClose }) => { onChange={(event, newValue) => { formik.setFieldValue('rah_type_id', newValue) }} - options={["آزاد راه", "بزرگراه"]} + options={["آزاد راه", "بزرگراه", 'راه فرعی درجه 3']} renderInput={(params) => } /> @@ -199,12 +205,14 @@ const CreateForm = ({ handleClose }) => { onChange={(event, newValue) => { formik.setFieldValue('name_mehvar_id', newValue) }} - options={["تست"]} + options={["سایر"]} renderInput={(params) => } /> - {/* */} + + + { /> - { - formik.setFieldValue('arze_navar', newValue) - }} - options={["15", "30"]} - renderInput={(params) => } - /> + + { + formik.setFieldValue('arze_navar', newValue) + }} + options={["15", "30"]} + renderInput={(params) => } + /> + diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx index a939113..42bb2af 100644 --- a/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx @@ -1,20 +1,11 @@ "use client"; -import { Close } from "@mui/icons-material"; -import { Dialog, DialogTitle, IconButton, Slide } from "@mui/material"; -import { useState } from "react"; -import CreateForm from "./Form"; import DialogTransition from "@/core/components/DialogTransition"; +import { Close } from "@mui/icons-material"; +import { Dialog, DialogTitle, IconButton } from "@mui/material"; +import CreateForm from "./Form"; -const InquiryPrivacyFencingCreate = () => { - const [open, setOpen] = useState(true); +const InquiryPrivacyFencingCreate = ({ open, handleClose }) => { - const handleClickOpen = () => { - setOpen(true); - }; - - const handleClose = (value) => { - setOpen(false); - }; return ( <> From 4efc228d31d8c2111d1714348d313e84eea94973 Mon Sep 17 00:00:00 2001 From: Amirhossein Mahmoodi Date: Sat, 13 Jul 2024 11:10:53 +0330 Subject: [PATCH 3/5] add form create inquiryPrivacyFencing --- package.json | 3 +- .../Create/Form/LocationOnMap/index.jsx | 4 +- .../Create/Form/index.jsx | 903 ++++++++++-------- .../MapLayer/MarkerLocation/index.jsx | 14 +- src/core/components/StyledForm.jsx | 3 +- 5 files changed, 539 insertions(+), 388 deletions(-) diff --git a/package.json b/package.json index 9ca9364..36ec3d1 100644 --- a/package.json +++ b/package.json @@ -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" } -} \ No newline at end of file +} diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx index ce08a88..4114b33 100644 --- a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx @@ -9,12 +9,12 @@ const MapLayer = dynamic(() => import("@/core/components/MapLayer"), { ssr: false, }); -const LocationOnMap = () => { +const LocationOnMap = ({ setValue }) => { return ( - + diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx index c726849..b79c756 100644 --- a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx @@ -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 ( - { - 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 => ( - <> - - - - - - - - formik.setFieldValue('nameh_date', moment(newValue))} - label="تاریخ نامه درخواست" - slotProps={{ - textField: { fullWidth: true, size: "small" }, - }} - /> - - - - - - { - formik.setFieldValue('motaghazi_is_legal_id', newValue) - }} - options={["حقوقی", "حقیقی"]} - renderInput={(params) => } - /> - - - + + + + + + + + ( + onChange(moment(newValue))} + label="تاریخ نامه درخواست" + slotProps={{ + textField: { fullWidth: true, size: "small" }, + }} + /> + )} + /> + + + + + + ( + { + onChange(newValue) + }} + options={["حقوقی", "حقیقی"]} + renderInput={(params) => } + /> + )} + /> + + + + + ( { - formik.setFieldValue('motaghazi_type_id', newValue) + onChange(newValue) }} options={["دولتی", "خصوصی"]} renderInput={(params) => } /> - - - - - - - - - - - - - - - - - - - - - - - - - - - { - formik.setFieldValue('edare_kol_id', newValue) - }} - renderInput={(params) => ( - - )} - /> - - - { - formik.setFieldValue('edare_shahri_id', newValue) - }} - options={["تهران"]} - renderInput={(params) => } - /> - - - { - formik.setFieldValue('rah_type_id', newValue) - }} - options={["آزاد راه", "بزرگراه", 'راه فرعی درجه 3']} - renderInput={(params) => } - /> - - - { - formik.setFieldValue('name_mehvar_id', newValue) - }} - options={["سایر"]} - renderInput={(params) => } - /> - - - - - - - - { - formik.setFieldValue('samt_id', newValue) - }} - options={["چپ", "راست"]} - renderInput={(params) => } - /> - - - { - formik.setFieldValue('mizan_harim', newValue) - }} - options={["12.5", "17.5"]} - renderInput={(params) => } - /> - - - + )} + /> + + + + + + + + + + + + + + + + + + + + + + + + + + + + ( + { + onChange(newValue) + }} + options={["تهران"]} + renderInput={(params) => ( + + )} + /> + )} + /> + + + ( + { + onChange(newValue) + }} + options={["تهران"]} + renderInput={(params) => } + /> + )} + /> + + + ( + { + onChange(newValue) + }} + options={["آزاد راه", "بزرگراه", 'راه فرعی درجه 3']} + renderInput={(params) => } + /> + )} + /> + + + ( + { + onChange(newValue) + }} + options={["سایر"]} + renderInput={(params) => } + /> + )} + /> + + + + + + + + ( + { + onChange(newValue) + }} + options={["چپ", "راست"]} + renderInput={(params) => } + /> + )} + /> + + + ( + { + onChange(newValue) + }} + options={["12.5", "17.5"]} + renderInput={(params) => } + /> + )} + /> + + + + + ( { - formik.setFieldValue('arze_navar', newValue) + onChange(newValue) }} options={["15", "30"]} renderInput={(params) => } /> - - - - - - - - - - - - - { - formik.setFieldValue('zone', newValue) - }} - options={["38", "39"]} - renderInput={(params) => } - /> - - - + )} + /> + + + + + + + + + + + + + + ( { - formik.setFieldValue('karbari_type_id', newValue) + onChange(newValue) }} - renderInput={(params) => } + options={["38", "39"]} + renderInput={(params) => } /> - - - - - - - مترمربع, - }} /> - - - { - formik.setFieldValue('ehdasat_type_id', newValue) - }} - renderTags={(value, getTagProps) => - value.map((option, index) => { - const { key, ...tagProps } = getTagProps({ index }); - return ( - - ); - }) - } - options={["تعمیرات", "احداث بنا"]} - renderInput={(params) => } - /> - - - متر, - }} /> - - - متر, - }} /> - - - { - formik.setFieldValue('mahale_ejra_id', newValue) - }} - options={["داخل حریم"]} - renderInput={(params) => } - /> - - - { - formik.setFieldValue('traffic_id', newValue) - }} - options={["سبک (ضریب ۱)"]} - renderInput={(params) => } - /> - - - { - formik.setFieldValue('vaziat_eghtesadi_id', newValue) - }} - options={["تست"]} - renderInput={(params) => } - /> - - - { - formik.setFieldValue('has_access_id', newValue) - }} - options={["بله", "خیر"]} - renderInput={(params) => } - /> - - - - - - - حداکثر مدت زمان شروع عملیات: - - - - - - - - - - - - - - - - - - - - - - - - - - )} - + )} + /> + + + + ( + { + onChange(newValue) + }} + options={["اتاقک نگهبانی", "دولتی"]} + renderInput={(params) => } + /> + )} + /> + + + + + + + مترمربع, + }} /> + + + ( + { + onChange(newValue) + }} + renderTags={(value, getTagProps) => + value.map((option, index) => { + const { key, ...tagProps } = getTagProps({ index }); + return ( + + ); + }) + } + options={["تعمیرات", "احداث بنا"]} + renderInput={(params) => } + /> + )} + /> + + + متر, + }} /> + + + متر, + }} /> + + + ( + { + onChange(newValue) + }} + options={["داخل حریم"]} + renderInput={(params) => } + /> + )} + /> + + + ( + { + onChange(newValue) + }} + options={["سبک (ضریب ۱)"]} + renderInput={(params) => } + /> + )} + /> + + + ( + { + onChange(newValue) + }} + options={["تست"]} + renderInput={(params) => } + /> + )} + /> + + + ( + { + onChange(newValue) + }} + options={["بله", "خیر"]} + renderInput={(params) => } + /> + )} + /> + + + + + + + حداکثر مدت زمان شروع عملیات: + + + + + + + + + + + + + + + + + + + + + + + + ); }; diff --git a/src/core/components/MapLayer/MarkerLocation/index.jsx b/src/core/components/MapLayer/MarkerLocation/index.jsx index c12a9d0..a75d191 100644 --- a/src/core/components/MapLayer/MarkerLocation/index.jsx +++ b/src/core/components/MapLayer/MarkerLocation/index.jsx @@ -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 ( diff --git a/src/core/components/StyledForm.jsx b/src/core/components/StyledForm.jsx index 1f299bb..4513129 100644 --- a/src/core/components/StyledForm.jsx +++ b/src/core/components/StyledForm.jsx @@ -1,6 +1,5 @@ import { styled } from "@mui/material"; -import { Form } from "formik"; -const StyledForm = styled(Form)``; +const StyledForm = styled('form')``; export default StyledForm; From 5183fddcdf75e41b516bb16ed508fab5824d67e6 Mon Sep 17 00:00:00 2001 From: Amirhossein Mahmoodi Date: Sat, 13 Jul 2024 11:49:14 +0330 Subject: [PATCH 4/5] add form create inquiryPrivacyFencing --- .../Create/Form/LocationOnMap/index.jsx | 2 +- .../Create/Form/index.jsx | 87 +++++++++---------- 2 files changed, 44 insertions(+), 45 deletions(-) diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx index 4114b33..be24704 100644 --- a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/LocationOnMap/index.jsx @@ -12,7 +12,7 @@ const MapLayer = dynamic(() => import("@/core/components/MapLayer"), { const LocationOnMap = ({ setValue }) => { return ( - + diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx index b79c756..057995e 100644 --- a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx @@ -144,7 +144,7 @@ const CreateForm = ({ handleClose }) => { - + { onChange(moment(newValue))} - label="تاریخ نامه درخواست" + label="تاریخ نامه درخواست *" slotProps={{ - textField: { fullWidth: true, size: "small" }, + textField: { fullWidth: true, size: "small", autoComplete: 'off' }, }} /> )} /> - + { onChange(newValue) }} options={["حقوقی", "حقیقی"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -198,7 +198,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["دولتی", "خصوصی"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -207,26 +207,26 @@ const CreateForm = ({ handleClose }) => { - + - + - + - + - + - + { }} options={["تهران"]} renderInput={(params) => ( - )} /> @@ -266,7 +265,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["تهران"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -284,7 +283,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["آزاد راه", "بزرگراه", 'راه فرعی درجه 3']} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -302,14 +301,14 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["سایر"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> - + @@ -325,7 +324,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["چپ", "راست"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -343,7 +342,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["12.5", "17.5"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -363,7 +362,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["15", "30"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -371,15 +370,15 @@ const CreateForm = ({ handleClose }) => { - + - - + + { onChange(newValue) }} options={["38", "39"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -411,16 +410,16 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["اتاقک نگهبانی", "دولتی"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> - + - مترمربع, }} /> @@ -447,18 +446,18 @@ const CreateForm = ({ handleClose }) => { }) } options={["تعمیرات", "احداث بنا"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> - متر, }} /> - متر, }} /> @@ -475,7 +474,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["داخل حریم"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -493,7 +492,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["سبک (ضریب ۱)"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -511,7 +510,7 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["تست"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> @@ -529,33 +528,33 @@ const CreateForm = ({ handleClose }) => { onChange(newValue) }} options={["بله", "خیر"]} - renderInput={(params) => } + renderInput={(params) => } /> )} /> - + - حداکثر مدت زمان شروع عملیات: - - + حداکثر مدت زمان شروع عملیات: * + + - + - + - + - + From 7d864ccf6bf7cfd676a6279e51f5e9efaad70565 Mon Sep 17 00:00:00 2001 From: Amirhossein Mahmoodi Date: Sat, 13 Jul 2024 14:02:55 +0330 Subject: [PATCH 5/5] add form create inquiryPrivacyFencing --- .../Create/Form/index.jsx | 5 ++-- .../inquiryPrivacyFencing/Create/index.jsx | 4 +-- src/core/utils/routes.js | 2 ++ src/lib/hooks/useRequest.js | 27 ++++++++++++++++++- 4 files changed, 33 insertions(+), 5 deletions(-) diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx index 057995e..9fff4da 100644 --- a/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/Form/index.jsx @@ -9,7 +9,7 @@ import moment from "jalali-moment"; import { Controller, useForm } from "react-hook-form"; import LocationOnMap from "./LocationOnMap"; -const CreateForm = ({ handleClose }) => { +const CreateForm = ({ handleClose, mutate }) => { const { control, watch, register, handleSubmit, setValue } = useForm({ defaultValues: { dabirkhaneh_number: '', @@ -130,6 +130,7 @@ const CreateForm = ({ handleClose }) => { try { await request(SET_INQUIRE_PRIVACY_FENCING, 'post', { data: formData }) handleClose() + mutate() } catch (error) { } @@ -441,7 +442,7 @@ const CreateForm = ({ handleClose }) => { value.map((option, index) => { const { key, ...tagProps } = getTagProps({ index }); return ( - + ); }) } diff --git a/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx b/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx index 42bb2af..9010277 100644 --- a/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx +++ b/src/components/dashboard/inquiryPrivacyFencing/Create/index.jsx @@ -4,7 +4,7 @@ import { Close } from "@mui/icons-material"; import { Dialog, DialogTitle, IconButton } from "@mui/material"; import CreateForm from "./Form"; -const InquiryPrivacyFencingCreate = ({ open, handleClose }) => { +const InquiryPrivacyFencingCreate = ({ open, handleClose, mutate }) => { return ( <> @@ -24,7 +24,7 @@ const InquiryPrivacyFencingCreate = ({ open, handleClose }) => { > - + ); diff --git a/src/core/utils/routes.js b/src/core/utils/routes.js index de863af..29a17a8 100644 --- a/src/core/utils/routes.js +++ b/src/core/utils/routes.js @@ -1,5 +1,7 @@ const api = process.env.NEXT_PUBLIC_API_URL; +export const GET_CSRF = api + "/csrf"; + export const GET_USER_ROUTE = api + "/webapi/user/get-permission"; export const GET_LOGIN_ROUTE = api + "/login_dev"; diff --git a/src/lib/hooks/useRequest.js b/src/lib/hooks/useRequest.js index 2e35512..8805a56 100644 --- a/src/lib/hooks/useRequest.js +++ b/src/lib/hooks/useRequest.js @@ -1,7 +1,18 @@ import { errorResponse } from "@/core/utils/errorResponse"; +import { GET_CSRF } from "@/core/utils/routes"; import { successRequest } from "@/core/utils/successRequest"; import axios from "axios"; +const getCsrfToken = async () => { + try { + const response = await axios.get(GET_CSRF); + return response.data.data; + } catch (error) { + console.error("Error fetching CSRF token:", error); + throw error; + } +}; + const defaultOptions = { data: {}, requestOptions: { @@ -15,13 +26,27 @@ const defaultOptions = { }; const useRequest = (initOptions) => { + const instance = axios.create(); + instance.interceptors.request.use( + async function (config) { + if (config.method !== 'get') { + const csrfToken = await getCsrfToken(); + config.headers['X-CSRF-TOKEN'] = csrfToken; + } + return config; + }, + function (error) { + return Promise.reject(error); + } + ); + const _options = Object.assign({}, defaultOptions, initOptions); return async (url = "", method = "get", options) => { const mergedOptions = Object.assign({}, _options, options); try { - const response = await axios({ + const response = await instance({ url, method, data: method === "get" ? null : mergedOptions.data,