| | |
| | | Divider, |
| | | } from '@mui/material'; |
| | | import MuiInput from '@mui/material/Input'; |
| | | import { styled } from '@mui/material/styles'; |
| | | import { useTranslate } from 'react-admin'; |
| | | import * as Tool from '../tool'; |
| | | import ConfirmButton from '../../page/components/ConfirmButton'; |
| | | |
| | | const MapSettings = (props) => { |
| | | const { sprite, onSubmit } = props; |
| | | const { sprite, setSpriteSettings, onSubmit } = props; |
| | | const translate = useTranslate(); |
| | | |
| | | const { control, handleSubmit, reset, watch } = useForm({ |
| | |
| | | rotation: (sprite?.rotation * 180) / Math.PI || 0, |
| | | copyDirection: 'right', |
| | | copyCount: 1, |
| | | // 其他默认值... |
| | | }, |
| | | }); |
| | | |
| | | // 监听所有字段的变化 |
| | | const watchAllFields = watch(); |
| | | |
| | | useEffect(() => { |
| | |
| | | scaleX: sprite.scale.x, |
| | | scaleY: sprite.scale.y, |
| | | rotation: (sprite.rotation * 180) / Math.PI, |
| | | // 设置其他字段的初始值 |
| | | }); |
| | | } |
| | | }, [sprite, reset]); |
| | | |
| | | // 更新精灵属性的函数 |
| | | const updateSprite = (data) => { |
| | | if (sprite) { |
| | | sprite.position.x = data.x; |
| | |
| | | sprite.scale.x = data.scaleX; |
| | | sprite.scale.y = data.scaleY; |
| | | sprite.rotation = (data.rotation * Math.PI) / 180; |
| | | // 更新其他属性... |
| | | } |
| | | }; |
| | | |
| | | // 处理表单提交 |
| | | const onFormSubmit = (data) => { |
| | | updateSprite(data); |
| | | if (onSubmit) { |
| | | onSubmit(data); |
| | | } |
| | | }; |
| | | |
| | | // 旋转滑块的刻度 |
| | | 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: 0 }}> |
| | |
| | | </Grid> |
| | | <Grid item xs={12}> |
| | | <Stack direction="row" spacing={2}> |
| | | <Button variant="outlined" color="error"> |
| | | <Button variant="outlined" color="error" onClick={() => { |
| | | Tool.getMapContainer().removeChild(sprite); |
| | | setSpriteSettings(null); |
| | | Tool.removeSelectedEffect(); |
| | | reset(); |
| | | }}> |
| | | {translate('ra.action.delete')} |
| | | </Button> |
| | | {/* <ConfirmButton /> */} |
| | | </Stack> |
| | | </Grid> |
| | | </Grid> |