update view admin

This commit is contained in:
Admin 2025-05-12 16:02:32 +07:00
parent 7cc30dc142
commit 255ef34ef1
4 changed files with 99 additions and 50 deletions

View File

@ -1,22 +1,38 @@
import { ActionIcon } from "@mantine/core"; import { Button } from "@mantine/core";
import { IconTrash } from "@tabler/icons-react"; import { IconTrash } from "@tabler/icons-react";
import { useChoosesStore } from "../../lib/zustand/use-chooses-store"; import { useChoosesStore } from "../../lib/zustand/use-chooses-store";
import { IBid } from "../../system/type"; import { useConfirmStore } from "../../lib/zustand/use-confirm";
import { deletesBid } from "../../apis/bid";
export interface IDeleteRowActionProps { export default function DeleteRowAction({
onClick?: () => void; onDeleted,
data: IBid }: {
} onDeleted?: () => void;
}) {
const { chooses } = useChoosesStore();
export default function DeleteRowAction({ data,onClick }: IDeleteRowActionProps) { const { setConfirm } = useConfirmStore();
const {chooses} = useChoosesStore()
const handleDelete = () => {
setConfirm({
handleOk: async () => {
const result = await deletesBid(chooses);
if (!result) return;
onDeleted?.();
},
title: 'Delete',
message: `This action will remove ${chooses.length} products.`
});
};
return ( return (
<ActionIcon disabled={!chooses.some(item => item.id === data.id)} onClick={onClick} size={"sm"} color="red"> <Button
<IconTrash size={14} /> onClick={handleDelete}
</ActionIcon> disabled={chooses.length <= 0}
size={"xs"}
color="red"
>
<IconTrash size={16} />
</Button>
); );
} }

View File

@ -35,6 +35,7 @@ export interface ITableActionsProps<R extends Record<string, string | number>> {
props?: TextInputProps; props?: TextInputProps;
render?: () => ReactNode; render?: () => ReactNode;
}; };
showMainAction?: boolean;
refAction?: TRefTableActionFn; refAction?: TRefTableActionFn;
selectProps?: SelectProps; selectProps?: SelectProps;
leftActionSession?: ReactNode; leftActionSession?: ReactNode;
@ -55,9 +56,10 @@ export default function TableActions<
actions, actions,
chooses, chooses,
refAction, refAction,
leftActionSession,
showMainAction = true,
onSearch, onSearch,
renderComfirm, renderComfirm,
leftActionSession,
onCloseComfirm, onCloseComfirm,
}: ITableActionsProps<R>) { }: ITableActionsProps<R>) {
const [opened, { toggle, close }] = useDisclosure(false); const [opened, { toggle, close }] = useDisclosure(false);
@ -259,16 +261,18 @@ export default function TableActions<
<Box className="flex items-end gap-4"> <Box className="flex items-end gap-4">
{leftActionSession} {leftActionSession}
<Select {showMainAction && (
size="xs" <Select
value={selectValue} size="xs"
onChange={handleChangeAction} value={selectValue}
label="Actions" onChange={handleChangeAction}
placeholder="Pick value" label="Actions"
defaultChecked={false} placeholder="Pick value"
data={actionDataMemo} defaultChecked={false}
{...selectProps} data={actionDataMemo}
/> {...selectProps}
/>
)}
</Box> </Box>
)} )}

View File

@ -16,7 +16,8 @@ import {
IconHammer, IconHammer,
IconHistory, IconHistory,
IconMenu, IconMenu,
IconPlus IconPlus,
IconTrash,
} from "@tabler/icons-react"; } from "@tabler/icons-react";
import _ from "lodash"; import _ from "lodash";
import { useMemo, useRef, useState } from "react"; import { useMemo, useRef, useState } from "react";
@ -27,25 +28,25 @@ import {
ShowHistoriesBidPicklesApiModal, ShowHistoriesBidPicklesApiModal,
ShowHistoriesModal, ShowHistoriesModal,
} from "../components/bid"; } from "../components/bid";
import DeleteRowAction from "../components/bid/delete-row-action";
import constants, { haveHistories } from "../constant"; import constants, { haveHistories } from "../constant";
import Table from "../lib/table/table"; import Table from "../lib/table/table";
import { IColumn, TRefTableFn } from "../lib/table/type"; import { IColumn, TRefTableFn } from "../lib/table/type";
import { useChoosesStore } from "../lib/zustand/use-chooses-store";
import { useConfirmStore } from "../lib/zustand/use-confirm"; import { useConfirmStore } from "../lib/zustand/use-confirm";
import { mappingStatusColors } from "../system/constants"; import { mappingStatusColors } from "../system/constants";
import { IBid } from "../system/type"; import { IBid } from "../system/type";
import { extractDomainSmart, formatTime } from "../utils"; import { extractDomainSmart, formatTime } from "../utils";
import DeleteRowAction from "../components/bid/delete-row-action";
import { useChoosesStore } from "../lib/zustand/use-chooses-store";
export default function Bids() { export default function Bids() {
const refTableFn: TRefTableFn<IBid> = useRef({}); const refTableFn: TRefTableFn<IBid> = useRef({});
const [clickData, setClickData] = useState<IBid | null>(null); const [clickData, setClickData] = useState<IBid | null>(null);
const {setChooses} = useChoosesStore()
const { setConfirm } = useConfirmStore(); const { setConfirm } = useConfirmStore();
const { setChooses } = useChoosesStore();
const [openedHistories, historiesModel] = useDisclosure(false); const [openedHistories, historiesModel] = useDisclosure(false);
const [openedHistoriesGraysApi, historiesGraysApiModel] = const [openedHistoriesGraysApi, historiesGraysApiModel] =
useDisclosure(false); useDisclosure(false);
@ -67,6 +68,7 @@ export default function Bids() {
renderRow(row) { renderRow(row) {
return ( return (
<Anchor <Anchor
target="_blank"
className="text-[14px]" className="text-[14px]"
href={row.url} href={row.url}
size="sm" size="sm"
@ -80,7 +82,7 @@ export default function Bids() {
{ {
key: "web_bid", key: "web_bid",
title: "Web", title: "Web",
typeFilter: "text", typeFilter: "none",
renderRow(row) { renderRow(row) {
return <span>{extractDomainSmart(row.web_bid.origin_url)}</span>; return <span>{extractDomainSmart(row.web_bid.origin_url)}</span>;
}, },
@ -88,7 +90,7 @@ export default function Bids() {
{ {
key: "lot_id", key: "lot_id",
title: "Lot ID", title: "Lot ID",
typeFilter: "text", typeFilter: "none",
}, },
{ {
key: "model", key: "model",
@ -99,22 +101,22 @@ export default function Bids() {
{ {
key: "plus_price", key: "plus_price",
title: "Plus price", title: "Plus price",
typeFilter: "number", typeFilter: "none",
}, },
{ {
key: "max_price", key: "max_price",
title: "Max price", title: "Max price",
typeFilter: "number", typeFilter: "none",
}, },
{ {
key: "current_price", key: "current_price",
title: "Current price", title: "Current price",
typeFilter: "number", typeFilter: "none",
}, },
{ {
key: "reserve_price", key: "reserve_price",
title: "Reserve price", title: "Reserve price",
typeFilter: "number", typeFilter: "none",
}, },
{ {
key: "histories", key: "histories",
@ -129,7 +131,7 @@ export default function Bids() {
{ {
key: "start_bid_time", key: "start_bid_time",
title: "Start bid", title: "Start bid",
typeFilter: "text", typeFilter: "none",
renderRow(row) { renderRow(row) {
return ( return (
<Tooltip hidden={!row.start_bid_time} label={row.start_bid_time}> <Tooltip hidden={!row.start_bid_time} label={row.start_bid_time}>
@ -145,7 +147,7 @@ export default function Bids() {
{ {
key: "close_time", key: "close_time",
title: "Close time", title: "Close time",
typeFilter: "text", typeFilter: "date",
renderRow(row) { renderRow(row) {
return ( return (
<Tooltip hidden={!row.close_time} label={row.close_time}> <Tooltip hidden={!row.close_time} label={row.close_time}>
@ -161,7 +163,23 @@ export default function Bids() {
{ {
key: "status", key: "status",
title: "Status", title: "Status",
typeFilter: "text", typeFilter: {
type: "select",
data: [
{
label: "Biding",
value: "biding",
},
{
label: "Win bid",
value: "win-bid",
},
{
label: "Out bid",
value: "out-bid",
},
],
},
renderRow(row) { renderRow(row) {
return ( return (
<Box className="flex items-center justify-center"> <Box className="flex items-center justify-center">
@ -219,14 +237,8 @@ export default function Bids() {
}, },
}} }}
actionsOptions={{ actionsOptions={{
showMainAction: false,
actions: [ actions: [
// {
// key: "add",
// title: "Add",
// callback: () => {
// bidModal.open();
// },
// },
{ {
key: "delete", key: "delete",
title: "Delete", title: "Delete",
@ -249,8 +261,18 @@ export default function Bids() {
}, },
], ],
leftActionSession: ( leftActionSession: (
<Button onClick={bidModal.open} size="xs" rightSection={<IconPlus size={14}/>}>Add</Button> <Box className="flex items-end gap-2">
) <Button
onClick={bidModal.open}
size="xs"
rightSection={<IconPlus size={14} />}
>
Add
</Button>
<DeleteRowAction onDeleted={refTableFn.current?.fetchData} />
</Box>
),
}} }}
refTableFn={refTableFn} refTableFn={refTableFn}
striped striped
@ -360,7 +382,13 @@ export default function Bids() {
</Menu.Dropdown> </Menu.Dropdown>
</Menu> </Menu>
<DeleteRowAction data={row} onClick={() => handleDelete(row)} /> <ActionIcon
onClick={() => handleDelete(row)}
size={"sm"}
color="red"
>
<IconTrash size={14} />
</ActionIcon>
</Box> </Box>
); );
}, },

View File

@ -53,10 +53,11 @@ export class BidsService {
| true; | true;
} = { } = {
id: true, id: true,
model: true, model: [FilterOperator.ILIKE],
lot_id: true, lot_id: true,
close_time: true, close_time: true,
name: true, name: [FilterOperator.ILIKE],
status: true
}; };
query.filter = AppResponse.processFilters(query.filter, filterableColumns); query.filter = AppResponse.processFilters(query.filter, filterableColumns);