From 6d88e85c58f76e4616feda86de322235edfb2229 Mon Sep 17 00:00:00 2001 From: skyouc Date: 星期一, 31 三月 2025 16:04:02 +0800 Subject: [PATCH] 新增任务工作档 新增任务明细 --- rsf-admin/src/page/task/TaskCreate.jsx | 210 ++++++++ rsf-admin/src/page/taskItem/TaskItemCreate.jsx | 203 ++++++++ rsf-admin/src/page/task/TaskList.jsx | 180 +++++++ rsf-admin/src/page/taskItem/TaskItemPanel.jsx | 135 +++++ rsf-admin/src/page/task/TaskEdit.jsx | 182 +++++++ rsf-admin/src/page/taskItem/TaskItemList.jsx | 178 +++++++ rsf-admin/src/page/taskItem/index.jsx | 18 rsf-admin/src/page/task/TaskPanel.jsx | 141 +++++ rsf-admin/src/page/taskItem/TaskItemEdit.jsx | 175 +++++++ rsf-admin/src/page/task/index.jsx | 19 10 files changed, 1,441 insertions(+), 0 deletions(-) diff --git a/rsf-admin/src/page/task/TaskCreate.jsx b/rsf-admin/src/page/task/TaskCreate.jsx new file mode 100644 index 0000000..adab1f4 --- /dev/null +++ b/rsf-admin/src/page/task/TaskCreate.jsx @@ -0,0 +1,210 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { + CreateBase, + useTranslate, + TextInput, + NumberInput, + BooleanInput, + DateInput, + SaveButton, + SelectInput, + ReferenceInput, + ReferenceArrayInput, + AutocompleteInput, + Toolbar, + required, + useDataProvider, + useNotify, + Form, + useCreateController, +} from 'react-admin'; +import { + Dialog, + DialogActions, + DialogContent, + DialogTitle, + Stack, + Grid, + Box, +} from '@mui/material'; +import DialogCloseButton from "../components/DialogCloseButton"; +import StatusSelectInput from "../components/StatusSelectInput"; +import MemoInput from "../components/MemoInput"; + +const TaskCreate = (props) => { + const { open, setOpen } = props; + + const translate = useTranslate(); + const notify = useNotify(); + + const handleClose = (event, reason) => { + if (reason !== "backdropClick") { + setOpen(false); + } + }; + + const handleSuccess = async (data) => { + setOpen(false); + notify('common.response.success'); + }; + + const handleError = async (error) => { + notify(error.message || 'common.response.fail', { type: 'error', messageArgs: { _: error.message } }); + }; + + return ( + <> + <CreateBase + record={{}} + transform={(data) => { + return data; + }} + mutationOptions={{ onSuccess: handleSuccess, onError: handleError }} + > + <Dialog + open={open} + onClose={handleClose} + aria-labelledby="form-dialog-title" + fullWidth + disableRestoreFocus + maxWidth="md" // 'xs' | 'sm' | 'md' | 'lg' | 'xl' + > + <Form> + <DialogTitle id="form-dialog-title" sx={{ + position: 'sticky', + top: 0, + backgroundColor: 'background.paper', + zIndex: 1000 + }} + > + {translate('create.title')} + <Box sx={{ position: 'absolute', top: 8, right: 8, zIndex: 1001 }}> + <DialogCloseButton onClose={handleClose} /> + </Box> + </DialogTitle> + <DialogContent sx={{ mt: 2 }}> + <Grid container rowSpacing={2} columnSpacing={2}> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.taskCode" + source="taskCode" + parse={v => v} + autoFocus + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.task.taskStatus" + source="taskStatus" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.task.taskType" + source="taskType" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.orgLoc" + source="orgLoc" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.orgSite" + source="orgSite" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.targLoc" + source="targLoc" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.targSite" + source="targSite" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.barcode" + source="barcode" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.robotCode" + source="robotCode" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.task.exceStatus" + source="exceStatus" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.expDesc" + source="expDesc" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.task.sort" + source="sort" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.task.expCode" + source="expCode" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <DateInput + label="table.field.task.startTime" + source="startTime" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <DateInput + label="table.field.task.endTime" + source="endTime" + /> + </Grid> + + <Grid item xs={6} display="flex" gap={1}> + <StatusSelectInput /> + </Grid> + <Grid item xs={12} display="flex" gap={1}> + <Stack direction="column" spacing={1} width={'100%'}> + <MemoInput /> + </Stack> + </Grid> + </Grid> + </DialogContent> + <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}> + <Toolbar sx={{ width: '100%', justifyContent: 'space-between' }} > + <SaveButton /> + </Toolbar> + </DialogActions> + </Form> + </Dialog> + </CreateBase> + </> + ) +} + +export default TaskCreate; diff --git a/rsf-admin/src/page/task/TaskEdit.jsx b/rsf-admin/src/page/task/TaskEdit.jsx new file mode 100644 index 0000000..ab88ff1 --- /dev/null +++ b/rsf-admin/src/page/task/TaskEdit.jsx @@ -0,0 +1,182 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { + Edit, + SimpleForm, + FormDataConsumer, + useTranslate, + TextInput, + NumberInput, + BooleanInput, + DateInput, + SelectInput, + ReferenceInput, + ReferenceArrayInput, + AutocompleteInput, + SaveButton, + Toolbar, + Labeled, + NumberField, + required, + useRecordContext, + DeleteButton, +} from 'react-admin'; +import { useWatch, useFormContext } from "react-hook-form"; +import { Stack, Grid, Box, Typography } from '@mui/material'; +import * as Common from '@/utils/common'; +import { EDIT_MODE, REFERENCE_INPUT_PAGESIZE } from '@/config/setting'; +import EditBaseAside from "../components/EditBaseAside"; +import CustomerTopToolBar from "../components/EditTopToolBar"; +import MemoInput from "../components/MemoInput"; +import StatusSelectInput from "../components/StatusSelectInput"; + +const FormToolbar = () => { + const { getValues } = useFormContext(); + + return ( + <Toolbar sx={{ justifyContent: 'space-between' }}> + <SaveButton /> + <DeleteButton mutationMode="optimistic" /> + </Toolbar> + ) +} + +const TaskEdit = () => { + const translate = useTranslate(); + + return ( + <Edit + redirect="list" + mutationMode={EDIT_MODE} + actions={<CustomerTopToolBar />} + aside={<EditBaseAside />} + > + <SimpleForm + shouldUnregister + warnWhenUnsavedChanges + toolbar={<FormToolbar />} + mode="onTouched" + defaultValues={{}} + // validate={(values) => { }} + > + <Grid container width={{ xs: '100%', xl: '80%' }} rowSpacing={3} columnSpacing={3}> + <Grid item xs={12} md={8}> + <Typography variant="h6" gutterBottom> + {translate('common.edit.title.main')} + </Typography> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.taskCode" + source="taskCode" + parse={v => v} + autoFocus + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.task.taskStatus" + source="taskStatus" + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.task.taskType" + source="taskType" + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.orgLoc" + source="orgLoc" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.orgSite" + source="orgSite" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.targLoc" + source="targLoc" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.targSite" + source="targSite" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.barcode" + source="barcode" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.robotCode" + source="robotCode" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.task.exceStatus" + source="exceStatus" + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.expDesc" + source="expDesc" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.task.sort" + source="sort" + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.task.expCode" + source="expCode" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <DateInput + label="table.field.task.startTime" + source="startTime" + /> + </Stack> + <Stack direction='row' gap={2}> + <DateInput + label="table.field.task.endTime" + source="endTime" + /> + </Stack> + + </Grid> + <Grid item xs={12} md={4}> + <Typography variant="h6" gutterBottom> + {translate('common.edit.title.common')} + </Typography> + <StatusSelectInput /> + <Box mt="2em" /> + <MemoInput /> + </Grid> + </Grid> + </SimpleForm> + </Edit > + ) +} + +export default TaskEdit; diff --git a/rsf-admin/src/page/task/TaskList.jsx b/rsf-admin/src/page/task/TaskList.jsx new file mode 100644 index 0000000..c46301c --- /dev/null +++ b/rsf-admin/src/page/task/TaskList.jsx @@ -0,0 +1,180 @@ +import React, { useState, useRef, useEffect, useMemo, useCallback } from "react"; +import { useNavigate } from 'react-router-dom'; +import { + List, + DatagridConfigurable, + SearchInput, + TopToolbar, + SelectColumnsButton, + EditButton, + FilterButton, + CreateButton, + ExportButton, + BulkDeleteButton, + WrapperField, + useRecordContext, + useTranslate, + useNotify, + useListContext, + FunctionField, + TextField, + NumberField, + DateField, + BooleanField, + ReferenceField, + TextInput, + DateTimeInput, + DateInput, + SelectInput, + NumberInput, + ReferenceInput, + ReferenceArrayInput, + AutocompleteInput, + DeleteButton, +} from 'react-admin'; +import { Box, Typography, Card, Stack } from '@mui/material'; +import { styled } from '@mui/material/styles'; +import TaskCreate from "./TaskCreate"; +import TaskPanel from "./TaskPanel"; +import EmptyData from "../components/EmptyData"; +import MyCreateButton from "../components/MyCreateButton"; +import MyExportButton from '../components/MyExportButton'; +import PageDrawer from "../components/PageDrawer"; +import MyField from "../components/MyField"; +import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; +import * as Common from '@/utils/common'; + +const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ + '& .css-1vooibu-MuiSvgIcon-root': { + height: '.9em' + }, + '& .RaDatagrid-row': { + cursor: 'auto' + }, + '& .column-name': { + }, + '& .opt': { + width: 200 + }, +})); + +const filters = [ + <SearchInput source="condition" alwaysOn />, + <DateInput label='common.time.after' source="timeStart" alwaysOn />, + <DateInput label='common.time.before' source="timeEnd" alwaysOn />, + + <TextInput source="taskCode" label="table.field.task.taskCode" />, + <NumberInput source="taskStatus" label="table.field.task.taskStatus" />, + <NumberInput source="taskType" label="table.field.task.taskType" />, + <TextInput source="orgLoc" label="table.field.task.orgLoc" />, + <TextInput source="orgSite" label="table.field.task.orgSite" />, + <TextInput source="targLoc" label="table.field.task.targLoc" />, + <TextInput source="targSite" label="table.field.task.targSite" />, + <TextInput source="barcode" label="table.field.task.barcode" />, + <TextInput source="robotCode" label="table.field.task.robotCode" />, + <NumberInput source="exceStatus" label="table.field.task.exceStatus" />, + <TextInput source="expDesc" label="table.field.task.expDesc" />, + <NumberInput source="sort" label="table.field.task.sort" />, + <TextInput source="expCode" label="table.field.task.expCode" />, + <DateInput source="startTime" label="table.field.task.startTime" />, + <DateInput source="endTime" label="table.field.task.endTime" />, + + <TextInput label="common.field.memo" source="memo" />, + <SelectInput + label="common.field.status" + source="status" + choices={[ + { id: '1', name: 'common.enums.statusTrue' }, + { id: '0', name: 'common.enums.statusFalse' }, + ]} + resettable + />, +] + +const TaskList = () => { + const translate = useTranslate(); + + const [createDialog, setCreateDialog] = useState(false); + const [drawerVal, setDrawerVal] = useState(false); + + return ( + <Box display="flex"> + <List + sx={{ + flexGrow: 1, + transition: (theme) => + theme.transitions.create(['all'], { + duration: theme.transitions.duration.enteringScreen, + }), + marginRight: !!drawerVal ? `${PAGE_DRAWER_WIDTH}px` : 0, + }} + title={"menu.task"} + empty={<EmptyData onClick={() => { setCreateDialog(true) }} />} + filters={filters} + sort={{ field: "create_time", order: "desc" }} + actions={( + <TopToolbar> + <FilterButton /> + <MyCreateButton onClick={() => { setCreateDialog(true) }} /> + <SelectColumnsButton preferenceKey='task' /> + <MyExportButton /> + </TopToolbar> + )} + perPage={DEFAULT_PAGE_SIZE} + > + <StyledDatagrid + preferenceKey='task' + bulkActionButtons={() => <BulkDeleteButton mutationMode={OPERATE_MODE} />} + rowClick={(id, resource, record) => false} + expand={() => <TaskPanel />} + expandSingle={true} + omit={['id', 'createTime', 'createBy', 'memo']} + > + <NumberField source="id" /> + <TextField source="taskCode" label="table.field.task.taskCode" /> + <NumberField source="taskStatus" label="table.field.task.taskStatus" /> + <NumberField source="taskType" label="table.field.task.taskType" /> + <TextField source="orgLoc" label="table.field.task.orgLoc" /> + <TextField source="orgSite" label="table.field.task.orgSite" /> + <TextField source="targLoc" label="table.field.task.targLoc" /> + <TextField source="targSite" label="table.field.task.targSite" /> + <TextField source="barcode" label="table.field.task.barcode" /> + <TextField source="robotCode" label="table.field.task.robotCode" /> + <NumberField source="exceStatus" label="table.field.task.exceStatus" /> + <TextField source="expDesc" label="table.field.task.expDesc" /> + <NumberField source="sort" label="table.field.task.sort" /> + <TextField source="expCode" label="table.field.task.expCode" /> + <DateField source="startTime" label="table.field.task.startTime" showTime /> + <DateField source="endTime" label="table.field.task.endTime" showTime /> + + <ReferenceField source="updateBy" label="common.field.updateBy" reference="user" link={false} sortable={false}> + <TextField source="nickname" /> + </ReferenceField> + <DateField source="updateTime" label="common.field.updateTime" showTime /> + <ReferenceField source="createBy" label="common.field.createBy" reference="user" link={false} sortable={false}> + <TextField source="nickname" /> + </ReferenceField> + <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> + </StyledDatagrid> + </List> + <TaskCreate + open={createDialog} + setOpen={setCreateDialog} + /> + <PageDrawer + title='Task Detail' + drawerVal={drawerVal} + setDrawerVal={setDrawerVal} + > + </PageDrawer> + </Box> + ) +} + +export default TaskList; diff --git a/rsf-admin/src/page/task/TaskPanel.jsx b/rsf-admin/src/page/task/TaskPanel.jsx new file mode 100644 index 0000000..24270ed --- /dev/null +++ b/rsf-admin/src/page/task/TaskPanel.jsx @@ -0,0 +1,141 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { Box, Card, CardContent, Grid, Typography, Tooltip } from '@mui/material'; +import { + useTranslate, + useRecordContext, +} from 'react-admin'; +import PanelTypography from "../components/PanelTypography"; +import * as Common from '@/utils/common' + +const TaskPanel = () => { + const record = useRecordContext(); + if (!record) return null; + const translate = useTranslate(); + return ( + <> + <Card sx={{ width: { xs: 300, sm: 500, md: 600, lg: 800 }, margin: 'auto' }}> + <CardContent> + <Grid container spacing={2}> + <Grid item xs={12} sx={{ display: 'flex', justifyContent: 'space-between' }}> + <Typography variant="h6" gutterBottom align="left" sx={{ + maxWidth: { xs: '100px', sm: '180px', md: '260px', lg: '360px' }, + whiteSpace: 'nowrap', + overflow: 'hidden', + textOverflow: 'ellipsis', + }}> + {Common.camelToPascalWithSpaces(translate('table.field.task.id'))}: {record.id} + </Typography> + {/* inherit, primary, secondary, textPrimary, textSecondary, error */} + <Typography variant="h6" gutterBottom align="right" > + ID: {record.id} + </Typography> + </Grid> + </Grid> + <Grid container spacing={2}> + <Grid item xs={12} container alignContent="flex-end"> + <Typography variant="caption" color="textSecondary" sx={{ wordWrap: 'break-word', wordBreak: 'break-all' }}> + {Common.camelToPascalWithSpaces(translate('common.field.memo'))}:{record.memo} + </Typography> + </Grid> + </Grid> + <Box height={20}> </Box> + <Grid container spacing={2}> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.taskCode" + property={record.taskCode} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.taskStatus" + property={record.taskStatus} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.taskType" + property={record.taskType} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.orgLoc" + property={record.orgLoc} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.orgSite" + property={record.orgSite} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.targLoc" + property={record.targLoc} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.targSite" + property={record.targSite} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.barcode" + property={record.barcode} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.robotCode" + property={record.robotCode} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.exceStatus" + property={record.exceStatus} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.expDesc" + property={record.expDesc} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.sort" + property={record.sort} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.expCode" + property={record.expCode} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.startTime" + property={record.startTime$} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.task.endTime" + property={record.endTime$} + /> + </Grid> + + </Grid> + </CardContent> + </Card > + </> + ); +}; + +export default TaskPanel; diff --git a/rsf-admin/src/page/task/index.jsx b/rsf-admin/src/page/task/index.jsx new file mode 100644 index 0000000..85c3ffe --- /dev/null +++ b/rsf-admin/src/page/task/index.jsx @@ -0,0 +1,19 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { + ListGuesser, + EditGuesser, + ShowGuesser, +} from "react-admin"; + +import TaskList from "./TaskList"; +import TaskEdit from "./TaskEdit"; + +export default { + + list: TaskList, + edit: TaskEdit, + show: ShowGuesser, + recordRepresentation: (record) => { + return `${record.id}` + } +}; diff --git a/rsf-admin/src/page/taskItem/TaskItemCreate.jsx b/rsf-admin/src/page/taskItem/TaskItemCreate.jsx new file mode 100644 index 0000000..315e6d9 --- /dev/null +++ b/rsf-admin/src/page/taskItem/TaskItemCreate.jsx @@ -0,0 +1,203 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { + CreateBase, + useTranslate, + TextInput, + NumberInput, + BooleanInput, + DateInput, + SaveButton, + SelectInput, + ReferenceInput, + ReferenceArrayInput, + AutocompleteInput, + Toolbar, + required, + useDataProvider, + useNotify, + Form, + useCreateController, +} from 'react-admin'; +import { + Dialog, + DialogActions, + DialogContent, + DialogTitle, + Stack, + Grid, + Box, +} from '@mui/material'; +import DialogCloseButton from "../components/DialogCloseButton"; +import StatusSelectInput from "../components/StatusSelectInput"; +import MemoInput from "../components/MemoInput"; + +const TaskItemCreate = (props) => { + const { open, setOpen } = props; + + const translate = useTranslate(); + const notify = useNotify(); + + const handleClose = (event, reason) => { + if (reason !== "backdropClick") { + setOpen(false); + } + }; + + const handleSuccess = async (data) => { + setOpen(false); + notify('common.response.success'); + }; + + const handleError = async (error) => { + notify(error.message || 'common.response.fail', { type: 'error', messageArgs: { _: error.message } }); + }; + + return ( + <> + <CreateBase + record={{}} + transform={(data) => { + return data; + }} + mutationOptions={{ onSuccess: handleSuccess, onError: handleError }} + > + <Dialog + open={open} + onClose={handleClose} + aria-labelledby="form-dialog-title" + fullWidth + disableRestoreFocus + maxWidth="md" // 'xs' | 'sm' | 'md' | 'lg' | 'xl' + > + <Form> + <DialogTitle id="form-dialog-title" sx={{ + position: 'sticky', + top: 0, + backgroundColor: 'background.paper', + zIndex: 1000 + }} + > + {translate('create.title')} + <Box sx={{ position: 'absolute', top: 8, right: 8, zIndex: 1001 }}> + <DialogCloseButton onClose={handleClose} /> + </Box> + </DialogTitle> + <DialogContent sx={{ mt: 2 }}> + <Grid container rowSpacing={2} columnSpacing={2}> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.taskItem.taskId" + source="taskId" + autoFocus + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.taskItem.orderId" + source="orderId" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.taskItem.orderType" + source="orderType" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.taskItem.orderItemId" + source="orderItemId" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.taskItem.sourceCode" + source="sourceCode" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.taskItem.matnrId" + source="matnrId" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.taskItem.maktx" + source="maktx" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.taskItem.matnrCode" + source="matnrCode" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.taskItem.unit" + source="unit" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <NumberInput + label="table.field.taskItem.anfme" + source="anfme" + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.taskItem.batch" + source="batch" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.taskItem.spec" + source="spec" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.taskItem.model" + source="model" + parse={v => v} + /> + </Grid> + <Grid item xs={6} display="flex" gap={1}> + <TextInput + label="table.field.taskItem.fieldsIndex" + source="fieldsIndex" + parse={v => v} + /> + </Grid> + + <Grid item xs={6} display="flex" gap={1}> + <StatusSelectInput /> + </Grid> + <Grid item xs={12} display="flex" gap={1}> + <Stack direction="column" spacing={1} width={'100%'}> + <MemoInput /> + </Stack> + </Grid> + </Grid> + </DialogContent> + <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}> + <Toolbar sx={{ width: '100%', justifyContent: 'space-between' }} > + <SaveButton /> + </Toolbar> + </DialogActions> + </Form> + </Dialog> + </CreateBase> + </> + ) +} + +export default TaskItemCreate; diff --git a/rsf-admin/src/page/taskItem/TaskItemEdit.jsx b/rsf-admin/src/page/taskItem/TaskItemEdit.jsx new file mode 100644 index 0000000..7157484 --- /dev/null +++ b/rsf-admin/src/page/taskItem/TaskItemEdit.jsx @@ -0,0 +1,175 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { + Edit, + SimpleForm, + FormDataConsumer, + useTranslate, + TextInput, + NumberInput, + BooleanInput, + DateInput, + SelectInput, + ReferenceInput, + ReferenceArrayInput, + AutocompleteInput, + SaveButton, + Toolbar, + Labeled, + NumberField, + required, + useRecordContext, + DeleteButton, +} from 'react-admin'; +import { useWatch, useFormContext } from "react-hook-form"; +import { Stack, Grid, Box, Typography } from '@mui/material'; +import * as Common from '@/utils/common'; +import { EDIT_MODE, REFERENCE_INPUT_PAGESIZE } from '@/config/setting'; +import EditBaseAside from "../components/EditBaseAside"; +import CustomerTopToolBar from "../components/EditTopToolBar"; +import MemoInput from "../components/MemoInput"; +import StatusSelectInput from "../components/StatusSelectInput"; + +const FormToolbar = () => { + const { getValues } = useFormContext(); + + return ( + <Toolbar sx={{ justifyContent: 'space-between' }}> + <SaveButton /> + <DeleteButton mutationMode="optimistic" /> + </Toolbar> + ) +} + +const TaskItemEdit = () => { + const translate = useTranslate(); + + return ( + <Edit + redirect="list" + mutationMode={EDIT_MODE} + actions={<CustomerTopToolBar />} + aside={<EditBaseAside />} + > + <SimpleForm + shouldUnregister + warnWhenUnsavedChanges + toolbar={<FormToolbar />} + mode="onTouched" + defaultValues={{}} + // validate={(values) => { }} + > + <Grid container width={{ xs: '100%', xl: '80%' }} rowSpacing={3} columnSpacing={3}> + <Grid item xs={12} md={8}> + <Typography variant="h6" gutterBottom> + {translate('common.edit.title.main')} + </Typography> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.taskItem.taskId" + source="taskId" + autoFocus + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.taskItem.orderId" + source="orderId" + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.taskItem.orderType" + source="orderType" + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.taskItem.orderItemId" + source="orderItemId" + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.taskItem.sourceCode" + source="sourceCode" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.taskItem.matnrId" + source="matnrId" + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.taskItem.maktx" + source="maktx" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.taskItem.matnrCode" + source="matnrCode" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.taskItem.unit" + source="unit" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <NumberInput + label="table.field.taskItem.anfme" + source="anfme" + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.taskItem.batch" + source="batch" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.taskItem.spec" + source="spec" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.taskItem.model" + source="model" + parse={v => v} + /> + </Stack> + <Stack direction='row' gap={2}> + <TextInput + label="table.field.taskItem.fieldsIndex" + source="fieldsIndex" + parse={v => v} + /> + </Stack> + + </Grid> + <Grid item xs={12} md={4}> + <Typography variant="h6" gutterBottom> + {translate('common.edit.title.common')} + </Typography> + <StatusSelectInput /> + <Box mt="2em" /> + <MemoInput /> + </Grid> + </Grid> + </SimpleForm> + </Edit > + ) +} + +export default TaskItemEdit; diff --git a/rsf-admin/src/page/taskItem/TaskItemList.jsx b/rsf-admin/src/page/taskItem/TaskItemList.jsx new file mode 100644 index 0000000..6e1217a --- /dev/null +++ b/rsf-admin/src/page/taskItem/TaskItemList.jsx @@ -0,0 +1,178 @@ +import React, { useState, useRef, useEffect, useMemo, useCallback } from "react"; +import { useNavigate } from 'react-router-dom'; +import { + List, + DatagridConfigurable, + SearchInput, + TopToolbar, + SelectColumnsButton, + EditButton, + FilterButton, + CreateButton, + ExportButton, + BulkDeleteButton, + WrapperField, + useRecordContext, + useTranslate, + useNotify, + useListContext, + FunctionField, + TextField, + NumberField, + DateField, + BooleanField, + ReferenceField, + TextInput, + DateTimeInput, + DateInput, + SelectInput, + NumberInput, + ReferenceInput, + ReferenceArrayInput, + AutocompleteInput, + DeleteButton, +} from 'react-admin'; +import { Box, Typography, Card, Stack } from '@mui/material'; +import { styled } from '@mui/material/styles'; +import TaskItemCreate from "./TaskItemCreate"; +import TaskItemPanel from "./TaskItemPanel"; +import EmptyData from "../components/EmptyData"; +import MyCreateButton from "../components/MyCreateButton"; +import MyExportButton from '../components/MyExportButton'; +import PageDrawer from "../components/PageDrawer"; +import MyField from "../components/MyField"; +import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; +import * as Common from '@/utils/common'; + +const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ + '& .css-1vooibu-MuiSvgIcon-root': { + height: '.9em' + }, + '& .RaDatagrid-row': { + cursor: 'auto' + }, + '& .column-name': { + }, + '& .opt': { + width: 200 + }, +})); + +const filters = [ + <SearchInput source="condition" alwaysOn />, + <DateInput label='common.time.after' source="timeStart" alwaysOn />, + <DateInput label='common.time.before' source="timeEnd" alwaysOn />, + + <NumberInput source="taskId" label="table.field.taskItem.taskId" />, + <NumberInput source="orderId" label="table.field.taskItem.orderId" />, + <NumberInput source="orderType" label="table.field.taskItem.orderType" />, + <NumberInput source="orderItemId" label="table.field.taskItem.orderItemId" />, + <TextInput source="sourceCode" label="table.field.taskItem.sourceCode" />, + <NumberInput source="matnrId" label="table.field.taskItem.matnrId" />, + <TextInput source="maktx" label="table.field.taskItem.maktx" />, + <TextInput source="matnrCode" label="table.field.taskItem.matnrCode" />, + <TextInput source="unit" label="table.field.taskItem.unit" />, + <NumberInput source="anfme" label="table.field.taskItem.anfme" />, + <TextInput source="batch" label="table.field.taskItem.batch" />, + <TextInput source="spec" label="table.field.taskItem.spec" />, + <TextInput source="model" label="table.field.taskItem.model" />, + <TextInput source="fieldsIndex" label="table.field.taskItem.fieldsIndex" />, + + <TextInput label="common.field.memo" source="memo" />, + <SelectInput + label="common.field.status" + source="status" + choices={[ + { id: '1', name: 'common.enums.statusTrue' }, + { id: '0', name: 'common.enums.statusFalse' }, + ]} + resettable + />, +] + +const TaskItemList = () => { + const translate = useTranslate(); + + const [createDialog, setCreateDialog] = useState(false); + const [drawerVal, setDrawerVal] = useState(false); + + return ( + <Box display="flex"> + <List + sx={{ + flexGrow: 1, + transition: (theme) => + theme.transitions.create(['all'], { + duration: theme.transitions.duration.enteringScreen, + }), + marginRight: !!drawerVal ? `${PAGE_DRAWER_WIDTH}px` : 0, + }} + title={"menu.taskItem"} + empty={<EmptyData onClick={() => { setCreateDialog(true) }} />} + filters={filters} + sort={{ field: "create_time", order: "desc" }} + actions={( + <TopToolbar> + <FilterButton /> + <MyCreateButton onClick={() => { setCreateDialog(true) }} /> + <SelectColumnsButton preferenceKey='taskItem' /> + <MyExportButton /> + </TopToolbar> + )} + perPage={DEFAULT_PAGE_SIZE} + > + <StyledDatagrid + preferenceKey='taskItem' + bulkActionButtons={() => <BulkDeleteButton mutationMode={OPERATE_MODE} />} + rowClick={(id, resource, record) => false} + expand={() => <TaskItemPanel />} + expandSingle={true} + omit={['id', 'createTime', 'createBy', 'memo']} + > + <NumberField source="id" /> + <NumberField source="taskId" label="table.field.taskItem.taskId" /> + <NumberField source="orderId" label="table.field.taskItem.orderId" /> + <NumberField source="orderType" label="table.field.taskItem.orderType" /> + <NumberField source="orderItemId" label="table.field.taskItem.orderItemId" /> + <TextField source="sourceCode" label="table.field.taskItem.sourceCode" /> + <NumberField source="matnrId" label="table.field.taskItem.matnrId" /> + <TextField source="maktx" label="table.field.taskItem.maktx" /> + <TextField source="matnrCode" label="table.field.taskItem.matnrCode" /> + <TextField source="unit" label="table.field.taskItem.unit" /> + <NumberField source="anfme" label="table.field.taskItem.anfme" /> + <TextField source="batch" label="table.field.taskItem.batch" /> + <TextField source="spec" label="table.field.taskItem.spec" /> + <TextField source="model" label="table.field.taskItem.model" /> + <TextField source="fieldsIndex" label="table.field.taskItem.fieldsIndex" /> + + <ReferenceField source="updateBy" label="common.field.updateBy" reference="user" link={false} sortable={false}> + <TextField source="nickname" /> + </ReferenceField> + <DateField source="updateTime" label="common.field.updateTime" showTime /> + <ReferenceField source="createBy" label="common.field.createBy" reference="user" link={false} sortable={false}> + <TextField source="nickname" /> + </ReferenceField> + <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> + </StyledDatagrid> + </List> + <TaskItemCreate + open={createDialog} + setOpen={setCreateDialog} + /> + <PageDrawer + title='TaskItem Detail' + drawerVal={drawerVal} + setDrawerVal={setDrawerVal} + > + </PageDrawer> + </Box> + ) +} + +export default TaskItemList; diff --git a/rsf-admin/src/page/taskItem/TaskItemPanel.jsx b/rsf-admin/src/page/taskItem/TaskItemPanel.jsx new file mode 100644 index 0000000..52f58c1 --- /dev/null +++ b/rsf-admin/src/page/taskItem/TaskItemPanel.jsx @@ -0,0 +1,135 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { Box, Card, CardContent, Grid, Typography, Tooltip } from '@mui/material'; +import { + useTranslate, + useRecordContext, +} from 'react-admin'; +import PanelTypography from "../components/PanelTypography"; +import * as Common from '@/utils/common' + +const TaskItemPanel = () => { + const record = useRecordContext(); + if (!record) return null; + const translate = useTranslate(); + return ( + <> + <Card sx={{ width: { xs: 300, sm: 500, md: 600, lg: 800 }, margin: 'auto' }}> + <CardContent> + <Grid container spacing={2}> + <Grid item xs={12} sx={{ display: 'flex', justifyContent: 'space-between' }}> + <Typography variant="h6" gutterBottom align="left" sx={{ + maxWidth: { xs: '100px', sm: '180px', md: '260px', lg: '360px' }, + whiteSpace: 'nowrap', + overflow: 'hidden', + textOverflow: 'ellipsis', + }}> + {Common.camelToPascalWithSpaces(translate('table.field.taskItem.id'))}: {record.id} + </Typography> + {/* inherit, primary, secondary, textPrimary, textSecondary, error */} + <Typography variant="h6" gutterBottom align="right" > + ID: {record.id} + </Typography> + </Grid> + </Grid> + <Grid container spacing={2}> + <Grid item xs={12} container alignContent="flex-end"> + <Typography variant="caption" color="textSecondary" sx={{ wordWrap: 'break-word', wordBreak: 'break-all' }}> + {Common.camelToPascalWithSpaces(translate('common.field.memo'))}:{record.memo} + </Typography> + </Grid> + </Grid> + <Box height={20}> </Box> + <Grid container spacing={2}> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.taskId" + property={record.taskId} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.orderId" + property={record.orderId} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.orderType" + property={record.orderType} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.orderItemId" + property={record.orderItemId} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.sourceCode" + property={record.sourceCode} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.matnrId" + property={record.matnrId} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.maktx" + property={record.maktx} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.matnrCode" + property={record.matnrCode} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.unit" + property={record.unit} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.anfme" + property={record.anfme} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.batch" + property={record.batch} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.spec" + property={record.spec} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.model" + property={record.model} + /> + </Grid> + <Grid item xs={6}> + <PanelTypography + title="table.field.taskItem.fieldsIndex" + property={record.fieldsIndex} + /> + </Grid> + + </Grid> + </CardContent> + </Card > + </> + ); +}; + +export default TaskItemPanel; diff --git a/rsf-admin/src/page/taskItem/index.jsx b/rsf-admin/src/page/taskItem/index.jsx new file mode 100644 index 0000000..da6cff0 --- /dev/null +++ b/rsf-admin/src/page/taskItem/index.jsx @@ -0,0 +1,18 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { + ListGuesser, + EditGuesser, + ShowGuesser, +} from "react-admin"; + +import TaskItemList from "./TaskItemList"; +import TaskItemEdit from "./TaskItemEdit"; + +export default { + list: TaskItemList, + edit: TaskItemEdit, + show: ShowGuesser, + recordRepresentation: (record) => { + return `${record.id}` + } +}; -- Gitblit v1.9.1