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

19-06 deploy

Browse Source
main
tteld 1 year ago
parent d12ed32c04
commit 82b59d8c54
12 changed files with 418 additions and 209 deletions
Show Stats Download Patch File Download Diff File

BIN
build.zip
View File

Binary file not shown.

25
src/API/LayoutApi/tasks.ts
Unescape View File

@ -43,6 +43,9 @@ export type TTaskPostFileParams = {
shift_update_id?: number; shift_update_id?: number;
description?: string; description?: string;
}; };
interface TMessageResponse {
message: string;
}
export const taskController = { export const taskController = {
async read(filterObject: TTasksGetParams) { async read(filterObject: TTasksGetParams) {
@ -76,12 +79,22 @@ export const taskController = {
}, },
async taskPatch(obj: TTasksPutParams, task_id: number | undefined) { async taskPatch(obj: TTasksPutParams, task_id: number | undefined) {
const { data } = await instance try {
.put<TTask>(`task/${task_id}/`, obj) const response = await instance.put<TTask | TMessageResponse>(
.then((u) => { `task/${task_id}/`,
return u; obj
}); );
return data; if (response.status === 202) {
const data = response.data as TMessageResponse;
message.success({ content: data.message });
}
return { data: response?.data as TTask, status: response?.status };
} catch (error: any) {
return {
data: error?.response?.data.data,
status: error?.response.status,
};
}
}, },
async addTaskController(obj: TTasksPostParams) { async addTaskController(obj: TTasksPostParams) {

2
src/API/api.ts
Unescape View File

@ -1,7 +1,7 @@
import axios from "axios"; import axios from "axios";
// const instance = axios.create({ // const instance = axios.create({
// baseURL: "http://10.10.10.12:8080/api/v1/", // baseURL: "http://10.10.10.19:8080/api/v1/",
// }); // });
const instance = axios.create({ const instance = axios.create({
baseURL: "https://api.tteld.co/api/v1/", baseURL: "https://api.tteld.co/api/v1/",

15
src/API/auth/register.ts
Unescape View File

@ -25,21 +25,20 @@ export const RegisterApi = async (value: registerInterface) => {
timezone: data?.data.timezone, timezone: data?.data.timezone,
role: data?.data.role, role: data?.data.role,
}; };
message.success({
content: "Email sent successfully!",
duration: 3,
});
const userJSON = JSON.stringify(userObject); const userJSON = JSON.stringify(userObject);
localStorage.setItem("user", userJSON); localStorage.setItem("user", userJSON);
localStorage.setItem("access_token", data?.data.access_token); localStorage.setItem("access_token", data?.data.access_token);
localStorage.setItem("refresh_token", data?.data.refresh_token); localStorage.setItem("refresh_token", data?.data.refresh_token);
document.location.replace("/"); document.location.replace("/");
return status; return status;
} catch (error:any) { } catch (e) {}
setTimeout(() => {
message.error({ content: ' ', duration: 2 });
}, 1000);
}
}; };
export const validateUsername = async (value: any) => { export const validateUsername = async (value: any) => {
const {status} = await instance.get(`users/check/${value}/`); const { status } = await instance.get(`users/check/${value}/`);
return status return status;
}; };

72
src/App.tsx
Unescape View File

@ -73,7 +73,7 @@ const App: React.FC = () => {
setData(data); setData(data);
}); });
} }
}, [admin_id]); }, []);
useEffect(() => { useEffect(() => {
if (data) { if (data) {
@ -137,8 +137,8 @@ const App: React.FC = () => {
<img alt="" src={requestIcon} /> <img alt="" src={requestIcon} />
), ),
getItem( getItem(
<Link to="call/">Call Requests</Link>, <Link to="calls/">Call Requests</Link>,
"call/", "calls/",
<img alt="" src={callIcon} /> <img alt="" src={callIcon} />
) )
); );
@ -209,8 +209,52 @@ const App: React.FC = () => {
</Menu.Item> </Menu.Item>
</Menu> </Menu>
); );
// const [isOnline, setIsOnline] = useState<boolean>(navigator.onLine);
// const reconnectingMessageKey = "reconnectingMessage";
// const reconnectingMessageContent = "Reconnecting...";
// useEffect(() => {
// let reconnectingTimeout: NodeJS.Timeout | null = null;
// const handleOnlineStatus = () => {
// setIsOnline(true);
// message.success({ content: "Reconnected!" });
// if (isOnline === false) {
// message.destroy(reconnectingMessageKey);
// }
// if (reconnectingTimeout) {
// clearTimeout(reconnectingTimeout);
// }
// };
// const handleOfflineStatus = () => {
// setIsOnline(false);
// if (isOnline !== false) {
// message.loading({
// content: reconnectingMessageContent,
// key: reconnectingMessageKey,
// duration: 0,
// });
// reconnectingTimeout = setTimeout(() => {
// message.destroy(reconnectingMessageKey);
// }, 30 * 60 * 1000); // 30 minutes
// }
// };
// window.addEventListener("online", handleOnlineStatus);
// window.addEventListener("offline", handleOfflineStatus);
// return () => {
// window.removeEventListener("online", handleOnlineStatus);
// window.removeEventListener("offline", handleOfflineStatus);
// if (reconnectingTimeout) {
// clearTimeout(reconnectingTimeout);
// }
// };
// }, [isOnline]);
let taskSocket: WebSocket; let taskSocket: WebSocket;
const [isLive, setIslive] = useState(true); const [isLive, setIslive] = useState(false);
const [socketData, setSocketData] = useState<any>(); const [socketData, setSocketData] = useState<any>();
const connect = async () => { const connect = async () => {
try { try {
@ -219,7 +263,7 @@ const App: React.FC = () => {
admin_id admin_id
) { ) {
// taskSocket = new WebSocket( // taskSocket = new WebSocket(
// `ws://10.10.10.12:8080/global/?user_id=${admin_id}` // `ws://10.10.10.19:8080/global/?user_id=${admin_id}`
// ); // );
taskSocket = new WebSocket( taskSocket = new WebSocket(
`wss://api.tteld.co/global/?user_id=${admin_id}` `wss://api.tteld.co/global/?user_id=${admin_id}`
@ -236,6 +280,7 @@ const App: React.FC = () => {
console.error("WebSocket error:", errorEvent); console.error("WebSocket error:", errorEvent);
}); });
taskSocket.addEventListener("close", (event) => { taskSocket.addEventListener("close", (event) => {
console.log("WebSocket: clocse");
setIslive(false); setIslive(false);
}); });
} }
@ -245,6 +290,15 @@ const App: React.FC = () => {
useEffect(() => { useEffect(() => {
connect(); connect();
}, []); }, []);
// function checkConnection() {
// if (!isLive) {
// connect();
// }
// }
// setInterval(checkConnection, 5000);
const [api, contextHolder] = notification.useNotification(); const [api, contextHolder] = notification.useNotification();
const openNotification = useCallback( const openNotification = useCallback(
(placement: NotificationPlacement, data: TCall) => { (placement: NotificationPlacement, data: TCall) => {
@ -436,7 +490,13 @@ const App: React.FC = () => {
<Route <Route
key={"task"} key={"task"}
path="/" path="/"
element={<Task socketData={socketData} />} element={
<Task
socketData={socketData}
connect={connect}
isLive={isLive}
/>
}
/> />
{mainItems && {mainItems &&
mainItems.map((u) => ( mainItems.map((u) => (

318
src/Auth/Register.tsx
Unescape View File

@ -38,12 +38,10 @@ const Register: React.FC = () => {
} }
}); });
} else if (status === 200) { } else if (status === 200) {
setTimeout(() => { message.error({
message.error({ content: "This username already exists!",
content: "This username already exists!", duration: 2,
duration: 2, });
});
}, 1000);
} }
}); });
}; };
@ -72,55 +70,55 @@ const Register: React.FC = () => {
> >
<h1>Sign up</h1> <h1>Sign up</h1>
{/* { && ( */} {/* { && ( */}
<Card <Card
bodyStyle={{ background: "rgb(250, 250, 250)" }} bodyStyle={{ background: "rgb(250, 250, 250)" }}
title={emailDom} title={emailDom}
className="login-form-card " className="login-form-card "
style={{ width: 600, textAlign: "left" }} style={{ width: 600, textAlign: "left" }}
>
<Space
direction="vertical"
size="middle"
style={{ display: "flex", gap: "20px", margin: "auto" }}
> >
<Space <Row gutter={24}>
direction="vertical" <Col span={12}>
size="middle" <Form.Item
style={{ display: "flex", gap: "20px", margin: "auto" }} name="first_name"
> rules={[
<Row gutter={24}> {
<Col span={12}> required: true,
<Form.Item message: "Please input your first name!",
name="first_name" whitespace: true,
rules={[ },
{ ]}
required: true, >
message: "Please input your first name!", <Input
whitespace: true, // prefix={<UserOutlined className="site-form-item-icon" />}
}, placeholder="First name"
]} />
> </Form.Item>
<Input </Col>
// prefix={<UserOutlined className="site-form-item-icon" />} <Col span={12}>
placeholder="First name" <Form.Item
/> name="last_name"
</Form.Item> rules={[
</Col> {
<Col span={12}> required: true,
<Form.Item message: "Please input your last name!",
name="last_name" whitespace: true,
rules={[ },
{ ]}
required: true, >
message: "Please input your last name!", <Input
whitespace: true, // prefix={<UserOutlined className="site-form-item-icon" />}
}, placeholder="Last name"
]} />
> </Form.Item>
<Input </Col>
// prefix={<UserOutlined className="site-form-item-icon" />} </Row>
placeholder="Last name"
/>
</Form.Item>
</Col>
</Row>
<Form.Item <Form.Item
name="email" name="email"
rules={[ rules={[
{ {
@ -149,119 +147,119 @@ const Register: React.FC = () => {
)} )}
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="username" name="username"
tooltip="What do you want others to call you?" tooltip="What do you want others to call you?"
rules={[ rules={[
{ {
required: true, required: true,
message: "Please input your username!", message: "Please input your username!",
whitespace: true, whitespace: true,
}, },
]} ]}
> >
<Input <Input
prefix={<UserOutlined className="site-form-item-icon" />} prefix={<UserOutlined className="site-form-item-icon" />}
placeholder="Username" placeholder="Username"
/> />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="password" name="password"
rules={[ rules={[
{ {
required: true, required: true,
message: "Please input your password!", message: "Please input your password!",
},
{
min: 8,
message:
"Your password must contain at least 8 characters.",
},
() => ({
validator(_, value) {
if (!value || /[^0-9]+/.test(value)) {
return Promise.resolve();
}
return Promise.reject(
new Error("Your password can’t be entirely numeric.")
);
}, },
{ }),
min: 8, () => ({
message: validator(_, value) {
"Your password must contain at least 8 characters.", // Список общеупотребимых паролей (пример)
const commonPasswords = common;
if (!value || !commonPasswords.includes(value)) {
return Promise.resolve();
}
return Promise.reject(
new Error(
"Your password can’t be a commonly used password."
)
);
}, },
() => ({ }),
validator(_, value) { ({ getFieldValue }) => ({
if (!value || /[^0-9]+/.test(value)) { validator(_, value) {
return Promise.resolve(); const personalInfo = getFieldValue("username");
} if (!value || !value.includes(personalInfo)) {
return Promise.reject( return Promise.resolve();
new Error("Your password can’t be entirely numeric.") }
); return Promise.reject(
}, new Error(
}), "Your password can’t be too similar to your other personal information."
() => ({ )
validator(_, value) { );
// Список общеупотребимых паролей (пример) },
const commonPasswords = common; }),
if (!value || !commonPasswords.includes(value)) { ]}
return Promise.resolve(); hasFeedback
} >
return Promise.reject( <Input.Password
new Error( prefix={<LockOutlined className="site-form-item-icon" />}
"Your password can’t be a commonly used password." type="password"
) placeholder="Password"
); />
}, </Form.Item>
}),
({ getFieldValue }) => ({
validator(_, value) {
const personalInfo = getFieldValue("username");
if (!value || !value.includes(personalInfo)) {
return Promise.resolve();
}
return Promise.reject(
new Error(
"Your password can’t be too similar to your other personal information."
)
);
},
}),
]}
hasFeedback
>
<Input.Password
prefix={<LockOutlined className="site-form-item-icon" />}
type="password"
placeholder="Password"
/>
</Form.Item>
<Form.Item <Form.Item
name="password_confirm" name="password_confirm"
dependencies={["password"]} dependencies={["password"]}
hasFeedback hasFeedback
rules={[ rules={[
{ {
required: true, required: true,
message: "Please confirm your password!", message: "Please confirm your password!",
},
({ getFieldValue }) => ({
validator(_, value) {
if (!value || getFieldValue("password") === value) {
return Promise.resolve();
}
return Promise.reject(
new Error(
"The new password that you entered do not match!"
)
);
}, },
({ getFieldValue }) => ({ }),
validator(_, value) { ]}
if (!value || getFieldValue("password") === value) { >
return Promise.resolve(); <Input.Password
} prefix={<LockOutlined className="site-form-item-icon" />}
return Promise.reject( type="password"
new Error( placeholder="Re-enter Password"
"The new password that you entered do not match!" />
) </Form.Item>
);
},
}),
]}
>
<Input.Password
prefix={<LockOutlined className="site-form-item-icon" />}
type="password"
placeholder="Re-enter Password"
/>
</Form.Item>
<Form.Item> <Form.Item>
<Button type="primary" htmlType="submit" loading={loading}> <Button type="primary" htmlType="submit" loading={loading}>
Confirm Confirm
</Button> </Button>
</Form.Item> </Form.Item>
</Space> </Space>
</Card> </Card>
{/* )} */} {/* )} */}
</Space> </Space>
</Form> </Form>

69
src/Components/Customers/CustomersEdit.tsx
Unescape View File

@ -11,6 +11,7 @@ import {
Col, Col,
Input, Input,
Button, Button,
Select,
} from "antd"; } from "antd";
import { customerController } from "../../API/LayoutApi/customers"; import { customerController } from "../../API/LayoutApi/customers";
import Notfound from "../../Utils/Notfound"; import Notfound from "../../Utils/Notfound";
@ -20,6 +21,17 @@ import { useState } from "react";
import infoIcon from "../../assets/infoIcon.png"; import infoIcon from "../../assets/infoIcon.png";
// @ts-ignore // @ts-ignore
import infoIconActive from "../../assets/infoIconActive.png"; import infoIconActive from "../../assets/infoIconActive.png";
// @ts-ignore
import zippy from "../../assets/zippyicon.svg";
// @ts-ignore
import evo from "../../assets/evoicon.png";
// @ts-ignore
import zeelog from "../../assets/zeelogicon.svg";
// @ts-ignore
import ontime from "../../assets/ontimeicon.svg";
// @ts-ignore
import tt from "../../assets/tticon.svg";
import { useCompanyData } from "../../Hooks/Companies";
const TabPane = Tabs.TabPane; const TabPane = Tabs.TabPane;
@ -29,11 +41,12 @@ type params = {
const CustomerEdit = () => { const CustomerEdit = () => {
const { id } = useParams<params>(); const { id } = useParams<params>();
const { data, refetch, status } = useCustomerOne(id); const { data, status } = useCustomerOne(id);
let navigate = useNavigate(); let navigate = useNavigate();
const onSubmit = async (value: any) => { const onSubmit = async (value: any) => {
value.company_id = companyVal;
await customerController.customerPatch(value, id); await customerController.customerPatch(value, id);
navigate(-1); window.location.replace("/#/customers/");
}; };
const ClickDelete = () => { const ClickDelete = () => {
@ -46,6 +59,28 @@ const CustomerEdit = () => {
} }
}; };
const [activeTab, setActiveTab] = useState("1"); const [activeTab, setActiveTab] = useState("1");
const getImageSource = (source: string) => {
switch (source) {
case "Zippy":
return zippy;
case "EVO":
return evo;
case "Ontime":
return ontime;
case "Zeelog":
return zeelog;
case "TT":
return tt;
default:
return tt;
}
};
const [companyName, setCompanyName] = useState<string>("");
const [companyVal, setCompanyVal] = useState<any>();
const { data: companyData } = useCompanyData({ name: companyName });
return ( return (
<div> <div>
<Spin size="large" spinning={!data}> <Spin size="large" spinning={!data}>
@ -96,9 +131,35 @@ const CustomerEdit = () => {
wrapperCol={{ span: "100%" }} wrapperCol={{ span: "100%" }}
label="Company" label="Company"
> >
<Input <Select
defaultValue={data?.company?.name} defaultValue={data?.company?.name}
readOnly onSearch={(value: any) => setCompanyName(value)}
onChange={(e: any) => {
setCompanyVal(e);
}}
options={companyData?.map((item) => ({
label: (
<div>
{item?.source && (
<img
style={{
width: 15,
height: 20,
paddingTop: 7,
}}
src={getImageSource(item?.source)}
alt=""
/>
)}{" "}
{item?.name}
</div>
),
value: item?.id,
}))}
filterOption={false}
autoClearSearchValue={false}
allowClear
// value={companyName}
/> />
</Form.Item> </Form.Item>
</Col> </Col>

45
src/Components/Tasks/ErrorUncompletedTasksModal.tsx
Unescape View File

@ -0,0 +1,45 @@
import { TTask } from "../../types/Tasks/TTasks";
import { Modal } from "antd";
import TaskTable from "./TaskTable";
const ErrorUncompletedTasksModal = ({
errorModal,
setErrorModal,
uncomletedData,
}: {
uncomletedData: TTask[] | undefined;
errorModal: boolean;
setErrorModal: any;
}) => {
const handleCancel = () => {
setErrorModal(!errorModal);
};
return (
<Modal
onCancel={handleCancel}
footer={null}
open={errorModal}
width={1400}
maskClosable={true}
>
<div className="uncomleted-tasks-modal">
<p
className="p-driver"
style={{ textAlign: "center", marginBottom: 10, color: "red" }}
>
You have unfinished tasks. You cannot assign another one until they
are completed.
</p>
<TaskTable
data={{ characters: uncomletedData }}
showTaskModal={false}
showErrorModal={false}
isLoading={false}
setErrorModal={setErrorModal}
/>
</div>
</Modal>
);
};
export default ErrorUncompletedTasksModal;

8
src/Components/Tasks/TaskModal.tsx
Unescape View File

@ -16,7 +16,7 @@ import { useEffect, useState } from "react";
import { taskController } from "../../API/LayoutApi/tasks"; import { taskController } from "../../API/LayoutApi/tasks";
import { useTeamData } from "../../Hooks/Teams"; import { useTeamData } from "../../Hooks/Teams";
import { TTeam } from "../../types/Team/TTeam"; import { TTeam } from "../../types/Team/TTeam";
import { EditOutlined, CaretRightOutlined } from "@ant-design/icons"; import { EditOutlined } from "@ant-design/icons";
import { TSocket } from "../../types/common/TSocket"; import { TSocket } from "../../types/common/TSocket";
// @ts-ignore // @ts-ignore
import closeIcon from "../../assets/closeIcon.png"; import closeIcon from "../../assets/closeIcon.png";
@ -201,9 +201,9 @@ const TaskModal = ({
setModalOpen(!modalOpen); setModalOpen(!modalOpen);
}; };
const nextStatus = (status : string) => { // const nextStatus = (status : string) => {
console.log(); // console.log();
} // }
useEffect(() => { useEffect(() => {
if (socketData && socketData.task) { if (socketData && socketData.task) {

26
src/Components/Tasks/TaskTable.tsx
Unescape View File

@ -25,12 +25,16 @@ const TaskTable = ({
data, data,
isLoading, isLoading,
showTaskModal, showTaskModal,
showErrorModal,
setErrorModal,
}: { }: {
data: { data: {
characters: TTask[] | undefined; characters: TTask[] | undefined;
}; };
showTaskModal: any; showTaskModal: any;
showErrorModal: any;
isLoading: boolean; isLoading: boolean;
setErrorModal: React.Dispatch<React.SetStateAction<boolean>>;
}) => { }) => {
const moment = require("moment"); const moment = require("moment");
const statusClick = (record: any) => { const statusClick = (record: any) => {
@ -42,7 +46,13 @@ const TaskTable = ({
const value = { const value = {
status: "Checking", status: "Checking",
}; };
taskController.taskPatch(value, record.id); taskController
.taskPatch(value, record?.id)
.then((response: { data: TTask; status: number }) => {
if (response?.status == 403) {
showErrorModal(response);
}
});
}, },
}); });
} }
@ -54,7 +64,9 @@ const TaskTable = ({
const value = { const value = {
status: "Done", status: "Done",
}; };
taskController.taskPatch(value, record.id); taskController.taskPatch(value, record.id).then(() => {
setErrorModal(false);
});
}, },
}); });
} }
@ -138,7 +150,7 @@ const TaskTable = ({
justifyContent: "space-around", justifyContent: "space-around",
}} }}
> >
{record.via_telegram && ( {record?.via_telegram && (
<Tooltip placement="topLeft" title={"Created via Telegram"}> <Tooltip placement="topLeft" title={"Created via Telegram"}>
<img src={tgIcon} alt="" style={{ width: 20, height: 20 }} /> <img src={tgIcon} alt="" style={{ width: 20, height: 20 }} />
</Tooltip> </Tooltip>
@ -162,7 +174,7 @@ const TaskTable = ({
width: isMobile ? "1%" : "5%", width: isMobile ? "1%" : "5%",
fixed: isMobile ? "left" : false, fixed: isMobile ? "left" : false,
key: "2", key: "2",
render: (text: any, record: TTask) => ( render: (text?: any, record?: TTask) => (
<div <div
style={{ style={{
display: "flex", display: "flex",
@ -220,9 +232,9 @@ const TaskTable = ({
ellipsis: { ellipsis: {
showTitle: false, showTitle: false,
}, },
render: (item: { title: string; id: number }, record: TTask) => ( render: (item?: { title?: string; id: number }, record?: TTask) => (
<Tooltip placement="topLeft" title={item?.title}> <Tooltip placement="topLeft" title={item?.title}>
{item.title} {item?.title}
</Tooltip> </Tooltip>
), ),
}, },
@ -234,7 +246,7 @@ const TaskTable = ({
ellipsis: { ellipsis: {
showTitle: false, showTitle: false,
}, },
render: (status: string) => ( render: (status?: string) => (
<span> <span>
{status === "Done" && <p className="status-done">Done</p>} {status === "Done" && <p className="status-done">Done</p>}
{status === "Checking" && ( {status === "Checking" && (

36
src/Components/Tasks/Tasks.tsx
Unescape View File

@ -16,9 +16,18 @@ import IconSearch from "../../assets/searchIcon.png";
import TaskModal from "./TaskModal"; import TaskModal from "./TaskModal";
import TaskUploadModal from "./TaskUploadModal"; import TaskUploadModal from "./TaskUploadModal";
import { TSocket } from "../../types/common/TSocket"; import { TSocket } from "../../types/common/TSocket";
import ErrorUncompletedTasksModal from "./ErrorUncompletedTasksModal";
const { Option } = Select; const { Option } = Select;
const Task = ({ socketData }: { socketData: TSocket | undefined }) => { const Task = ({
socketData,
connect,
isLive,
}: {
socketData: TSocket | undefined;
connect: () => Promise<void>;
isLive: boolean;
}) => {
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const [modalOpen, setModalOpen] = useState(false); const [modalOpen, setModalOpen] = useState(false);
const [characters, setCharacters] = useState<TTask[] | undefined>(); const [characters, setCharacters] = useState<TTask[] | undefined>();
@ -27,6 +36,8 @@ const Task = ({ socketData }: { socketData: TSocket | undefined }) => {
const [status, setStatus] = useState<any>(); const [status, setStatus] = useState<any>();
const [page, setPage] = useState(1); const [page, setPage] = useState(1);
const [uploadOpen, setUploadOpen] = useState(false); const [uploadOpen, setUploadOpen] = useState(false);
const [errorModal, setErrorModal] = useState(false);
const [uncomletedData, setUncomletedData] = useState<TTask[]>();
useEffect(() => { useEffect(() => {
if ( if (
@ -34,8 +45,8 @@ const Task = ({ socketData }: { socketData: TSocket | undefined }) => {
socketData.task && socketData.task &&
((role !== "Checker" && ((role !== "Checker" &&
(!team || team.includes(socketData?.task?.assigned_to?.id))) || (!team || team.includes(socketData?.task?.assigned_to?.id))) ||
role === "Checker") && role === "Checker")
(!status || status.includes(socketData?.task?.status)) // &&(!status || status.includes(socketData?.task?.status))
) { ) {
setCharacters((prev: any) => { setCharacters((prev: any) => {
if (prev && prev?.length >= 15) { if (prev && prev?.length >= 15) {
@ -139,6 +150,11 @@ const Task = ({ socketData }: { socketData: TSocket | undefined }) => {
setRecordTask(e); setRecordTask(e);
setModalOpen(true); setModalOpen(true);
}; };
const showErrorModal = (e: { data: TTask[]; status: number }) => {
setUncomletedData(e?.data);
setErrorModal(true);
};
const Next = () => { const Next = () => {
const a = Number(page) + 1; const a = Number(page) + 1;
@ -164,6 +180,7 @@ const Task = ({ socketData }: { socketData: TSocket | undefined }) => {
}, 1000); }, 1000);
}; };
const theme = localStorage.getItem("theme") === "true" ? true : false; const theme = localStorage.getItem("theme") === "true" ? true : false;
return ( return (
<div> <div>
{open && <AddTask open={open} setOpen={setOpen} />} {open && <AddTask open={open} setOpen={setOpen} />}
@ -185,6 +202,13 @@ const Task = ({ socketData }: { socketData: TSocket | undefined }) => {
setModalOpen={setModalOpen} setModalOpen={setModalOpen}
/> />
)} )}
{errorModal && (
<ErrorUncompletedTasksModal
errorModal={errorModal}
setErrorModal={setErrorModal}
uncomletedData={uncomletedData}
/>
)}
<div className="header d-flex"> <div className="header d-flex">
<div className="header-title d-flex"> <div className="header-title d-flex">
<p className="title">Tasks</p> <p className="title">Tasks</p>
@ -204,7 +228,9 @@ const Task = ({ socketData }: { socketData: TSocket | undefined }) => {
className={`btn-refresh-${theme && "dark"} d-flex`} className={`btn-refresh-${theme && "dark"} d-flex`}
onClick={() => { onClick={() => {
refetch(); refetch();
// connect(); if (!isLive) {
connect();
}
}} }}
> >
<img <img
@ -255,6 +281,8 @@ const Task = ({ socketData }: { socketData: TSocket | undefined }) => {
data={{ characters }} data={{ characters }}
isLoading={isLoading} isLoading={isLoading}
showTaskModal={showTaskModal} showTaskModal={showTaskModal}
showErrorModal={showErrorModal}
setErrorModal={setErrorModal}
/> />
<Space style={{ width: "100%", marginTop: 10 }} direction="vertical"> <Space style={{ width: "100%", marginTop: 10 }} direction="vertical">
<Space style={{ width: "100%", justifyContent: "flex-end" }} wrap> <Space style={{ width: "100%", justifyContent: "flex-end" }} wrap>

7
src/types/Tasks/TTasks.ts
Unescape View File

@ -1,12 +1,5 @@
import { TUser } from "../User/TUser"; import { TUser } from "../User/TUser";
type data = {
id: number;
name?: string;
title?: string;
username?: string;
};
export type TTask = { export type TTask = {
id: number; id: number;
note: string; note: string;

Write Preview
Loading…
Cancel
Save