From ae81dbb1364e69cc8c73462795a64cbc6316c1fc Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期四, 17 十月 2024 10:03:50 +0800
Subject: [PATCH] #

---
 zy-acs-flow/src/map/http.js                                                             |   19 ++
 zy-acs-flow/src/map/insight/agv/AgvMain.jsx                                             |  134 ++++++++++++++
 zy-acs-flow/public/model/agv/fork.fbx                                                   |    0 
 zy-acs-flow/src/map/insight/index.jsx                                                   |    2 
 zy-acs-flow/src/map/insight/agv/index.jsx                                               |   51 +++++
 zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/MapController.java   |   15 +
 zy-acs-flow/public/model/agv/body.fbx                                                   |    0 
 zy-acs-flow/src/map/insight/agv/AgvThree.js                                             |  275 ++++++++++++++++++++++++++++++
 zy-acs-flow/public/model/agv/loader.fbx                                                 |    0 
 zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/result/MapAgvVo.java |   13 +
 zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx                                         |    8 
 11 files changed, 501 insertions(+), 16 deletions(-)

diff --git a/zy-acs-flow/public/model/agv/body.fbx b/zy-acs-flow/public/model/agv/body.fbx
new file mode 100644
index 0000000..618f057
--- /dev/null
+++ b/zy-acs-flow/public/model/agv/body.fbx
Binary files differ
diff --git a/zy-acs-flow/public/model/agv/fork.fbx b/zy-acs-flow/public/model/agv/fork.fbx
new file mode 100644
index 0000000..05a3597
--- /dev/null
+++ b/zy-acs-flow/public/model/agv/fork.fbx
Binary files differ
diff --git a/zy-acs-flow/public/model/agv/loader.fbx b/zy-acs-flow/public/model/agv/loader.fbx
new file mode 100644
index 0000000..15f3ac3
--- /dev/null
+++ b/zy-acs-flow/public/model/agv/loader.fbx
Binary files differ
diff --git a/zy-acs-flow/src/map/http.js b/zy-acs-flow/src/map/http.js
index b329a1f..663e064 100644
--- a/zy-acs-flow/src/map/http.js
+++ b/zy-acs-flow/src/map/http.js
@@ -108,7 +108,6 @@
     })
 }
 
-
 export const getLocGroup = async (row, bay, callback) => {
     await request.post('/map/shelf/group', {
         row: row,
@@ -127,3 +126,21 @@
         console.error(error.message);
     })
 }
+
+export const getAgvInfo = async (agvNo, callback) => {
+    await request.post('/map/agv/info', {
+        agvNo: agvNo,
+    }, {
+        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
+    }).then((res) => {
+        const { code, msg, data } = res.data;
+        if (code === 200) {
+            callback(data)
+        } else {
+            notify.error(msg);
+        }
+    }).catch((error) => {
+        notify.error(error.message);
+        console.error(error.message);
+    })
+}
diff --git a/zy-acs-flow/src/map/insight/agv/AgvMain.jsx b/zy-acs-flow/src/map/insight/agv/AgvMain.jsx
new file mode 100644
index 0000000..ada1503
--- /dev/null
+++ b/zy-acs-flow/src/map/insight/agv/AgvMain.jsx
@@ -0,0 +1,134 @@
+import React, { useRef, useEffect, useState } from 'react';
+import { useTranslate } from 'react-admin';
+import {
+    Box,
+    CircularProgress,
+    Grid,
+    Typography,
+    Paper,
+    Button,
+    Divider,
+    Stack,
+} from '@mui/material';
+import ShelfThree from './AgvThree';
+import { getAgvInfo } 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, curAgvNo) => {
+    if (info && shelfThree) {
+        shelfThree.generateMesh((loader, addObject) => {
+            const promises = [];
+            promises.push(new Promise((resolve) => {
+                loader.load('model/agv.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.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 AgvMain = (props) => {
+    const { data, curAgvNo, setCurAgvNo } = props;
+    const translate = useTranslate();
+    const containerRef = useRef();
+    const [loading, setLoading] = useState(true);
+    const [info, setInfo] = useState(null);
+
+    useEffect(() => {
+        if (data) {
+            getAgvInfo(data.no, (response) => {
+                setInfo(response);
+                setCurAgvNo(data.no);
+            });
+        }
+    }, [data]);
+
+    useEffect(() => {
+        if (info) {
+            endThree();
+            setLoading(true);
+            setTimeout(() => {
+                startThree(containerRef.current);
+                shelfThree.handleClick = (objName) => {
+                    setCurAgvNo(objName);
+                };
+                renderThree(info, curAgvNo);
+                setLoading(false);
+            }, 300)
+        }
+        return endThree;
+    }, [info]);
+
+    return (
+        <Box display="flex" height="100%">
+            <Box
+                position="relative"
+                width="50%"
+                height="100%"
+                ref={containerRef}
+                style={{ backgroundColor: '#7a7a7a' }}
+            >
+                {loading && (
+                    <Box
+                        position="absolute"
+                        top="50%"
+                        left="50%"
+                        style={{ transform: 'translate(-50%, -50%)' }}
+                    >
+                        <CircularProgress sx={{ color: grey[50] }} />
+                    </Box>
+                )}
+            </Box>
+            <Box width="50%" height="100%" overflow="auto" pl={1}>
+            </Box>
+        </Box>
+    );
+}
+
+export default AgvMain;
\ No newline at end of file
diff --git a/zy-acs-flow/src/map/insight/agv/AgvThree.js b/zy-acs-flow/src/map/insight/agv/AgvThree.js
new file mode 100644
index 0000000..01b60c0
--- /dev/null
+++ b/zy-acs-flow/src/map/insight/agv/AgvThree.js
@@ -0,0 +1,275 @@
+import * as THREE from 'three'
+import Stats from 'three/addons/libs/stats.module.js';
+import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'
+import TWEEN from '@tweenjs/tween.js';
+import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer';
+import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass';
+import { OutlinePass } from 'three/examples/jsm/postprocessing/OutlinePass';
+import { ShaderPass } from 'three/examples/jsm/postprocessing/ShaderPass';
+import { FXAAShader } from 'three/examples/jsm/shaders/FXAAShader';
+import { FBXLoader } from 'three/examples/jsm/loaders/FBXLoader'
+
+const help = false;
+
+export default class ShelfThree {
+
+    constructor(dom) {
+        this.dom = dom;
+
+        this.objects = [];
+    }
+
+    startup = () => {
+        this.scene = this.initScene();
+        this.camera = this.initCamera();
+        this.renderer = this.initRenderer();
+        this.controls = this.initControls();
+        this.stats = this.initStats();
+        this.composer = this.initComposer();
+        this.windowResize();
+        this.initRaycaster();
+        initLight(this.scene);
+
+        this.animate();
+    }
+
+    animate = () => {
+        this.animationFrame = requestAnimationFrame(this.animate);
+        this.render();
+        TWEEN.update();
+    }
+
+    render = () => {
+        // this.renderer.render(this.scene, this.camera);
+        this.composer.render(); // use special effects
+        this.stats.update();
+        // Rotate the scene
+        this.controls.update()
+        this.controls.autoRotateSpeed = 2;
+    }
+
+    getFullWidth = () => {
+        return this.dom?.offsetWidth;
+    }
+
+    getFullHeight = () => {
+        return this.dom?.offsetHeight;
+    }
+
+    addObject = (object) => {
+        this.scene?.add(object);
+        this.objects?.push(object);
+    }
+
+    initScene = () => {
+        const scene = new THREE.Scene();
+        // scene.background = new THREE.Color(0xf8f8f8);
+        scene.background = new THREE.Color(0x7a7a7a);
+        scene.fog = new THREE.Fog(scene.background, 1, 5000);
+        if (help) {
+            scene.add(new THREE.AxesHelper(1000));
+        }
+        return scene;
+    }
+
+    initCamera = () => {
+        const camera = new THREE.PerspectiveCamera(70, this.getFullWidth() / this.getFullHeight(), 1, 60000);
+        camera.position.set(-400, 400, 400);
+        this.scene.add(camera);
+        return camera;
+    }
+
+    initRenderer = () => {
+        const renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
+        renderer.setClearAlpha(0);
+        // renderer.useLegacyLights = false;  // 鏃х増鍏夋簮 閲嶈
+        renderer.shadowMap.enabled = true;
+        // this.renderer.shadowMap.type = THREE.BasicShadowMap;    // 鏈�浣庨槾褰�
+        // renderer.toneMapping = THREE.ReinhardToneMapping;
+        renderer.toneMapping = THREE.ACESFilmicToneMapping;
+        renderer.setPixelRatio(window.devicePixelRatio);
+        renderer.setSize(this.getFullWidth(), this.getFullHeight());
+        this.dom?.appendChild(renderer.domElement);
+        return renderer;
+    }
+
+    initComposer = () => {
+        const composer = new EffectComposer(this.renderer);
+        const renderPass = new RenderPass(this.scene, this.camera);
+        composer.addPass(renderPass);
+        // pixel ratio
+        const pixelRatio = this.renderer.getPixelRatio();
+        const newWidth = Math.floor(this.getFullWidth() * pixelRatio) || 1;
+        const newHeight = Math.floor(this.getFullHeight() * pixelRatio) || 1;
+        composer.setSize(newWidth, newHeight);
+        // antialias
+        const effectFXAA = new ShaderPass(FXAAShader);
+        effectFXAA.uniforms['resolution'].value.set(1 / newWidth, 1 / newHeight);
+        composer.addPass(effectFXAA);
+        // outline
+        this.outlinePass = new OutlinePass(new THREE.Vector2(this.getFullWidth(), this.getFullHeight()), this.scene, this.camera);
+        this.outlinePass.visibleEdgeColor.set('#ffffff'); // outline color
+        this.outlinePass.edgeStrength = 10; // outline weight
+        composer.addPass(this.outlinePass);
+        return composer;
+    }
+
+    initControls = () => {
+        const controls = new OrbitControls(this.camera, this.renderer.domElement);
+        // controls.enableRotate = false; // 绂佺敤鏁翠綋鏃嬭浆鍔熻兘
+        controls.enablePan = false; // 鍏佽骞崇Щ
+        controls.enableDamping = true;   // 寮�鍚樆灏�
+        controls.dampingFactor = 0.08; // 闃诲凹鍥犲瓙
+        controls.enableZoom = true; // 鍏佽缂╂斁
+        // controls.minDistance = 1; // 鏈�灏忕缉鏀捐窛绂�
+        // controls.maxDistance = 30; // 鏈�澶х缉鏀捐窛绂�
+        controls.minPolarAngle = 0; // 鏈�灏忎刊浠拌搴︼紙鍚戜笅鐪嬶級
+        controls.minPolarAngle = Math.PI / 2.1;
+        controls.maxPolarAngle = Math.PI / 2.1; // 鏈�澶т刊浠拌搴︼紙鍚戜笂鐪嬶級
+        controls.rotateSpeed = 0.6; // 瑙嗚绉诲姩閫熷害鍑忔參
+        controls.autoRotate = true; // 鑷姩鏃嬭浆
+
+        controls.target = new THREE.Vector3(0, 250, 0)  // 灞忓箷涓績鐐� 骞虫浛 camera鐨刲ookAt
+        return controls;
+    }
+
+    initStats = () => {
+        const stats = new Stats();
+        this.dom?.appendChild(stats.dom);
+        if (!help) {
+            stats.domElement.style.display = 'none';
+        }
+        return stats;
+    }
+
+    windowResize = () => {
+        this.resizeHandler = () => {
+            this.camera.aspect = this.getFullWidth() / this.getFullHeight();
+            this.camera.updateProjectionMatrix();
+            this.renderer.setSize(this.getFullWidth(), this.getFullHeight());
+        };
+        window.addEventListener('resize', this.resizeHandler, false);
+    }
+
+    initRaycaster = () => {
+        const raycaster = new THREE.Raycaster();
+        const mouse = new THREE.Vector2();
+        this.handleClickEvent = (event) => {
+            let x, y;
+            if (event.changedTouches) {
+                x = event.changedTouches[0].pageX;
+                y = event.changedTouches[0].pageY;
+            } else {
+                x = event.clientX;
+                y = event.clientY;
+            }
+            let rect = this.dom.getBoundingClientRect();
+            mouse.x = ((x - rect.left) / rect.width) * 2 - 1;
+            mouse.y = -((y - rect.top) / rect.height) * 2 + 1;
+            event.preventDefault();
+            raycaster.setFromCamera(mouse, this.camera);
+            let intersects = raycaster.intersectObjects(this.objects, true);
+            if (intersects.length === 0) {
+                return;
+            }
+            let objName = intersects[0].object.name;
+            this.objects.forEach(obj => {
+                if (obj.name === objName) {
+                    this.outlinePass.selectedObjects = [obj];
+                }
+            })
+            if (objName && this.handleClick) {
+                this.handleClick(objName, x, y);
+            }
+        }
+        this.dom?.addEventListener("click", this.handleClickEvent, false);
+    }
+
+    generateMesh = (fn) => {
+        const loader = new FBXLoader();
+        fn(loader, this.addObject);
+    }
+
+    setNewSelectedMesh = (objName) => {
+        for (const mesh of this.objects) {
+            if (mesh.name === objName) {
+                this.outlinePass.selectedObjects = [mesh];
+                break;
+            }
+        }
+    }
+
+    rePerspective = (maxHeight, normalHeight) => {
+        const height = Math.max(maxHeight, normalHeight)
+        const cameraPosScale = 0.7;
+        this.camera.position.set(
+            -height * cameraPosScale,
+            height * cameraPosScale,
+            height * cameraPosScale
+        );
+        this.controls.target = new THREE.Vector3(0, maxHeight * 0.53, 0);
+    }
+
+    destroy = () => {
+        cancelAnimationFrame(this.animationFrame);
+        window.removeEventListener('resize', this.resizeHandler);
+        if (this.scene) {
+            while (this.scene.children.length > 0) {
+                this.removeEntity(this.scene.children[0]);
+            }
+            this.scene = null;
+        }
+        if (this.renderer) {
+            this.renderer.dispose();
+            this.renderer.forceContextLoss();
+            this.renderer.context = null;
+            this.renderer.domElement = null;
+            this.renderer = null;
+        }
+        if (this.composer) {
+            this.composer.passes.forEach(pass => {
+                if (pass.dispose) {
+                    pass.dispose();
+                }
+            });
+            this.composer = null;
+        }
+        if (this.controls) {
+            this.controls.dispose();
+            this.controls = null;
+        }
+        this.dom?.removeEventListener("click", this.handleClickEvent);
+        this.camera = null;
+        this.objects = [];
+        while (this.dom?.firstChild) {
+            this.dom.removeChild(this.dom.firstChild);
+        }
+    }
+
+    removeEntity = (object) => {
+        if (object.material) object.material.dispose();
+        if (object.geometry) object.geometry.dispose();
+        if (object.texture) object.texture.dispose();
+        this.scene.remove(object);
+    }
+};
+
+const initLight = (scene) => {
+    const hemiLight = new THREE.HemisphereLight(0xffffff, 0xffffff, 6);
+    hemiLight.color.setHSL(0.6, 1, 0.6);
+    hemiLight.groundColor.setHSL(0.095, 1, 0.75);
+    hemiLight.position.set(0, 1500, 0);
+    scene.add(hemiLight);
+
+    const dirLight = new THREE.DirectionalLight(0xffffff, 2.5);
+    dirLight.color.setHSL(0.1, 1, 0.95);
+    dirLight.position.set(-10, 10, 10);
+    dirLight.position.multiplyScalar(30);
+    scene.add(dirLight);
+
+    const dirLight1 = new THREE.DirectionalLight(0xffffff, 2.5);
+    dirLight1.color.setHSL(0.1, 1, 0.95);
+    dirLight1.position.set(10, 10, -10);
+    dirLight1.position.multiplyScalar(30);
+    scene.add(dirLight1);
+}
\ No newline at end of file
diff --git a/zy-acs-flow/src/map/insight/agv/index.jsx b/zy-acs-flow/src/map/insight/agv/index.jsx
index 5d678c0..af002ed 100644
--- a/zy-acs-flow/src/map/insight/agv/index.jsx
+++ b/zy-acs-flow/src/map/insight/agv/index.jsx
@@ -1,11 +1,54 @@
-
+import React, { useState, useRef, useEffect } from 'react';
+import { useTranslate } from "react-admin";
+import { Box, Typography, Tabs, Tab, Stack, useTheme, Divider } from '@mui/material';
+// import AgvMain from './AgvMain';
+import JsonShow from '../../JsonShow';
 
 const AgvInsight = (props) => {
+    const { sprite } = props;
+    const theme = useTheme();
+    const themeMode = theme.palette.mode;
+    const translate = useTranslate();
+
+    const [activeTab, setActiveTab] = useState(0);
+    const [curAgvNo, setCurAgvNo] = useState(null);
+
+    const handleTabChange = (event, newValue) => {
+        setActiveTab(newValue);
+    };
 
     return (
-        <>
-            <h1>Agv</h1>
-        </>
+        <Box sx={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
+            <Tabs
+                value={activeTab}
+                onChange={handleTabChange}
+                centered
+                sx={{ mb: 0 }}
+            >
+                <Tab label={translate('page.map.insight.title')} />
+                <Tab label={'JSON'} />
+            </Tabs>
+
+            <Divider />
+
+            <Box flex={1} pt={2}>
+                {activeTab === 0 && (
+                    <>
+                    </>
+                    // <AgvMain
+                    //     data={sprite?.data}
+                    //     curAgvNo={curAgvNo}
+                    //     setCurAgvNo={setCurAgvNo}
+                    // />
+                )}
+                {activeTab === 1 && (
+                    <JsonShow
+                        data={sprite?.data}
+                        height={550}
+                    />
+                )}
+            </Box>
+        </Box>
     )
 }
 
diff --git a/zy-acs-flow/src/map/insight/index.jsx b/zy-acs-flow/src/map/insight/index.jsx
index a601a51..ec213a8 100644
--- a/zy-acs-flow/src/map/insight/index.jsx
+++ b/zy-acs-flow/src/map/insight/index.jsx
@@ -70,7 +70,7 @@
                                     {deviceType === DEVICE_TYPE.AGV && (
                                         <>
                                             <AgvInsight
-
+                                                sprite={sprite}
                                             />
                                         </>
                                     )}
diff --git a/zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx b/zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx
index fe2b0fb..275fbac 100644
--- a/zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx
+++ b/zy-acs-flow/src/map/insight/shelf/ShelfMain.jsx
@@ -1,5 +1,4 @@
 import React, { useRef, useEffect, useState } from 'react';
-import * as THREE from 'three';
 import { useTranslate } from 'react-admin';
 import {
     Box,
@@ -10,13 +9,10 @@
     Button,
     Divider,
     Stack,
-    Card,
-    CardContent,
 } from '@mui/material';
 import ShelfThree from './ShelfThree';
 import { getLocGroup } from '../../http';
 import { grey } from '@mui/material/colors';
-import { styled } from '@mui/system';
 
 let shelfThree;
 
@@ -117,10 +113,6 @@
         }
         return endThree;
     }, [info]);
-
-    useEffect(() => {
-        console.log(selectedLoc);
-    }, [selectedLoc])
 
     return (
         <Box display="flex" height="100%">
diff --git a/zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/MapController.java b/zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/MapController.java
index aebae1e..299d4e2 100644
--- a/zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/MapController.java
+++ b/zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/MapController.java
@@ -17,8 +17,9 @@
 import com.zy.acs.manager.core.service.floyd.FloydNavigateService;
 import com.zy.acs.manager.manager.controller.param.MapDataParam;
 import com.zy.acs.manager.manager.controller.param.MapParam;
-import com.zy.acs.manager.manager.entity.*;
+import com.zy.acs.manager.manager.controller.result.MapAgvVo;
 import com.zy.acs.manager.manager.entity.Map;
+import com.zy.acs.manager.manager.entity.*;
 import com.zy.acs.manager.manager.enums.AgvStsType;
 import com.zy.acs.manager.manager.mapper.MapMapper;
 import com.zy.acs.manager.manager.service.*;
@@ -124,7 +125,17 @@
         return R.ok().add(locList);
     }
 
-
+    @PostMapping("/agv/info")
+    public R agvInfo(@RequestParam(required = false) String agvNo) {
+        if (Cools.isEmpty(agvNo)) {
+            return R.error();
+        }
+        Agv agv = agvService.selectByUuid(agvNo);
+        AgvDetail agvDetail = agvDetailService.selectByAgvNo(agvNo);
+        MapAgvVo vo = new MapAgvVo();
+        vo.setAgvNo(agv.getUuid());
+        return R.ok().add(vo);
+    }
 
 
 
diff --git a/zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/result/MapAgvVo.java b/zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/result/MapAgvVo.java
new file mode 100644
index 0000000..9243e1c
--- /dev/null
+++ b/zy-acs-manager/src/main/java/com/zy/acs/manager/manager/controller/result/MapAgvVo.java
@@ -0,0 +1,13 @@
+package com.zy.acs.manager.manager.controller.result;
+
+import lombok.Data;
+
+/**
+ * Created by vincent on 10/17/2024
+ */
+@Data
+public class MapAgvVo {
+
+    private String agvNo;
+
+}

--
Gitblit v1.9.1