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

Merge branch 'release/v0.9.4'

Browse Source
This commit is contained in:
Amirhossein Mahmoodi
2024-11-23 14:33:28 +03:30
parent 84b21a0c68 3306cec911
commit 85f5aba9c2
8 changed files with 332 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.env.local.example
View File

@@ -1,3 +1,3 @@
NEXT_PUBLIC_VERSION="0.9.2"
NEXT_PUBLIC_VERSION="0.9.4"
NEXT_PUBLIC_API_URL="https://rms.witel.ir"
NEXT_PUBLIC_MAPTILE_ENDPOINT="https://rmsmap.rmto.ir/141map"

2
package.json
View File

@@ -49,4 +49,4 @@
"eslint-config-prettier": "^9.1.0",
"prettier": "^3.3.2"
}
}
}

7
src/app/(withAuth)/dashboard/car-details/page.js Normal file
View File

@@ -0,0 +1,7 @@
import TestPage from "@/components/dashboard/carDetails";
const Page = () => {
return <TestPage />;
};
export default Page;

187
src/components/dashboard/carDetails/CarDetailsContent.jsx Normal file
View File

@@ -0,0 +1,187 @@
import {
Button, Collapse,
DialogActions,
DialogContent, Grid,
Stack, TextField
} from "@mui/material";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import {useFormik} from "formik";
import moment from "jalali-moment";
import * as Yup from "yup";
import {useState} from "react";
import ApplicantRequestDetail from "@/core/components/ApplicantRequestDetail";
import DetailMap from "@/core/components/ApplicantRequestDetail/DetailMap";
import FlyToPolyline from "@/core/components/ApplicantRequestDetail/FlyToPolyline";
import {MapContainer} from "react-leaflet";
import dynamic from "next/dynamic";
import MapLoading from "@/core/components/MapLayer/Loading";
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
loading: () => <MapLoading />,
ssr: false,
});
const fakeData = {
id: 1,
shomareh_darkhast: "2124",
ostan: "ostan",
shahr: "shahr",
shahrestan: "shahrestan",
bakhsh: "bakhsh",
roosta: "roosta",
tarikh_darkhast: "tarikh_darkhast",
sazman: "sazman",
masahat_zamin: "masahat_zamin",
masahat_tarh: "masahat_tarh",
gorooh_tarh: "gorooh_tarh",
onvane_tarh: "onvane_tarh",
address: "کرج - فلان جا - جنب پاساژ - نزدیک اونجا - اونور خیابون - زیر رو گذر - روی زیر گذر",
file_mosavab: "file",
polyline: [
[35.6892, 51.3890],
[35.7074, 51.3929],
],
};
const CarDetailsContent = ({setOpenCarDialog}) => {
const [openCarDetailContent, setOpenCarDetailContent] = useState(false)
const initialValues = {
start_date: "",
end_date: "",
vehicle_code: "",
}
const validationSchema = Yup.object().shape({
start_date: Yup.string().required("تاریخ شروع الزامیست!!!"),
end_date: Yup.string().test(
"is-greater",
"تاریخ اتمام نمی‌تواند کمتر از تاریخ شروع باشد",
function (value) {
const {start_date} = this.parent; // Access other field values
if (!value || !start_date) return true; // Skip validation if either field is empty
return moment(value, "YYYY/MM/DD").isSameOrAfter(
moment(start_date, "YYYY/MM/DD")
);
}
).required("تاریخ اتمام الزامیست!!!"),
vehicle_code: Yup.mixed()
.test("is-number", "کد خودرو باید عدد باشد!!!", (value) => !isNaN(value))
.test("positive", "کد خودرو باید مثبت باشد!!!", (value) => value >= 0)
.required("کد خودرو الزامیست!!!"),
})
const handleSubmit = async (values, props) => {
props.setSubmitting(true);
setOpenCarDetailContent(true)
console.log(values)
}
const formik = useFormik({
initialValues,
validationSchema,
onSubmit: handleSubmit,
});
console.log(formik.errors)
return (
<>
<DialogContent>
<Stack spacing={2} sx={{my: 2}}>
<Stack direction={"row"} spacing={2} sx={{my: 2}}>
<MuiDatePicker
formik={formik}
value={formik.values.start_date}
name={"start_date"}
error={formik.errors.start_date}
helperText={formik.touched.start_date && formik.errors.start_date}
touched={formik.touched.start_date}
onBlur={formik.handleBlur("start_date")}
/>
<MuiDatePicker
formik={formik}
name={"end_date"}
disabled={formik.values.start_date === ""}
value={formik.values.end_date}
error={formik.errors.end_date}
helperText={formik.touched.end_date && formik.errors.end_date}
touched={formik.touched.end_date}
onBlur={formik.handleBlur("end_date")}
/>
<TextField
name="vehicle_code"
label={"کد خودرو"}
type="text"
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
variant="outlined"
value={formik.values.vehicle_code}
onChange={(event) => {
if (!isNaN(event.target.value)) {
formik.setFieldValue("vehicle_code", event.target.value);
} else {
formik.setFieldValue("vehicle_code", formik.values.vehicle_code);
}
}}
size={"small"}
error={formik.touched.vehicle_code && Boolean(formik.errors.vehicle_code)}
helperText={formik.touched.vehicle_code && formik.errors.vehicle_code}
onBlur={formik.handleBlur("vehicle_code")}
fullWidth
/>
</Stack>
<Stack>
<Button variant={"contained"} color={"primary"}
onClick={formik.handleSubmit}>
نمایش اطلاعات
</Button>
</Stack>
</Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={4}>
<Stack direction="column" sx={{height : "100%", justifyContent: "start", alignItems: "center"}} spacing={5}>
<TextField
name="vehicle_code"
label={"مصرف سوخت خودرو"}
disabled
variant="outlined"
value={"5 لیتر"}
size={"small"}
fullWidth
/>
<TextField
name="vehicle_code"
label={"مسافت پیموده شده"}
disabled
variant="outlined"
value={"54 کیلومتر"}
size={"small"}
fullWidth
/>
<TextField
name="vehicle_code"
label={"زمان روشن بودن خودرو"}
disabled
variant="outlined"
value={"3 ساعت"}
size={"small"}
fullWidth
/>
</Stack>
</Grid>
<Grid item xs={12} sm={8}>
<MapLayer style={{ height: "400px", width: "100%" }}>
{/*<FlyToPolyline polyline={fakeData.polyline} />*/}
</MapLayer>
</Grid>
</Grid>
</DialogContent>
<DialogActions>
<Button variant={"outlined"} color={"warning"} onClick={() => setOpenCarDialog(false)}>
بستن
</Button>
</DialogActions>
</>
);
};
export default CarDetailsContent;

45
src/components/dashboard/carDetails/index.jsx Normal file
View File

@@ -0,0 +1,45 @@
"use client";
import PageTitle from "@/core/components/PageTitle";
import {Dialog, DialogTitle, IconButton, Stack, Tooltip} from "@mui/material";
import {useState} from "react";
import DriveEtaIcon from "@mui/icons-material/DriveEta";
import CarDetailsContent from "@/components/dashboard/carDetails/CarDetailsContent";
const TestPage = () => {
const [openCarDialog, setOpenCarDialog] = useState(false)
return (
<Stack spacing={1}>
<PageTitle title={"نمایش اطلاعات خودرو"} />
<>
<Tooltip title="نمایش اطلاعات خودرو">
<IconButton
color="primary"
onClick={() => {
setOpenCarDialog(true);
}}
>
<DriveEtaIcon />
</IconButton>
</Tooltip>
<Dialog
onClose={()=>setOpenCarDialog(false)}
fullWidth
open={openCarDialog}
PaperProps={{
sx: {
transition: "all .3s",
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"lg"}
>
<DialogTitle>
نمایش اطلاعات خودرو
</DialogTitle>
<CarDetailsContent setOpenCarDialog={setOpenCarDialog} />
</Dialog>
</>
</Stack>
);
};
export default TestPage;

21
src/core/components/ApplicantRequestDetail/FlyToPolyline.jsx Normal file
View File

@@ -0,0 +1,21 @@
"use client";
import { Polyline, useMap } from "react-leaflet";
import { useEffect } from "react";
const purpleOptions = { color: "purple" };
const FlyToPolyline = ({ polyline }) => {
const map = useMap();
useEffect(() => {
if (map) {
const leafletPolyline = L.polyline(polyline); // Create a Leaflet polyline
const bounds = leafletPolyline.getBounds(); // Get bounds from the polyline
map.flyToBounds(bounds, { padding: [50, 50] }); // Fly to the polyline bounds
}
}, [map, polyline]);
return <Polyline pathOptions={purpleOptions} positions={polyline} />; // Render the polyline
};
export default FlyToPolyline;

61
src/core/components/MuiDatePicker.jsx Normal file
View File

@@ -0,0 +1,61 @@
import { LocalizationProvider, MobileDateTimePicker } from "@mui/x-date-pickers";
import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
import moment from "jalali-moment";
import { faIR } from "@mui/x-date-pickers/locales";
import {Box, IconButton, FormControl, FormHelperText, InputAdornment, Stack} from "@mui/material";
import ClearIcon from "@mui/icons-material/Clear";
export default function PickerWithButtonField({
formik,
name,
value,
error,
touched,
disabled,
}) {
return (
<FormControl variant="outlined" fullWidth size="small" error={!!error}>
<Stack sx={{width : "100%"}} direction={"row"}>
<LocalizationProvider
dateAdapter={AdapterDateFnsJalali}
localeText={faIR.components.MuiLocalizationProvider.defaultProps.localeText}
>
<MobileDateTimePicker
ampm={false}
disableFuture
value={value ? new Date(value) : null}
onChange={(newValue) => {
const formattedDate = moment(newValue).locale("en").format("YYYY-MM-DD HH:mm");
formik.setFieldValue(name, formattedDate);
}}
slotProps={{
textField: {
placeholder: name === "start_date"
? "تاریخ شروع را وارد کنید"
: "تاریخ اتمام را وارد کنید",
variant: "outlined",
disabled,
fullWidth: true,
error: !!error,
helperText : touched && error ,
size: "small", // Ensure that the TextField is small
InputProps: {
endAdornment: (
<InputAdornment position="end">
<IconButton
size="small" // Set size="small" for IconButton
onClick={() => formik.setFieldValue(name, null)}
>
<ClearIcon />
</IconButton>
</InputAdornment>
),
},
},
}}
/>
</LocalizationProvider>
</Stack>
</FormControl>
);
}

9
src/core/utils/pageMenu.js
View File

@@ -19,6 +19,7 @@ import ReportIcon from "@mui/icons-material/Report";
import AssignmentLateIcon from "@mui/icons-material/AssignmentLate";
import LineAxisIcon from "@mui/icons-material/LineAxis";
import ScienceIcon from "@mui/icons-material/Science";
import DriveEtaIcon from '@mui/icons-material/DriveEta';
import BiotechIcon from "@mui/icons-material/Biotech";
export const pageMenu = [
@@ -493,4 +494,12 @@ export const pageMenu = [
icon: <BiotechIcon sx={{ width: "inherit", height: "inherit" }} />,
permissions: ["azmayesh-type-management"],
},
{
id: "CarDetails",
label: "اطلاعات خودرو",
type: "page",
route: "/dashboard/car-details",
icon: <DriveEtaIcon sx={{ width: "inherit", height: "inherit" }} />,
permissions: ["all"],
},
];