Update page added status Archived

dilmurod
Dilmurod 1 week ago
parent cfad4ed633
commit 9fe44a9cdc

@ -143,6 +143,7 @@ const Update = () => {
<Option value="Done">Done</Option> <Option value="Done">Done</Option>
<Option value="Paper">Paper</Option> <Option value="Paper">Paper</Option>
<Option value="Setup">Setup</Option> <Option value="Setup">Setup</Option>
<Option value="Archived">Archived</Option>
</Select> </Select>
<Select <Select

@ -13,6 +13,8 @@ import {
Button, Button,
Select, Select,
Upload, Upload,
Modal,
notification,
} from "antd"; } from "antd";
import { updateController } from "../../API/LayoutApi/update"; import { updateController } from "../../API/LayoutApi/update";
import { import {
@ -55,7 +57,10 @@ const UpdateEdit = () => {
refetch(); refetch();
document.location.replace("/#/updates/"); document.location.replace("/#/updates/");
} else { } else {
alert("solution is empty!!!!!!!!!!!!!!!!!!!!!"); notification.error({
message: "Error",
description: "Solution cannot be empty!",
});
} }
} else { } else {
await updateController.updatePut(value, id); await updateController.updatePut(value, id);
@ -123,15 +128,31 @@ const UpdateEdit = () => {
} }
}, [data]); }, [data]);
// const ClickDelete = () => {
// const shouldDelete = window.confirm(
// "Вы уверены, что хотите удалить эту задачу?"
// );
// if (shouldDelete && id !== undefined) {
// updateController.deleteUpdateController(id).then((data: any) => {
// document.location.replace(`/#/updates/`);
// });
// }
// };
const ClickDelete = () => { const ClickDelete = () => {
const shouldDelete = window.confirm( Modal.confirm({
"Вы уверены, что хотите удалить эту задачу?" title: "Are you sure you want to delete this task?",
); okText: "Yes",
if (shouldDelete && id !== undefined) { okType: "danger",
updateController.deleteUpdateController(id).then((data: any) => { cancelText: "No",
document.location.replace(`/#/updates/`); onOk() {
if (id) {
updateController.deleteUpdateController(id).then(() => {
document.location.replace("/#/updates/");
}); });
} }
},
});
}; };
const [imgname, setImgname] = useState<any>([]); const [imgname, setImgname] = useState<any>([]);
function handlePaste(event: any) { function handlePaste(event: any) {
@ -301,7 +322,7 @@ const UpdateEdit = () => {
danger danger
onClick={ClickDelete} onClick={ClickDelete}
> >
Delete Archived
</Button> </Button>
)} )}
<Button <Button

@ -1,9 +1,6 @@
import { Button, Space, Table, Tooltip, theme } from "antd"; import { Button, Space, Table, Tooltip, theme, Tag } from "antd";
import { PushpinOutlined } from "@ant-design/icons"; import { PushpinOutlined } from "@ant-design/icons";
import moment from "moment"; import moment from "moment";
import { useCompanyData } from "../../Hooks/Companies";
import { useCustomerData } from "../../Hooks/Customers";
import { useUserData } from "../../Hooks/Users";
import { updateController } from "../../API/LayoutApi/update"; import { updateController } from "../../API/LayoutApi/update";
import { import {
QueryObserverResult, QueryObserverResult,
@ -40,9 +37,8 @@ const UpdateTable = ({
options?: (RefetchOptions & RefetchQueryFilters<TPageData>) | undefined options?: (RefetchOptions & RefetchQueryFilters<TPageData>) | undefined
) => Promise<QueryObserverResult<TUpdate[], unknown>>; ) => Promise<QueryObserverResult<TUpdate[], unknown>>;
}) => { }) => {
// const CompanyData = useCompanyData({}); // Jadvalda kamida bitta is_active === false yozuv borligini aniqlaymiz
// const CustomerData = useCustomerData({}); const hasInactive = data?.some((item) => item.is_active === false);
// const AdminData = useUserData({});
const [isTextSelected, setIsTextSelected] = useState(false); const [isTextSelected, setIsTextSelected] = useState(false);
@ -67,6 +63,7 @@ const UpdateTable = ({
document.location.replace(`/#/updates/${record.id}`); document.location.replace(`/#/updates/${record.id}`);
} }
}; };
const getImageSource = (source: string) => { const getImageSource = (source: string) => {
switch (source) { switch (source) {
case "Zippy": case "Zippy":
@ -86,33 +83,8 @@ const UpdateTable = ({
const { token } = theme.useToken(); const { token } = theme.useToken();
return ( // Asosiy ustunlar
<div style={{ paddingBottom: 40 }}> const baseColumns = [
<Table
onRow={(record) => ({
onClick: (event) => Row(record, event),
})}
dataSource={data?.map((u, i) => ({
no: i + 1,
...u,
// company_name: CompanyData?.data?.find(
// (company: any) => company.id === u.company_id
// )?.name,
// customer_name: CustomerData?.data?.data?.find(
// (customer: any) => customer.id === u.customer_id
// )?.name,
// in_charge_name: AdminData?.data?.find(
// (admin: any) => admin.id === u.provider_id
// )?.username,
// executor_name: AdminData?.data?.find(
// (admin: any) => admin.id === u.executor_id
// )?.username,
created: moment(u?.created_at, "YYYY-MM-DD HH:mm:ss").format(
"DD.MM.YYYY HH:mm"
),
action: { ...u },
}))}
columns={[
{ {
title: <img src={tagIcon} alt="" />, title: <img src={tagIcon} alt="" />,
dataIndex: "no", dataIndex: "no",
@ -122,11 +94,9 @@ const UpdateTable = ({
{ {
title: "Company", title: "Company",
dataIndex: "company", dataIndex: "company",
ellipsis: { ellipsis: { showTitle: false },
showTitle: false,
},
width: "10%", width: "10%",
render: (text: any, record: any) => ( render: (text: any) => (
<Tooltip placement="topLeft" title={text?.name}> <Tooltip placement="topLeft" title={text?.name}>
<div style={{ display: "flex", alignItems: "center" }}> <div style={{ display: "flex", alignItems: "center" }}>
{text?.source && ( {text?.source && (
@ -144,9 +114,7 @@ const UpdateTable = ({
{ {
title: "Driver", title: "Driver",
dataIndex: "customer", dataIndex: "customer",
ellipsis: { ellipsis: { showTitle: false },
showTitle: false,
},
width: "10%", width: "10%",
render: (item: { name: string }) => ( render: (item: { name: string }) => (
<Tooltip placement="topLeft" title={item?.name}> <Tooltip placement="topLeft" title={item?.name}>
@ -157,9 +125,7 @@ const UpdateTable = ({
{ {
title: "Created by", title: "Created by",
dataIndex: "provider", dataIndex: "provider",
ellipsis: { ellipsis: { showTitle: false },
showTitle: false,
},
responsive: ["xl"], responsive: ["xl"],
width: "10%", width: "10%",
render: (provider: { username: string }) => ( render: (provider: { username: string }) => (
@ -171,9 +137,7 @@ const UpdateTable = ({
{ {
title: "Completed by", title: "Completed by",
dataIndex: "executor", dataIndex: "executor",
ellipsis: { ellipsis: { showTitle: false },
showTitle: false,
},
responsive: ["lg"], responsive: ["lg"],
width: "10%", width: "10%",
render: (executor: { username: string }) => ( render: (executor: { username: string }) => (
@ -182,12 +146,22 @@ const UpdateTable = ({
</Tooltip> </Tooltip>
), ),
}, },
{ ];
const archivedColumn = {
title: "Status", title: "Status",
dataIndex: "is_active",
width: "8%",
render: (is_active: boolean) =>
is_active === false ? <Tag color="gray">Archived</Tag> : null,
};
// Qolgan ustunlar
const otherColumns = [
{
title: hasInactive ? "Status Before Deletion" : "Status",
dataIndex: "status", dataIndex: "status",
ellipsis: { ellipsis: { showTitle: false },
showTitle: false,
},
width: "10%", width: "10%",
render: (status: string) => ( render: (status: string) => (
<span> <span>
@ -205,9 +179,7 @@ const UpdateTable = ({
title: "Note", title: "Note",
dataIndex: "note", dataIndex: "note",
width: "10%", width: "10%",
ellipsis: { ellipsis: { showTitle: false },
showTitle: false,
},
render: (note: string) => ( render: (note: string) => (
<Tooltip placement="topLeft" title={note}> <Tooltip placement="topLeft" title={note}>
{note} {note}
@ -219,9 +191,7 @@ const UpdateTable = ({
dataIndex: "solution", dataIndex: "solution",
width: "10%", width: "10%",
responsive: ["lg"], responsive: ["lg"],
ellipsis: { ellipsis: { showTitle: false },
showTitle: false,
},
render: (note: string) => ( render: (note: string) => (
<Tooltip placement="topLeft" title={note}> <Tooltip placement="topLeft" title={note}>
{note} {note}
@ -231,9 +201,7 @@ const UpdateTable = ({
{ {
title: "Created at", title: "Created at",
dataIndex: "created", dataIndex: "created",
ellipsis: { ellipsis: { showTitle: false },
showTitle: false,
},
responsive: ["xxl"], responsive: ["xxl"],
width: "10%", width: "10%",
render: (note: string) => ( render: (note: string) => (
@ -253,27 +221,10 @@ const UpdateTable = ({
{record.status !== "Done" && ( {record.status !== "Done" && (
<Space> <Space>
{record.is_pinned ? ( {record.is_pinned ? (
// <button
// className="btn-unpin"
// onClick={(e) => {
// const updateData = {
// is_pinned: false,
// };
// updateController
// .updatePatch(updateData, record.id)
// .then(() => {
// refetch();
// });
// }}
// >
// <img src={unpin} alt="" />
// </button>
<Button <Button
style={{ background: "#f99e2c", color: "#fff" }} style={{ background: "#f99e2c", color: "#fff" }}
onClick={(e) => { onClick={() => {
const updateData = { const updateData = { is_pinned: false };
is_pinned: false,
};
updateController updateController
.updatePatch(updateData, record.id) .updatePatch(updateData, record.id)
.then(() => { .then(() => {
@ -281,29 +232,11 @@ const UpdateTable = ({
}); });
}} }}
icon={<PushpinOutlined />} icon={<PushpinOutlined />}
></Button> />
) : ( ) : (
// <button
// className="btn-pin"
// style={{ paddingTop: 2 }}
// onClick={(e) => {
// const updateData = {
// is_pinned: true,
// };
// updateController
// .updatePatch(updateData, record.id)
// .then(() => {
// refetch();
// });
// }}
// >
// <img src={pin} alt="" />
// </button>
<Button <Button
onClick={(e) => { onClick={() => {
const updateData = { const updateData = { is_pinned: true };
is_pinned: true,
};
updateController updateController
.updatePatch(updateData, record.id) .updatePatch(updateData, record.id)
.then(() => { .then(() => {
@ -311,7 +244,7 @@ const UpdateTable = ({
}); });
}} }}
icon={<PushpinOutlined />} icon={<PushpinOutlined />}
></Button> />
)} )}
</Space> </Space>
)} )}
@ -319,30 +252,38 @@ const UpdateTable = ({
); );
}, },
}, },
]} ];
// Oxirida ustunlar massivini yaratamiz
// Agar is_active false bolgan yozuvlar bor bolsa, archivedColumn qoshiladi
const columns: any = hasInactive
? [...baseColumns, archivedColumn, ...otherColumns]
: [...baseColumns, ...otherColumns];
return (
<div style={{ paddingBottom: 40 }}>
<Table
onRow={(record) => ({
onClick:
record.is_active === false
? undefined
: (event) => Row(record, event),
})}
dataSource={data?.map((u, i) => ({
no: i + 1,
...u,
created: moment(u?.created_at, "YYYY-MM-DD HH:mm:ss").format(
"DD.MM.YYYY HH:mm"
),
action: { ...u },
}))}
columns={columns}
rowClassName={(record, index) => rowClassName={(record, index) =>
index % 2 === 0 ? "odd-row" : "even-row" index % 2 === 0 ? "odd-row" : "even-row"
} }
loading={isLoading} loading={isLoading}
size="small" size="small"
scroll={{ x: "768px" }} scroll={{ x: "768px" }}
// pagination={{
// pageSize: 10,
// size: "default",
// style: {
// margin: 0,
// justifyContent: "end",
// position: "fixed",
// bottom: 0,
// left: 0,
// width: "100%",
// backgroundColor: token.colorBgContainer,
// boxShadow: "0 4px 8px rgba(0, 0, 0, 0.4)",
// padding: "10px 0",
// zIndex: 1000,
// },
// showLessItems: true,
// }}
pagination={false} pagination={false}
bordered bordered
/> />

Loading…
Cancel
Save