#
luxiaotao1123
2024-10-10 04e0677e23d17324ef80508b1019a0fa19db6aa4
zy-acs-flow/src/map/settings/MapSettings.jsx
@@ -11,9 +11,6 @@
    MenuItem,
    InputLabel,
    FormControl,
    FormHelperText,
    Checkbox,
    FormControlLabel,
    Stack,
} from '@mui/material';
import { useTranslate } from 'react-admin';
@@ -35,7 +32,7 @@
        },
    });
    // 监听表单值的变化
    // 监听所有字段的变化
    const watchAllFields = watch();
    useEffect(() => {
@@ -71,12 +68,23 @@
        }
    };
    // 旋转滑块的刻度
    const rotationMarks = [
        { value: 0, label: '0°' },
        { value: 90, label: '90°' },
        { value: 180, label: '180°' },
        { value: 270, label: '270°' },
        { value: 360, label: '360°' },
    ];
    return (
        <Box component="form" onSubmit={handleSubmit(onFormSubmit)} noValidate sx={{ mt: 2 }}>
            <Grid container spacing={2}>
        <Box component="form" onSubmit={handleSubmit(onFormSubmit)} noValidate sx={{ mt: 0 }}>
            <Grid container spacing={1}>
                {/* 位置 */}
                <Grid item xs={12}>
                    <Typography variant="h6">{translate('map.settings.position')}</Typography>
                    <Typography variant="button">
                        {translate('page.map.settings.map.base.position')}
                    </Typography>
                </Grid>
                <Grid item xs={6}>
                    <Controller
@@ -117,7 +125,9 @@
                {/* 缩放 */}
                <Grid item xs={12}>
                    <Typography variant="h6">{translate('map.settings.scale')}</Typography>
                    <Typography variant="button">
                        {translate('page.map.settings.map.base.scale')}
                    </Typography>
                </Grid>
                <Grid item xs={6}>
                    <Controller
@@ -160,9 +170,11 @@
                {/* 旋转 */}
                <Grid item xs={12}>
                    <Typography variant="h6">{translate('map.settings.rotation')}</Typography>
                    <Typography variant="button">
                        {translate('page.map.settings.map.base.rotation')}
                    </Typography>
                </Grid>
                <Grid item xs={12}>
                <Grid item xs={8}>
                    <Controller
                        name="rotation"
                        control={control}
@@ -172,7 +184,9 @@
                                min={0}
                                max={360}
                                step={1}
                                marks={rotationMarks}
                                valueLabelDisplay="auto"
                                valueLabelFormat={(value) => `${value}°`}
                                onChange={(e, value) => {
                                    field.onChange(value);
                                    updateSprite({ ...watchAllFields, rotation: value });
@@ -181,10 +195,31 @@
                        )}
                    />
                </Grid>
                <Grid item xs={4}>
                    <Controller
                        name="rotation"
                        control={control}
                        render={({ field }) => (
                            <TextField
                                {...field}
                                label={`${translate('page.map.settings.map.base.rotation')} (°)`}
                                type="number"
                                fullWidth
                                inputProps={{ min: 0, max: 360 }}
                                onChange={(e) => {
                                    field.onChange(e);
                                    updateSprite({ ...watchAllFields, rotation: parseFloat(e.target.value) });
                                }}
                            />
                        )}
                    />
                </Grid>
                {/* 复制 */}
                <Grid item xs={12}>
                    <Typography variant="h6">{translate('map.settings.copy')}</Typography>
                    <Typography variant="button">
                        {translate('page.map.settings.map.copy.title')}
                    </Typography>
                </Grid>
                <Grid item xs={6}>
                    <Controller
@@ -192,12 +227,25 @@
                        control={control}
                        render={({ field }) => (
                            <FormControl fullWidth>
                                <InputLabel>{translate('map.settings.copyDirection')}</InputLabel>
                                <Select {...field} label={translate('map.settings.copyDirection')}>
                                    <MenuItem value="left">{translate('map.settings.left')}</MenuItem>
                                    <MenuItem value="right">{translate('map.settings.right')}</MenuItem>
                                    <MenuItem value="up">{translate('map.settings.up')}</MenuItem>
                                    <MenuItem value="down">{translate('map.settings.down')}</MenuItem>
                                <InputLabel>
                                    {translate('page.map.settings.map.copy.direction')}
                                </InputLabel>
                                <Select
                                    {...field}
                                    label={translate('page.map.settings.map.copy.direction')}
                                >
                                    <MenuItem value="left">
                                        {translate('page.map.settings.map.copy.left')}
                                    </MenuItem>
                                    <MenuItem value="right">
                                        {translate('page.map.settings.map.copy.right')}
                                    </MenuItem>
                                    <MenuItem value="up">
                                        {translate('page.map.settings.map.copy.up')}
                                    </MenuItem>
                                    <MenuItem value="down">
                                        {translate('page.map.settings.map.copy.down')}
                                    </MenuItem>
                                </Select>
                            </FormControl>
                        )}
@@ -210,7 +258,7 @@
                        render={({ field }) => (
                            <TextField
                                {...field}
                                label={translate('map.settings.copyCount')}
                                label={translate('page.map.settings.map.copy.count')}
                                type="number"
                                fullWidth
                                inputProps={{ min: 1 }}
@@ -223,10 +271,10 @@
                <Grid item xs={12}>
                    <Stack direction="row" spacing={2}>
                        <Button type="submit" variant="contained" color="primary">
                            {translate('common.submit')}
                            {translate('ra.action.confirm')}
                        </Button>
                        <Button variant="outlined" color="secondary" onClick={() => reset()}>
                            {translate('common.reset')}
                            {translate('common.action.reset')}
                        </Button>
                    </Stack>
                </Grid>