From ec5a22c126ea778b8baea29a078dabb05184b65a Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期三, 09 十月 2024 10:57:29 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/MapPage.jsx | 71 ++++++++++++++++++++++++++++------- 1 files changed, 57 insertions(+), 14 deletions(-) diff --git a/zy-acs-flow/src/map/MapPage.jsx b/zy-acs-flow/src/map/MapPage.jsx index decde65..b205b29 100644 --- a/zy-acs-flow/src/map/MapPage.jsx +++ b/zy-acs-flow/src/map/MapPage.jsx @@ -21,20 +21,23 @@ import Player from './player'; import * as Tool from './tool'; import { NotificationProvider, useNotification } from './Notification'; +import Device from "./Device"; let player; const Map = () => { + const theme = useTheme(); + const themeMode = theme.palette.mode; + const notify = useNotification(); + const mapRef = useRef(); const contentRef = useRef(); const [app, setApp] = useState(null); const [mapContainer, setMapContainer] = useState(null); - const notify = useNotification(); const [mode, setMode] = useState(MapMode.OBSERVER_MODE); + const [deviceVisible, setDeviceVisible] = React.useState(false); - const theme = useTheme(); - const themeMode = theme.palette.mode; useEffect(() => { Tool.patchRaLayout('0px'); @@ -90,6 +93,16 @@ switchMode(mode); }, [mode]); + const onDrop = (sprite, type, x, y) => { + const { mapX, mapY } = Tool.getRealPosition(x, y); + sprite.x = mapX; + sprite.y = mapY; + + // Utils.initSprite(sprite, type); + // mapContainer.addChild(sprite); + // Utils.beMovable(sprite); + }; + const actions = [ { icon: <FileCopyIcon />, name: '澶嶅埗' }, { icon: <SaveIcon />, name: '淇濆瓨' }, @@ -128,6 +141,39 @@ }} /> <Box sx={{ flexGrow: 1 }} /> + + {mode === MapMode.OBSERVER_MODE && ( + <> + <Button + variant="contained" + color="primary" + sx={{ mr: 1 }} + > + 鍋滄RCS杩愯浆 + </Button> + <Button variant="contained" color="secondary"> + 妯℃嫙AGV杩愯 + </Button> + </> + )} + + {mode === MapMode.MOVABLE_MODE && ( + <> + <Button + variant="contained" + color="primary" + sx={{ mr: 1 }} + > + 娣诲姞妯″瀷 + </Button> + </> + )} + + {mode === MapMode.SETTINGS_MODE && ( + <> + </> + )} + <Select value={mode} onChange={(event) => { @@ -136,7 +182,7 @@ variant="outlined" size="small" sx={{ - mr: 2, + ml: 2, backgroundColor: '#fff', borderRadius: 1, }} @@ -145,16 +191,6 @@ <MenuItem value={MapMode.MOVABLE_MODE}>缂栬緫妯″紡</MenuItem> <MenuItem value={MapMode.SETTINGS_MODE}>閰嶇疆妯″紡</MenuItem> </Select> - <Button - variant="contained" - color="primary" - sx={{ mr: 1 }} - > - 鍋滄RCS杩愯浆 - </Button> - <Button variant="contained" color="secondary"> - 妯℃嫙AGV杩愯 - </Button> </Box> <Box sx={{ @@ -196,6 +232,13 @@ ))} </SpeedDial> </Box> + <Device + open={deviceVisible} + onCancel={() => { + setDeviceVisible(false); + }} + onDrop={onDrop} + /> </Box> ); } -- Gitblit v1.9.1