From 6bee3457639f04f3a3576c1a32dcb7d5632cd3d4 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期五, 11 十月 2024 15:52:49 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/settings/CopyDrawer.jsx | 221 +++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 197 insertions(+), 24 deletions(-) diff --git a/zy-acs-flow/src/map/settings/CopyDrawer.jsx b/zy-acs-flow/src/map/settings/CopyDrawer.jsx index 1fa447a..60b46e2 100644 --- a/zy-acs-flow/src/map/settings/CopyDrawer.jsx +++ b/zy-acs-flow/src/map/settings/CopyDrawer.jsx @@ -15,6 +15,12 @@ Divider, Drawer, IconButton, + LinearProgress, + Switch, + FormControlLabel, + FormLabel, + ToggleButtonGroup, + ToggleButton, } from '@mui/material'; import CloseIcon from '@mui/icons-material/Close'; import { useTranslate } from 'react-admin'; @@ -25,17 +31,62 @@ } from '../constants'; import { useNotification } from '../Notification'; +const incrementOptionsMap = { + [DEVICE_TYPE.SHELF]: [ + { value: 'row', label: 'page.map.settings.config.shelf.row' }, + { value: 'bay', label: 'page.map.settings.config.shelf.bay' }, + ], + [DEVICE_TYPE.CHARGE]: [ + { value: 'no', label: 'page.map.settings.config.base.no' }, + ], + [DEVICE_TYPE.STATION]: [ + { value: 'no', label: 'page.map.settings.config.base.no' }, + ], + [DEVICE_TYPE.POINT]: [ + { value: 'no', label: 'page.map.settings.config.base.no' }, + ], +}; + const CopyDrawer = (props) => { - const { open, onCancel, sprite, width = PAGE_DRAWER_WIDTH, handleOnCopy } = props; + const { open, onCancel, sprite, value, width = PAGE_DRAWER_WIDTH, handleOnCopy } = props; const notify = useNotification(); const translate = useTranslate(); const deviceType = sprite?.data?.type; + const incrementOptions = incrementOptionsMap[deviceType] const { control, handleSubmit, reset, watch, setValue, formState: { errors } } = useForm({ - defaultValues: {}, + defaultValues: { + copyDirect: value?.copyDirect || '', + copyCount: value?.copyCount || '', + gap: 0.0, + autoIncrement: false, + incrementMode: 'ascending', + }, }); + useEffect(() => { + if (watch('autoIncrement') && incrementOptions && incrementOptions.length > 0) { + const currentIncrementValue = watch('incrementValue'); + if (!currentIncrementValue) { + setValue('incrementValue', incrementOptions[0].value); + } + } else { + setValue('incrementValue', undefined); + } + }, [watch('autoIncrement'), incrementOptions, setValue, watch]); + useEffect(() => { + if (sprite && value && Object.keys(value).length > 0) { + reset({ + copyDirect: value.copyDirect || '', + copyCount: value.copyCount || '', + gap: 0.0, + autoIncrement: false, + incrementMode: 'ascending', + incrementValue: undefined, + }); + } + }, [sprite, value, reset, incrementOptions, setValue]); const handleClose = () => { onCancel(); @@ -43,6 +94,8 @@ const onFormSubmit = (data) => { if (data) { + console.log(data); + } if (handleOnCopy) { handleOnCopy(data); @@ -59,7 +112,7 @@ onClose={handleClose} sx={{ zIndex: 100, opacity: 1 }} > - {open && ( + {(open) && ( <Box pt={12} width={{ xs: '100vW', sm: width }} height={'calc(100vh - 200px);'} mt={{ xs: 2, sm: 1 }} sx={{ }}> <Stack direction="row" p={2}> @@ -74,31 +127,151 @@ <Box p={3}> <Box component="form" onSubmit={handleSubmit(onFormSubmit)} noValidate sx={{ mt: 0 }}> <Grid container spacing={1.4}> - {deviceType === DEVICE_TYPE.SHELF && ( - <> - </> - )} - - {deviceType === DEVICE_TYPE.CHARGE && ( - <> - </> - )} - - {deviceType === DEVICE_TYPE.STATION && ( - <> - </> - )} - - {deviceType === DEVICE_TYPE.POINT && ( - <> - </> - )} - + <Grid item xs={6}> + <Controller + name="copyDirect" + control={control} + render={({ field }) => ( + <TextField + {...field} + label={translate('page.map.settings.map.copy.direction')} + InputProps={{ + readOnly: true, + }} + fullWidth + /> + )} + /> + </Grid> + <Grid item xs={6}> + <Controller + name="copyCount" + control={control} + render={({ field }) => ( + <TextField + {...field} + label={translate('page.map.settings.map.copy.count')} + InputProps={{ + readOnly: true, + }} + fullWidth + /> + )} + /> + </Grid> <Grid item xs={12}> + <Controller + name="gap" + control={control} + render={({ field }) => ( + <TextField + {...field} + label={translate('page.map.settings.map.copy.field.gap')} + type="number" + sx={{ width: '50%' }} + fullWidth + inputProps={{ + min: 0, + step: 1, + }} + /> + )} + /> + </Grid> + + <Grid item xs={12} mt={2} mb={1}> <Divider /> </Grid> - + + <Grid item xs={12}> + <Controller + name="autoIncrement" + control={control} + render={({ field }) => ( + <FormControlLabel + control={ + <Switch + {...field} + checked={field.value || false} + onChange={(e) => field.onChange(e.target.checked)} + /> + } + label={translate('page.map.settings.map.copy.field.autoIncrement')} + /> + )} + /> + </Grid> + + {(!!incrementOptions?.length && watch('autoIncrement')) && ( + <Grid item xs={12}> + <FormControl fullWidth> + <FormLabel sx={{ mb: 1 }}> + {translate('page.map.settings.map.copy.field.incrementValue')} + </FormLabel> + <Controller + name='incrementValue' + control={control} + render={({ field }) => ( + <ToggleButtonGroup + {...field} + value={field.value} + exclusive + onChange={(event, value) => { + field.onChange(value); + }} + fullWidth + > + {incrementOptions.map((option, idx) => ( + <ToggleButton key={idx} value={option.value}> + {translate(option.label)} + </ToggleButton> + ))} + </ToggleButtonGroup> + )} + /> + </FormControl> + </Grid> + )} + + {watch('autoIncrement') && ( + <Grid item xs={12}> + <FormControl fullWidth> + <FormLabel sx={{ + mb: 1 + }}> + {translate('page.map.settings.map.copy.field.incrementMode')} + </FormLabel> + <Controller + name="incrementMode" + control={control} + render={({ field }) => ( + <ToggleButtonGroup + {...field} + value={field.value} + exclusive + onChange={(event, value) => { + field.onChange(value); + }} + fullWidth + > + <ToggleButton value="ascending"> + {translate('page.map.settings.map.copy.field.ascend')} + </ToggleButton> + <ToggleButton value="descending"> + {translate('page.map.settings.map.copy.field.descend')} + </ToggleButton> + </ToggleButtonGroup> + )} + /> + </FormControl> + </Grid> + )} + + <Grid item xs={12} mt={2}> + <Divider /> + </Grid> + <Grid item xs={12} mt={2}> <Stack direction="row" spacing={2}> <Button variant="contained" color="primary" type="submit"> -- Gitblit v1.9.1