From 822d9d9494cc575c1bcdbaa51d68da817236c0b8 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期六, 12 十月 2024 08:13:56 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/settings/CopyDrawer.jsx | 346 ++++++++++++++++++++++++++++++--------------------------- 1 files changed, 183 insertions(+), 163 deletions(-) diff --git a/zy-acs-flow/src/map/settings/CopyDrawer.jsx b/zy-acs-flow/src/map/settings/CopyDrawer.jsx index 2229124..f72ab02 100644 --- a/zy-acs-flow/src/map/settings/CopyDrawer.jsx +++ b/zy-acs-flow/src/map/settings/CopyDrawer.jsx @@ -5,11 +5,12 @@ Grid, Typography, TextField, - Slider, + Card, + CardContent, Button, Select, MenuItem, - InputLabel, + useTheme, FormControl, Stack, Divider, @@ -79,6 +80,9 @@ const { open, onCancel, sprite, value, width = PAGE_DRAWER_WIDTH, handleOnCopy } = props; const notify = useNotification(); const translate = useTranslate(); + const theme = useTheme(); + const themeMode = theme.palette.mode; + const deviceType = sprite?.data?.type; const incrementOptions = incrementOptionsMap[deviceType] @@ -137,173 +141,189 @@ </Stack> <Box p={3}> - <Box component="form" onSubmit={handleSubmit(onFormSubmit)} noValidate sx={{ mt: 0 }}> - <Grid container spacing={1.4}> - <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} - rules={{ validate: (value) => validateIncrement(value, deviceType, sprite, translate) }} - render={({ field }) => ( - <FormControlLabel - control={ - <Switch + <Card sx={{ + p: 2, + transition: '0.3s', + boxShadow: themeMode === 'light' + ? '0px 2px 8px rgba(0, 0, 0, 0.1)' + : '0px 2px 2px rgba(255, 255, 255, 0.1)', + '&:hover': { + boxShadow: themeMode === 'light' + ? '0px 4px 16px rgba(0, 0, 0, 0.2)' + : '0px 4px 8px rgba(255, 255, 255, 0.2)', + }, + borderRadius: '8px', + }}> + <CardContent> + <Box component="form" onSubmit={handleSubmit(onFormSubmit)} noValidate sx={{ mt: 0 }}> + <Grid container spacing={1.4}> + <Grid item xs={6}> + <Controller + name="copyDirect" + control={control} + render={({ field }) => ( + <TextField {...field} - checked={field.value || false} - onChange={(e) => field.onChange(e.target.checked)} + label={translate('page.map.settings.map.copy.direction')} + InputProps={{ + readOnly: true, + }} + fullWidth /> - } - label={translate('page.map.settings.map.copy.field.autoIncrement')} + )} /> + </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} + rules={{ validate: (value) => validateIncrement(value, deviceType, sprite, translate) }} + 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')} + /> + )} + /> + {errors.autoIncrement && ( + <Typography color="error"> + {errors.autoIncrement.message} + </Typography> + )} + </Grid> + + {(!!incrementOptions?.length && 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) => { + if (value !== null) { + field.onChange(value); + } + }} + fullWidth + > + {incrementOptions.map((option, idx) => ( + <ToggleButton key={idx} value={option.value}> + {translate(option.label)} + </ToggleButton> + ))} + </ToggleButtonGroup> + )} + /> + </FormControl> + </Grid> )} - /> - {errors.autoIncrement && ( - <Typography color="error"> - {errors.autoIncrement.message} - </Typography> - )} - </Grid> - {(!!incrementOptions?.length && 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) => { - if (value !== null) { - field.onChange(value); - } - }} - fullWidth - > - {incrementOptions.map((option, idx) => ( - <ToggleButton key={idx} value={option.value}> - {translate(option.label)} - </ToggleButton> - ))} - </ToggleButtonGroup> - )} - /> - </FormControl> + {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) => { + if (value !== null) { + 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"> + {translate('ra.action.confirm')} + </Button> + </Stack> + </Grid> + </Grid> - )} - - {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) => { - if (value !== null) { - 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"> - {translate('ra.action.confirm')} - </Button> - </Stack> - </Grid> - - </Grid> - </Box> + </Box> + </CardContent> + </Card> </Box> </Box> )} -- Gitblit v1.9.1