#

luxiaotao1123

2024-03-14 3157658523c787ec2a995252579829cd60f63261

#

 zy-asrs-flow/src/pages/map/header/search.jsx

New file
@@ -0,0 +1,68 @@
import React, { useState, useRef, useEffect } from 'react';
import { Layout, Button, Flex, Row, Col, FloatButton, Select, Spin, AutoComplete } from 'antd';
import { FormattedMessage, useIntl, useModel } from '@umijs/max';
import {
    CloseOutlined
} from '@ant-design/icons';
import * as Utils from '../utils'

const MapSearch = (props) => {
    const intl = useIntl();

    const sensorTypeSelectOptions = Utils.sensorTypeSelectOptions(intl);

    const [curSensorType, setCurSensorType] = React.useState(sensorTypeSelectOptions?.[0]?.value);

    useEffect(() => {
    }, [props]);

    React.useEffect(() => {
        switch (curSensorType) {
            case Utils.SENSOR_TYPE.SHELF:
                break;
            case Utils.SENSOR_TYPE.AGV:
                break;
            default:
                break;
        }
    }, [curSensorType])

    return (
        <>
            <Select
                className='map-header-select'
                variant='filled'
                style={{
                    width: 160,
                }}
                size={'large'}
                options={sensorTypeSelectOptions}
                value={curSensorType}
                onChange={setCurSensorType}
            />
            <AutoComplete
                className='map-header-select'
                variant='filled'
                style={{
                    width: 360,
                }}
                size={'large'}
                placeholder={intl.formatMessage({ id: 'common.search.placeholder', defaultMessage: '请输入搜索内容' })}
                allowClear={{
                    clearIcon: <CloseOutlined />
                }}
                onSearch={() => { }}
                options={[
                    {
                        value: 'text 1',
                    },
                    {
                        value: 'text 2',
                    },
                ]}
            />
        </>
    )
}

export default MapSearch;

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

@@ -16,6 +16,7 @@
import Settings from './components/settings'
import * as Utils from './utils'
import Player from './player';
import MapSearch from './header/search';
import MapDrawer from './drawer';

const useStyles = createStyles(({ token }) => {
@@ -64,7 +65,6 @@
    const { styles } = useStyles();
    const mapRef = React.useRef();
    const contentRef = React.useRef();
    const sensorTypeSelectOptions = Utils.sensorTypeSelectOptions(intl);

    const [model, setModel] = React.useState(() => MapModel.OBSERVER_MODEL);
    const [deviceVisible, setDeviceVisible] = React.useState(false);
@@ -213,42 +213,9 @@
                <Header className={styles.header}>
                    <Row style={{ height: '100%' }}>
                        <Col className={styles.headerCol} span={12} style={{}}>
                            <Select
                                className='map-header-select'
                                variant='filled'
                                style={{
                                    width: 160,
                                }}
                                size={'large'}
                                options={sensorTypeSelectOptions}
                                defaultValue={sensorTypeSelectOptions?.[0]?.value}
                                onChange={(value, option) => {
                                    console.log(value, option);
                                }}
                            />
                            <AutoComplete
                                className='map-header-select'
                                variant='filled'
                                style={{
                                    width: 360,
                                }}
                                size={'large'}
                                placeholder={intl.formatMessage({ id: 'common.search.placeholder', defaultMessage: '请输入搜索内容' })}
                                allowClear={{
                                    clearIcon: <CloseOutlined />
                                }}
                            <MapSearch

                                onSearch={() => { }}
                                options={[
                                    {
                                        value: 'text 1',
                                    },
                                    {
                                        value: 'text 2',
                                    },
                                ]}
                            />

                        </Col>
                        {/* 3C40C6 */}
                        <Col span={12} style={{ backgroundColor: '#4a69bd' }}>