mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-08-27 00:52:50 +00:00
add checkbox
This commit is contained in:
@@ -15,6 +15,7 @@ import {
|
||||
Box,
|
||||
Button,
|
||||
Card,
|
||||
Checkbox,
|
||||
Divider,
|
||||
Group,
|
||||
Menu,
|
||||
@@ -381,6 +382,7 @@ const FirstMilePage = () => {
|
||||
const [jobs, setJobs] = useState<FirstMileJob[]>(PLACEHOLDER_JOBS);
|
||||
const [search, setSearch] = useState("");
|
||||
const [statusFilter, setStatusFilter] = useState<StatusFilter>("ALL");
|
||||
const [rowSelection, setRowSelection] = useState<Record<string, boolean>>({});
|
||||
|
||||
const [assignOpen, setAssignOpen] = useState(false);
|
||||
const [detailOpen, setDetailOpen] = useState(false);
|
||||
@@ -528,6 +530,29 @@ const FirstMilePage = () => {
|
||||
const headerClassName = ruleEngineTable.headerCell;
|
||||
const cellClassName = ruleEngineTable.bodyCell;
|
||||
return [
|
||||
{
|
||||
id: "select",
|
||||
size: 40,
|
||||
meta: { headerClassName, cellClassName },
|
||||
header: ({ table }) => (
|
||||
<Checkbox
|
||||
aria-label="Select all"
|
||||
checked={table.getIsAllPageRowsSelected()}
|
||||
indeterminate={
|
||||
table.getIsSomePageRowsSelected() && !table.getIsAllPageRowsSelected()
|
||||
}
|
||||
onChange={(e) => table.toggleAllPageRowsSelected(e.currentTarget.checked)}
|
||||
/>
|
||||
),
|
||||
cell: ({ row }) => (
|
||||
<Checkbox
|
||||
aria-label="Select row"
|
||||
checked={row.getIsSelected()}
|
||||
disabled={!row.getCanSelect()}
|
||||
onChange={row.getToggleSelectedHandler()}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
id: "bookingRef",
|
||||
header: "Booking",
|
||||
@@ -725,8 +750,11 @@ const FirstMilePage = () => {
|
||||
tableOptions={{
|
||||
manualPagination: true,
|
||||
pageCount,
|
||||
state: { pagination },
|
||||
enableRowSelection: true,
|
||||
getRowId: (row) => row.id,
|
||||
state: { pagination, rowSelection },
|
||||
onPaginationChange: setPagination,
|
||||
onRowSelectionChange: setRowSelection,
|
||||
}}
|
||||
containerClassName="border-0 shadow-none bg-transparent"
|
||||
footer={({ table, pagination: footerPagination }) => (
|
||||
|
||||
@@ -15,6 +15,7 @@ import {
|
||||
Box,
|
||||
Button,
|
||||
Card,
|
||||
Checkbox,
|
||||
Divider,
|
||||
Group,
|
||||
Menu,
|
||||
@@ -381,6 +382,7 @@ const LastMilePage = () => {
|
||||
const [jobs, setJobs] = useState<LastMileJob[]>(PLACEHOLDER_JOBS);
|
||||
const [search, setSearch] = useState("");
|
||||
const [statusFilter, setStatusFilter] = useState<StatusFilter>("ALL");
|
||||
const [rowSelection, setRowSelection] = useState<Record<string, boolean>>({});
|
||||
|
||||
const [assignOpen, setAssignOpen] = useState(false);
|
||||
const [detailOpen, setDetailOpen] = useState(false);
|
||||
@@ -528,6 +530,29 @@ const LastMilePage = () => {
|
||||
const headerClassName = ruleEngineTable.headerCell;
|
||||
const cellClassName = ruleEngineTable.bodyCell;
|
||||
return [
|
||||
{
|
||||
id: "select",
|
||||
size: 40,
|
||||
meta: { headerClassName, cellClassName },
|
||||
header: ({ table }) => (
|
||||
<Checkbox
|
||||
aria-label="Select all"
|
||||
checked={table.getIsAllPageRowsSelected()}
|
||||
indeterminate={
|
||||
table.getIsSomePageRowsSelected() && !table.getIsAllPageRowsSelected()
|
||||
}
|
||||
onChange={(e) => table.toggleAllPageRowsSelected(e.currentTarget.checked)}
|
||||
/>
|
||||
),
|
||||
cell: ({ row }) => (
|
||||
<Checkbox
|
||||
aria-label="Select row"
|
||||
checked={row.getIsSelected()}
|
||||
disabled={!row.getCanSelect()}
|
||||
onChange={row.getToggleSelectedHandler()}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
id: "bookingRef",
|
||||
header: "Booking",
|
||||
@@ -725,8 +750,11 @@ const LastMilePage = () => {
|
||||
tableOptions={{
|
||||
manualPagination: true,
|
||||
pageCount,
|
||||
state: { pagination },
|
||||
enableRowSelection: true,
|
||||
getRowId: (row) => row.id,
|
||||
state: { pagination, rowSelection },
|
||||
onPaginationChange: setPagination,
|
||||
onRowSelectionChange: setRowSelection,
|
||||
}}
|
||||
containerClassName="border-0 shadow-none bg-transparent"
|
||||
footer={({ table, pagination: footerPagination }) => (
|
||||
|
||||
Reference in New Issue
Block a user