From dc31d8c4e1e45d6f932050a0da4e18a09d8dfd07 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期三, 16 十月 2024 15:55:27 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx | 131 +++++++++++++++++++++++++++++++------------ 1 files changed, 93 insertions(+), 38 deletions(-) diff --git a/zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx b/zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx index e05fec1..be7e735 100644 --- a/zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx +++ b/zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx @@ -12,56 +12,111 @@ Stack, } from '@mui/material'; import ShelfThree from './ShelfThree'; +import { getLocGroup } from '../../http'; +import { grey } from '@mui/material/colors'; + +let shelfThree; + +const startThree = (dom) => { + shelfThree = new ShelfThree(dom); + shelfThree.startup(); +} + +const endThree = () => { + if (shelfThree) { + shelfThree.destroy(); + shelfThree = null; + } +} + +const renderThree = (info, curLocNo) => { + if (info && shelfThree) { + shelfThree.generateMesh((loader, addObject) => { + const promises = []; + const singleHeight = 123; + for (const item of info) { + const { lev } = item; + promises.push(new Promise((resolve) => { + loader.load('model/shelf.fbx', (mesh) => { + mesh.position.set(0, singleHeight * (lev - 1), 0); + mesh.scale.set(5, 5, 5); + mesh.name = item.locNo; + mesh.traverse((child) => { + if (child.isMesh) { + switch (child.name) { + case '璐ф灦': + child.material.color.set(0x4680BF); + break; + case '鎵樼洏': + child.visible = item.locStsEl === 'STOCK' || item.locStsEl === 'PAKOUT'; + child.material.color.set(0xBEBEBE); + break; + case '涓嶈鍒�': + child.visible = item.locStsEl === 'STOCK' || item.locStsEl === 'PAKOUT'; + child.material.color.set(0xE8B67E); + break; + default: + break; + } + child.name = item.locNo + child.castShadow = true; + child.receiveShadow = true; + } + }); + addObject(mesh); + resolve(); + }) + })); + + } + + Promise.all(promises).then(() => { + shelfThree.setNewSelectedMesh(curLocNo); + shelfThree.rePerspective(singleHeight * info.length, 500); + }).catch(error => { + console.error(error); + }); + }) + } +} const ShelfMain = (props) => { const { data, curLocNo, setCurLocNo } = props; const translate = useTranslate(); const containerRef = useRef(); const [loading, setLoading] = useState(true); - const [shelfThree, setShelfThree] = useState(null); const [info, setInfo] = useState(null); useEffect(() => { - const initThree = () => { - const shelfThreeInstance = new ShelfThree(containerRef.current); - shelfThreeInstance.startup(); - shelfThreeInstance.handleClick = (objName) => { - setCurLocNo(objName); - }; - setShelfThree(shelfThreeInstance); - setLoading(false); - // Fetch initial data - fetchShelfInfo(curLocNo); - }; - - initThree(); - - return () => { - if (shelfThree) { - shelfThree.destroy(); - } - }; - }, []); + if (data) { + getLocGroup(data.row, data.bay, (response) => { + setInfo(response); + setCurLocNo(response[0]?.locNo); + }); + } + }, [data]); useEffect(() => { - if (curLocNo) { - fetchShelfInfo(curLocNo); + if (info) { + endThree(); + setLoading(true); + setTimeout(() => { + startThree(containerRef.current); + shelfThree.handleClick = (objName) => { + setCurLocNo(objName); + }; + renderThree(info, curLocNo); + setLoading(false); + }, 300) } - }, [curLocNo]); - - const fetchShelfInfo = async (locNo) => { - // 鍋囪鏈変竴涓嚱鏁版潵鑾峰彇璐ф灦淇℃伅 - const res = await fetchShelfData(locNo); - if (res?.data) { - setInfo(res.data); - } - }; + return endThree; + }, [info]); return ( - <Box display="flex" height="500px"> + <Box display="flex" height="100%"> <Box position="relative" - width="60%" + width="50%" height="100%" ref={containerRef} style={{ backgroundColor: '#7a7a7a' }} @@ -73,12 +128,12 @@ left="50%" style={{ transform: 'translate(-50%, -50%)' }} > - <CircularProgress /> + <CircularProgress sx={{ color: grey[50] }} /> </Box> )} </Box> - <Box width="40%" height="100%" overflow="auto" p={2}> - <Paper elevation={3} style={{ padding: '16px' }}> + <Box width="50%" height="100%" overflow="auto" p={2}> + {/* <Paper elevation={3} style={{ padding: '16px' }}> <Typography variant="h6" gutterBottom> {translate('map.loc.no', { defaultMessage: '搴撲綅鍙�' })}: {curLocNo} </Typography> @@ -118,7 +173,7 @@ </Stack> </Grid> </Grid> - </Paper> + </Paper> */} </Box> </Box> ); -- Gitblit v1.9.1