From 764834e18ac2dbe928a4eb255c8eed89f631340c Mon Sep 17 00:00:00 2001 From: zhang <zc857179121@qq.com> Date: 星期四, 04 九月 2025 16:15:02 +0800 Subject: [PATCH] 1 --- zy-acs-flow/src/map/insight/agv/AgvMain.jsx | 181 ++++++++++++++++++++++++++++----------------- 1 files changed, 112 insertions(+), 69 deletions(-) diff --git a/zy-acs-flow/src/map/insight/agv/AgvMain.jsx b/zy-acs-flow/src/map/insight/agv/AgvMain.jsx index f58925b..d15684b 100644 --- a/zy-acs-flow/src/map/insight/agv/AgvMain.jsx +++ b/zy-acs-flow/src/map/insight/agv/AgvMain.jsx @@ -14,68 +14,10 @@ } from '@mui/material'; import { useNotification } from '../../Notification'; import AgvThree from './AgvThree'; -import { handleRestoreAgvAll } from '../../http'; +import { handleRestoreAgvAll, handleAgvPatrol } from '../../http'; import BoolValueIcon from '../BoolValueIcon'; import ConfirmButton from '../../../page/components/ConfirmButton'; - -let three; - -const startThree = (dom) => { - three = new AgvThree(dom); - three.startup(); -} - -const endThree = () => { - if (three) { - three.destroy(); - three = null; - } -} - -const renderThree = (curAgvNo) => { - if (curAgvNo && three) { - three.generateMesh((loader, addObject) => { - const loadModel = (path) => { - return new Promise((resolve, reject) => { - loader.load(path, (mesh) => { - resolve(mesh); - }, undefined, (error) => { - reject(error); - }); - }); - }; - - Promise.all([ - loadModel('model/agv/body.fbx'), - loadModel('model/agv/loader.fbx'), - loadModel('model/agv/fork.fbx'), - ]).then(([bodyMesh, loaderMesh, forkMesh]) => { - const scaleVal = 1; - bodyMesh.scale.set(scaleVal, scaleVal, scaleVal); - loaderMesh.scale.set(scaleVal, scaleVal, scaleVal); - forkMesh.scale.set(scaleVal, scaleVal, scaleVal); - - bodyMesh.position.set(55, 0, 0);; - loaderMesh.position.set(55, 150, 0);; - forkMesh.position.set(55, 165, 0);; - - const agvGroup = new THREE.Group(); - agvGroup.add(bodyMesh); - agvGroup.add(loaderMesh); - agvGroup.add(forkMesh); - - agvGroup.name = curAgvNo; - - addObject(agvGroup); - - three?.rePerspective(350, 450); - - }).catch((error) => { - console.error(error); - }); - }); - } -} +import { grey } from '@mui/material/colors'; const AgvMain = (props) => { const { curAgvNo, curAgvInfo: info, fetchAgvInfo } = props; @@ -87,9 +29,70 @@ const containerRef = useRef(); const [loading, setLoading] = useState(true); + const threeRef = useRef(null); + + const startThree = (dom) => { + if (threeRef.current) { + threeRef.current.destroy(); + } + threeRef.current = new AgvThree(dom); + threeRef.current.startup(); + } + + const endThree = () => { + if (threeRef.current) { + threeRef.current.destroy(); + threeRef.current = null; + } + } + + const renderThree = (curAgvNo) => { + if (curAgvNo && threeRef.current) { + threeRef.current.generateMesh((loader, addObject) => { + const loadModel = (path) => { + return new Promise((resolve, reject) => { + loader.load(path, (mesh) => { + resolve(mesh); + }, undefined, (error) => { + reject(error); + }); + }); + }; + + Promise.all([ + loadModel('model/agv/body.fbx'), + loadModel('model/agv/loader.fbx'), + loadModel('model/agv/fork.fbx'), + ]).then(([bodyMesh, loaderMesh, forkMesh]) => { + const scaleVal = 1; + bodyMesh.scale.set(scaleVal, scaleVal, scaleVal); + loaderMesh.scale.set(scaleVal, scaleVal, scaleVal); + forkMesh.scale.set(scaleVal, scaleVal, scaleVal); + + bodyMesh.position.set(55, 0, 0);; + loaderMesh.position.set(55, 150, 0);; + forkMesh.position.set(55, 165, 0);; + + const agvGroup = new THREE.Group(); + agvGroup.add(bodyMesh); + agvGroup.add(loaderMesh); + agvGroup.add(forkMesh); + + agvGroup.name = curAgvNo; + + addObject(agvGroup); + + threeRef.current?.rePerspective(350, 450); + + }).catch((error) => { + console.error(error); + }); + }); + } + } + useEffect(() => { - if (info) { - endThree(); + if (curAgvNo) { setLoading(true); setTimeout(() => { startThree(containerRef.current); @@ -98,7 +101,7 @@ }, 200); } return endThree; - }, [info]); + }, [curAgvNo]); const handleRestoreAll = () => { handleRestoreAgvAll({ agvNo: info.agvNo }); @@ -119,6 +122,13 @@ }); } + const patrolControl = async () => { + const res = await handleAgvPatrol({ agvNo: info.agvNo }) + if (res) { + fetchAgvInfo(curAgvNo); + } + } + return ( <Box display="flex" height="100%"> <Box @@ -135,7 +145,7 @@ left="50%" style={{ transform: 'translate(-50%, -50%)' }} > - <CircularProgress /> + <CircularProgress sx={{ color: grey[50] }} /> </Box> )} </Box> @@ -162,19 +172,25 @@ <KeyValuePair label={translate('table.field.agvDetail.pos')} value={info?.pos} bool /> </Grid> <Grid item xs={12}> + <KeyValuePair label={translate('table.field.agvDetail.code')} value={info?.code} /> + </Grid> + <Grid item xs={12}> <KeyValuePair label={translate('common.field.status')} value={info?.agvStatus} /> </Grid> <Grid item xs={12}> <KeyValuePair label={translate('table.field.agvDetail.vol')} value={info?.vol} /> </Grid> - <Grid item xs={12}> + {/* <Grid item xs={12}> <KeyValuePair label={translate('table.field.agvDetail.soc')} value={info?.soc} /> - </Grid> + </Grid> */} <Grid item xs={12}> <KeyValuePair label={translate('table.field.agvDetail.agvAngle')} value={info?.direction} /> </Grid> <Grid item xs={12}> - <KeyValuePair label={translate('table.field.agvDetail.backpack')} value={info?.backpack.filter(item => item.loaded === true).length} /> + <KeyValuePair label={translate('table.field.agvDetail.backpack')} value={info?.backpack?.filter(item => item.loaded === true).length} /> + </Grid> + <Grid item xs={12}> + <KeyValuePair label={translate('table.field.agvDetail.error')} value={info?.error} /> </Grid> <Grid item xs={12}> <KeyValuePair label={translate('table.field.agvDetail.task')} value={info?.taskIds?.join(',')} /> @@ -190,7 +206,8 @@ }}> <Grid container spacing={2} style={{ marginTop: '0px' }}> <Grid item xs={12}> - <Stack spacing={2} mt={2}> + <Stack spacing={1} mt={2}> + {/* more */} <Button color="primary" variant="contained" @@ -200,8 +217,33 @@ > {translate('page.map.settings.map.more.title')} </Button> + {/* patrol */} {info && ( - info.status === 1 + info.patrol + ? + <Button variant="contained" color="error" fullWidth onClick={() => { + patrolControl(); + }}> + {translate('page.map.action.stopPatrol')} + </Button> + : + // <Button variant="contained" fullWidth onClick={() => { + // patrolControl(); + // }}> + // {translate('page.map.action.startPatrol')} + // </Button> + <ConfirmButton + label="page.map.action.startPatrol" + color="primary" + variant="contained" + onConfirm={() => { + patrolControl(); + }} + /> + )} + {/* status */} + {info && ( + info.status === 0 ? <Button variant="contained" color="error" fullWidth onClick={() => { updateStatus(); }}> @@ -213,6 +255,7 @@ {translate('page.map.action.enable')} </Button> )} + {/* restore all */} <ConfirmButton label="page.map.action.restoreALl" color="inherit" -- Gitblit v1.9.1