diff --git a/src/pages/Directory/NotesPage.jsx b/src/pages/Directory/NotesPage.jsx
index 45abe8d3..0860132d 100644
--- a/src/pages/Directory/NotesPage.jsx
+++ b/src/pages/Directory/NotesPage.jsx
@@ -125,8 +125,7 @@ const NotesPage = ({ projectId, searchText, onExport }) => {
) : (
{debouncedSearch
diff --git a/src/pages/Expense/ExpensePage.jsx b/src/pages/Expense/ExpensePage.jsx
index d7b2b594..fcabf458 100644
--- a/src/pages/Expense/ExpensePage.jsx
+++ b/src/pages/Expense/ExpensePage.jsx
@@ -30,6 +30,7 @@ import {
SearchSchema,
} from "../../components/Expenses/ExpenseSchema";
import PreviewDocument from "../../components/Expenses/PreviewDocument";
+import HandleExpenseExport from "../../components/PaymentRequest/HandleExpenseExport";
// Context
export const ExpenseContext = createContext();
@@ -70,6 +71,8 @@ const ExpensePage = () => {
const IsViewSelf = useHasUserPermission(VIEW_SELF_EXPENSE);
const { setOffcanvasContent, setShowTrigger } = useFab();
const [filterData, setFilterdata] = useState(defaultFilter);
+ const tableRef = useRef(null);
+ const [filteredData, setFilteredData] = useState([]);
const removeFilterChip = (key, id) => {
setFilters((prev) => {
const updated = { ...prev };
@@ -114,6 +117,11 @@ const ExpensePage = () => {
removeFilterChip,
};
+ const handleExport = (type) => {
+ HandleExpenseExport(type, filters, searchText, tableRef);
+ };
+
+
return (
@@ -126,17 +134,19 @@ const ExpensePage = () => {
-
-
setSearchText(e.target.value)}
- />
+
-
+
{IsCreatedAble && (
)}
+
+ {/* 3-Dots Dropdown */}
+
+
+
+
+ -
+
+
+
+
-
+
+
+
+ -
+
+
+
+ -
+
+
+
+
+
@@ -163,6 +214,8 @@ const ExpensePage = () => {
filters={filters}
groupBy={groupBy}
searchText={searchText}
+ tableRef={tableRef}
+ onDataFiltered={setFilteredData}
/>
) : (
diff --git a/src/pages/PaymentRequest/PaymentRequestPage.jsx b/src/pages/PaymentRequest/PaymentRequestPage.jsx
index 7b7d2ff1..7c904cf5 100644
--- a/src/pages/PaymentRequest/PaymentRequestPage.jsx
+++ b/src/pages/PaymentRequest/PaymentRequestPage.jsx
@@ -9,6 +9,7 @@ import { defaultPaymentRequestFilter } from "../../components/PaymentRequest/Pay
import ViewPaymentRequest from "../../components/PaymentRequest/ViewPaymentRequest";
import PreviewDocument from "../../components/Expenses/PreviewDocument";
import MakeExpense from "../../components/PaymentRequest/MakeExpense";
+import HandlePaymentRequestExport from "../../components/PaymentRequest/HandlePaymentRequestExport";
export const PaymentRequestContext = createContext();
export const usePaymentRequestContext = () => {
@@ -25,12 +26,15 @@ const PaymentRequestPage = () => {
const [filters, setFilters] = useState(defaultPaymentRequestFilter);
const [filterData, setFilterdata] = useState(null);
const [ViewDocument, setDocumentView] = useState({ IsOpen: false, Image: null });
+ const [searchText, setSearchText] = useState("");
const [isExpenseGenerate, setIsExpenseGenerate] = useState({ IsOpen: null, RequestId: null });
const [modalSize, setModalSize] = useState("md");
const [search, setSearch] = useState("");
const updatedRef = useRef();
const { setOffcanvasContent, setShowTrigger } = useFab();
-
+ const [exportLoading, setExportLoading] = useState(false);
+ const tableRef = useRef(null);
+ const [filteredData, setFilteredData] = useState([]);
const contextValue = {
setManageRequest,
setVieRequest,
@@ -76,6 +80,10 @@ const PaymentRequestPage = () => {
});
};
+ const handleExport = (type) => {
+ HandlePaymentRequestExport(type, filters, search, tableRef, setExportLoading);
+};
+
return (
@@ -92,18 +100,19 @@ const PaymentRequestPage = () => {
-
-
setSearch(e.target.value)}
- />
+
-
-
+
+
+ {/* 3-Dots Dropdown */}
+
+
+
+
+ -
+
+
+
+
-
+
+
+
+ -
+
+
+
+ -
+
+
+
+
+
+
@@ -129,6 +180,8 @@ const PaymentRequestPage = () => {
filterData={filterData}
removeFilterChip={handleRemoveChip}
clearFilter={clearFilter}
+ tableRef={tableRef}
+ onDataFiltered={setFilteredData}
/>
{/* Add/Edit Modal */}
diff --git a/src/pages/RecurringExpense/RecurringExpensePage.jsx b/src/pages/RecurringExpense/RecurringExpensePage.jsx
index 12c07e10..1097ebd3 100644
--- a/src/pages/RecurringExpense/RecurringExpensePage.jsx
+++ b/src/pages/RecurringExpense/RecurringExpensePage.jsx
@@ -1,12 +1,13 @@
-import React, { createContext, useState, useEffect, useContext } from "react";
+import React, { createContext, useState, useEffect, useContext, useRef } from "react";
import Breadcrumb from "../../components/common/Breadcrumb";
import GlobalModel from "../../components/common/GlobalModel";
import { useFab } from "../../Context/FabContext";
import ManageRecurringExpense from "../../components/RecurringExpense/ManageRecurringExpense";
import RecurringExpenseList from "../../components/RecurringExpense/RecurringExpenseList";
import { PAYEE_RECURRING_EXPENSE } from "../../utils/constants";
-import { SearchRecurringExpenseSchema } from "../../components/RecurringExpense/RecurringExpenseSchema";
+import { defaultRecurringExpense, SearchRecurringExpenseSchema } from "../../components/RecurringExpense/RecurringExpenseSchema";
import ViewRecurringExpense from "../../components/RecurringExpense/ViewRecurringExpense";
+import HandleRecurringExpenseExport from "../../components/RecurringExpense/HandleRecurringExpenseExport";
export const RecurringExpenseContext = createContext();
export const useRecurringExpenseContext = () => {
@@ -16,13 +17,19 @@ export const useRecurringExpenseContext = () => {
"useRecurringExpenseContext must be used within an ExpenseProvider"
);
}
- return context;
+ return context;
};
const RecurringExpensePage = () => {
const [ManageRequest, setManageRequest] = useState({
IsOpen: null,
RecurringId: null,
});
+ const tableRef = useRef(null);
+
+ const [filteredData, setFilteredData] = useState([]);
+ const [exportLoading, setExportLoading] = useState(false);
+ const [searchText, setSearchText] = useState("");
+ const [filters, setFilters] = useState(defaultRecurringExpense);
const [viewRecurring, setViewRecurring] = useState({
view: false,
recurringId: null,
@@ -44,6 +51,12 @@ const RecurringExpensePage = () => {
prev.includes(id) ? prev.filter((s) => s !== id) : [...prev, id]
);
};
+
+
+ const handleExport = (type) => {
+ HandleRecurringExpenseExport(type, filters, search, tableRef, setExportLoading);
+ };
+
return (
@@ -56,8 +69,8 @@ const RecurringExpensePage = () => {
/>
{/* Top Bar */}
-
-
+
+
{/* Left Column: Search + Filter */}
@@ -67,7 +80,7 @@ const RecurringExpensePage = () => {
className="form-control form-control-sm w-auto"
placeholder="Search Recurring Expense"
value={search}
- style={{minWidth:"200px"}}
+ style={{ minWidth: "200px" }}
onChange={(e) => setSearch(e.target.value)}
/>
@@ -99,8 +112,8 @@ const RecurringExpensePage = () => {
- {/* Right Column: Add Button */}
-
+ {/* Right Column: Add Button + 3-Dots Menu */}
+
+
+ {/* 3-Dots Dropdown */}
+
+
+
+
+ -
+
+
+
+
-
+
+
+
+ -
+
+
+
+ -
+
+
+
+
+
+
@@ -124,6 +179,8 @@ const RecurringExpensePage = () => {
{ManageRequest.IsOpen && (
diff --git a/src/pages/employee/EmployeeList.jsx b/src/pages/employee/EmployeeList.jsx
index ba7a13ba..9417f8bc 100644
--- a/src/pages/employee/EmployeeList.jsx
+++ b/src/pages/employee/EmployeeList.jsx
@@ -298,31 +298,7 @@ const EmployeeList = () => {
{/* Switches: All Employees + Inactive */}
- {/* All Employees Switch */}
-
- {/* Show Inactive Employees Switch */}
-
-
- setShowInactive(e.target.checked)}
- />
-
-
-
-
- {/* Right side: Search + Export + Add Employee */}
-
- {/* Search Input - ALWAYS ENABLED */}
+ {/* {showAllEmployees && ( */}
- {/* Export Dropdown */}
-
+ {/* )} */}
+
+ {/* Right side: Search + Add Employee + Options */}
+
{/* Add Employee Button */}
{Manage_Employee && (
)}
+
+ {/* 3-Dots Dropdown (New Combined Menu) */}
+
+
},
{ path: "/project/manage/:projectId", element:
},
{ path: "/service-projects/:projectId", element:
},
- {path:"/service/job",element:
},
+ { path: "/service/job", element:
},
{ path: "/employees", element:
},
{ path: "/employee/:employeeId", element:
},
@@ -120,8 +120,9 @@ const router = createBrowserRouter(
{ path: "/expenses", element:
},
{ path: "/payment-request", element:
},
{ path: "/recurring-payment", element:
},
- { path: "/advance-payment", element:
},
- { path: "/advance-payment/:employeeId", element:
},
+
+ { path: "/advance-payment", element:
},
+ { path: "/advance-payment/:employeeId", element:
},
{ path: "/collection", element:
},
// Purchases and Inventory
diff --git a/src/utils/exportUtils.js b/src/utils/exportUtils.js
deleted file mode 100644
index 40f7d423..00000000
--- a/src/utils/exportUtils.js
+++ /dev/null
@@ -1,27 +0,0 @@
-// utils/exportUtils.js
-export const exportToCSV = (data, filename = "export.csv") => {
- if (!data || data.length === 0) return;
-
- const headers = Object.keys(data[0]);
- const csvRows = [];
-
- // Add headers
- csvRows.push(headers.join(","));
-
- // Add values
- data.forEach(row => {
- const values = headers.map(header => `"${row[header] ?? ""}"`);
- csvRows.push(values.join(","));
- });
-
- // Create CSV Blob
- const csvContent = csvRows.join("\n");
- const blob = new Blob([csvContent], { type: "text/csv;charset=utf-8;" });
-
- // Create download link
- const link = document.createElement("a");
- const url = URL.createObjectURL(blob);
- link.setAttribute("href", url);
- link.setAttribute("download", filename);
- link.click();
-};
diff --git a/src/utils/tableExportUtils.jsx b/src/utils/tableExportUtils.jsx
index 768ff5ac..e7dfe072 100644
--- a/src/utils/tableExportUtils.jsx
+++ b/src/utils/tableExportUtils.jsx
@@ -46,62 +46,73 @@ const sanitizeText = (text) => {
return text.replace(/[^\x00-\x7F]/g, "?");
};
-export const exportToPDF = async (data, fileName = "data", columns = null, options = {}) => {
+export const exportToPDF = async (data, fileName = "data", columns = null) => {
if (!data || data.length === 0) return;
const pdfDoc = await PDFDocument.create();
const font = await pdfDoc.embedFont(StandardFonts.Helvetica);
- // Default options
- const {
- columnWidths = [], // array of widths per column
- fontSizeHeader = 12,
- fontSizeRow = 10,
- rowHeight = 25,
- } = options;
-
- const pageWidth = 1000;
+ const pageWidth = 900;
const pageHeight = 600;
- let page = pdfDoc.addPage([pageWidth, pageHeight]);
const margin = 30;
+ const rowHeight = 20;
+
+ let page = pdfDoc.addPage([pageWidth, pageHeight]);
let y = pageHeight - margin;
const headers = columns || Object.keys(data[0]);
- // Draw headers
- headers.forEach((header, i) => {
- const x = margin + (columnWidths[i] ? columnWidths.slice(0, i).reduce((a, b) => a + b, 0) : i * 150);
- page.drawText(header, { x, y, font, size: fontSizeHeader });
+ const sanitize = (value) => {
+ if (value === null || value === undefined) return "";
+ return String(value).replace(/[^\x00-\x7F]/g, ""); // remove unicode
+ };
+
+ // ---- Draw Header Row ----
+ headers.forEach((header, index) => {
+ const x = margin + index * 120;
+ page.drawText(sanitize(header), {
+ x,
+ y,
+ size: 12,
+ font,
+ });
});
+
y -= rowHeight;
- // Draw rows
- data.forEach(row => {
- headers.forEach((header, i) => {
- const x = margin + (columnWidths[i] ? columnWidths.slice(0, i).reduce((a, b) => a + b, 0) : i * 150);
- const text = row[header] || '';
- page.drawText(text, { x, y, font, size: fontSizeRow });
- });
- y -= rowHeight;
-
+ // ---- Draw Table Rows ----
+ data.forEach((row) => {
if (y < margin) {
+ // Create a new page
page = pdfDoc.addPage([pageWidth, pageHeight]);
y = pageHeight - margin;
}
+
+ headers.forEach((header, index) => {
+ const x = margin + index * 120;
+ const text = sanitize(row[header]);
+
+ page.drawText(text, {
+ x,
+ y,
+ size: 10,
+ font,
+ });
+ });
+
+ y -= rowHeight;
});
const pdfBytes = await pdfDoc.save();
- const blob = new Blob([pdfBytes], { type: 'application/pdf' });
- const link = document.createElement('a');
+
+ // Download
+ const blob = new Blob([pdfBytes], { type: "application/pdf" });
+ const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
link.download = `${fileName}.pdf`;
link.click();
};
-
-
-
-
/**
* Export JSON data to PDF in a card-style format
* @param {Array} data - Array of objects to export