Adding Filter Get api and delete modal open.

src/components/PaymentRequest/PaymentRequestFilterPanel.jsx

@@ -0,0 +1,203 @@
+import React, { useEffect, useState, useMemo } from "react";
+import { FormProvider, useForm, Controller } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { defaultPaymentRequestFilter,SearchPaymentRequestSchema } from "./PaymentRequestSchema";
+
+import DateRangePicker, { DateRangePicker1 } from "../common/DateRangePicker";
+import SelectMultiple from "../common/SelectMultiple";
+import { useProjectName } from "../../hooks/useProjects";
+import { useExpenseStatus } from "../../hooks/masterHook/useMaster";
+import { useEmployeesAllOrByProjectId } from "../../hooks/useEmployees";
+import { useSelector } from "react-redux";
+import moment from "moment";
+import { usePaymentRequestFilter } from "../../hooks/useExpense";
+import { useLocation, useNavigate, useParams } from "react-router-dom";
+
+const PaymentRequestFilterPanel = ({ onApply, handleGroupBy }) => {
+    const { status } = useParams();
+    const navigate = useNavigate();
+    const selectedProjectId = useSelector(
+        (store) => store.localVariables.projectId
+    );
+    const { data, isLoading, isError, error, isFetching, isFetched } =
+        usePaymentRequestFilter();
+
+    const groupByList = useMemo(() => {
+        return [
+            { id: "projects", name: "Project" },
+            { id: "status", name: "Status" },
+            { id: "createdBy", name: "Submitted By" },
+            { id: "currency", name: "Currency" },
+            { id: "expensesCategory", name: "Expense Category" },
+            { id: "payees", name: "Payee" },
+            { id: "date", name: "Due Date" },
+
+        ].sort((a, b) => a.name.localeCompare(b.name));
+    }, []);
+
+    const [selectedGroup, setSelectedGroup] = useState(groupByList[6]);
+    const [resetKey, setResetKey] = useState(0);
+
+console.log("Kartik",data)
+
+    const methods = useForm({
+        resolver: zodResolver(SearchPaymentRequestSchema),
+        defaultValues: defaultPaymentRequestFilter,
+    });
+
+    const { control, handleSubmit, reset, setValue, watch } = methods;
+    const isTransactionDate = watch("isTransactionDate");
+
+    const closePanel = () => {
+        document.querySelector(".offcanvas.show .btn-close")?.click();
+    };
+
+
+
+    const handleGroupChange = (e) => {
+        const group = groupByList.find((g) => g.id === e.target.value);
+        if (group) setSelectedGroup(group);
+    };
+
+
+    const onSubmit = (formData) => {
+        onApply({
+            ...formData,
+            startDate: moment.utc(formData.startDate, "DD-MM-YYYY").toISOString(),
+            endDate: moment.utc(formData.endDate, "DD-MM-YYYY").toISOString(),
+        });
+        handleGroupBy(selectedGroup.id);
+        // closePanel();
+    };
+
+    const onClear = () => {
+        reset(defaultPaymentRequestFilter);
+        setResetKey((prev) => prev + 1);
+        onApply(defaultPaymentRequestFilter);
+        if (status) {
+            navigate("/expenses", { replace: true });
+        }
+    };
+
+    const location = useLocation();
+    useEffect(() => {
+        closePanel();
+    }, [location]);
+
+    const [appliedStatusId, setAppliedStatusId] = useState(null);
+
+    if (isError && isFetched)
+        return <div>Something went wrong Here- {error.message} </div>;
+
+    return (
+        <>
+            <FormProvider {...methods}>
+                <form onSubmit={handleSubmit(onSubmit)} className="p-2 text-start">
+                    <div className="mb-3 w-100">
+                        <div className="d-flex align-items-center mb-2">
+                            <label className="form-label me-2">Filter By:</label>
+                        </div>
+                        <label className="fw-semibold">Choose Date Range:</label>
+                        <DateRangePicker1
+                            placeholder="DD-MM-YYYY To DD-MM-YYYY"
+                            startField="startDate"
+                            endField="endDate"
+                            resetSignal={resetKey}
+                            defaultRange={false}
+                            maxDate={new Date()}
+                        />
+                    </div>
+
+                    <div className="row g-2">
+                        <SelectMultiple
+                            name="projectIds"
+                            label="Projects :"
+                            options={data?.projects}
+                            labelKey="name"
+                            valueKey="id"
+                        />
+                        <SelectMultiple
+                            name="createdByIds"
+                            label="Submitted By :"
+                            options={data?.createdBy}
+                            labelKey={(item) => item.name}
+                            valueKey="id"
+                        />
+                        <SelectMultiple
+                            name="payees"
+                            label="Payee :"
+                            options={data?.payees}
+                            labelKey={(item) => item.name}
+                            valueKey="id"
+                        />
+                        <SelectMultiple
+                            name="expensesCategory"
+                            label="Category :"
+                            options={data?.expensesCategory}
+                            labelKey={(item) => item.name}
+                            valueKey="id"
+                        />
+                        <SelectMultiple
+                            name="currencyIds"
+                            label="Currency :"
+                            options={data?.currency}
+                            labelKey={(item) => item.name}
+                            valueKey="id"
+                        />
+
+                        <div className="mb-3">
+                            <label className="form-label">Status :</label>
+                            <div className="row flex-wrap">
+                                {data?.status
+                                    ?.slice()
+                                    .sort((a, b) => a.name.localeCompare(b.name))
+                                    .map((status) => (
+                                        <div className="col-6" key={status.id}>
+                                            <Controller
+                                                control={control}
+                                                name="statusIds"
+                                                render={({ field: { value = [], onChange } }) => (
+                                                    <div className="d-flex align-items-center me-3 mb-2">
+                                                        <input
+                                                            type="checkbox"
+                                                            className="form-check-input"
+                                                            value={status.id}
+                                                            checked={value.includes(status.id)}
+                                                            onChange={(e) => {
+                                                                const checked = e.target.checked;
+                                                                onChange(
+                                                                    checked
+                                                                        ? [...value, status.id]
+                                                                        : value.filter((v) => v !== status.id)
+                                                                );
+                                                            }}
+                                                        />
+                                                        <label className="ms-2 mb-0">{status.name}</label>
+                                                    </div>
+                                                )}
+                                            />
+                                        </div>
+                                    ))}
+                            </div>
+                        </div>
+                    </div>                   
+
+                    <div className="d-flex justify-content-end py-3 gap-2">
+                        <button
+                            type="button"
+                            className="btn btn-label-secondary btn-sm"
+                            onClick={onClear}
+                        >
+                            Clear
+                        </button>
+                        <button type="submit" className="btn btn-primary btn-sm">
+                            Apply
+                        </button>
+                    </div>
+                </form>
+            </FormProvider>
+        </>
+    );
+};
+
+export default PaymentRequestFilterPanel;

src/components/PaymentRequest/PaymentRequestList.jsx

@@ -10,9 +10,14 @@ import { formatDate, formatUTCToLocalTime } from "../../utils/dateUtils";
 import Avatar from "../../components/common/Avatar";
 import { usePaymentRequestContext } from "../../pages/PaymentRequest/PaymentRequestPage";
 import { ExpenseTableSkeleton } from "../Expenses/ExpenseSkeleton";
+import ConfirmModal from "../common/ConfirmModal";
+import { useNavigate } from "react-router-dom";
 
-const PaymentRequestList = ({ groupBy = "submittedBy", search }) => {
+const PaymentRequestList = ({filters, groupBy = "submittedBy", search }) => {
   const { setManageRequest } = usePaymentRequestContext();
+  const navigate = useNavigate();
+  const [IsDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
+  const [deletingId, setDeletingId] = useState(null);
   const groupByField = (items, field) => {
     return items.reduce((acc, item) => {
       let key;
@@ -28,9 +33,8 @@ const PaymentRequestList = ({ groupBy = "submittedBy", search }) => {
           displayField = "Status";
           break;
         case "submittedBy":
-          key = `${item?.createdBy?.firstName ?? ""} ${
+          key = `${item?.createdBy?.firstName ?? ""} ${item.createdBy?.lastName ?? ""
-            item.createdBy?.lastName ?? ""
+            }`.trim();
-          }`.trim();
           displayField = "Submitted By";
           break;
         case "project":
@@ -83,9 +87,8 @@ const PaymentRequestList = ({ groupBy = "submittedBy", search }) => {
       label: "Submitted By",
       align: "text-start",
       getValue: (e) =>
-        `${e.createdBy?.firstName ?? ""} ${
+        `${e.createdBy?.firstName ?? ""} ${e.createdBy?.lastName ?? ""
-          e.createdBy?.lastName ?? ""
+          }`.trim() || "N/A",
-        }`.trim() || "N/A",
       customRender: (e) => (
         <div
           className="d-flex align-items-center cursor-pointer"
@@ -98,9 +101,8 @@ const PaymentRequestList = ({ groupBy = "submittedBy", search }) => {
             lastName={e.createdBy?.lastName}
           />
           <span className="text-truncate">
-            {`${e.createdBy?.firstName ?? ""} ${
+            {`${e.createdBy?.firstName ?? ""} ${e.createdBy?.lastName ?? ""
-              e.createdBy?.lastName ?? ""
+              }`.trim() || "N/A"}
-            }`.trim() || "N/A"}
           </span>
         </div>
       ),
@@ -126,9 +128,8 @@ const PaymentRequestList = ({ groupBy = "submittedBy", search }) => {
       align: "text-center",
       getValue: (e) => (
         <span
-          className={`badge bg-label-${
+          className={`badge bg-label-${getColorNameFromHex(e?.expenseStatus?.color) || "secondary"
-            getColorNameFromHex(e?.expenseStatus?.color) || "secondary"
+            }`}
-          }`}
         >
           {e?.expenseStatus?.name || "Unknown"}
         </span>
@@ -142,7 +143,7 @@ const PaymentRequestList = ({ groupBy = "submittedBy", search }) => {
   const { data, isLoading, isError, error, isFetching } = usePaymentRequestList(
     ITEMS_PER_PAGE,
     currentPage,
-    {},
+    filters,
     true,
     debouncedSearch
   );
@@ -190,153 +191,179 @@ const PaymentRequestList = ({ groupBy = "submittedBy", search }) => {
     );
   };
 
+  const handleDelete = (id) => {
+    setDeletingId(id);
+    DeleteExpense(
+      { id },
+      {
+        onSettled: () => {
+          setDeletingId(null);
+          setIsDeleteModalOpen(false);
+        },
+      }
+    );
+  };
+
   return (
-    <div className="card page-min-h table-responsive px-sm-4">
+    <>
-      <div className="card-datatable" id="payment-request-table">
+      {IsDeleteModalOpen && (
-        <table className="table border-top dataTable text-nowrap align-middle">
+        <ConfirmModal
-          <thead>
+          isOpen={IsDeleteModalOpen}
-            <tr>
+          type="delete"
-              {paymentRequestColumns.map((col) => (
+          header="Delete Expense"
-                <th key={col.key} className={`sorting ${col.align}`}>
+          message="Are you sure you want delete?"
-                  {col.label}
+          onSubmit={handleDelete}
-                </th>
+          onClose={() => setIsDeleteModalOpen(false)}
-              ))}
+          // loading={isPending}
-              <th className="text-center">Action</th>
+          paramData={deletingId}
-            </tr>
+        />
-          </thead>
+      )}
+      <div className="card page-min-h table-responsive px-sm-4">
+        <div className="card-datatable" id="payment-request-table">
+          <table className="table border-top dataTable text-nowrap align-middle">
+            <thead>
+              <tr>
+                {paymentRequestColumns.map((col) => (
+                  <th key={col.key} className={`sorting ${col.align}`}>
+                    {col.label}
+                  </th>
+                ))}
+                <th className="text-center">Action</th>
+              </tr>
+            </thead>
 
-          <tbody>
+            <tbody>
-            {Object.keys(grouped).length > 0 ? (
+              {Object.keys(grouped).length > 0 ? (
-              Object.values(grouped).map(({ key, displayField, items }) => (
+                Object.values(grouped).map(({ key, displayField, items }) => (
-                <React.Fragment key={key}>
+                  <React.Fragment key={key}>
-                  <tr className="tr-group text-dark">
+                    <tr className="tr-group text-dark">
-                    <td colSpan={8} className="text-start">
+                      <td colSpan={8} className="text-start">
-                      <div className="d-flex align-items-center">
+                        <div className="d-flex align-items-center">
-                        {" "}
+                          {" "}
-                        <small className="fs-6 py-1">
+                          <small className="fs-6 py-1">
-                          {displayField} :{" "}
+                            {displayField} :{" "}
-                        </small>{" "}
+                          </small>{" "}
-                        <small className="fs-6  ms-3">
+                          <small className="fs-6  ms-3">
-                          {IsGroupedByDate ? formatUTCToLocalTime(key) : key}
+                            {IsGroupedByDate ? formatUTCToLocalTime(key) : key}
-                        </small>
+                          </small>
-                      </div>
-                    </td>
-                  </tr>
-                  {items?.map((paymentRequest) => (
-                    <tr key={paymentRequest.id}>
-                      {paymentRequestColumns.map(
-                        (col) =>
-                          (col.isAlwaysVisible || groupBy !== col.key) && (
-                            <td
-                              key={col.key}
-                              className={`d-table-cell ${col.align ?? ""}`}
-                            >
-                              {col?.customRender
-                                ? col?.customRender(paymentRequest)
-                                : col?.getValue(paymentRequest)}
-                            </td>
-                          )
-                      )}
-                      <td className="sticky-action-column bg-white">
-                        <div className="d-flex justify-content-center gap-2">
-                          <i
-                            className="bx bx-show text-primary cursor-pointer"
-                            onClick={() =>
-                              setViewExpense({
-                                expenseId: paymentRequest.id,
-                                view: true,
-                              })
-                            }
-                          ></i>
-
-                          <div className="dropdown z-2">
-                            <button
-                              type="button"
-                              className="btn btn-xs btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0 m-0"
-                              data-bs-toggle="dropdown"
-                              aria-expanded="false"
-                            >
-                              <i
-                                className="bx bx-dots-vertical-rounded text-muted p-0"
-                                data-bs-toggle="tooltip"
-                                data-bs-offset="0,8"
-                                data-bs-placement="top"
-                                data-bs-custom-class="tooltip-dark"
-                                title="More Action"
-                              ></i>
-                            </button>
-                            <ul className="dropdown-menu dropdown-menu-end w-auto">
-                              <li
-                                onClick={() =>
-                                  setManageRequest({
-                                    IsOpen: true,
-                                    RequestId: paymentRequest.id,
-                                  })
-                                }
-                              >
-                                <a className="dropdown-item px-2 cursor-pointer py-1">
-                                  <i className="bx bx-edit text-primary  bx-xs me-2"></i>
-                                  <span className="align-left ">Modify</span>
-                                </a>
-                              </li>
-
-                              <li
-                                onClick={() => {
-                                  setIsDeleteModalOpen(true);
-                                  setDeletingId(paymentRequest.id);
-                                }}
-                              >
-                                <a className="dropdown-item  px-2 cursor-pointer py-1">
-                                  <i className="bx bx-trash text-danger  bx-xs me-2"></i>
-                                  <span className="align-left">Delete</span>
-                                </a>
-                              </li>
-                            </ul>
-                          </div>
                         </div>
                       </td>
                     </tr>
-                  ))}
+                    {items?.map((paymentRequest) => (
-                </React.Fragment>
+                      <tr key={paymentRequest.id}>
-              ))
+                        {paymentRequestColumns.map(
-            ) : (
+                          (col) =>
-              <tr>
+                            (col.isAlwaysVisible || groupBy !== col.key) && (
-                <td colSpan={8} className="text-center border-0 ">
+                              <td
-                  <div className="py-8">
+                                key={col.key}
-                    <p>No Request Found</p>
+                                className={`d-table-cell ${col.align ?? ""}`}
-                  </div>
+                              >
-                </td>
+                                {col?.customRender
-              </tr>
+                                  ? col?.customRender(paymentRequest)
-            )}
+                                  : col?.getValue(paymentRequest)}
-          </tbody>
+                              </td>
-        </table>
+                            )
-      </div>
+                        )}
+                        <td className="sticky-action-column bg-white">
+                          <div className="d-flex justify-content-center gap-2">
+                            <i
+                              className="bx bx-show text-primary cursor-pointer"
+                              onClick={() =>
+                                setViewExpense({
+                                  expenseId: paymentRequest.id,
+                                  view: true,
+                                })
+                              }
+                            ></i>
 
-      {/* Pagination */}
+                            <div className="dropdown z-2">
-      {totalPages > 1 && (
+                              <button
-        <div className="d-flex justify-content-end py-3 pe-3">
+                                type="button"
-          <nav>
+                                className="btn btn-xs btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0 m-0"
-            <ul className="pagination mb-0">
+                                data-bs-toggle="dropdown"
-              {[...Array(totalPages)].map((_, index) => (
+                                aria-expanded="false"
-                <li
+                              >
-                  key={index}
+                                <i
-                  className={`page-item ${
+                                  className="bx bx-dots-vertical-rounded text-muted p-0"
-                    currentPage === index + 1 ? "active" : ""
+                                  data-bs-toggle="tooltip"
-                  }`}
+                                  data-bs-offset="0,8"
-                >
+                                  data-bs-placement="top"
-                  <button
+                                  data-bs-custom-class="tooltip-dark"
-                    className="page-link"
+                                  title="More Action"
-                    onClick={() => setCurrentPage(index + 1)}
+                                ></i>
-                  >
+                              </button>
-                    {index + 1}
+                              <ul className="dropdown-menu dropdown-menu-end w-auto">
-                  </button>
+                                <li
-                </li>
+                                  onClick={() =>
-              ))}
+                                    setManageRequest({
-            </ul>
+                                      IsOpen: true,
-          </nav>
+                                      RequestId: paymentRequest.id,
+                                    })
+                                  }
+                                >
+                                  <a className="dropdown-item px-2 cursor-pointer py-1">
+                                    <i className="bx bx-edit text-primary  bx-xs me-2"></i>
+                                    <span className="align-left ">Modify</span>
+                                  </a>
+                                </li>
+
+                                <li
+                                  onClick={() => {
+                                    setIsDeleteModalOpen(true);
+                                    setDeletingId(paymentRequest.id);
+                                  }}
+                                >
+                                  <a className="dropdown-item  px-2 cursor-pointer py-1">
+                                    <i className="bx bx-trash text-danger  bx-xs me-2"></i>
+                                    <span className="align-left">Delete</span>
+                                  </a>
+                                </li>
+                              </ul>
+                            </div>
+                          </div>
+                        </td>
+                      </tr>
+                    ))}
+                  </React.Fragment>
+                ))
+              ) : (
+                <tr>
+                  <td colSpan={8} className="text-center border-0 ">
+                    <div className="py-8">
+                      <p>No Request Found</p>
+                    </div>
+                  </td>
+                </tr>
+              )}
+            </tbody>
+          </table>
         </div>
-      )}
+
-    </div>
+        {/* Pagination */}
+        {totalPages > 1 && (
+          <div className="d-flex justify-content-end py-3 pe-3">
+            <nav>
+              <ul className="pagination mb-0">
+                {[...Array(totalPages)].map((_, index) => (
+                  <li
+                    key={index}
+                    className={`page-item ${currentPage === index + 1 ? "active" : ""
+                      }`}
+                  >
+                    <button
+                      className="page-link"
+                      onClick={() => setCurrentPage(index + 1)}
+                    >
+                      {index + 1}
+                    </button>
+                  </li>
+                ))}
+              </ul>
+            </nav>
+          </div>
+        )}
+      </div>
+    </>
   );
 };
 

src/components/PaymentRequest/PaymentRequestSchema.js

@@ -64,3 +64,25 @@ export const defaultPaymentRequest = {
   billAttachments: [],
 };
 
+
+export const SearchPaymentRequestSchema = z.object({
+  projectIds: z.array(z.string()).optional(),
+  statusIds: z.array(z.string()).optional(),
+  createdByIds: z.array(z.string()).optional(),
+  currencyIds: z.array(z.string()).optional(),
+  expenseCategoryIds: z.array(z.string()).optional(),
+  payees: z.array(z.string()).optional(),
+  startDate: z.string().optional(),
+  endDate: z.string().optional(),
+});
+
+export const defaultPaymentRequestFilter = {
+  projectIds: [],
+  statusIds: [],
+  createdByIds: [],
+  currencyIds: [],
+  expenseCategoryIds: [],
+  payees: [],
+  startDate: null,
+  endDate: null,
+};

src/hooks/useExpense.js

@@ -334,6 +334,14 @@ export const useUpdatePaymentRequest = (onSuccessCallBack) => {
 };
 //#endregion
 
+export const usePaymentRequestFilter = () => {
+  return useQuery({
+    queryKey: ["PaymentRequestFilter"],
+    queryFn: async () =>
+      await ExpenseRepository.GetPaymentRequestFilter().then((res) => res.data),
+  });
+};
+
 //#region Advance Payment
 export const useExpenseTransactions = (employeeId)=>{
  return useQuery({

src/pages/PaymentRequest/PaymentRequestPage.jsx

@@ -1,10 +1,12 @@
-import React, { createContext, useState,useEffect, useContext } from "react";
+import React, { createContext, useState, useEffect, useContext } from "react";
 import Breadcrumb from "../../components/common/Breadcrumb";
 import GlobalModel from "../../components/common/GlobalModel";
 import ManagePaymentRequest from "../../components/PaymentRequest/ManagePaymentRequest";
 import ExpenseFilterPanel from "../../components/Expenses/ExpenseFilterPanel";
 import { useFab } from "../../Context/FabContext";
 import PaymentRequestList from "../../components/PaymentRequest/PaymentRequestList";
+import PaymentRequestFilterPanel from "../../components/PaymentRequest/PaymentRequestFilterPanel";
+import { defaultPaymentRequestFilter,SearchPaymentRequestSchema } from "../../components/PaymentRequest/PaymentRequestSchema";
 
 export const PaymentRequestContext = createContext();
 export const usePaymentRequestContext = () => {
@@ -20,32 +22,27 @@ const PaymentRequestPage = () => {
     RequestId: null,
   });
   const { setOffcanvasContent, setShowTrigger } = useFab();
+  const [filters, setFilters] = useState(defaultPaymentRequestFilter);
 
   const [search, setSearch] = useState("");
 
   const contextValue = {
-    // setViewExpense,
     setManageRequest,
-    // setDocumentView,
-    // filterData,
-    // removeFilterChip
   };
 
   useEffect(() => {
 
     setShowTrigger(true);
     setOffcanvasContent(
-      "Expense Filters",
+      "Payment Request Filters",
-      <ExpenseFilterPanel
+      <PaymentRequestFilterPanel onApply={setFilters} />
-   
-      />
     );
 
     return () => {
       setShowTrigger(false);
       setOffcanvasContent("", null);
     };
-  },[]);
+  }, []);
 
   return (
     <PaymentRequestContext.Provider value={contextValue}>
@@ -94,8 +91,9 @@ const PaymentRequestPage = () => {
           </div>
         </div>
         <PaymentRequestList
-            search={search}
+          search={search}
-          />
+          filters={filters}
+        />
 
         {/* Add/Edit Modal */}
         {ManageRequest.IsOpen && (
@@ -115,7 +113,7 @@ const PaymentRequestPage = () => {
             />
           </GlobalModel>
         )}
-        
+
       </div>
     </PaymentRequestContext.Provider>
   );

src/repositories/ExpsenseRepository.jsx

@@ -16,20 +16,21 @@ const ExpenseRepository = {
 
   //#endregion
 
-//#region Payment Request
+  //#region Payment Request
   GetPaymentRequestList: (pageSize, pageNumber, filter, isActive, searchString) => {
     const payloadJsonString = JSON.stringify(filter);
     return api.get(`/api/Expense/get/payment-requests/list?isActive=${isActive}&pageSize=${pageSize}&pageNumber=${pageNumber}&filter=${payloadJsonString}&searchString=${searchString}`);
   },
   CreatePaymentRequest: (data) => api.post("/api/expense/payment-request/create", data),
   UpdatePaymentRequest: (id, data) => api.put(`/api/Expense/payment-request/edit/${id}`, data),
-    GetPaymentRequest:(id)=>api.get(`/api/Expense/get/payment-request/details/${id}`),
+  GetPaymentRequest: (id) => api.get(`/api/Expense/get/payment-request/details/${id}`),
+  GetPaymentRequestFilter: () => api.get('/api/Expense/payment-request/filter'),
 
   //#endregion
 
 
   //#region Advance Payment
-    GetTranctionList:()=>api.get(`/get/transactions/${employeeId}`)
+  GetTranctionList: () => api.get(`/get/transactions/${employeeId}`)
   //#endregion
 }