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

Ui alignment in Recurring Expense and Payment Request page.

Browse Source
This commit is contained in:
Kartik Sharma 2025-11-10 16:00:28 +05:30
parent 26675d61c3
commit 00e74b645c
5 changed files with 16 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Expenses/ExpenseSkeleton.jsx
View File

@ -154,7 +154,7 @@ export const ExpenseTableSkeleton = ({ groups = 3, rowsPerGroup = 3 }) => {
<thead>
<tr>
<th className="d-none d-sm-table-cell">
<div className="text-start ms-5">Expense Categort</div>
<div className="text-start ms-5">Expense Category</div>
</th>
<th className="d-none d-sm-table-cell">
<div className="text-start ms-5">Payment Mode</div>

2
src/components/PaymentRequest/PaymentRequestList.jsx
View File

@ -239,7 +239,7 @@ const PaymentRequestList = ({ filters, groupBy = "submittedBy", search }) => {
/>
)}
<div className="card page-min-h table-responsive px-sm-4">
<div className="card-datatable" id="payment-request-table">
<div className="card-datatable mx-2" id="payment-request-table ">
<table className="table border-top dataTable text-nowrap align-middle">
<thead>
<tr>

8
src/components/RecurringExpense/RecurringExpenseList.jsx
View File

@ -181,10 +181,11 @@ const RecurringExpenseList = ({ search, filterStatuses }) => {
/>
)}
<div className="card page-min-h table-responsive px-sm-4 ">
<div className="card page-min-h table-responsive px-sm-4">
<div className="card-datatable" id="payment-request-table">
{Array.isArray(filteredData) && filteredData.length > 0 && (
<table className="table border-top dataTable text-nowrap align-middle">
<div className="mx-2">
{Array.isArray(filteredData) && filteredData.length > 0 && (
<table className="table border-top dataTable text-nowrap align-middle">
<thead>
<tr>
{recurringExpenseColumns.map((col) => (
@ -284,6 +285,7 @@ const RecurringExpenseList = ({ search, filterStatuses }) => {
{isError ? (<p>{error.message}</p>):(<p>No Recurring Expense Found</p>)}
</div>
)}
</div>
</div>
{/* Pagination */}

8
src/pages/PaymentRequest/PaymentRequestPage.jsx
View File

@ -73,7 +73,7 @@ const PaymentRequestPage = () => {
{/* Top Bar */}
<div className="card my-3 px-sm-4 px-0">
<div className="card-body py-2 px-0">
<div className="card-body py-2 px-0 mx-2">
<div className="row align-items-center">
<div className="col-6">
<input
@ -81,11 +81,12 @@ const PaymentRequestPage = () => {
className="form-control form-control-sm w-auto"
placeholder="Search Payment Request"
value={search}
style={{minWidth:"200px"}}
onChange={(e) => setSearch(e.target.value)}
/>
</div>
<div className="col-6 text-end mt-2 mt-sm-0">
<div className="col-6 text-end mt-sm-0">
<button
className="btn btn-sm btn-primary"
type="button"
@ -145,7 +146,8 @@ const PaymentRequestPage = () => {
size="md"
closeModal={() => setIsExpenseGenerate({IsOpen:false, requestId: null})}
>
<MakeExpense onClose={() => setIsExpenseGenerate({IsOpen:false, requestId: null})} />
<MakeExpe
nse onClose={() => setIsExpenseGenerate({IsOpen:false, requestId: null})} />
</GlobalModel>
)}

7
src/pages/RecurringExpense/RecurringExpensePage.jsx
View File

@ -57,16 +57,17 @@ const RecurringExpensePage = () => {
{/* Top Bar */}
<div className="card my-3 px-sm-4 px-0">
<div className="card-body py-2 px-1">
<div className="card-body py-2 px-1 mx-2">
<div className="row align-items-center mb-0">
{/* Left Column: Search + Filter */}
<div className="col-md-8 col-sm-12 mb-2 mb-md-0">
<div className="d-flex align-items-center flex-wrap gap-0">
<input
type="search"
className="form-control form-control-sm w-25"
className="form-control form-control-sm w-auto"
placeholder="Search Recurring Expense"
value={search}
style={{minWidth:"200px"}}
onChange={(e) => setSearch(e.target.value)}
/>
@ -99,7 +100,7 @@ const RecurringExpensePage = () => {
</div>
{/* Right Column: Add Button */}
<div className="col-md-4 col-sm-12 text-md-end text-start">
<div className="col-md-4 col-sm-12 text-md-end text-end">
<button
className="btn btn-sm btn-primary"
type="button"