From 9fc7622352e2c84dacd90dfce103eb8ff1128678 Mon Sep 17 00:00:00 2001 From: skyouc Date: 星期三, 09 四月 2025 14:07:47 +0800 Subject: [PATCH] 任务列表界面优化 --- rsf-admin/src/page/task/TaskItemList.jsx | 152 ++++++++++++++++ rsf-admin/src/page/task/TaskItemCreate.jsx | 190 +++++++++++++++++++++ rsf-admin/src/page/taskLog/TaskItemLogList.jsx | 159 +++++++++++++++++ 3 files changed, 501 insertions(+), 0 deletions(-) diff --git a/rsf-admin/src/page/task/TaskItemCreate.jsx b/rsf-admin/src/page/task/TaskItemCreate.jsx new file mode 100644 index 0000000..02bdbd1 --- /dev/null +++ b/rsf-admin/src/page/task/TaskItemCreate.jsx @@ -0,0 +1,190 @@ +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}> + <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}> + <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/task/TaskItemList.jsx b/rsf-admin/src/page/task/TaskItemList.jsx new file mode 100644 index 0000000..67ae0ab --- /dev/null +++ b/rsf-admin/src/page/task/TaskItemList.jsx @@ -0,0 +1,152 @@ +import React, { useState, useRef, useEffect, useMemo, useCallback } from "react"; +import { useFetcher, useNavigate } from 'react-router-dom'; +import { + List, + DatagridConfigurable, + SearchInput, + TopToolbar, + SelectColumnsButton, + FilterButton, + useTranslate, + TextField, + NumberField, + DateField, + BooleanField, + ReferenceField, + TextInput, + DateInput, + SelectInput, + NumberInput, + useGetRecordId, +} from 'react-admin'; +import { Box, Typography, Card, Stack } from '@mui/material'; +import { styled } from '@mui/material/styles'; +import PageDrawer from "../components/PageDrawer"; +import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; +import MyCreateButton from "../components/MyCreateButton"; +import TaskItemCreate from "./TaskItemCreate"; + +const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ + '& .css-1vooibu-MuiSvgIcon-root': { + height: '.9em' + }, + '& .RaDatagrid-row': { + cursor: 'auto', + maring: '1em' + }, + '& .column-name': { + }, + '& .opt': { + width: 220 + }, +})); + +const filters = [ + <SearchInput source="condition" alwaysOn />, + <DateInput label='common.time.after' source="timeStart" />, + <DateInput label='common.time.before' source="timeEnd" />, + <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" />, + <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 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); + const recordId = useGetRecordId(); + + return ( + <Box display="flex"> + <List + resource="taskItem" + 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={false} + pagination={false} + filters={filters} + filter={{taskId: recordId}} + 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={false} + rowClick={(id, resource, record) => false} + // expand={() => <TaskItemPanel />} + expandSingle={true} + omit={['id', 'createTime', 'createBy', 'memo', 'taskId', 'orderId', 'orderItemId', 'matnrId']} + > + <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" /> + <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" /> + <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} /> + </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/taskLog/TaskItemLogList.jsx b/rsf-admin/src/page/taskLog/TaskItemLogList.jsx new file mode 100644 index 0000000..72abff1 --- /dev/null +++ b/rsf-admin/src/page/taskLog/TaskItemLogList.jsx @@ -0,0 +1,159 @@ +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 MyExportButton from '../components/MyExportButton'; +import PageDrawer from "../components/PageDrawer"; +import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; + +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="taskItemId" label="table.field.taskItemLog.taskItemId" />, + <NumberInput source="taskId" label="table.field.taskItemLog.taskId" />, + <NumberInput source="orderId" label="table.field.taskItemLog.orderId" />, + <TextInput source="orderType" label="table.field.taskItemLog.orderType" />, + <NumberInput source="orderItemId" label="table.field.taskItemLog.orderItemId" />, + <NumberInput source="source" label="table.field.taskItemLog.source" />, + <NumberInput source="matnrId" label="table.field.taskItemLog.matnrId" />, + <TextInput source="maktx" label="table.field.taskItemLog.maktx" />, + <TextInput source="matnrCode" label="table.field.taskItemLog.matnrCode" />, + <TextInput source="trackCode" label="table.field.taskItemLog.trackCode" />, + <TextInput source="unit" label="table.field.taskItemLog.unit" />, + <NumberInput source="anfme" label="table.field.taskItemLog.anfme" />, + <TextInput source="batch" label="table.field.taskItemLog.batch" />, + <TextInput source="spec" label="table.field.taskItemLog.spec" />, + <TextInput source="model" label="table.field.taskItemLog.model" />, + <TextInput source="fieldsIndex" label="table.field.taskItemLog.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 TaskItemLogList = () => { + 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.taskItemLog"} + filters={filters} + empty={false} + sort={{ field: "create_time", order: "desc" }} + actions={( + <TopToolbar> + <FilterButton /> + <SelectColumnsButton preferenceKey='taskItemLog' /> + <MyExportButton /> + </TopToolbar> + )} + perPage={DEFAULT_PAGE_SIZE} + > + <StyledDatagrid + preferenceKey='taskItemLog' + bulkActionButtons={false} + rowClick={(id, resource, record) => false} + expandSingle={true} + omit={['id', 'createTime', 'createBy', 'memo', 'taskId', 'orderId', 'orderItemId', 'matnrId']} + > + <NumberField source="id" /> + <NumberField source="taskId" label="table.field.taskItemLog.taskId" /> + <NumberField source="orderId" label="table.field.taskItemLog.orderId" /> + <TextField source="orderType" label="table.field.taskItemLog.orderType" /> + <NumberField source="orderItemId" label="table.field.taskItemLog.orderItemId" /> + <NumberField source="source" label="table.field.taskItemLog.source" /> + <NumberField source="matnrId" label="table.field.taskItemLog.matnrId" /> + <TextField source="maktx" label="table.field.taskItemLog.maktx" /> + <TextField source="matnrCode" label="table.field.taskItemLog.matnrCode" /> + <TextField source="trackCode" label="table.field.taskItemLog.trackCode" /> + <TextField source="unit" label="table.field.taskItemLog.unit" /> + <NumberField source="anfme" label="table.field.taskItemLog.anfme" /> + <TextField source="batch" label="table.field.taskItemLog.batch" /> + <TextField source="spec" label="table.field.taskItemLog.spec" /> + <TextField source="model" label="table.field.taskItemLog.model" /> + <TextField source="updateBy$" label="common.field.updateBy"/> + <TextField source="createBy$" label="common.field.createBy"/> + <DateField source="updateTime" label="common.field.updateTime" showTime /> + <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} /> + </StyledDatagrid> + </List> + <PageDrawer + title='TaskItemLog Detail' + drawerVal={drawerVal} + setDrawerVal={setDrawerVal} + > + </PageDrawer> + </Box> + ) +} + +export default TaskItemLogList; -- Gitblit v1.9.1