#

luxiaotao1123

2024-03-06 f5a90a314b3575d84806b0ee0504f45c8641eadd

#

 zy-asrs-flow/src/pages/map/components/settings.jsx

@@ -0,0 +1,45 @@
import React, { useState, useRef, useEffect } from 'react';
import { Col, Form, Modal, Row, Checkbox, Image, Tree, Drawer, Space, Button, Card, Divider } from 'antd';
import { FormattedMessage, useIntl, useModel } from '@umijs/max';
import * as PIXI from 'pixi.js';
import { createStyles } from 'antd-style';
import './index.css'

const useStyles = createStyles(({ token, css }) => {

})

const SpriteSettings = (props) => {
    const { styles } = useStyles();

    useEffect(() => {

    }, []);


    return (
        <>
            <Drawer
                open={props.open}
                onClose={() => {
                    props.onCancel();
                }}
                getContainer={props.refCurr}
                rootStyle={{ position: "absolute" }}
                mask={false}
                width={378}
                extra={
                    <Space>
                        <Button onClick={() => props.onCancel()}><FormattedMessage id='common.cancel' defaultMessage='取消' /></Button>
                    </Space>
                }
            >
                <Card>

                </Card>
            </Drawer>
        </>
    )
}

export default SpriteSettings;

 zy-asrs-flow/src/pages/map/index.jsx

@@ -11,7 +11,8 @@
} from '@ant-design/icons';
import './index.css'
import { createStyles } from 'antd-style';
import Edit from './components/device'
import Edit from './components/device';
import Settings from './components/settings'
import * as Utils from './utils'
import Player from './player';

@@ -49,6 +50,7 @@
    const contentRef = React.useRef();

    const [deviceVisible, setDeviceVisible] = React.useState(false);
    const [settingsVisible, setSettingsVisible] = React.useState(false);
    const [windowSize, setWindowSize] = React.useState({
        width: window.innerWidth,
        height: window.innerHeight,
@@ -119,11 +121,11 @@

            player.activateMapEvent(null);
            mapContainer.children.forEach(child => {
                Utils.beSettings(child, setDidClickSprite);
                Utils.beSettings(child, setSettingsVisible, setDidClickSprite);
            })
        } else {
            player.hideStarryBackground();
            

            player.activateMapEvent(Utils.MapEvent.SELECTION_BOX);
            mapContainer.children.forEach(child => {
                Utils.beMovable(child, setDidClickSprite);
@@ -141,6 +143,10 @@
        mapContainer.addChild(sprite);
        Utils.beMovable(sprite, setDidClickSprite);
    };

    const settingsFinish = () => {

    }

    // didClickSprite, stop triggers both sprite click and play's selection boxs
    React.useEffect(() => {
@@ -198,7 +204,7 @@
                            }}
                        />
                        <FloatButton
                            type={deviceSettingModel?'primary':'default'}
                            type={deviceSettingModel ? 'primary' : 'default'}
                            tooltip={<div><FormattedMessage id='map.device.oper' defaultMessage='参数设置' /></div>}
                            icon={<SettingOutlined />}
                            onClick={() => {
@@ -217,6 +223,15 @@
                refCurr={mapRef.current}
                onDrop={onDrop}
            />

            <Settings
                open={settingsVisible}
                onCancel={() => {
                    setSettingsVisible(false);
                }}
                refCurr={mapRef.current}
                onDrop={settingsFinish}
            />
        </>
    )
}

 zy-asrs-flow/src/pages/map/player.js

@@ -260,7 +260,6 @@


        this.starryTicker = (delta) => {
            console.log(1);
            speed += (warpSpeed - speed) / 20;
            cameraZ += delta * 10 * (speed + baseSpeed);
            for (let i = 0; i < starAmount; i++) {

 zy-asrs-flow/src/pages/map/utils.js

@@ -68,7 +68,7 @@
}

// sprite be beSettings from sprite click event
export const beSettings = (sprite, setDidClickSprite) => {
export const beSettings = (sprite, setSettingsVisible, setDidClickSprite) => {
    sprite.off('pointerup');
    sprite.off('pointermove');
    sprite.off('pointerdown');
@@ -77,6 +77,8 @@
    sprite.on("click", onClick);

    function onClick(event) {
        console.log(1);
        setSettingsVisible(true);
        // setDidClickSprite(true);
    }
}