Untitled
unknown
plain_text
5 months ago
38 kB
2
Indexable
import React, { useEffect, useState, useRef } from "react";
import Board from "@asseinfo/react-kanban";
import "@asseinfo/react-kanban/dist/styles.css";
import { addTask, getTasksData } from "../../../redux/actions/task_actions";
import { getManager } from "../../../api/auth";
import "./fulltask.css";
import { Avatar, Paper, Typography } from "@material-ui/core";
import ProgressBar from "react-bootstrap/ProgressBar";
import { Button, Dialog, Tooltip, } from "@mui/material";
import AvatarGroup from "@mui/material/AvatarGroup";
import LoadingSpinner from "../../../containers/spinner";
import Slide from "@mui/material/Slide";
import AddTask from "../../../components/Header/AddTask.js";
import { ActionButton } from "../../../utils/buttons";
import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
import { getTaskLifebyid } from "../../../api/auth";
import { connect } from "react-redux";
import PropTypes from "prop-types";
import Replytask from "./replytask";
import moment from "moment";
import { addTaskApi, getMyCreatedTasks, getTaskDetailsById, getChecklist, updateChecklistStatus, storeChecklist, getmycreatedTasksType, getmycreatedTasksbyclinetType } from "../../../api/common";
import Box from '@mui/material/Box';
import { makeStyles } from "@material-ui/core/styles";
import { Grid } from "@material-ui/core";
import Taskresult from "./Taskresult.js";
import Taskcaard from "./Taskcaard.js";
import Pagination from '@mui/material/Pagination';
import ReactDOM from "react-dom";
import { editTaskApi } from "../../../api/common";
import Taskcarrdclient from "./Taskcarrdclient.js";
import Taskresultclient from "./Taskresultclient.js";
import ButtonGroup from '@mui/material/ButtonGroup';
import Tabs from '@mui/material/Tabs';
import Tab from '@mui/material/Tab';
import ChecklistIcon from '@mui/icons-material/Checklist';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faListCheck, faAddressCard, faHospitalUser, faUserTie, faCalendarDays, faUserMd, faCalendarAlt, faCalendar } from '@fortawesome/free-solid-svg-icons';
import MyCalender from "../../MyCalendar/MyCalender.js";
import TaskCalendarmonth from "../../Header/TaskCalendarmonth.js";
import Weeklcalendartask from "./Weeklcalendartask.js";
import Daytaskcalendar from "./Daytaskcalendar.js";
import { getAllTasks } from '../../../api/events';
import { useHistory, useLocation } from "react-router";
import Daytaskcaelndar2 from "./Daytaskcaelndar2.js";
const useStyles = makeStyles((theme) => ({
}));
const Transition = React.forwardRef(function Transition(props, ref) {
return <Slide direction="up" ref={ref} {...props} />;
});
const initialize = {
columns: [
{
id: 1,
title: "New",
cards: [],
},
{
id: 2,
title: "In Progress",
cards: [],
},
{
id: 3,
title: "Completed",
cards: [],
},
],
};
function stringToColor(string) {
let hash = 0;
let i;
for (i = 0; i < string.length; i += 1) {
hash = string.charCodeAt(i) + ((hash << 5) - hash);
}
let color = "#";
for (i = 0; i < 3; i += 1) {
const value = (hash >> (i * 8)) & 0xff;
color += `00${value.toString(16)}`.slice(-2);
}
return color;
}
function stringAvatar(name) {
if (name) {
const parts = name.split(" ");
if (parts.length >= 2) {
return {
sx: {
bgcolor: stringToColor(name),
},
children: `${parts[0][0]}${parts[1][0]}`,
};
}
}
return {
};
}
function CustomTabPanel(props) {
const { children, value, index, ...other } = props;
return (
<div
role="tabpanel"
hidden={value !== index}
id={`simple-tabpanel-${index}`}
aria-labelledby={`simple-tab-${index}`}
{...other}
>
{value === index && (
<Typography>{children}</Typography>
)}
</div>
);
}
CustomTabPanel.propTypes = {
children: PropTypes.node,
index: PropTypes.number.isRequired,
value: PropTypes.number.isRequired,
};
function a11yProps(index) {
return {
id: `simple-tab-${index}`,
'aria-controls': `simple-tabpanel-${index}`,
};
}
function FullTaskCanban(props) {
const location = useLocation();
const history = useHistory();
const queryParams = new URLSearchParams(location.search);
const tabFromQuery = parseInt(queryParams.get('tabFromQuery')) || 0;
const subTabFromQuery1 = parseInt(queryParams.get('subTabFromQuery1')) || 0;
const subTabFromQuery2 = parseInt(queryParams.get('subTabFromQuery2')) || 0;
const subTabFromQuery3 = parseInt(queryParams.get('subTab')) || 0;
const selected = parseInt(queryParams.get('selected.id')) || 0;
const selectedclient = parseInt(queryParams.get('selectedclient.id')) || 0;
const [valuetab, setValueTab] = useState(tabFromQuery);
const [subValue1, setSubValue1] = useState(subTabFromQuery1);
const [subValue2, setSubValue2] = useState(subTabFromQuery2);
const [subValue3, setSubValue3] = useState(0);
useEffect(() => {
setValueTab(tabFromQuery);
setSubValue1(subTabFromQuery1);
setSubValue2(subTabFromQuery2)
}, [tabFromQuery, subTabFromQuery1, subTabFromQuery2]);
const handleTabChange = (event, newValue) => {
setValueTab(newValue);
const searchParams = new URLSearchParams(location.search);
searchParams.set('tabFromQuery', newValue.toString());
history.push({ search: searchParams.toString() });
};
const handleSubChange1 = (event, newValue) => {
setSubValue1(newValue);
const searchParams = new URLSearchParams(location.search);
searchParams.set('subTabFromQuery1', newValue.toString());
history.push({ search: searchParams.toString() });
};
const handleSubChange2 = (event, newValue) => {
setSubValue2(newValue);
const searchParams = new URLSearchParams(location.search);
searchParams.set('subTabFromQuery2', newValue.toString());
history.push({ search: searchParams.toString() });
};
const handleSubChange3 = (event, newValue) => {
setSubValue3(newValue);
};
const [board, setBoard] = useState(initialize);
const [waiting, setWaiting] = useState(true);
const [clinntboard, setclientBoard] = useState(initialize);
const [waitingbyclient, setWaitingByClient] = useState(true);
const [openD, setOpenD] = useState(false);
const [selectedTask, setSelectedTask] = useState(null);
const [key, setKey] = useState('home');
const [clientstasks, setClientsTasks] = useState([]);
const [selectedclientTask, setSelectedClientTask] = useState(null);
const [taskList, setTaskList] = useState([]);
const [taskbyclientList, setByClientTaskList] = useState([]);
const onhandleClickOpen = () => {
setOpenD(true);
};
const onhandleClose = () => {
setOpenD(false);
};
console.log("selectedclient ", selectedclient)
useEffect(() => {
const fetchData = async () => {
try {
setWaiting(true);
let tasks = [];
switch (valuetab) {
case 0:
switch (subValue1) {
case 0:
if (props.user?.role === "LIFE_NAVIGATOR") {
tasks = await getmycreatedTasksType("", "advisor");
} else if (props.user?.role === "ADVISOR") {
tasks = await getmycreatedTasksType("", "life_navigator");
} else {
tasks = await getmycreatedTasksType("", "advisor");
}
break;
case 1:
tasks = await getmycreatedTasksType("", "client");
break;
case 2:
if (manager?.user_createdby?.role === "ADMIN") {
tasks = await getmycreatedTasksType("", "admin");
} else if (manager?.user_createdby?.role === "MANAGER") {
tasks = await getmycreatedTasksType("", "manager");
} else {
tasks = await getmycreatedTasksType("", "admin");
}
break;
case 3:
if (props.user?.role === "LIFE_NAVIGATOR") {
tasks = await getmycreatedTasksType("", "doctor");
} else {
tasks = await getmycreatedTasksType("", "");
}
break;
}
break;
}
if (tasks.task && tasks.task.length > 0) {
const taskList = tasks.task;
setTaskList(taskList);
setBoard(initialize);
const defaultSelectedTask = selected ? taskList.find(task => task.id === selected) : taskList[0];
setSelectedTask(defaultSelectedTask || null);
} else {
setTaskList([]);
setBoard(null);
setSelectedTask(null);
}
setWaiting(false);
} catch (error) {
console.error("Error fetching data:", error);
}
};
fetchData();
}, [valuetab, subValue1]);
useEffect(() => {
const fetchData = async () => {
try {
setWaitingByClient(true)
let taskData = [];
switch (valuetab) {
case 1:
switch (subValue2) {
case 0:
case 0:
if (props.user?.role === "LIFE_NAVIGATOR") {
taskData = await getmycreatedTasksbyclinetType("", "advisor");
} else if (props.user?.role === "ADVISOR") {
taskData = await getmycreatedTasksbyclinetType("", "life_navigator");
} else {
taskData = await getmycreatedTasksbyclinetType("", "advisor");
}
break;
case 1:
taskData = await getmycreatedTasksbyclinetType("", "client");
break;
case 2:
if (manager?.user_createdby?.role === "ADMIN") {
taskData = await getmycreatedTasksbyclinetType("", "admin");
} else if (manager?.user_createdby?.role === "MANAGER") {
taskData = await getmycreatedTasksbyclinetType("", "manager");
} else {
taskData = await getmycreatedTasksbyclinetType("", "admin");
}
break;
case 3:
if (props.user?.role === "LIFE_NAVIGATOR") {
taskData = await getmycreatedTasksbyclinetType("", "doctor");
}
break;
}
break;
}
console.log("TaskData after switch:", taskData);
if (taskData.data && taskData.data.length > 0) {
const taskbyclientList = taskData.data;
setByClientTaskList(taskbyclientList);
setclientBoard(initialize);
const defaultSelectedCLientTask = selectedclient ? taskData.data.find(task => task.id === selectedclient) : taskData.data[0];;
setSelectedClientTask(defaultSelectedCLientTask || null);
}
else {
setByClientTaskList([]);
setclientBoard(null);
setSelectedClientTask(null);
}
setWaitingByClient(false)
} catch (error) {
console.error("Error fetching data:", error);
}
};
fetchData();
}, [valuetab, subValue2]);
const onSubmit = async (values) => {
let task = values;
task.start_time = moment
.utc(task.start_time)
.format("YYYY-MM-DD hh:mm:ss");
task.end_time = moment.utc(task.end_time).format("YYYY-MM-DD hh:mm:ss");
try {
await addTaskApi(task);
props.getTasksData();
setOpenD(false);
} catch (error) {
console.log(error);
}
};
const [value, setValue] = React.useState('1');
const handleChange = (event, newValue) => {
setValue(newValue);
};
const classes = useStyles();
const [isScrollingDown, setIsScrollingDown] = useState(false);
const [lastScrollY, setLastScrollY] = useState(0);
const [manager, setManager] = useState("");
const idx = props.user?.id;
useEffect(() => {
getManager(idx)
.then((managerData) => {
setManager(managerData);
})
.catch((error) => console.log(error));
}, [idx]);
useEffect(() => {
const handleScroll = () => {
const scrolledDown = window.scrollY > 0;
setIsScrollingDown(scrolledDown);
};
window.addEventListener('scroll', handleScroll);
return () => {
window.removeEventListener('scroll', handleScroll);
};
}, []);
const handleEditTaskPriority = async (taskId, updatedPriority) => {
try {
// Update the local state with the new priority
const updatedTaskList = taskList.map((task) => {
if (task.id === taskId) {
return { ...task, priority: updatedPriority };
}
return task;
});
setTaskList(updatedTaskList)
// Update the API call to send only priority
await editTaskApi(taskId, updatedPriority);
const updatedSelectedTask = { ...selectedTask, priority: updatedPriority };
setSelectedTask(updatedSelectedTask);
} catch (error) {
console.error("Error editing task:", error.message);
}
};
const handleEditTaskPriorityClientclint = async (taskId, updatedPriority) => {
try {
// Update the local state with the new priority
const updatedTaskByClientList = taskbyclientList.map((task) => {
if (task.id === taskId) {
return { ...task, priority: updatedPriority };
}
return task;
});
setByClientTaskList(updatedTaskByClientList);
// Update the API call to send only priority
await editTaskApi(taskId, updatedPriority);
const updatedSelectedClientTask = { ...selectedclientTask, priority: updatedPriority };
setSelectedClientTask(updatedSelectedClientTask);
} catch (error) {
console.error("Error editing task:", error.message);
}
};
const handleEditTaskStage = async (taskId, updatedStage) => {
try {
// Update the local state with the new stage
const updatedTaskList = taskList.map((task) => {
if (task.id === taskId) {
return { ...task, stages: updatedStage };
}
return task;
});
setTaskList(updatedTaskList);
// Update the API call to send only stage
await editTaskApi(taskId, null, updatedStage);
const updatedSelectedTask = { ...selectedTask, stages: updatedStage };
setSelectedTask(updatedSelectedTask)
} catch (error) {
console.error("Error editing task:", error.message);
}
};
const handleEditTaskClientclientStage = async (taskId, updatedStage) => {
try {
// Update the local state with the new stage
const updatedClientTaskList = taskbyclientList.map((task) => {
if (task.id === taskId) {
return { ...task, stages: updatedStage };
}
return task;
});
setByClientTaskList(updatedClientTaskList);
// Update the API call to send only stage
await editTaskApi(taskId, null, updatedStage);
const updatedSelectedClientTask = { ...selectedclientTask, stages: updatedStage };
setSelectedClientTask(updatedSelectedClientTask);
} catch (error) {
console.error("Error editing task:", error.message);
}
};
const handleCardClick = (taskId) => {
console.log('Handling Card Click:', taskId);
const selected = taskList.find((task) => task.id === taskId);
console.log('Selected Task:', selected);
setSelectedTask(selected);
};
const handleCardclientdataClick = (taskId) => {
const selectedclient = taskbyclientList.find((task) => task.id === taskId);
setSelectedClientTask(selectedclient);
};
const [subTabValue, setSubTabValue] = useState('1'); // State for sub-tabs
const handleSubTabChange = (event, newValue) => {
setSubTabValue(newValue);
};
<Taskresult selectedTask={selectedTask} handleEditTaskPriority={handleEditTaskPriority} handleEditTaskStage={handleEditTaskStage} />
return (
<div className={`taskresultresukbox ${isScrollingDown ? 'scrolling-down' : ''}`}>
<style>{`
.MuiTabs-flexContainer {
justify-content: normal;
}
.MuiTabs-indicator {
background-color:white !important;
display: none !important;
}
.css-19kzrtu{
padiing:0px !important;
}
.css-1ujnqem-MuiTabs-root{
min-height: 20px !important;
}
`}</style>
<Tabs value={valuetab} onChange={handleTabChange} aria-label="basic tabs example" className="tabstaskstabs" >
<Tab icon={<FontAwesomeIcon icon={faListCheck} className="tabtask__icon" />} iconPosition="start" label="Task created by me" className={valuetab === 0 ? 'tabtaskcssname selected-tabtaskfull' : 'tabtaskcssname '}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
}} />
<Tab icon={<FontAwesomeIcon icon={faAddressCard} className="tabtask__icon" />} iconPosition="start" label="My Task (send by other)" className={valuetab === 1 ? 'tabtaskcssname selected-tabtaskfull2' : 'tabtaskcssname '}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
}} />
<Tab icon={<FontAwesomeIcon icon={faCalendarDays} className="tabtask__icon" />} iconPosition="start" label="Calender Task" className={valuetab === 2 ? 'tabtaskcssname selected-tabtaskfull3' : 'tabtaskcssname '}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
}} />
</Tabs>
<CustomTabPanel value={valuetab} index={0}>
<Tabs value={subValue1} onChange={handleSubChange1} aria-label="subtabs example" className="tabstaskstabs">
<Tab id="font_11_size" icon={<FontAwesomeIcon icon={faListCheck} className="tabtask__icon" />} iconPosition="start" label={props.user?.role === "LIFE_NAVIGATOR" ? "For Professional" : "For Life Navigator"} className={subValue1 === 0 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'
}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} />
<Tab id="font_11_size" icon={<FontAwesomeIcon icon={faHospitalUser} className="tabtask__icon" />} iconPosition="start" label="For Client" className={subValue1 === 1 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
fontSize: "11px"
},
'&.selected-tabtaskful2222': {
fontSize: "11px",
borderBottom: '3px solid black !important',
},
}} />
<Tab id="font_11_size" icon={<FontAwesomeIcon icon={faUserTie} className="tabtask__icon" />} iconPosition="start" label="For Manager" className={subValue1 === 2 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
fontSize: "11px"
},
'&.selected-tabtaskful2222': {
fontSize: "11px",
borderBottom: '3px solid black !important',
},
}} />
{props.user?.role === "LIFE_NAVIGATOR" &&
<Tab id="font_11_size" icon={<FontAwesomeIcon icon={faUserMd} className="tabtask__icon" />} iconPosition="start" label="For Doctor" className={subValue1 === 3 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
fontSize: "11px"
},
'&.selected-tabtaskful2222': {
fontSize: "11px",
borderBottom: '3px solid black !important',
},
}} />
}
</Tabs>
<CustomTabPanel value={subValue1} index={0}>
<div className="taskcardmaingrid mt-2">
<Grid container spacing={3} >
{waiting && <p style={{ marginTop: '1%' }}>Loading...</p>}
{!waiting && board === null &&
<div className="notaskavavilabldivvvv">
<p className="notaskavavilablepppp">No tasks available</p>
</div>
}
{!waiting && board !== null && (
<>
<Grid item sm={12} md={4} >
{taskList.slice().reverse().map((task, index) => (
<Taskcaard
task={task}
handleCardClick={() => handleCardClick(task.id)}
index={index}
handleEditTaskPriority={handleEditTaskPriority}
handleEditTaskStage={handleEditTaskStage}
/>
))}
</Grid>
<Grid item xs={12} sm={12} md={8} className="taskresultdivboxtypecs" >
{<Taskresult selectedTask={selectedTask} />}
</Grid>
</>
)}
</Grid>
</div>
</CustomTabPanel>
<CustomTabPanel value={subValue1} index={1}>
<div className="taskcardmaingrid mt-2">
<Grid container spacing={3} >
{waiting && <p style={{ marginTop: '1%' }}>Loading...</p>}
{!waiting && board === null &&
<div className="notaskavavilabldivvvv">
<p className="notaskavavilablepppp">No tasks available</p>
</div>
}
{!waiting && board !== null && (
<>
<Grid item sm={12} md={4} >
{taskList.slice().reverse().map((task, index) => (
<Taskcaard
task={task}
handleCardClick={() => handleCardClick(task.id)}
index={index}
handleEditTaskPriority={handleEditTaskPriority}
handleEditTaskStage={handleEditTaskStage}
/>
))}
</Grid>
<Grid item xs={12} sm={12} md={8} className="taskresultdivboxtypecs">
{<Taskresult selectedTask={selectedTask} />}
</Grid>
</>
)}
</Grid>
</div>
</CustomTabPanel>
<CustomTabPanel value={subValue1} index={2}>
<div className="taskcardmaingrid mt-2">
<Grid container spacing={3} >
{waiting && <p style={{ marginTop: '1%' }}>Loading...</p>}
{!waiting && board === null &&
<div className="notaskavavilabldivvvv">
<p className="notaskavavilablepppp">No tasks available</p>
</div>
}
{!waiting && board !== null && (
<>
<Grid item sm={12} md={4} >
{taskList.slice().reverse().map((task, index) => (
<Taskcaard
task={task}
handleCardClick={() => handleCardClick(task.id)}
index={index}
handleEditTaskPriority={handleEditTaskPriority}
handleEditTaskStage={handleEditTaskStage}
/>
))}
</Grid>
<Grid item xs={12} sm={12} md={8} className="taskresultdivboxtypecs" >
{<Taskresult selectedTask={selectedTask} />}
</Grid>
</>
)}
</Grid>
</div>
</CustomTabPanel>
<CustomTabPanel value={subValue1} index={3}>
<div className="taskcardmaingrid mt-2">
<Grid container spacing={3} >
{waiting && <p style={{ marginTop: '1%' }}>Loading...</p>}
{!waiting && board === null &&
<div className="notaskavavilabldivvvv">
<p className="notaskavavilablepppp">No tasks available</p>
</div>
}
{!waiting && board !== null && (
<>
<Grid item sm={12} md={4} >
{taskList.slice().reverse().map((task, index) => (
<Taskcaard
task={task}
handleCardClick={() => handleCardClick(task.id)}
index={index}
handleEditTaskPriority={handleEditTaskPriority}
handleEditTaskStage={handleEditTaskStage}
/>
))}
</Grid>
<Grid item xs={12} sm={12} md={8} className="taskresultdivboxtypecs" >
{<Taskresult selectedTask={selectedTask} />}
</Grid>
</>
)}
</Grid>
</div>
</CustomTabPanel>
</CustomTabPanel>
<CustomTabPanel value={valuetab} index={1}>
<Tabs value={subValue2} onChange={handleSubChange2} aria-label="subtabs example">
<Tab icon={<FontAwesomeIcon icon={faListCheck} className="tabtask__icon" />} iconPosition="start" label={props.user?.role === "LIFE_NAVIGATOR" ? "By Professional" : "By Life Navigator"} className={subValue2 === 0 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} />
<Tab icon={<FontAwesomeIcon icon={faHospitalUser} className="tabtask__icon" />} iconPosition="start" label="By Client" className={subValue2 === 1 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} />
<Tab icon={<FontAwesomeIcon icon={faUserTie} className="tabtask__icon" />} iconPosition="start" label="By Manager" className={subValue2 === 2 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} />
{props.user?.role === "LIFE_NAVIGATOR" &&
<Tab icon={<FontAwesomeIcon icon={faUserMd} className="tabtask__icon" />} iconPosition="start" label="By Doctor" className={subValue2 === 3 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} />
}
</Tabs>
<CustomTabPanel value={subValue2} index={0}>
<div className="taskcardmaingrid mt-2">
<Grid container spacing={3} >
{waitingbyclient && <p style={{ marginTop: '1%' }}>Loading...</p>}
{!waitingbyclient && clinntboard === null &&
<div className="notaskavavilabldivvvv">
<p className="notaskavavilablepppp">No tasks available</p>
</div>
}
{!waitingbyclient && clinntboard !== null && (
<>
<Grid item sm={12} md={4}>
{taskbyclientList.slice().reverse().map((task, index) => (
<Taskcarrdclient key={index} task={task} handleCardclientdataClick={handleCardclientdataClick}
handleEditTaskPriorityClientclint={handleEditTaskPriorityClientclint}
index={index} handleEditTaskClientclientStage={handleEditTaskClientclientStage}
/>
))}
</Grid>
<Grid item xs={12} sm={12} md={8} className="taskresultdivboxtypecs">
<Taskresultclient selectedclientTask={selectedclientTask} handleEditTaskPriorityClientclint={handleEditTaskPriorityClientclint}
/>
</Grid>
</>
)}
</Grid>
</div>
</CustomTabPanel>
<CustomTabPanel value={subValue2} index={1}>
<div className='taskcardmaingrid mt-2'>
<Grid container spacing={3} >
{waitingbyclient && <p style={{ marginTop: '1%' }}>Loading...</p>}
{!waitingbyclient && clinntboard === null &&
<div className="notaskavavilabldivvvv">
<p className="notaskavavilablepppp">No tasks available</p>
</div>
}
{!waitingbyclient && clinntboard !== null && (
<>
<Grid item sm={12} md={4}>
{taskbyclientList.slice().reverse().map((task, index) => (
<Taskcarrdclient key={index} task={task} handleCardclientdataClick={handleCardclientdataClick}
handleEditTaskPriorityClientclint={handleEditTaskPriorityClientclint}
index={index} handleEditTaskClientclientStage={handleEditTaskClientclientStage}
/>
))}
</Grid>
<Grid item xs={12} sm={12} md={8} className="taskresultdivboxtypecs">
<Taskresultclient selectedclientTask={selectedclientTask} handleEditTaskPriorityClientclint={handleEditTaskPriorityClientclint}
/>
</Grid>
</>
)}
</Grid>
</div>
</CustomTabPanel>
<CustomTabPanel value={subValue2} index={2}>
<div className='taskcardmaingrid mt-2'>
<Grid container spacing={3} >
{waitingbyclient && <p>Loading...</p>}
{!waitingbyclient && clinntboard === null &&
<div className="notaskavavilabldivvvv">
<p className="notaskavavilablepppp">No tasks available</p>
</div>
}
{!waitingbyclient && clinntboard !== null && (
<>
<Grid item sm={12} md={4}>
{taskbyclientList.slice().reverse().map((task, index) => (
<Taskcarrdclient key={index} task={task} handleCardclientdataClick={handleCardclientdataClick}
handleEditTaskPriorityClientclint={handleEditTaskPriorityClientclint}
index={index} handleEditTaskClientclientStage={handleEditTaskClientclientStage}
/>
))}
</Grid>
<Grid item xs={12} sm={12} md={8} className="taskresultdivboxtypecs">
<Taskresultclient selectedclientTask={selectedclientTask} handleEditTaskPriorityClientclint={handleEditTaskPriorityClientclint}
/>
</Grid>
</>
)}
</Grid>
</div>
</CustomTabPanel>
<CustomTabPanel value={subValue2} index={3}>
<div className='taskcardmaingrid mt-2'>
<Grid container spacing={3} >
{waitingbyclient && <p>Loading...</p>}
{!waitingbyclient && clinntboard === null &&
<div className="notaskavavilabldivvvv">
<p className="notaskavavilablepppp">No tasks available</p>
</div>
}
{!waitingbyclient && clinntboard !== null && (
<>
<Grid item sm={12} md={4}>
{taskbyclientList.slice().reverse().map((task, index) => (
<Taskcarrdclient key={index} task={task} handleCardclientdataClick={handleCardclientdataClick}
handleEditTaskPriorityClientclint={handleEditTaskPriorityClientclint}
index={index} handleEditTaskClientclientStage={handleEditTaskClientclientStage}
/>
))}
</Grid>
<Grid item xs={12} sm={12} md={8} className="taskresultdivboxtypecs">
<Taskresultclient selectedclientTask={selectedclientTask} handleEditTaskPriorityClientclint={handleEditTaskPriorityClientclint}
/>
</Grid>
</>
)}
</Grid>
</div>
</CustomTabPanel>
</CustomTabPanel>
<CustomTabPanel value={valuetab} index={2}>
<Tabs value={subValue3} onChange={handleSubChange3} aria-label="subtabs example" className="tabstaskstabs">
<Tab icon={<FontAwesomeIcon icon={faCalendarAlt} className="tabtask__icon" />} iconPosition="start" label={"Montly Calendar"} className={subValue3 === 0 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'
}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} />
<Tab icon={<FontAwesomeIcon icon={faCalendar} className="tabtask__icon" />} iconPosition="start" label={"Weekly Calendar"} className={subValue3 === 1 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} />
<Tab icon={<FontAwesomeIcon icon={faCalendarDays} className="tabtask__icon" />} iconPosition="start" label={"Day Calendar"} className={subValue3 === 2 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'
}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} />
{/* <Tab icon={<FontAwesomeIcon icon={faCalendarDays} className="tabtask__icon" />} iconPosition="start" label={"Day Task"} className={subValue3=== 3 ? 'tabtaskcssna222222 selected-tabtaskful2222' : 'tabtaskcssna222222'
}
sx={{
'& .MuiTab-label': {
fontWeight: 600,
},
'&.selected-tabtaskful2222': {
borderBottom: '3px solid black !important',
},
}} /> */}
</Tabs>
<CustomTabPanel value={subValue3} index={0}>
{<TaskCalendarmonth user={props.user} getAllTasks={getAllTasks} />}
</CustomTabPanel>
<CustomTabPanel value={subValue3} index={1}>
{<Weeklcalendartask user={props.user} getAllTasks={getAllTasks} />}
</CustomTabPanel>
<CustomTabPanel value={subValue3} index={2}>
{<Daytaskcalendar user={props.user} getAllTasks={getAllTasks} />}
</CustomTabPanel>
{/* <CustomTabPanel value={subValue3} index={3}>
{ <Daytaskcaelndar2 user={props.user} getAllTasks={getAllTasks}/>}
</CustomTabPanel> */}
</CustomTabPanel>
</div>
);
}
FullTaskCanban.propTypes = {
classes: PropTypes.object.isRequired,
};
FullTaskCanban.defaultProps = {
user: {},
dense: false,
isLogin: false,
};
const mapStateToProps = (state) => ({
user: state.authReducer.user,
adding: state.taskReducer.adding,
userAttr: PropTypes.object.isRequired,
// user: state.authReducer.user,
...state,
});
export default connect(mapStateToProps, { addTask, getTasksData })(FullTaskCanban);Editor is loading...
Leave a Comment