добавила селект на выбор статуса задачи

parent 143897d6
......@@ -3,7 +3,7 @@ import TableCell from '@mui/material/TableCell';
import IconButton from '@mui/material/IconButton';
import Input from '@mui/material/Input';
import { Done, CalendarToday } from '@mui/icons-material';
import MaterialUIPickers from '../UI/DateTimePicker/DateTimePicker';
import MaterialUIPickers from './DateTimePicker/DateTimePicker';
const CustomTableCell = ({ task, name, onChange, onModalOpen }) => {
......
......@@ -8,16 +8,14 @@ import dayjs from 'dayjs';
import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
export default function MaterialUIPickers(props) {
console.log(props)
return (
<LocalizationProvider dateAdapter={AdapterMoment} sx={{ width: "auto", fontSize:"9px",fontWeight: "200" }}>
<LocalizationProvider dateAdapter={AdapterMoment} sx={{ width: "auto", fontSize:5,fontWeight: "200" }}>
<DateTimePicker
readOnly={props.readOnly}
renderInput={(params) => (
<TextField {...params}
sx={{ width: "auto",fontWeight: "200",fontSize: '9 px' }}
sx={{ width: "auto",fontWeight: "200",fontSize: 5 }}
name="dateCreated" />
)}
value={
......
import * as React from 'react';
import Box from '@mui/material/Box';
import InputLabel from '@mui/material/InputLabel';
import MenuItem from '@mui/material/MenuItem';
import FormControl from '@mui/material/FormControl';
import Select from '@mui/material/Select';
export default function BasicSelect(props) {
const [taskContent, setTaskContent] = React.useState(props.task.accomplish);
const handleChange = (event) => {
setTaskContent(event.target.value);
};
React.useEffect(() => {
if (props.task !== null) {
setTaskContent({
accomplish: props.task.accomplish,
});
}
}, [props.task]);
const inputChangeHandler = (e) => {
const { name, value } = e.target;
console.log(e.target)
setTaskContent((prevState) => {
return { ...prevState, [name]: value };
});
props.onChange(e, props.task);
};
console.log(props)
return (
<Box sx={{ minWidth: 60}}>
<FormControl fullWidth>
<InputLabel id="demo-simple-select-label"></InputLabel>
<Select
labelId="demo-simple-select-label"
id="demo-simple-select"
value={taskContent?.accomplish}
label=""
name={"accomplish"}
onChange={inputChangeHandler}
sx={{ marginTop: 2}}
// className={'disabled'}
>
<MenuItem value={props.itemOne}>{props.itemOne}</MenuItem>
<MenuItem value={props.itemTwo}>{props.itemTwo}</MenuItem>
<MenuItem value={props.itemThree}>{props.itemThree}</MenuItem>
</Select>
</FormControl>
</Box>
);
}
\ No newline at end of file
......@@ -3,30 +3,26 @@ import {
Box,
Table,
TableBody,
TextField,
TableCell,
TableContainer,
TablePagination,
TableRow,
Typography,
Paper,
IconButton,
Tooltip,
Input,
} from "@mui/material";
import { useState, useEffect } from "react";
import { Done, Edit } from "@mui/icons-material";
import DeleteIcon from "@mui/icons-material/Delete";
import TaskModal from "../../components/MyTasksCompoments/TaskModal/TaskModal";
import EnhancedTableHead from "./MyTasksHeader/MyTasksHeader";
import { Container } from "@mui/system";
import { DateTimePicker, LocalizationProvider } from "@mui/x-date-pickers";
import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
import moment from "moment";
import MyTaskToolBar from '../../components/MyTasksCompoments/MyTaskToolBar';
import CustomTableCell from "../../components/MyTasksCompoments/CustomTableCell";
import MaterialUIPickers from "../../components/UI/DateTimePicker/DateTimePicker";
import MaterialUIPickersDue from "../../components/UI/DateTimePicker/DateTimePickerDue";
import MaterialUIPickers from "../../components/MyTasksCompoments/DateTimePicker/DateTimePicker";
import MaterialUIPickersDue from "../../components/MyTasksCompoments/DateTimePicker/DateTimePickerDue";
import BasicSelect from "../../components/UI/Select/Select"
function descendingComparator(a, b, orderBy) {
if (b[orderBy] < a[orderBy]) {
......@@ -83,10 +79,10 @@ export default function EnhancedTable() {
dateTimeStart: "2022-10-26T11:00:00",
dateTimeDue: "2022-10-27T10:30:00",
id:1,
dateCreated:"26.10.2022"
createdAt:"26.10.2022",
accomplish:" "
},
{
user:"second",
title:"задача2",
description:"описание задачи222222",
author:"Ivan",
......@@ -95,22 +91,24 @@ export default function EnhancedTable() {
dateTimeStart: "2022-10-26T13:30:00",
dateTimeDue: "2022-10-27T12:30:00",
id:2,
dateCreated:"26.10.2022"
createdAt:"26.10.2022",
accomplish:" "
},
{
user:"theird",
id:3,
title:"задача3",
description:"описание задачи333333bjh,khkuhlhvilv hmgjtycikg mkgyxxkjfkkmgyhkfrdtseygdtjtuliuo8plfyvguh,bb",
createdAt:"27.10.2022",
dateTimeStart: "2022-10-30T09:30:00",
dateTimeDue: "2022-11-02T09:30:00",
accomplish:" ",
author:"Artem",
project:"Project1",
executor:"Bota",
priority:"B",
dateTimeStart: "2022-10-30T09:30:00",
dateTimeDue: "2022-11-02T09:30:00",
id:3,
dateCreated:"27.10.2022",
}
])
useEffect(() => {
if (newStartedDate) {
......@@ -173,7 +171,6 @@ export default function EnhancedTable() {
setOrder(isAsc ? 'desc' : 'asc');
setOrderBy(property);
};
const deleteTask=(id)=>{
console.log(id)
......@@ -207,7 +204,6 @@ export default function EnhancedTable() {
let newTasks=[...tasks]
newTasks.unshift(
{
user:"",
title:"",
description:"",
priority:"",
......@@ -216,12 +212,12 @@ export default function EnhancedTable() {
dateTimeStart:"",
dateTimeDue:"",
id:4,
dateCreated:""
createdAt:"",
accomplish:" "
}
)
setTasks(newTasks)
};
return (
<Box sx={{ width: 'fullwidth' }}>
......@@ -262,10 +258,9 @@ export default function EnhancedTable() {
padding="none"
></TableCell>
<CustomTableCell {...{ task, name: "priority", onChange }} />
<CustomTableCell {...{ task, name: "dateCreated", onChange }} />
<CustomTableCell {...{ task, name: "createdAt", onChange }} />
<CustomTableCell {...{ task, name: "title", onChange, onModalOpen}} />
<CustomTableCell {...{ task, name: "author", onChange }} />
<TableCell key={task.id} >
<MaterialUIPickers
......@@ -275,8 +270,7 @@ export default function EnhancedTable() {
readOnly={readOnly}
/>
</TableCell>
<TableCell key={task.id}>
<TableCell key={task.id}>
<MaterialUIPickersDue
newDueDate={newDueDate}
task={task}
......@@ -284,9 +278,13 @@ export default function EnhancedTable() {
readOnly={readOnly}
/>
</TableCell>
<CustomTableCell {...{ task, name: "done", onChange }} />
<BasicSelect
itemOne={"open"}
itemTwo={"done"}
itemThree={"failed"}
task={task}
/>
<TableCell >
......@@ -317,7 +315,6 @@ export default function EnhancedTable() {
</TableCell>
</TableRow>
);
})}
......
......@@ -56,7 +56,7 @@ const headCells = [
id: 'done',
numeric: true,
disablePadding: false,
label: 'Выполнено',
label: 'Статус',
},
{
id: 'change',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment