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

fixed collection header ui

Browse Source
This commit is contained in:
pramod.mahajan 2025-11-21 14:51:31 +05:30
parent a5329f1a2a
commit 18e739f3ab
1 changed files with 32 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/pages/collections/CollectionPage.jsx
View File

@ -116,13 +116,13 @@ const CollectionPage = () => {
/>
<div className="card my-3 py-2 px-sm-4 px-2">
<div className="row align-items-center mx-0">
{/* Left side: Date Picker + Show Pending (stacked on mobile) */}
<div className="col-12 col-md-6 d-flex flex-column flex-md-row flex-wrap align-items-start">
<div className="row align-items-center gap-sm-2 gap-md-0 mx-0">
<div className="col-12 col-md-4 d-flex flex-column flex-md-row flex-wrap align-items-start">
<div className="d-inline-flex border rounded-pill overflow-hidden shadow-none">
<button
type="button"
className={`btn px-2 py-1 rounded-0 text-tiny ${!showPending ? "btn-primary text-white" : ""
className={`btn px-2 py-1 rounded-0 text-tiny ${
!showPending ? "btn-primary text-white" : ""
}`}
onClick={() => setShowPending(false)}
>
@ -130,7 +130,8 @@ const CollectionPage = () => {
</button>
<button
type="button"
className={`btn px-2 py-1 rounded-0 text-tiny ${showPending ? "btn-primary text-white" : ""
className={`btn px-2 py-1 rounded-0 text-tiny ${
showPending ? "btn-primary text-white" : ""
}`}
onClick={() => setShowPending(true)}
>
@ -139,37 +140,39 @@ const CollectionPage = () => {
</div>
</div>
{/* Right side: Search + Add Button */}
<div className="col-12 col-sm-6 d-flex justify-content-end align-items-center gap-2">
<FormProvider {...methods}>
<DateRangePicker1 howManyDay={180} startField="fromDate"
endField="toDate" />
</FormProvider>
<div className="col-12 col-sm-8 d-block d-sm-flex justify-content-end ga-2 align-items-center gap-2">
<input
type="search"
value={searchText}
onChange={(e) => setSearchText(e.target.value)}
placeholder="Search Collection"
className="form-control form-control-sm w-auto"
className="form-control form-control-sm mt-2 mt-sm-0"
/>
<div className="d-flex justify-content-between justify-content-sm-between mt-2 mt-sm-0">
<FormProvider {...methods} className="me-3">
<DateRangePicker1
howManyDay={180}
startField="fromDate"
endField="toDate"
/>
</FormProvider>
{(canCreate || isAdmin) && (
<button
className="btn btn-sm btn-primary"
className="btn btn-sm btn-primary ms-sm-2"
type="button"
onClick={() =>
setCollection({ isOpen: true, invoiceId: null })
}
>
<i className="bx bx-plus-circle me-2"></i>
<span className="d-none d-md-inline-block">
Add New Collection
</span>
<span className="d-none d-md-inline-block">Collection</span>
</button>
)}
</div>
</div>
</div>
</div>
<CollectionList
fromDate={fromDate}