Abdujamol
/
taskboard
mirror of https://github.com/etoyowimura/taskboard.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update page added status Archived

Browse Source
dilmurod
Dilmurod 1 week ago
parent cfad4ed633
commit 9fe44a9cdc
3 changed files with 218 additions and 255 deletions
Show Stats Download Patch File Download Diff File

1
src/Components/Updates/Update.tsx
Unescape View File

@ -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

41
src/Components/Updates/UpdateEdit.tsx
Unescape View File

@ -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

431
src/Components/Updates/UpdateTable.tsx
Unescape View File

@ -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,263 +83,207 @@ const UpdateTable = ({
const { token } = theme.useToken(); const { token } = theme.useToken();
// Asosiy ustunlar
const baseColumns = [
{
title: <img src={tagIcon} alt="" />,
dataIndex: "no",
width: "4%",
align: "center",
},
{
title: "Company",
dataIndex: "company",
ellipsis: { showTitle: false },
width: "10%",
render: (text: any) => (
<Tooltip placement="topLeft" title={text?.name}>
<div style={{ display: "flex", alignItems: "center" }}>
{text?.source && (
<img
src={getImageSource(text?.source)}
alt=""
style={{ width: 20, height: 20, marginRight: 10 }}
/>
)}
{text?.name}
</div>
</Tooltip>
),
},
{
title: "Driver",
dataIndex: "customer",
ellipsis: { showTitle: false },
width: "10%",
render: (item: { name: string }) => (
<Tooltip placement="topLeft" title={item?.name}>
{item?.name}
</Tooltip>
),
},
{
title: "Created by",
dataIndex: "provider",
ellipsis: { showTitle: false },
responsive: ["xl"],
width: "10%",
render: (provider: { username: string }) => (
<Tooltip placement="topLeft" title={provider?.username}>
{provider?.username}
</Tooltip>
),
},
{
title: "Completed by",
dataIndex: "executor",
ellipsis: { showTitle: false },
responsive: ["lg"],
width: "10%",
render: (executor: { username: string }) => (
<Tooltip placement="topLeft" title={executor?.username}>
{executor?.username}
</Tooltip>
),
},
];
const archivedColumn = {
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",
ellipsis: { showTitle: false },
width: "10%",
render: (status: string) => (
<span>
{status === "Done" && <p className="status-done">Done</p>}
{status === "In Progress" && (
<p className="status-in-progress">In Progress</p>
)}
{status === "New" && <p className="status-new">New</p>}
{status === "Setup" && <p className="status-new">Setup</p>}
{status === "Paper" && <p className="status-new">Paper</p>}
</span>
),
},
{
title: "Note",
dataIndex: "note",
width: "10%",
ellipsis: { showTitle: false },
render: (note: string) => (
<Tooltip placement="topLeft" title={note}>
{note}
</Tooltip>
),
},
{
title: "Solution",
dataIndex: "solution",
width: "10%",
responsive: ["lg"],
ellipsis: { showTitle: false },
render: (note: string) => (
<Tooltip placement="topLeft" title={note}>
{note}
</Tooltip>
),
},
{
title: "Created at",
dataIndex: "created",
ellipsis: { showTitle: false },
responsive: ["xxl"],
width: "10%",
render: (note: string) => (
<Tooltip placement="topLeft" title={note}>
{note}
</Tooltip>
),
},
{
title: "Actions",
dataIndex: "action",
width: "6%",
align: "center",
render: (record: TUpdate) => {
return (
<div className="notedit">
{record.status !== "Done" && (
<Space>
{record.is_pinned ? (
<Button
style={{ background: "#f99e2c", color: "#fff" }}
onClick={() => {
const updateData = { is_pinned: false };
updateController
.updatePatch(updateData, record.id)
.then(() => {
refetch();
});
}}
icon={<PushpinOutlined />}
/>
) : (
<Button
onClick={() => {
const updateData = { is_pinned: true };
updateController
.updatePatch(updateData, record.id)
.then(() => {
refetch();
});
}}
icon={<PushpinOutlined />}
/>
)}
</Space>
)}
</div>
);
},
},
];
// Oxirida ustunlar massivini yaratamiz
// Agar is_active false bo‘lgan yozuvlar bor bo‘lsa, archivedColumn qo‘shiladi
const columns: any = hasInactive
? [...baseColumns, archivedColumn, ...otherColumns]
: [...baseColumns, ...otherColumns];
return ( return (
<div style={{ paddingBottom: 40 }}> <div style={{ paddingBottom: 40 }}>
<Table <Table
onRow={(record) => ({ onRow={(record) => ({
onClick: (event) => Row(record, event), onClick:
record.is_active === false
? undefined
: (event) => Row(record, event),
})} })}
dataSource={data?.map((u, i) => ({ dataSource={data?.map((u, i) => ({
no: i + 1, no: i + 1,
...u, ...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( created: moment(u?.created_at, "YYYY-MM-DD HH:mm:ss").format(
"DD.MM.YYYY HH:mm" "DD.MM.YYYY HH:mm"
), ),
action: { ...u }, action: { ...u },
}))} }))}
columns={[ columns={columns}
{
title: <img src={tagIcon} alt="" />,
dataIndex: "no",
width: "4%",
align: "center",
},
{
title: "Company",
dataIndex: "company",
ellipsis: {
showTitle: false,
},
width: "10%",
render: (text: any, record: any) => (
<Tooltip placement="topLeft" title={text?.name}>
<div style={{ display: "flex", alignItems: "center" }}>
{text?.source && (
<img
src={getImageSource(text?.source)}
alt=""
style={{ width: 20, height: 20, marginRight: 10 }}
/>
)}
{text?.name}
</div>
</Tooltip>
),
},
{
title: "Driver",
dataIndex: "customer",
ellipsis: {
showTitle: false,
},
width: "10%",
render: (item: { name: string }) => (
<Tooltip placement="topLeft" title={item?.name}>
{item?.name}
</Tooltip>
),
},
{
title: "Created by",
dataIndex: "provider",
ellipsis: {
showTitle: false,
},
responsive: ["xl"],
width: "10%",
render: (provider: { username: string }) => (
<Tooltip placement="topLeft" title={provider?.username}>
{provider?.username}
</Tooltip>
),
},
{
title: "Completed by",
dataIndex: "executor",
ellipsis: {
showTitle: false,
},
responsive: ["lg"],
width: "10%",
render: (executor: { username: string }) => (
<Tooltip placement="topLeft" title={executor?.username}>
{executor?.username}
</Tooltip>
),
},
{
title: "Status",
dataIndex: "status",
ellipsis: {
showTitle: false,
},
width: "10%",
render: (status: string) => (
<span>
{status === "Done" && <p className="status-done">Done</p>}
{status === "In Progress" && (
<p className="status-in-progress">In Progress</p>
)}
{status === "New" && <p className="status-new">New</p>}
{status === "Setup" && <p className="status-new">Setup</p>}
{status === "Paper" && <p className="status-new">Paper</p>}
</span>
),
},
{
title: "Note",
dataIndex: "note",
width: "10%",
ellipsis: {
showTitle: false,
},
render: (note: string) => (
<Tooltip placement="topLeft" title={note}>
{note}
</Tooltip>
),
},
{
title: "Solution",
dataIndex: "solution",
width: "10%",
responsive: ["lg"],
ellipsis: {
showTitle: false,
},
render: (note: string) => (
<Tooltip placement="topLeft" title={note}>
{note}
</Tooltip>
),
},
{
title: "Created at",
dataIndex: "created",
ellipsis: {
showTitle: false,
},
responsive: ["xxl"],
width: "10%",
render: (note: string) => (
<Tooltip placement="topLeft" title={note}>
{note}
</Tooltip>
),
},
{
title: "Actions",
dataIndex: "action",
width: "6%",
align: "center",
render: (record: TUpdate) => {
return (
<div className="notedit">
{record.status !== "Done" && (
<Space>
{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
style={{ background: "#f99e2c", color: "#fff" }}
onClick={(e) => {
const updateData = {
is_pinned: false,
};
updateController
.updatePatch(updateData, record.id)
.then(() => {
refetch();
});
}}
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
onClick={(e) => {
const updateData = {
is_pinned: true,
};
updateController
.updatePatch(updateData, record.id)
.then(() => {
refetch();
});
}}
icon={<PushpinOutlined />}
></Button>
)}
</Space>
)}
</div>
);
},
},
]}
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
/> />

Write Preview
Loading…
Cancel
Save