|  |  |  | 
|---|
|  |  |  | ReferenceArrayInput, | 
|---|
|  |  |  | AutocompleteInput, | 
|---|
|  |  |  | DeleteButton, | 
|---|
|  |  |  | FunctionField, | 
|---|
|  |  |  | Pagination, | 
|---|
|  |  |  | useNotify, | 
|---|
|  |  |  | useRefresh, | 
|---|
|  |  |  | } from 'react-admin'; | 
|---|
|  |  |  | import { Box, Typography, Card, Stack } from '@mui/material'; | 
|---|
|  |  |  | import { Box, Chip, Card, Stack } from '@mui/material'; | 
|---|
|  |  |  | import { styled } from '@mui/material/styles'; | 
|---|
|  |  |  | import TaskCreate from "./TaskCreate"; | 
|---|
|  |  |  | import TaskPanel from "./TaskPanel"; | 
|---|
|  |  |  | 
|---|
|  |  |  | import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; | 
|---|
|  |  |  | import * as Common from '@/utils/common'; | 
|---|
|  |  |  | import TaskListAside from "./TaskListAside"; | 
|---|
|  |  |  | import { getTaskStsChipColor } from '@/utils/color-util'; | 
|---|
|  |  |  | import ConfirmButton from "../components/ConfirmButton"; | 
|---|
|  |  |  | import ClearIcon from '@mui/icons-material/Clear'; | 
|---|
|  |  |  | import CheckIcon from '@mui/icons-material/Check'; | 
|---|
|  |  |  | import request from '@/utils/request'; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ | 
|---|
|  |  |  | '& .css-1vooibu-MuiSvgIcon-root': { | 
|---|
|  |  |  | 
|---|
|  |  |  | <DateInput label='common.time.before' source="timeEnd" alwaysOn />, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // <TextInput source="uuid" label="table.field.task.uuid" />, | 
|---|
|  |  |  | <ReferenceInput source="busId" label="table.field.task.busId" reference="bus"> | 
|---|
|  |  |  | <AutocompleteInput label="table.field.task.busId" optionText="seqNum" filterToQuery={(val) => ({ seqNum: val })} /> | 
|---|
|  |  |  | <ReferenceInput source="busId" label="table.field.task.busId" reference="bus" > | 
|---|
|  |  |  | <AutocompleteInput label="table.field.task.busId" optionText="busNo" filterToQuery={(val) => ({ seqNum: val })} /> | 
|---|
|  |  |  | </ReferenceInput>, | 
|---|
|  |  |  | <TextInput source="seqNum" label="table.field.task.seqNum" />, | 
|---|
|  |  |  | <NumberInput source="priority" label="table.field.task.priority" />, | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const TaskList = () => { | 
|---|
|  |  |  | const translate = useTranslate(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const notify = useNotify(); | 
|---|
|  |  |  | const refresh = useRefresh(); | 
|---|
|  |  |  | const [createDialog, setCreateDialog] = useState(false); | 
|---|
|  |  |  | const [drawerVal, setDrawerVal] = useState(false); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const [taskStsByComplete, setTaskStsByComplete] = useState(null); | 
|---|
|  |  |  | const [taskStsByCancel, setTaskStsByCancel] = useState(null); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | useEffect(() => { | 
|---|
|  |  |  | request.post('/taskSts/list', { | 
|---|
|  |  |  | uuid: 'COMPLETE' | 
|---|
|  |  |  | }, { | 
|---|
|  |  |  | headers: { | 
|---|
|  |  |  | 'Content-Type': 'application/x-www-form-urlencoded' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }).then(res => { | 
|---|
|  |  |  | setTaskStsByComplete(res.data.data[0]?.id); | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | request.post('/taskSts/list', { | 
|---|
|  |  |  | uuid: 'CANCEL' | 
|---|
|  |  |  | }, { | 
|---|
|  |  |  | headers: { | 
|---|
|  |  |  | 'Content-Type': 'application/x-www-form-urlencoded' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }).then(res => { | 
|---|
|  |  |  | setTaskStsByCancel(res.data.data[0]?.id); | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, []); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const onComplete = (taskId) => { | 
|---|
|  |  |  | request.get("/task/complete/" + taskId).then(res => { | 
|---|
|  |  |  | const { code, msg, data } = res.data; | 
|---|
|  |  |  | if (code === 200) { | 
|---|
|  |  |  | notify(msg || 'common.response.success', { type: 'success', messageArgs: { _: msg } }); | 
|---|
|  |  |  | refresh(); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | notify(msg || 'common.response.fail', { type: 'error', messageArgs: { _: msg } }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }).catch(error => { | 
|---|
|  |  |  | notify(error.message || 'common.response.fail', { type: 'error', messageArgs: { _: error.message } }); | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const onCancel = (taskId) => { | 
|---|
|  |  |  | request.get("/task/cancel/" + taskId).then(res => { | 
|---|
|  |  |  | const { code, msg, data } = res.data; | 
|---|
|  |  |  | if (code === 200) { | 
|---|
|  |  |  | notify(msg || 'common.response.success', { type: 'success', messageArgs: { _: msg } }); | 
|---|
|  |  |  | refresh(); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | notify(msg || 'common.response.fail', { type: 'error', messageArgs: { _: msg } }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }).catch(error => { | 
|---|
|  |  |  | notify(error.message || 'common.response.fail', { type: 'error', messageArgs: { _: error.message } }); | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | return ( | 
|---|
|  |  |  | <Box display="flex"> | 
|---|
|  |  |  | 
|---|
|  |  |  | <MyExportButton /> | 
|---|
|  |  |  | </TopToolbar> | 
|---|
|  |  |  | )} | 
|---|
|  |  |  | perPage={DEFAULT_PAGE_SIZE} | 
|---|
|  |  |  | pagination={<Pagination rowsPerPageOptions={[10, 25, 50, 100]} />} | 
|---|
|  |  |  | perPage={25} | 
|---|
|  |  |  | aside={<TaskListAside />} | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <StyledDatagrid | 
|---|
|  |  |  | 
|---|
|  |  |  | expandSingle={true} | 
|---|
|  |  |  | omit={['id', 'uuid', 'startTime', 'endTime', 'errTime', 'emptyMk', 'zpallet', | 
|---|
|  |  |  | 'oriSta', 'oriLoc', 'oriCode', 'destSta', 'destLoc', 'destCode', | 
|---|
|  |  |  | 'updateTime', 'updateBy', 'createTime', 'createBy', 'statusBool', 'memo']} | 
|---|
|  |  |  | 'updateTime', 'updateBy', 'ioTime', 'createBy', 'statusBool', 'memo']} | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <NumberField source="id" /> | 
|---|
|  |  |  | <TextField source="uuid" label="table.field.task.uuid" /> | 
|---|
|  |  |  | 
|---|
|  |  |  | <ReferenceField source="taskType" label="table.field.task.taskType" reference="taskType" link={false} sortable={false}> | 
|---|
|  |  |  | <TextField source="name" /> | 
|---|
|  |  |  | </ReferenceField> | 
|---|
|  |  |  | <ReferenceField source="taskSts" label="table.field.task.taskSts" reference="taskSts" link={false} sortable={false}> | 
|---|
|  |  |  | {/* <ReferenceField source="taskSts" label="table.field.task.taskSts" reference="taskSts" link={false} sortable={false}> | 
|---|
|  |  |  | <TextField source="name" /> | 
|---|
|  |  |  | </ReferenceField> */} | 
|---|
|  |  |  | <ReferenceField source="taskSts" label="table.field.task.taskSts" reference="taskSts" link={false} sortable={true}> | 
|---|
|  |  |  | <FunctionField render={record => ( | 
|---|
|  |  |  | <Chip | 
|---|
|  |  |  | label={record.name} | 
|---|
|  |  |  | variant="outlined" | 
|---|
|  |  |  | size="small" | 
|---|
|  |  |  | color={getTaskStsChipColor(record.name)} | 
|---|
|  |  |  | sx={{ fontSize: '0.75rem' }} | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | )} /> | 
|---|
|  |  |  | {/* <TextField source="name" /> */} | 
|---|
|  |  |  | </ReferenceField> | 
|---|
|  |  |  | <NumberField source="priority" label="table.field.task.priority" /> | 
|---|
|  |  |  | <DateField source="ioTime" label="table.field.task.ioTime" showTime /> | 
|---|
|  |  |  | <DateField source="startTime" label="table.field.task.startTime" showTime /> | 
|---|
|  |  |  | <DateField source="endTime" label="table.field.task.endTime" showTime /> | 
|---|
|  |  |  | 
|---|
|  |  |  | </ReferenceField> | 
|---|
|  |  |  | <TextField source="oriDesc" label="table.field.task.oriDesc" /> | 
|---|
|  |  |  | <TextField source="destDesc" label="table.field.task.destDesc" /> | 
|---|
|  |  |  | <NumberField source="priority" label="table.field.task.priority" /> | 
|---|
|  |  |  | <TextField source="emptyMk" label="table.field.task.emptyMk" /> | 
|---|
|  |  |  | <TextField source="zpallet" label="table.field.task.zpallet" /> | 
|---|
|  |  |  | <TextField source="errDesc" label="table.field.task.errDesc" /> | 
|---|
|  |  |  | 
|---|
|  |  |  | <DateField source="createTime" label="common.field.createTime" showTime /> | 
|---|
|  |  |  | <BooleanField source="statusBool" label="common.field.status" sortable={false} /> | 
|---|
|  |  |  | <TextField source="memo" label="common.field.memo" sortable={false} /> | 
|---|
|  |  |  | <WrapperField cellClassName="opt" label="common.field.opt"> | 
|---|
|  |  |  | <EditButton sx={{ padding: '1px', fontSize: '.75rem' }} /> | 
|---|
|  |  |  | <DeleteButton sx={{ padding: '1px', fontSize: '.75rem' }} mutationMode={OPERATE_MODE} /> | 
|---|
|  |  |  | </WrapperField> | 
|---|
|  |  |  | <FunctionField label="common.field.opt" cellClassName="opt" render={record => ( | 
|---|
|  |  |  | (record.taskSts !== taskStsByComplete && record.taskSts !== taskStsByCancel) && ( | 
|---|
|  |  |  | <> | 
|---|
|  |  |  | <ConfirmButton | 
|---|
|  |  |  | label="common.action.complete" | 
|---|
|  |  |  | size="small" | 
|---|
|  |  |  | color="primary" | 
|---|
|  |  |  | startIcon={<CheckIcon />} | 
|---|
|  |  |  | sx={{ | 
|---|
|  |  |  | padding: '1px', | 
|---|
|  |  |  | fontSize: '.75rem', | 
|---|
|  |  |  | '& .MuiButton-startIcon': { | 
|---|
|  |  |  | marginRight: '2px' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | mr: 1 | 
|---|
|  |  |  | }} | 
|---|
|  |  |  | data={record.seqNum} | 
|---|
|  |  |  | onConfirm={() => { | 
|---|
|  |  |  | onComplete(record.id); | 
|---|
|  |  |  | }} | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <ConfirmButton | 
|---|
|  |  |  | label="ra.action.cancel" | 
|---|
|  |  |  | size="small" | 
|---|
|  |  |  | color="error" | 
|---|
|  |  |  | startIcon={<ClearIcon />} | 
|---|
|  |  |  | sx={{ | 
|---|
|  |  |  | padding: '1px', | 
|---|
|  |  |  | fontSize: '.75rem', | 
|---|
|  |  |  | '& .MuiButton-startIcon': { | 
|---|
|  |  |  | marginRight: '1.5px' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | }} | 
|---|
|  |  |  | data={record.seqNum} | 
|---|
|  |  |  | onConfirm={() => { | 
|---|
|  |  |  | onCancel(record.id); | 
|---|
|  |  |  | }} | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </> | 
|---|
|  |  |  | ) | 
|---|
|  |  |  | )} /> | 
|---|
|  |  |  | </StyledDatagrid> | 
|---|
|  |  |  | </List> | 
|---|
|  |  |  | <TaskCreate | 
|---|