passenger boss implement

2023-07-18 16:34:32 +03:30
parent 5560dce1dd
commit 233181165c
8 changed files with 359 additions and 147 deletions
--- a/public/locales/fa/app.json
+++ b/public/locales/fa/app.json
@@ -19,9 +19,9 @@
  },
  "sidebar": {
    "dashboard": "داشبورد",
-    "passenger-office": "اداره مسافر",
+    "passenger-office": "اداره مسافر (توزیع درخواست)",
    "machinary-office": "ماشین آلات",
-    "passenger-boss": "رئیس مسافر",
+    "passenger-boss": "رئیس مسافر (کارگروه استانی)",
    "transportation-assistance": "معاونت حمل و نقل",
    "manager": "مدیر کل",
    "change-password": "تغییر رمز عبور",
@@ -103,6 +103,17 @@
    "vehicle_type": "نوع ماشین",
    "state_name": "وضعیت درخواست"
  },
+  "PassengerBoss": {
+    "name": "نام",
+    "id": "کد یکتا",
+    "national_id": "کد ملی",
+    "phone_number": "موبایل",
+    "created_at": "تاریخ درخواست",
+    "updated_at": "تاریخ بروزرسانی",
+    "navgan_id": "کد ناوگان",
+    "vehicle_type": "نوع ماشین",
+    "state_name": "وضعیت درخواست"
+  },
  "TransportationAssistance": {
    "name": "نام",
    "id": "کد یکتا",
@@ -123,8 +134,7 @@
    "updated_at": "تاریخ بروزرسانی",
    "navgan_id": "کد ناوگان",
    "vehicle_type": "نوع ماشین",
-    "state_name": "وضعیت درخواست",
-    "proposed_amount": "مقدار پیشنهادی"
+    "state_name": "وضعیت درخواست"
  },
  "ConfirmDialog": {
    "confirm": "تایید",
@@ -134,7 +144,10 @@
    "amount_error": "وارد کردن مقدار پیشنهادی الزامیست",
    "description_error": "وارد کردن توضیحات الزامی است!",
    "description": "توضیحات",
-    "choose_file": "انتخاب فایل"
+    "choose_file": "انتخاب فایل",
+    "approved_amount": "مبلغ تصویب شده",
+    "approved_amount_error": "وارد کردن مبلغ تصویب شده الزامیست",
+    "proposed_amount": "مقدار پیشنهادی"
  },
  "RejectDialog": {
    "reject": "عدم تایید",
--- a/src/components/dashboard/machinary-office/Form/ConfirmForm.jsx
+++ b/src/components/dashboard/machinary-office/Form/ConfirmForm.jsx
@@ -56,7 +56,7 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
          name="description"
          multiline
          rows={8}
-          placeholder={t("RejectDialog.description")}
+          placeholder={t("ConfirmDialog.description")}
          value={description}
          onChange={handleDescriptionChange}
          fullWidth
@@ -65,7 +65,7 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
        />
        <TextField
          name="proposed_amount"
-          label={t("MachinaryOffice.proposed_amount")}
+          label={t("ConfirmDialog.proposed_amount")}
          type="number"
          inputProps={{
            min: 0,
--- a/src/components/dashboard/passenger-boss/Form/ConfirmForm.jsx
+++ b/src/components/dashboard/passenger-boss/Form/ConfirmForm.jsx
@@ -0,0 +1,103 @@
+import { CONFIRM_PASSENGER_BOSS } from "@/core/data/apiRoutes";
+import {
+  Dialog,
+  DialogTitle,
+  DialogContent,
+  DialogContentText,
+  DialogActions,
+  Button,
+  TextField,
+} from "@mui/material";
+import { useTranslations } from "next-intl";
+import { useState } from "react";
+import { useFormik } from "formik";
+import * as Yup from "yup";
+
+const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
+  const t = useTranslations();
+  const [proposedAmount, setProposedAmount] = useState("");
+  const [description, setDescription] = useState("");
+
+  //formik
+  const validationSchema = Yup.object().shape({
+    proposed_amount: Yup.string().required(
+      t("ConfirmDialog.approved_amount_error")
+    ),
+  });
+  const formik = useFormik({
+    initialValues: {
+      proposed_amount: "",
+      description: "",
+    },
+    validationSchema,
+    onSubmit: () => {
+      const formData = new FormData();
+      formData.append("approved_amount", proposedAmount);
+      if (description != "") formData.append("expert_description", description);
+      handleClose();
+      confirmData(CONFIRM_PASSENGER_BOSS, rowId, formData);
+    },
+  });
+
+  const handleDescriptionChange = (event) => {
+    setDescription(event.target.value);
+  };
+  const handleAmountChange = (event) => {
+    if (/^\d*$/.test(event.target.value)) {
+      setProposedAmount(event.target.value);
+    }
+    formik.handleChange(event);
+  };
+
+  return (
+    <Dialog open={open} onClose={handleClose}>
+      <DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
+      <DialogContent>
+        <DialogContentText>{t("ConfirmDialog.context")}</DialogContentText>
+        <TextField
+          name="description"
+          multiline
+          rows={8}
+          placeholder={t("ConfirmDialog.description")}
+          value={description}
+          onChange={handleDescriptionChange}
+          fullWidth
+          variant="outlined"
+          sx={{ mt: 1 }}
+        />
+        <TextField
+          name="proposed_amount"
+          label={t("ConfirmDialog.approved_amount")}
+          type="number"
+          inputProps={{
+            min: 0,
+            inputMode: "numeric",
+            pattern: "[0-9]*",
+          }}
+          variant="outlined"
+          value={proposedAmount}
+          onChange={handleAmountChange}
+          onBlur={formik.handleBlur("proposed_amount")}
+          error={
+            formik.touched.proposed_amount &&
+            Boolean(formik.errors.proposed_amount)
+          }
+          helperText={
+            formik.touched.proposed_amount && formik.errors.proposed_amount
+          }
+          sx={{ mt: 1 }}
+          fullWidth
+        />
+      </DialogContent>
+      <DialogActions>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("ConfirmDialog.button-confirm")}
+        </Button>
+        <Button onClick={handleClose} color="secondary" autoFocus>
+          {t("ConfirmDialog.button-cancel")}
+        </Button>
+      </DialogActions>
+    </Dialog>
+  );
+};
+export default ConfirmForm;
--- a/src/components/dashboard/passenger-boss/Form/RejectForm.jsx
+++ b/src/components/dashboard/passenger-boss/Form/RejectForm.jsx
@@ -0,0 +1,76 @@
+import { REJECT_PASSENGER_BOSS } from "@/core/data/apiRoutes";
+import {
+  Dialog,
+  DialogTitle,
+  DialogContent,
+  DialogContentText,
+  DialogActions,
+  Button,
+  TextField,
+} from "@mui/material";
+import { useTranslations } from "next-intl";
+import { useFormik } from "formik";
+import * as Yup from "yup";
+import { useState } from "react";
+
+const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
+  const t = useTranslations();
+  const [description, setDescription] = useState("");
+
+  const validationSchema = Yup.object().shape({
+    description: Yup.string().required(t("RejectDialog.description_error")),
+  });
+
+  const formik = useFormik({
+    initialValues: {
+      description: "",
+    },
+    validationSchema,
+    onSubmit: () => {
+      const formData = new FormData();
+      formData.append("expert_description", description);
+      handleClose();
+      rejectData(REJECT_PASSENGER_BOSS, rowId, formData);
+    },
+  });
+
+  const handleDescriptionChange = (event) => {
+    setDescription(event.target.value);
+    formik.handleChange(event);
+  };
+
+  return (
+    <Dialog open={open} onClose={handleClose}>
+      <DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
+      <DialogContent>
+        <DialogContentText>{t("RejectDialog.context")}</DialogContentText>
+        <TextField
+          name="description"
+          multiline
+          rows={8}
+          placeholder={t("RejectDialog.description")}
+          value={description}
+          onChange={handleDescriptionChange}
+          onBlur={formik.handleBlur("description")}
+          error={
+            formik.touched.description && Boolean(formik.errors.description)
+          }
+          helperText={formik.touched.description && formik.errors.description}
+          fullWidth
+          variant="outlined"
+          sx={{ mt: 1 }}
+        />
+      </DialogContent>
+      <DialogActions>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("RejectDialog.button-reject")}
+        </Button>
+        <Button onClick={handleClose} color="secondary" autoFocus>
+          {t("RejectDialog.button-cancel")}
+        </Button>
+      </DialogActions>
+    </Dialog>
+  );
+};
+
+export default RejectForm;
--- a/src/components/dashboard/passenger-boss/TableRowActions.jsx
+++ b/src/components/dashboard/passenger-boss/TableRowActions.jsx
@@ -1,48 +1,52 @@
-import DeleteIcon from "@mui/icons-material/Delete";
-import EditIcon from "@mui/icons-material/Edit";
+import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
+import ThumbDownIcon from "@mui/icons-material/ThumbDown";
 import { Box, IconButton } from "@mui/material";
-// import EditForm from "./Form/EditForm";
 import { useContext } from "react";
 import { DataTableContext } from "@/lib/app/contexts/DataTableContext";
-// import DeleteForm from "./Form/DeleteForm";
+import ConfirmForm from "./Form/ConfirmForm";
+import RejectForm from "./Form/RejectForm";

 const TableRowActions = ({ row }) => {
  const {
-    toggleDrawer,
-    setDrawerContent,
-    openDeleteDialog,
-    handleOpenDeleteDialog,
-    handleCloseDeleteDialog,
-    handleDeleteDialog,
+    openConfirmDialog,
+    openRejectDialog,
+    handleOpenConfirmDialog,
+    handleOpenRejectDialog,
+    handleCloseConfirmDialog,
+    handleCloseRejectDialog,
    rowId,
-    deleteData,
+    confirmData,
+    rejectData,
  } = useContext(DataTableContext);
  return (
    <Box sx={{ display: "flex", flexWrap: "nowrap", gap: "8px" }}>
      <IconButton
-        aria-label="edit"
        color="primary"
        onClick={() => {
-          toggleDrawer(true);
-          //   setDrawerContent(<EditForm />);
+          handleOpenConfirmDialog(row);
        }}
      >
-        <EditIcon />
+        <ThumbUpAltIcon />
      </IconButton>
-      <IconButton
-        aria-label="delete"
-        color="primary"
-        onClick={() => handleOpenDeleteDialog(row)}
-      >
-        <DeleteIcon />
+      {openConfirmDialog && (
+        <ConfirmForm
+          rowId={rowId}
+          open={openConfirmDialog}
+          handleClose={handleCloseConfirmDialog}
+          confirmData={confirmData}
+        />
+      )}
+      <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
+        <ThumbDownIcon />
      </IconButton>
-      {/* <DeleteForm
-        rowId={rowId}
-        open={openDeleteDialog}
-        handleClose={handleCloseDeleteDialog}
-        handleDelete={handleDeleteDialog}
-        deleteData={deleteData}
-      /> */}
+      {openRejectDialog && (
+        <RejectForm
+          rowId={rowId}
+          open={openRejectDialog}
+          handleClose={handleCloseRejectDialog}
+          rejectData={rejectData}
+        />
+      )}
    </Box>
  );
 };
--- a/src/components/dashboard/passenger-boss/TableTollbar.jsx
+++ b/src/components/dashboard/passenger-boss/TableTollbar.jsx
@@ -1,30 +1,11 @@
-import { DataTableContext } from "@/lib/app/contexts/DataTableContext";
-import DataSaverOnIcon from "@mui/icons-material/DataSaverOn";
-import { Button, Stack, Tooltip } from "@mui/material";
+import { Stack, Tooltip } from "@mui/material";
 import { useTranslations } from "next-intl";
-import { useContext } from "react";
-// import AddForm from "./Form/AddForm";

 function TableToolbar() {
  const t = useTranslations();
-  const { toggleDrawer, setDrawerContent } = useContext(DataTableContext);
  return (
    <Stack direction={"row"} spacing={2}>
-      <Tooltip title={t("add")} arrow placement="right">
-        <Button
-          color="primary"
-          variant="contained"
-          size="small"
-          sx={{ textTransform: "unset", alignSelf: "center" }}
-          startIcon={<DataSaverOnIcon />}
-          onClick={() => {
-            toggleDrawer(true);
-            // setDrawerContent(<AddForm />);
-          }}
-        >
-          {t("add")}
-        </Button>
-      </Tooltip>
+      <Tooltip title={t("add")} arrow placement="right"></Tooltip>
    </Stack>
  );
 }
--- a/src/components/dashboard/passenger-boss/index.jsx
+++ b/src/components/dashboard/passenger-boss/index.jsx
@@ -1,14 +1,20 @@
 import DataTableStructure from "@/core/components/DatatableStructure";
 import DashboardLayouts from "@/layouts/dashboardLayouts";
-import { ContentCopy } from "@mui/icons-material";
 import { Box, Typography } from "@mui/material";
-import { DateTimePicker, LocalizationProvider } from "@mui/x-date-pickers";
-import { useTranslations } from "next-intl";
 import { useMemo } from "react";
-import TableToolbar from "./TableTollbar";
+// import TableToolbar from "./TableTollbar";
+import { GET_PASSENGER_BOSS } from "@/core/data/apiRoutes";
+import { useTranslations } from "next-intl";
 import TableRowActions from "./TableRowActions";
+import { format } from "date-fns-jalali";
+import {
+  LocalizationProvider,
+  MobileDateTimePicker,
+} from "@mui/x-date-pickers";
+import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
+import moment from "moment";

-const DashboardPassengerBossComponent = () => {
+function DashboardPassengerOfficeComponent() {
  const t = useTranslations();

  const columns = useMemo(
@@ -16,7 +22,7 @@ const DashboardPassengerBossComponent = () => {
      {
        accessorFn: (row) => row.id,
        id: "id",
-        header: "Id",
+        header: t("PassengerBoss.id"),
        enableColumnFilter: true,
        datatype: "numeric",
        filterFn: "equals",
@@ -33,9 +39,9 @@ const DashboardPassengerBossComponent = () => {
        ),
      },
      {
-        accessorFn: (row) => row.username,
-        id: "username",
-        header: "Username",
+        accessorFn: (row) => row.name,
+        id: "name",
+        header: t("PassengerBoss.name"),
        enableColumnFilter: true,
        datatype: "text",
        filterFn: "contains",
@@ -45,18 +51,20 @@ const DashboardPassengerBossComponent = () => {
        ),
      },
      {
-        accessorFn: (row) => row.name,
-        id: "name",
-        header: "Name",
+        accessorFn: (row) => row.national_id,
+        id: "national_id",
+        header: t("PassengerBoss.national_id"),
        enableColumnFilter: true,
-        datatype: "text",
-        filterFn: "contains",
-        columnFilterModeOptions: ["contains", "equals", "notEquals"],
-        muiTableBodyCellCopyButtonProps: {
-          fullWidth: true,
-          endIcon: <ContentCopy />,
-          sx: { justifyContent: "space-between" },
-        },
+        datatype: "numeric",
+        filterFn: "equals",
+        columnFilterModeOptions: [
+          "equals",
+          "notEquals",
+          "contains",
+          "lessThan",
+          "greaterThan",
+          "between",
+        ],
        Cell: ({ renderedCellValue }) => (
          <Typography variant="body2">{renderedCellValue}</Typography>
        ),
@@ -64,90 +72,48 @@ const DashboardPassengerBossComponent = () => {
      {
        accessorFn: (row) => row.phone_number,
        id: "phone_number",
-        header: "Phone Number",
-        enableColumnFilter: true,
-        datatype: "text",
-        filterFn: "contains",
-        columnFilterModeOptions: ["equals", "notEquals", "contains"],
-        muiTableBodyCellCopyButtonProps: {
-          fullWidth: true,
-          endIcon: <ContentCopy />,
-          sx: { justifyContent: "space-between" },
-        },
-        Cell: ({ renderedCellValue }) => (
-          <Typography variant="body2">{renderedCellValue}</Typography>
-        ),
-      },
-      {
-        accessorFn: (row) => row.status,
-        id: "status",
-        header: "Status",
+        header: t("PassengerBoss.phone_number"),
        enableColumnFilter: true,
        datatype: "numeric",
        filterFn: "equals",
-        filterSelectOptions: [
-          { text: "Active", value: "0" },
-          { text: "Deactive", value: "1" },
+        columnFilterModeOptions: [
+          "equals",
+          "notEquals",
+          "contains",
+          "lessThan",
+          "greaterThan",
+          "between",
        ],
-        filterVariant: "select",
        Cell: ({ renderedCellValue }) => (
          <Typography variant="body2">{renderedCellValue}</Typography>
        ),
      },
      {
-        accessorFn: (row) => row.gender,
-        id: "gender",
-        header: "Gender",
-        enableColumnFilter: true,
-        datatype: "text",
-        filterFn: "equals",
-        filterSelectOptions: [
-          { text: "Male", value: "male" },
-          { text: "Female", value: "female" },
-        ],
-        filterVariant: "select",
-        Cell: ({ renderedCellValue }) => (
-          <Typography variant="body2">{renderedCellValue}</Typography>
-        ),
-      },
-      {
-        accessorFn: (row) => row.national_id_code,
-        id: "national_id_code",
-        header: "National Id Code",
-        enableColumnFilter: true,
-        datatype: "text",
-        filterFn: "contains",
-        columnFilterModeOptions: ["equals", "notEquals", "contains"],
-        muiTableBodyCellCopyButtonProps: {
-          fullWidth: true,
-          endIcon: <ContentCopy />,
-          sx: { justifyContent: "space-between" },
-        },
-        Cell: ({ renderedCellValue }) => (
-          <Typography variant="body2">{renderedCellValue}</Typography>
-        ),
-      },
-      {
-        accessorFn: (row) => new Date(row.updated_at),
-        id: "updated_at",
-        header: "Update Date",
+        accessorFn: (row) =>
+          format(new Date(row.created_at), "HH:mm | yyyy/mm/dd"),
+        id: "created_at",
+        header: t("PassengerBoss.created_at"),
        enableColumnFilter: true,
        datatype: "date",
        filterFn: "lessThan",
        columnFilterModeOptions: ["lessThan", "greaterThan"],
        Cell: ({ renderedCellValue }) => {
-          const date = new Date(renderedCellValue);
-          const formattedDate = format(date, "MM/dd/yyyy HH:mm");
-          return <Typography variant="body2">{formattedDate}</Typography>;
+          return (
+            <Typography variant="body2" style={{ minWidth: "200px" }}>
+              {renderedCellValue}
+            </Typography>
+          );
        },
        Header: ({ column }) => <em>{column.columnDef.header}</em>,
        Filter: ({ column }) => {
          return (
-            <LocalizationProvider dateAdapter={AdapterDayjs}>
-              <DateTimePicker
+            <LocalizationProvider dateAdapter={AdapterDateFnsJalali}>
+              <MobileDateTimePicker
                onChange={(newValue) => {
                  const date = new Date(newValue);
-                  const formattedDate = format(date, "yyyy-MM-dd HH:mm");
+                  const formattedDate = moment(date)
+                    .locale("en")
+                    .format("YYYY-MM-DD HH:mm");
                  column.setFilterValue(formattedDate);
                }}
                slotProps={{
@@ -157,25 +123,82 @@ const DashboardPassengerBossComponent = () => {
                    variant: "standard",
                  },
                }}
-                value={column.getFilterValue()}
+                value={moment(column.getFilterValue())
+                  .locale("fa")
+                  .format("yyyy/mm/dd HH:mm")}
              />
            </LocalizationProvider>
          );
        },
      },
+      {
+        accessorFn: (row) =>
+          format(new Date(row.updated_at), "HH:mm | yyyy/mm/dd"),
+        id: "updated_at",
+        header: t("PassengerBoss.updated_at"),
+        enableColumnFilter: false,
+        datatype: "numeric",
+        Cell: ({ renderedCellValue }) => (
+          <Typography variant="body2">{renderedCellValue}</Typography>
+        ),
+      },
+      {
+        accessorFn: (row) => row.navgan_id,
+        id: "navgan_id",
+        header: t("PassengerBoss.navgan_id"),
+        enableColumnFilter: true,
+        datatype: "numeric",
+        filterFn: "equals",
+        columnFilterModeOptions: [
+          "equals",
+          "notEquals",
+          "contains",
+          "lessThan",
+          "greaterThan",
+          "between",
+        ],
+        Cell: ({ renderedCellValue }) => (
+          <Typography variant="body2">{renderedCellValue}</Typography>
+        ),
+      },
+      {
+        accessorFn: (row) => row.vehicle_type,
+        id: "vehicle_type",
+        header: t("PassengerBoss.vehicle_type"),
+        enableColumnFilter: true,
+        datatype: "text",
+        filterFn: "contains",
+        columnFilterModeOptions: ["contains", "equals", "notEquals"],
+        Cell: ({ renderedCellValue }) => (
+          <Typography variant="body2">{renderedCellValue}</Typography>
+        ),
+      },
+      {
+        accessorFn: (row) => row.state_name,
+        id: "state_id",
+        header: t("PassengerBoss.state_name"),
+        enableColumnFilter: false,
+        datatype: "numeric",
+        // filterFn: "equals",
+        // filterSelectOptions: [
+        // ],
+        // filterVariant: "select",
+        Cell: ({ renderedCellValue }) => (
+          <Typography variant="body2">{renderedCellValue}</Typography>
+        ),
+      },
    ],
    []
  );
-
  return (
    <DashboardLayouts>
      <Box sx={{ px: 3 }}>
        <DataTableStructure
-          //   tableUrl={SHOW_EXPERTS}
-          //   columns={columns}
+          tableUrl={GET_PASSENGER_BOSS}
+          columns={columns}
          selectableRow={false}
          enableCustomToolbar={true}
-          CustomToolbar={<TableToolbar />}
+          // CustomToolbar={<TableToolbar />}
          enableLastUpdate={true}
          enablePinning={true}
          enableDensityToggle={true}
@@ -190,6 +213,6 @@ const DashboardPassengerBossComponent = () => {
      </Box>
    </DashboardLayouts>
  );
-};
+}

-export default DashboardPassengerBossComponent;
+export default DashboardPassengerOfficeComponent;
--- a/src/core/data/apiRoutes.js
+++ b/src/core/data/apiRoutes.js
@@ -23,6 +23,17 @@ export const REJECT_PASSENGER_OFFICE =
  BASE_URL + "/dashboard/passenger_office_chief/reject";
 //passenger office

+//passenger boss
+export const GET_PASSENGER_BOSS =
+  BASE_URL + "/dashboard/province_working_group/show";
+
+export const CONFIRM_PASSENGER_BOSS =
+  BASE_URL + "/dashboard/province_working_group/confirm";
+
+export const REJECT_PASSENGER_BOSS =
+  BASE_URL + "/dashboard/province_working_group/reject";
+//passenger boss
+
 //transportation assistance
 export const GET_TRANSPORTATION_ASSISTANCE =
  BASE_URL + "/dashboard/transportation_assistant/show";
@@ -33,6 +44,7 @@ export const CONFIRM_TRANSPORTATION_ASSISTANCE =
 export const REJECT_TRANSPORTATION_ASSISTANCE =
  BASE_URL + "/dashboard/transportation_assistant/reject";
 //transportation assistance
+
 //machinary office
 export const GET_MACHINARY_OFFICE =
  BASE_URL + "/dashboard/machinery_expert/show";