admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases Wiki Activity

removed console and added none option for groupping for Expense list

Browse Source
This commit is contained in:
pramod.mahajan 2025-12-09 14:26:18 +05:30
parent 0643d3d0e1
commit 4a47b1d0fa
7 changed files with 398 additions and 355 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/Dashboard/Dashboard.jsx
View File

@ -37,7 +37,6 @@ const Dashboard = () => {
const canSelfAttendance = useHasUserPermission(SELF_ATTENDANCE);
const { data,isLoading,isError } = useGetCollectionOverview();
console.log("data-->", data);
return (
<div className="container-fluid mt-5">
<div className="row gy-4">

39
src/components/Expenses/ExpenseFilterPanel.jsx
View File

@ -1,4 +1,10 @@
import React, { forwardRef, useEffect, useImperativeHandle, useState, useMemo } from "react";
import React, {
forwardRef,
useEffect,
useImperativeHandle,
useState,
useMemo,
} from "react";
import { FormProvider, useForm, Controller } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import { defaultFilter, SearchSchema } from "./ExpenseSchema";
@ -15,7 +21,8 @@ import { useExpenseFilter } from "../../hooks/useExpense";
import { ExpenseFilterSkeleton } from "./ExpenseSkeleton";
import { useLocation, useNavigate, useParams } from "react-router-dom";
const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }, ref) => {
const ExpenseFilterPanel = forwardRef(
({ onApply, handleGroupBy, setFilterdata }, ref) => {
const { status } = useParams();
const navigate = useNavigate();
const selectedProjectId = useSelector(
@ -26,6 +33,7 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }
const groupByList = useMemo(() => {
return [
{ id: "none", name: "None" },
{ id: "transactionDate", name: "Transaction Date" },
{ id: "status", name: "Status" },
{ id: "submittedBy", name: "Submitted By" },
@ -36,7 +44,7 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }
].sort((a, b) => a.name.localeCompare(b.name));
}, []);
const [selectedGroup, setSelectedGroup] = useState(groupByList[6]);
const [selectedGroup, setSelectedGroup] = useState(groupByList[0]);
const [resetKey, setResetKey] = useState(0);
const dynamicDefaultFilter = useMemo(() => {
@ -124,12 +132,18 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }
if (status !== appliedStatusId) {
const filterWithStatus = {
...dynamicDefaultFilter,
projectIds: selectedProjectId ? [selectedProjectId] : dynamicDefaultFilter.projectIds || [],
projectIds: selectedProjectId
? [selectedProjectId]
: dynamicDefaultFilter.projectIds || [],
startDate: dynamicDefaultFilter.startDate
? moment.utc(dynamicDefaultFilter.startDate, "DD-MM-YYYY").toISOString()
? moment
.utc(dynamicDefaultFilter.startDate, "DD-MM-YYYY")
.toISOString()
: undefined,
endDate: dynamicDefaultFilter.endDate
? moment.utc(dynamicDefaultFilter.endDate, "DD-MM-YYYY").toISOString()
? moment
.utc(dynamicDefaultFilter.endDate, "DD-MM-YYYY")
.toISOString()
: undefined,
};
@ -152,8 +166,6 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }
if (isError && isFetched)
return <div>Something went wrong Here- {error.message} </div>;
return (
<>
<FormProvider {...methods}>
@ -164,7 +176,8 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }
<div className="d-inline-flex border rounded-pill mb-1 overflow-hidden shadow-none">
<button
type="button"
className={`btn px-2 py-1 rounded-0 text-tiny ${isTransactionDate ? "active btn-primary text-white" : ""
className={`btn px-2 py-1 rounded-0 text-tiny ${
isTransactionDate ? "active btn-primary text-white" : ""
}`}
onClick={() => setValue("isTransactionDate", true)}
>
@ -172,7 +185,8 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }
</button>
<button
type="button"
className={`btn px-2 py-1 rounded-0 text-tiny ${!isTransactionDate ? "active btn-primary text-white" : ""
className={`btn px-2 py-1 rounded-0 text-tiny ${
!isTransactionDate ? "active btn-primary text-white" : ""
}`}
onClick={() => setValue("isTransactionDate", false)}
>
@ -264,7 +278,7 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }
<select
id="groupBySelect"
className="form-select form-select-sm"
value={selectedGroup?.id || ""}
value={selectedGroup?.id || "none"}
onChange={handleGroupChange}
>
{groupByList.map((group) => (
@ -291,6 +305,7 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata }
</FormProvider>
</>
);
});
}
);
export default ExpenseFilterPanel;

69
src/components/Expenses/ExpenseList.jsx
View File

@ -23,8 +23,15 @@ import { useSelector } from "react-redux";
import ExpenseFilterChips from "./ExpenseFilterChips";
import { defaultFilter } from "./ExpenseSchema";
import { useNavigate } from "react-router-dom";
import { displayName } from "react-quill";
const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRef, onDataFiltered }) => {
const ExpenseList = ({
filters,
groupBy,
searchText,
tableRef,
onDataFiltered,
}) => {
const [deletingId, setDeletingId] = useState(null);
const [IsDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
const {
@ -76,7 +83,17 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
}
};
const groupByField = (items, field) => {
const groupByField = (items, field) => {
if (!field || field === "none") {
return {
All: {
key: "All",
displayField: "All",
items: items || []
}
};
}
return items.reduce((acc, item) => {
let key;
let displayField;
@ -91,8 +108,7 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
displayField = "Status";
break;
case "submittedBy":
key = `${item?.createdBy?.firstName ?? ""} ${item.createdBy?.lastName ?? ""
}`.trim();
key = `${item?.createdBy?.firstName ?? ""} ${item?.createdBy?.lastName ?? ""}`.trim();
displayField = "Submitted By";
break;
case "project":
@ -116,7 +132,7 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
displayField = "Others";
}
const groupKey = `${field}_${key}`; // unique key for object property
const groupKey = `${field}_${key}`;
if (!acc[groupKey]) {
acc[groupKey] = { key, displayField, items: [] };
}
@ -124,7 +140,8 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
acc[groupKey].items.push(item);
return acc;
}, {});
};
};
const expenseColumns = [
{
@ -150,7 +167,8 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
label: "Submitted By",
align: "text-start",
getValue: (e) =>
`${e.createdBy?.firstName ?? ""} ${e.createdBy?.lastName ?? ""
`${e.createdBy?.firstName ?? ""} ${
e.createdBy?.lastName ?? ""
}`.trim() || "N/A",
customRender: (e) => (
<div
@ -164,7 +182,8 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
lastName={e.createdBy?.lastName}
/>
<span className="text-truncate">
{`${e.createdBy?.firstName ?? ""} ${e.createdBy?.lastName ?? ""
{`${e.createdBy?.firstName ?? ""} ${
e.createdBy?.lastName ?? ""
}`.trim() || "N/A"}
</span>
</div>
@ -197,7 +216,8 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
align: "text-center",
getValue: (e) => (
<span
className={`badge bg-label-${getColorNameFromHex(e?.status?.color) || "secondary"
className={`badge bg-label-${
getColorNameFromHex(e?.status?.color) || "secondary"
}`}
>
{e.status?.name || "Unknown"}
@ -218,12 +238,18 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
return <ExpenseTableSkeleton headers={headers} />;
if (isError) return <div>{error?.message}</div>;
const grouped = groupBy
? groupByField(data?.data ?? [], groupBy)
: { All: data?.data ?? [] };
const isNoGrouping = !groupBy || groupBy === "none";
const grouped = isNoGrouping
? { All: { key: "All", displayField: "All", items: data?.data ?? [] } }
: groupByField(data?.data ?? [], groupBy);
const IsGroupedByDate = [
{key:"none",displayField:"None"},
{ key: "transactionDate", displayField: "Transaction Date" },
{ key: "createdAt", displayField: "created Date" },
{ key: "createdAt", displayField: "created Date", },
]?.includes(groupBy);
const canEditExpense = (expense) => {
@ -264,7 +290,8 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
groupBy={groupBy}
/>
<div
className="card-datatable table-responsive" ref={tableRef}
className="card-datatable table-responsive"
ref={tableRef}
id="horizontal-example"
>
<div className="dataTables_wrapper no-footer px-2 ">
@ -292,6 +319,7 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
{Object.keys(grouped).length > 0 ? (
Object.values(grouped).map(({ key, displayField, items }) => (
<React.Fragment key={key}>
{!isNoGrouping && (
<tr className="tr-group text-dark">
<td colSpan={8} className="text-start">
<div className="d-flex align-items-center px-2">
@ -307,6 +335,7 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
</div>
</td>
</tr>
)}
{items?.map((expense) => (
<tr key={expense.id}>
{expenseColumns.map(
@ -314,19 +343,23 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText, tableRe
(col.isAlwaysVisible || groupBy !== col.key) && (
<td
key={col.key}
className={`d-table-cell ml-2 ${col.align ?? ""
className={`d-table-cell ml-2 ${
col.align ?? ""
} `}
>
<div
className={`d-flex px-2 ${col.key === "status"
className={`d-flex px-2 ${
col.key === "status"
? "justify-content-center"
: ""
}
${col.key === "amount"
${
col.key === "amount"
? "justify-content-end"
: ""
}
${col.key === "submitted"
${
col.key === "submitted"
? "justify-content-center"
: ""
}

1
src/components/Tenant/OrganizationInfo.jsx
View File

@ -57,7 +57,6 @@ const OrganizationInfo = ({ onNext, onPrev, onSubmitTenant }) => {
// onNext();
const tenantPayload = { ...data, onBoardingDate: moment.utc(data.onBoardingDate, "DD-MM-YYYY").toISOString() }
// CreateTenant(tenantPayload);
console.log(tenantPayload)
}
};

1
src/components/common/Error.jsx
View File

@ -1,7 +1,6 @@
import React from 'react'
const Error = ({error,close}) => {
console.log(error)
return (
<div className="container text-center py-5">
<h1 className="display-4 fw-bold text-danger">{error.statusCode || error?.response?.status

2
src/hooks/useDocument.js
View File

@ -124,7 +124,6 @@ export const useUploadDocument = (onSuccessCallBack) => {
if (onSuccessCallBack) onSuccessCallBack();
},
onError: (error) => {
console.log(error);
showToast(
error.response.data.message ||
"Something went wrong please try again !",
@ -145,7 +144,6 @@ export const useUpdateDocument = (onSuccessCallBack) => {
if (onSuccessCallBack) onSuccessCallBack();
},
onError: (error) => {
console.log(error);
showToast(
error.response.data.message ||
"Something went wrong please try again !",

2
src/pages/Expense/ExpensePage.jsx
View File

@ -50,7 +50,7 @@ const ExpensePage = () => {
);
const [filters, setFilters] = useState(defaultFilter);
const [groupBy, setGroupBy] = useState("transactionDate");
const [groupBy, setGroupBy] = useState("none");
const [searchText, setSearchText] = useState("");
const filterPanelRef = useRef();
const [ManageExpenseModal, setManageExpenseModal] = useState({