#
Junjie
2024-03-19 77ac6b72ed82d51d0d45bf156ac1b5bb3cb15782
zy-asrs-flow/src/pages/map/index.jsx
@@ -1,7 +1,7 @@
import * as React from 'react'
import * as PIXI from 'pixi.js';
import { FormattedMessage, useIntl, useModel } from '@umijs/max';
import { Layout, Button, Flex, Row, Col, FloatButton, Select } from 'antd';
import { Layout, Button, Flex, Row, Col, FloatButton, Select, Spin } from 'antd';
const { Header, Content } = Layout;
import {
    AppstoreAddOutlined,
@@ -15,6 +15,7 @@
import Settings from './components/settings'
import * as Utils from './utils'
import Player from './player';
import MapDrawer from './drawer';
const useStyles = createStyles(({ token }) => {
    let dark = token.colorBgBase === '#000';
@@ -98,6 +99,10 @@
        const width = contentRef.current.offsetWidth;
        const height = contentRef.current.offsetHeight;
        app.renderer.resize(width, height);
        if (model !== MapModel.OBSERVER_MODEL) {
            player.hideGridlines();
            player.showGridlines();
        }
    }, [app, mapContainer, windowSize])
    // model
@@ -158,12 +163,12 @@
    }, [model]);
    // Add New Device
    const onDrop = (sprite, x, y) => {
    const onDrop = (sprite, type, x, y) => {
        const { mapX, mapY } = Utils.getRealPosition(x, y, mapContainer);
        sprite.x = mapX;
        sprite.y = mapY;
        Utils.initSprite(sprite);
        Utils.initSprite(sprite, type);
        mapContainer.addChild(sprite);
        Utils.beMovable(sprite, setDidClickSprite);
    };
@@ -192,6 +197,7 @@
    const prevSpriteBySettings = prevSpriteBySettingsRef.current;
    const settingsFinish = () => {
        setSettingsVisible(false);
        setSpriteBySettings(null);
    }
@@ -200,7 +206,38 @@
            <Layout className={styles.layout}>
                <Header className={styles.header}>
                    <Row style={{ height: '100%' }}>
                        <Col span={8} style={{ backgroundColor: '#3C40C6' }}></Col>
                        <Col span={8} style={{ backgroundColor: '#dcdde1' }}>
                            <Select
                                defaultValue="agv"
                                style={{
                                    width: 120,
                                }}
                                size={'large'}
                                onChange={(value, option) => {
                                    console.log(value, option);
                                }}
                                options={[
                                    {
                                        value: 'agv',
                                        label: 'agv',
                                    },
                                    {
                                        value: 'crn',
                                        label: 'crn',
                                    },
                                ]}
                            />
                            <Select
                            // notFoundContent={loading ? <Spin size="small" /> : null}
                            />
                        </Col>
                        <Col span={16} style={{ backgroundColor: '#3C40C6' }}>
                            <Flex className={styles.flex} gap={'large'} justify={'flex-end'} align={'center'}>
                                <Select
@@ -280,7 +317,7 @@
            <Edit
                open={deviceVisible}
                onCancel={() => {
                    // setDeviceVisible(false);
                    setDeviceVisible(false);
                }}
                refCurr={mapRef.current}
                onDrop={onDrop}
@@ -288,12 +325,15 @@
            <Settings
                open={settingsVisible}
                curSprite={spriteBySettings}
                onCancel={() => {
                    setSettingsVisible(false);
                    setSpriteBySettings(null);
                }}
                setSpriteBySettings={setSpriteBySettings}
                setDidClickSprite={setDidClickSprite}
                refCurr={mapRef.current}
                onDrop={settingsFinish}
                onSubmit={settingsFinish}
            />
        </>
    )