Shift and Cycle & Co-Driver modal Info (bug fixes)

dilmurod
Dilmurod 2 weeks ago
parent e782c49e4b
commit 428d4a7137

@ -1,23 +1,19 @@
import { Modal, Form, Input, DatePicker, Switch } from "antd";
import { useState } from "react";
import dayjs from "dayjs";
import { TTask } from "../../types/Tasks/TTasks";
import { TTask } from "../../../types/Tasks/TTasks";
interface ShiftAndCoDriverModalProps {
interface ShiftAndCoDriverCreateModalProps {
open: boolean;
onOk: (values: any) => void;
onCancel: () => void;
recordTask?: TTask;
recordTask?: TTask | any;
}
const ShiftAndCoDriverModal: React.FC<ShiftAndCoDriverModalProps> = ({
open,
onOk,
onCancel,
recordTask,
}) => {
const ShiftAndCoDriverCreateModal: React.FC<
ShiftAndCoDriverCreateModalProps
> = ({ open, onOk, onCancel, recordTask }) => {
const [form] = Form.useForm();
const [needsCycle, setNeedsCycle] = useState(false);
const [needsDriver, setNeedsDriver] = useState(false);
const [needsPickUp, setNeedsPickUp] = useState(false);
@ -62,8 +58,8 @@ const ShiftAndCoDriverModal: React.FC<ShiftAndCoDriverModalProps> = ({
>
<DatePicker
style={{ width: "100%" }}
format="DD MMM YYYY HH:mm:ss"
showTime={{ format: "HH:mm:ss" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
@ -75,6 +71,28 @@ const ShiftAndCoDriverModal: React.FC<ShiftAndCoDriverModalProps> = ({
<Input placeholder="Enter location" />
</Form.Item>
{/* Cycle info */}
<Form.Item
label="Cycle Date"
name="cycle_date"
rules={[{ required: true, message: "Please select date" }]}
>
<DatePicker
style={{ width: "100%" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
<Form.Item
label="Cycle Location"
name="cycle_location"
rules={[{ required: true, message: "Please enter location" }]}
>
<Input placeholder="Enter location" />
</Form.Item>
{/* Pick Up */}
<Form.Item label="Pick Up Info">
@ -98,8 +116,8 @@ const ShiftAndCoDriverModal: React.FC<ShiftAndCoDriverModalProps> = ({
>
<DatePicker
style={{ width: "100%" }}
format="DD MMM YYYY HH:mm:ss"
showTime={{ format: "HH:mm:ss" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
@ -113,44 +131,6 @@ const ShiftAndCoDriverModal: React.FC<ShiftAndCoDriverModalProps> = ({
</>
)}
{/* Cycle info */}
<Form.Item label="Cycle Info">
<Switch
checked={needsCycle}
onChange={(checked) => {
setNeedsCycle(checked);
if (!checked) {
form.resetFields(["cycle_date", "cycle_location"]);
}
}}
/>
</Form.Item>
{needsCycle && (
<>
<Form.Item
label="Cycle Date"
name="cycle_date"
rules={[{ required: true, message: "Please select date" }]}
>
<DatePicker
style={{ width: "100%" }}
format="DD MMM YYYY HH:mm:ss"
showTime={{ format: "HH:mm:ss" }}
/>
</Form.Item>
<Form.Item
label="Cycle Location"
name="cycle_location"
rules={[{ required: true, message: "Please enter location" }]}
>
<Input placeholder="Enter location" />
</Form.Item>
</>
)}
{/* DRIVER INFO */}
<Form.Item label="CO-Driver Info">
@ -189,8 +169,8 @@ const ShiftAndCoDriverModal: React.FC<ShiftAndCoDriverModalProps> = ({
>
<DatePicker
style={{ width: "100%" }}
format="DD MMM YYYY HH:mm:ss"
showTime={{ format: "HH:mm:ss" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
@ -211,8 +191,8 @@ const ShiftAndCoDriverModal: React.FC<ShiftAndCoDriverModalProps> = ({
>
<DatePicker
style={{ width: "100%" }}
format="DD MMM YYYY HH:mm:ss"
showTime={{ format: "HH:mm:ss" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
<Form.Item
@ -229,4 +209,4 @@ const ShiftAndCoDriverModal: React.FC<ShiftAndCoDriverModalProps> = ({
);
};
export default ShiftAndCoDriverModal;
export default ShiftAndCoDriverCreateModal;

@ -0,0 +1,168 @@
import React, { useEffect } from "react";
import { Modal, Form, Input, DatePicker } from "antd";
import dayjs from "dayjs";
import { taskController } from "../../../API/LayoutApi/tasks";
interface ShiftAndCoDriverEditModalProps {
open: boolean;
onCancel: () => void;
recordTask?: any;
}
const ShiftAndCoDriverEditModal: React.FC<ShiftAndCoDriverEditModalProps> = ({
open,
onCancel,
recordTask,
}) => {
const [form] = Form.useForm();
useEffect(() => {
if (recordTask) {
form.setFieldsValue({
shift_date: recordTask.shift_date ? dayjs(recordTask.shift_date) : null,
shift_location: recordTask.shift_location,
cycle_date: recordTask.cycle_date ? dayjs(recordTask.cycle_date) : null,
cycle_location: recordTask.cycle_location,
pickup_date: recordTask.pickup_date
? dayjs(recordTask.pickup_date)
: null,
pickup_location: recordTask.pickup_location,
driver_name: recordTask.driver_name,
co_driver_name: recordTask.co_driver_name,
co_driver_pickup_location: recordTask.co_driver_pickup_location,
co_driver_pickup_date: recordTask.co_driver_pickup_date
? dayjs(recordTask.co_driver_pickup_date)
: null,
co_driver_drop_date: recordTask.co_driver_drop_date
? dayjs(recordTask.co_driver_drop_date)
: null,
co_driver_drop_location: recordTask.co_driver_drop_location,
});
}
}, [recordTask, form]);
const handleOk = async () => {
try {
const values = await form.validateFields();
// Date fieldlarni string formatga o'tkazib yuboramiz
const formattedValues = {
...values,
shift_date: values.shift_date ? values.shift_date.toISOString() : null,
pickup_date: values.pickup_date
? values.pickup_date.toISOString()
: null,
cycle_date: values.cycle_date ? values.cycle_date.toISOString() : null,
co_driver_pickup_date: values.co_driver_pickup_date
? values.co_driver_pickup_date.toISOString()
: null,
co_driver_drop_date: values.co_driver_drop_date
? values.co_driver_drop_date.toISOString()
: null,
};
taskController.taskPatch(formattedValues, recordTask.id);
onCancel();
form.resetFields();
} catch (error) {
console.log("Validation Failed:", error);
}
};
return (
<Modal
open={open}
title="Edit Shift & Co-Driver Data"
okText="Save"
cancelText="Cancel"
onCancel={onCancel}
onOk={handleOk}
destroyOnClose
>
<Form form={form} layout="vertical">
{/* shift */}
<Form.Item label="Shift Date" name="shift_date">
<DatePicker
style={{ width: "100%" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
<Form.Item label="Shift Location" name="shift_location">
<Input placeholder="Enter location" />
</Form.Item>
{/* cycle */}
<Form.Item label="Cycle Date" name="cycle_date">
<DatePicker
style={{ width: "100%" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
<Form.Item label="Cycle Location" name="cycle_location">
<Input placeholder="Enter location" />
</Form.Item>
{/* pick up */}
<Form.Item label="Pick Up Date" name="pickup_date">
<DatePicker
style={{ width: "100%" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
<Form.Item label="Pick Up Location" name="cycle_location">
<Input placeholder="Enter location" />
</Form.Item>
{/* co driver */}
<Form.Item label="Driver Name" name="driver_name">
<Input placeholder="Driver name" />
</Form.Item>
<Form.Item label="Co-Driver Name" name="co_driver_name">
<Input placeholder="Co-driver name" />
</Form.Item>
<Form.Item label="Co-Driver Pick Up Date" name="co_driver_pickup_date">
<DatePicker
style={{ width: "100%" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
<Form.Item
label="Co-Driver Pick Up Location"
name="co_driver_pickup_location"
>
<Input placeholder="Enter pickup location" />
</Form.Item>
<Form.Item label="Co-Driver Drop Date" name="co_driver_drop_date">
<DatePicker
style={{ width: "100%" }}
format="MM-DD-YYYY hh:mm:ss A"
showTime={{ format: "hh:mm:ss A" }}
/>
</Form.Item>
<Form.Item
label="Co-Driver Drop Location"
name="co_driver_drop_location"
>
<Input placeholder="Drop location" />
</Form.Item>
</Form>
</Modal>
);
};
export default ShiftAndCoDriverEditModal;

@ -0,0 +1,175 @@
import { Button, Card, message } from "antd";
import { CopyOutlined, EditOutlined } from "@ant-design/icons";
import dayjs from "dayjs";
import { useState } from "react";
import ShiftAndCoDriverEditModal from "./ShiftAndCoDriverEditModal";
interface ShiftDataTabProps {
recordTask?: any;
}
const ShiftDataTab: React.FC<ShiftDataTabProps> = ({ recordTask }) => {
const [isModalOpen, setIsModalOpen] = useState(false);
const formatDateTime = (date?: string) =>
date ? dayjs(date).format("MM-DD-YYYY hh:mm:ss A") : null;
const displayValue = (val?: string | null) => val ?? "—";
const shiftInfo = {
pickUpDate: formatDateTime(recordTask?.pickup_date),
pickUpLocation: recordTask?.pickup_location ?? null,
shiftDate: formatDateTime(recordTask?.shift_date),
shiftLocation: recordTask?.shift_location ?? null,
cycleDate: formatDateTime(recordTask?.cycle_date),
cycleLocation: recordTask?.cycle_location ?? null,
};
const coDriverInfo = {
driverName: recordTask?.driver_name ?? null,
coDriverName: recordTask?.co_driver_name ?? null,
coDriverPickUpLocation: recordTask?.co_driver_pickup_location ?? null,
coDriverPickUpDate: formatDateTime(recordTask?.co_driver_pickup_date),
coDriverDropLocation: recordTask?.co_driver_drop_location ?? null,
coDriverDropDate: formatDateTime(recordTask?.co_driver_drop_date),
};
const buildTextBlock = (title: string, items: [string, string | null][]) => {
const lines = items
.filter(([, value]) => value)
.map(([label, value]) => `${label}: ${value}`);
return lines.length ? `${title}\n${lines.join("\n")}` : "";
};
const handleCopy = (lang: "en" | "ru") => {
let text = "";
if (lang === "en") {
text = [
buildTextBlock("SHIFT INFO", [
["Shift Date", shiftInfo.shiftDate],
["Shift Location", shiftInfo.shiftLocation],
["Pick up Date", shiftInfo.pickUpDate],
["Pick Up Location", shiftInfo.pickUpLocation],
["Cycle Date", shiftInfo.cycleDate],
["Cycle Location", shiftInfo.cycleLocation],
]),
buildTextBlock("CO DRIVER INFO", [
["Driver's name", coDriverInfo.driverName],
["Co-Driver's name", coDriverInfo.coDriverName],
["Co-driver pickup date", coDriverInfo.coDriverPickUpDate],
["Co-driver pickup location", coDriverInfo.coDriverPickUpLocation],
["Co-driver drop date", coDriverInfo.coDriverDropDate],
["Co-driver drop location", coDriverInfo.coDriverDropLocation],
]),
]
.filter(Boolean)
.join("\n\n");
} else {
text = [
buildTextBlock("ИНФОРМАЦИЯ О СМЕНЕ", [
["Дата пикапа", shiftInfo.pickUpDate],
["Место пикапа", shiftInfo.pickUpLocation],
["Дата шифта", shiftInfo.shiftDate],
["Место шифта", shiftInfo.shiftLocation],
["Дата сайкла", shiftInfo.cycleDate],
["Место сайкла", shiftInfo.cycleLocation],
]),
buildTextBlock("ИНФОРМАЦИЯ О СО-ВОДИТЕЛЕ", [
["Имя драйвера", coDriverInfo.driverName],
["Имя ко-драйвера", coDriverInfo.coDriverName],
["Время пикапа ко-драйвера", coDriverInfo.coDriverPickUpDate],
["Место пикапа ко-драйвера", coDriverInfo.coDriverPickUpLocation],
["Время высадки ко-драйвера", coDriverInfo.coDriverDropDate],
["Место высадки ко-драйвера", coDriverInfo.coDriverDropLocation],
]),
]
.filter(Boolean)
.join("\n\n");
}
if (!text) {
message.warning("Nothing to copy!");
return;
}
navigator.clipboard
.writeText(text)
.then(() => message.success("Data copied successfully!"))
.catch(() => message.error("Failed to copy!"));
};
return (
<>
<Card
title="Shift & Co-Driver Information"
extra={
<>
<Button
style={{ marginRight: 5 }}
icon={<EditOutlined />}
onClick={() => setIsModalOpen(true)}
>
Edit
</Button>
<Button icon={<CopyOutlined />} onClick={() => handleCopy("en")}>
Copy
</Button>
</>
}
style={{ width: "100%", marginBottom: 20 }}
>
<h4>SHIFT INFO</h4>
<p>Shift Date: {shiftInfo.shiftDate}</p>
<p>Shift Location: {shiftInfo.shiftLocation}</p>
<p>Pick up Date: {shiftInfo.pickUpDate}</p>
<p>Pick Up Location: {shiftInfo.pickUpLocation}</p>
<p>Cycle Date: {shiftInfo.cycleDate}</p>
<p>Cycle Location: {shiftInfo.cycleLocation}</p>
<h4>CO-DRIVER INFO</h4>
<p>Driver's name: {coDriverInfo.driverName}</p>
<p>Co-driver's name: {coDriverInfo.coDriverName}</p>
<p>Co-driver pickup date: {coDriverInfo.coDriverPickUpDate}</p>
<p>Co-driver pickup location: {coDriverInfo.coDriverPickUpLocation}</p>
<p>Co-driver drop date: {coDriverInfo.coDriverDropDate}</p>
<p>Co-driver drop location: {coDriverInfo.coDriverDropLocation}</p>
</Card>
<Card
title="Информация о смене"
extra={
<Button icon={<CopyOutlined />} onClick={() => handleCopy("ru")}>
Copy
</Button>
}
style={{ width: "100%" }}
>
<h4>ИНФОРМАЦИЯ О СМЕНЕ</h4>
<p>Дата шифта: {shiftInfo.shiftDate}</p>
<p>Место шифта: {shiftInfo.shiftLocation}</p>
<p>Дата сайкла: {shiftInfo.cycleDate}</p>
<p>Место сайкла: {shiftInfo.cycleLocation}</p>
<p>Дата пикапа: {shiftInfo.pickUpDate}</p>
<p>Место пикапа: {shiftInfo.pickUpLocation}</p>
<h4>ИНФОРМАЦИЯ О СО-ВОДИТЕЛЕ</h4>
<p>Имя драйвера: {coDriverInfo.driverName}</p>
<p>Имя ко-драйвера: {coDriverInfo.coDriverName}</p>
<p>Место пикапа ко-драйвера: {coDriverInfo.coDriverPickUpLocation}</p>
<p>Время пикапа ко-драйвера: {coDriverInfo.coDriverPickUpDate}</p>
<p>Место высадки ко-драйвера: {coDriverInfo.coDriverDropLocation}</p>
<p>Время высадки ко-драйвера: {coDriverInfo.coDriverDropDate}</p>
</Card>
<ShiftAndCoDriverEditModal
recordTask={recordTask}
open={isModalOpen}
onCancel={() => setIsModalOpen(false)}
/>
</>
);
};
export default ShiftDataTab;

@ -28,6 +28,9 @@ import {
RotateRightOutlined,
UploadOutlined,
} from "@ant-design/icons";
import ShiftAndCoDriverCreateModal from "./ShiftInfo/ShiftAndCoDriverCreateModal";
import { TSocket } from "../../types/common/TSocket";
// @ts-ignore
import closeIcon from "../../assets/closeIcon.png";
@ -64,8 +67,7 @@ import driverIcon from "../../assets/drivericon.png";
// @ts-ignore
import userIcon from "../../assets/userIcon.png";
import ShiftAndCoDriverModal from "./ShiftAndCoDriverModal";
import CopyCard from "./shiftInfoTab";
import ShiftDataTab from "./ShiftInfo/ShiftDataTab";
const TaskModal = ({
modalOpen,
@ -495,25 +497,26 @@ const TaskModal = ({
</Button>
</div>
</TabPane>
<TabPane
tab={
<span
style={{
display: "flex",
alignItems: "center",
}}
>
<span>
<DatabaseOutlined />
{recordTask?.company?.needs_extra_info && (
<TabPane
tab={
<span
style={{
display: "flex",
alignItems: "center",
}}
>
<span>
<DatabaseOutlined />
</span>
Shift & Driver Data
</span>
Shift & Driver Data
</span>
}
key="2"
>
<CopyCard recordTask={recordTask} />
</TabPane>
}
key="2"
>
<ShiftDataTab recordTask={recordTask} />
</TabPane>
)}
<TabPane
tab={
@ -782,7 +785,7 @@ const TaskModal = ({
</Tabs>
</div>
<ShiftAndCoDriverModal
<ShiftAndCoDriverCreateModal
recordTask={recordTask}
open={isModalOpen}
onOk={(values) => {

@ -1,4 +1,4 @@
import { Button, Modal, Space, Table, Tooltip } from "antd";
import { Button, message, Modal, Space, Table, Tooltip } from "antd";
import "../../App.css";
import { useEffect, useMemo, useState } from "react";
import { taskController } from "../../API/LayoutApi/tasks";
@ -24,6 +24,8 @@ import webIcon from "../../assets/web.png";
import { isMobile, role } from "../../App";
import { theme } from "antd";
import dayjs from "dayjs";
import ShiftAndCoDriverCreateModal from "./ShiftInfo/ShiftAndCoDriverCreateModal";
const admin_id = localStorage.getItem("admin_id");
const TaskTable = ({
@ -42,7 +44,11 @@ const TaskTable = ({
setErrorModal: React.Dispatch<React.SetStateAction<boolean>>;
}) => {
const moment = require("moment");
const statusClick = (record: any) => {
const [isModalOpen, setIsModalOpen] = useState(false);
const [recordTask, setRecordTask] = useState<TTask | null>(null);
const statusClick = async (record: any) => {
if (record.status === "New") {
Modal.confirm({
title: "Confirmation",
@ -59,19 +65,54 @@ const TaskTable = ({
},
});
}
// if (record.status === "Checking") {
// Modal.confirm({
// title: "Confirmation",
// content: `Are you sure you want to finish this task?`,
// onOk: () => {
// const value = {
// status: "Done",
// };
// taskController.taskPatch(value, record.id).then(() => {
// setErrorModal(false);
// });
// },
// });
// }
if (record.status === "Checking") {
Modal.confirm({
title: "Confirmation",
content: `Are you sure you want to finish this task?`,
onOk: () => {
const value = {
status: "Done",
};
taskController.taskPatch(value, record.id).then(() => {
setErrorModal(false);
});
},
});
// 1) Break / PTI holati
if (
record?.service?.title === "Break" ||
record?.service?.title === "PTI"
) {
const response = await taskController.taskPatch(
{ status: "Done" },
record.id
);
if (response?.status === 400) {
setRecordTask(record);
setIsModalOpen(true); // ❌ error qaytsa modal ochiladi
}
return;
}
// 2) needs_extra_info false bolsa
if (record?.company?.needs_extra_info === false) {
const response = await taskController.taskPatch(
{ status: "Done" },
record.id
);
if (response?.status === 400) {
setRecordTask(record);
setIsModalOpen(true); // ❌ error qaytsa modal ochiladi
}
return;
}
// 3) boshqa hollarda -> bevosita modal
setRecordTask(record);
setIsModalOpen(true);
}
};
const ptiPatch = (record: TTask) => {
@ -139,6 +180,90 @@ const TaskTable = ({
return "";
};
const formatDateTime = (date?: string) =>
date ? dayjs(date).format("MM-DD-YYYY hh:mm:ss A") : null;
const handleCopy = (record: any, lang: "en" | "ru") => {
const shiftInfo = {
pickUpDate: formatDateTime(record?.pickup_date),
pickUpLocation: record?.pickup_location ?? null,
shiftDate: formatDateTime(record?.shift_date),
shiftLocation: record?.shift_location ?? null,
cycleDate: formatDateTime(record?.cycle_date),
cycleLocation: record?.cycle_location ?? null,
};
const coDriverInfo = {
driverName: record?.driver_name ?? null,
coDriverName: record?.co_driver_name ?? null,
coDriverPickUpLocation: record?.co_driver_pickup_location ?? null,
coDriverPickUpDate: formatDateTime(record?.co_driver_pickup_date),
coDriverDropLocation: record?.co_driver_drop_location ?? null,
coDriverDropDate: formatDateTime(record?.co_driver_drop_date),
};
const buildTextBlock = (
title: string,
items: [string, string | null][]
) => {
const lines = items
.filter(([, value]) => value)
.map(([label, value]) => `${label}: ${value}`);
return lines.length ? `${title}\n${lines.join("\n")}` : "";
};
let text = "";
if (lang === "en") {
text = [
buildTextBlock("SHIFT INFO", [
["Shift Date", shiftInfo.shiftDate],
["Shift Location", shiftInfo.shiftLocation],
["Pick up Date", shiftInfo.pickUpDate],
["Pick Up Location", shiftInfo.pickUpLocation],
["Cycle Date", shiftInfo.cycleDate],
["Cycle Location", shiftInfo.cycleLocation],
]),
buildTextBlock("CO DRIVER INFO", [
["Driver's name", coDriverInfo.driverName],
["Co-Driver's name", coDriverInfo.coDriverName],
["Co-driver pickup date", coDriverInfo.coDriverPickUpDate],
["Co-driver pickup location", coDriverInfo.coDriverPickUpLocation],
["Co-driver drop date", coDriverInfo.coDriverDropDate],
["Co-driver drop location", coDriverInfo.coDriverDropLocation],
]),
]
.filter(Boolean)
.join("\n\n");
} else {
text = [
buildTextBlock("ИНФОРМАЦИЯ О СМЕНЕ", [
["Дата пикапа", shiftInfo.pickUpDate],
["Место пикапа", shiftInfo.pickUpLocation],
["Дата шифта", shiftInfo.shiftDate],
["Место шифта", shiftInfo.shiftLocation],
["Дата сайкла", shiftInfo.cycleDate],
["Место сайкла", shiftInfo.cycleLocation],
]),
buildTextBlock("ИНФОРМАЦИЯ О СО-ВОДИТЕЛЕ", [
["Имя драйвера", coDriverInfo.driverName],
["Имя ко-драйвера", coDriverInfo.coDriverName],
["Время пикапа ко-драйвера", coDriverInfo.coDriverPickUpDate],
["Место пикапа ко-драйвера", coDriverInfo.coDriverPickUpLocation],
["Время высадки ко-драйвера", coDriverInfo.coDriverDropDate],
["Место высадки ко-драйвера", coDriverInfo.coDriverDropLocation],
]),
]
.filter(Boolean)
.join("\n\n");
}
navigator.clipboard
.writeText(text)
.then(() => message.success("Data copied successfully!"))
.catch(() => message.error("Failed to copy!"));
};
const columns = useMemo(() => {
const columns = [
// {
@ -370,6 +495,38 @@ const TaskTable = ({
</div>
),
},
{
title: (
<Tooltip placement="topLeft" title={"Copy shift data"}>
Copy
</Tooltip>
),
width: "8%",
render: (text: any, record: TTask) => (
<>
{record?.company?.needs_extra_info && record?.status === "Done" && (
<>
<Button onClick={() => handleCopy(record, "en")} type="text">
<Tooltip
placement="topLeft"
title={"Copy shift data in English"}
>
🇬🇧
</Tooltip>
</Button>
<Button onClick={() => handleCopy(record, "ru")} type="text">
<Tooltip
placement="topLeft"
title={"Copy shift data in Russian"}
>
🇷🇺
</Tooltip>
</Button>
</>
)}
</>
),
},
{
title: "Actions",
dataIndex: "action",
@ -379,47 +536,49 @@ const TaskTable = ({
render: (text: string, record: TTask) => {
return (
<div style={{ zIndex: 1000 }}>
{role === "Checker" ? (
<Space>
{record.status === "New" && (
<Button
type="primary"
style={{ background: "#595959" }}
onClick={() => statusClick(record)}
>
Assign
</Button>
)}
{record.status === "Checking" &&
!!admin_id &&
record?.in_charge?.id === +admin_id && (
<Space>
{role === "Checker" ? (
<>
{record.status === "New" && (
<Button
type="primary"
style={{ background: "#595959" }}
onClick={() => statusClick(record)}
>
Finish
Assign
</Button>
)}
</Space>
) : (
<Space>
<Button
type="primary"
danger
onClick={(e) => {
const shouldDelete = window.confirm(
"Are you sure, you want to delete this task?"
);
if (shouldDelete && record.id !== undefined) {
taskController.deleteTaskController(record.id);
}
}}
>
Delete
</Button>
</Space>
)}
{record.status === "Checking" &&
!!admin_id &&
record?.in_charge?.id === +admin_id && (
<Button
type="primary"
style={{ background: "#595959" }}
onClick={() => statusClick(record)}
>
Finish
</Button>
)}
</>
) : (
<>
<Button
type="primary"
danger
onClick={() => {
const shouldDelete = window.confirm(
"Are you sure, you want to delete this task?"
);
if (shouldDelete && record.id !== undefined) {
taskController.deleteTaskController(record.id);
}
}}
>
Delete
</Button>
</>
)}
</Space>
</div>
);
},
@ -462,24 +621,28 @@ const TaskTable = ({
rowClassName={rowClassName}
scroll={{ x: "800px" }}
bordered
// 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,
// },
// }}
pagination={false}
/>
<ShiftAndCoDriverCreateModal
recordTask={recordTask}
open={isModalOpen}
onOk={(values) => {
if (recordTask?.id) {
const payload = { status: "Done", ...values };
taskController
.taskPatch(payload, recordTask.id)
.then((response: any) => {
if (response?.status == 403) {
showErrorModal(response);
} else {
setIsModalOpen(false);
}
});
}
}}
onCancel={() => setIsModalOpen(false)}
/>
</div>
);
};

@ -1,141 +0,0 @@
import { Button, Card, message } from "antd";
import { CopyOutlined } from "@ant-design/icons";
import dayjs from "dayjs";
interface CopyCardProps {
recordTask?: any;
}
const CopyCard: React.FC<CopyCardProps> = ({ recordTask }) => {
const formatDateTime = (date?: string) =>
date ? dayjs(date).format("DD MMM YYYY HH:mm:ss") : "—";
const shiftInfo = {
pickUpDate: formatDateTime(recordTask?.pickup_date) || "—",
pickUpLocation: recordTask?.pickup_location || "—",
shiftDate: formatDateTime(recordTask?.shift_date) || "—",
shiftLocation: recordTask?.shift_location || "—",
cycleDate: formatDateTime(recordTask?.cycle_date) || "—",
cycleLocation: recordTask?.cycle_location || "—",
};
const coDriverInfo = {
driverName: recordTask?.driver_name || "—",
coDriverName: recordTask?.co_driver_name || "—",
coDriverPickUpLocation: recordTask?.co_driver_pickup_location || "—",
coDriverPickUpDate:
formatDateTime(recordTask?.co_driver_pickup_date) || "—",
coDriverDropLocation: recordTask?.co_driver_drop_location || "—",
coDriverDropDate: formatDateTime(recordTask?.co_driver_drop_date) || "—",
};
const handleCopy = (text: string) => {
navigator.clipboard
.writeText(text)
.then(() => message.success("Data copied successfully!"))
.catch(() => message.error("Failed to copy!"));
};
const text = `
SHIFT INFO
Shift Date: ${shiftInfo.shiftDate}
Shift Location: ${shiftInfo.shiftLocation}
Pick up Date: ${shiftInfo.pickUpDate}
Pick Up Location: ${shiftInfo.pickUpLocation}
Cycle Date: ${shiftInfo.cycleDate}
Cycle Location: ${shiftInfo.cycleLocation}
CO DRIVER INFO
Driver's name: ${coDriverInfo.driverName}
Co-Driver's name: ${coDriverInfo.coDriverName}
Co-driver pickup date: ${coDriverInfo.coDriverPickUpDate}
Co-driver pickup location: ${coDriverInfo.coDriverPickUpLocation}
Co-driver drop date: ${coDriverInfo.coDriverDropDate}
Co-driver drop location: ${coDriverInfo.coDriverDropLocation}
`.trim();
const textRu = `
ИНФОРМАЦИЯ О СМЕНЕ
Дата пикапа: ${shiftInfo.pickUpDate}
Место пикапа: ${shiftInfo.pickUpLocation}
Дата шифта: ${shiftInfo.shiftDate}
Место шифта: ${shiftInfo.shiftLocation}
Дата сайкла: ${shiftInfo.cycleDate}
Место сайкла: ${shiftInfo.cycleLocation}
ИНФОРМАЦИЯ О СО-ВОДИТЕЛЕ
Имя драйвера: ${coDriverInfo.driverName}
Имя ко-драйвера: ${coDriverInfo.coDriverName}
Время пикапа ко-драйвера: ${coDriverInfo.coDriverPickUpDate}
Место пикапа ко-драйвера: ${coDriverInfo.coDriverPickUpLocation}
Время высадки ко-драйвера: ${coDriverInfo.coDriverDropDate}
Место высадки ко-драйвера: ${coDriverInfo.coDriverDropLocation}
`.trim();
return (
<>
<Card
title="Shift & Co-Driver Info"
extra={
<Button icon={<CopyOutlined />} onClick={() => handleCopy(text)}>
Copy
</Button>
}
style={{ width: "100%", marginBottom: 20 }}
>
<h4>SHIFT INFO</h4>
<p>Shift Date: {shiftInfo.shiftDate}</p>
<p>Shift Location: {shiftInfo.shiftLocation}</p>
<p>Pick up Date: {shiftInfo.pickUpDate}</p>
<p>Pick Up Location: {shiftInfo.pickUpLocation}</p>
<p>Cycle Date: {shiftInfo.cycleDate}</p>
<p>Cycle Location: {shiftInfo.cycleLocation}</p>
<h4>CO-DRIVER INFO</h4>
<p>Driver's name: {coDriverInfo.driverName}</p>
<p>Co-driver's name: {coDriverInfo.coDriverName}</p>
<p>Co-driver pickup date: {coDriverInfo.coDriverPickUpDate}</p>
<p>Co-driver pickup location: {coDriverInfo.coDriverPickUpLocation}</p>
<p>Co-driver drop date: {coDriverInfo.coDriverDropDate}</p>
<p>Co-driver drop location: {coDriverInfo.coDriverDropLocation}</p>
</Card>
<Card
title="Информация о смене"
extra={
<Button icon={<CopyOutlined />} onClick={() => handleCopy(textRu)}>
Copy
</Button>
}
style={{ width: "100%" }}
>
<h4>ИНФОРМАЦИЯ О СМЕНЕ</h4>
<p>Дата шифта: {shiftInfo.shiftDate}</p>
<p>Место шифта: {shiftInfo.shiftLocation}</p>
<p>Дата сайкла: {shiftInfo.cycleDate}</p>
<p>Место сайкла: {shiftInfo.cycleLocation}</p>
<p>Дата пикапа: {shiftInfo.pickUpDate}</p>
<p>Место пикапа: {shiftInfo.pickUpLocation}</p>
<h4>ИНФОРМАЦИЯ О СО-ВОДИТЕЛЕ</h4>
<p>Имя драйвера: {coDriverInfo.driverName}</p>
<p>Имя ко-драйвера: {coDriverInfo.coDriverName}</p>
<p>Место пикапа ко-драйвера: {coDriverInfo.coDriverPickUpLocation}</p>
<p>Время пикапа ко-драйвера {coDriverInfo.coDriverPickUpDate}</p>
<p>Место высадки ко-драйвера:{coDriverInfo.coDriverDropLocation}</p>
<p>Время высадки ко-драйвера: {coDriverInfo.coDriverDropDate}</p>
</Card>
</>
);
};
export default CopyCard;
Loading…
Cancel
Save