1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
| import React, { useState, useRef, useEffect } from 'react';
| import { Segmented, AutoComplete } from 'antd';
| import { FormattedMessage, useIntl } from '@umijs/max';
| import { createStyles } from 'antd-style';
| import * as Utils from '../utils'
|
| const useStyles = createStyles(({ token }) => {
| return {
| floorBox: {
| position: 'absolute',
| left: '50%',
| top: '3%',
| transform: 'translate(-50%, -50%)',
| zIndex: 999
| }
| }
| })
|
| const floorSelectOptions = [
| {
| label: '1F',
| value: 1
| },
| {
| label: '2F',
| value: 2
| },
| {
| label: '3F',
| value: 3
| },
| {
| label: '4F',
| value: 4
| },
| {
| label: '5F',
| value: 5
| },
| ]
|
| const MapFloor = (props) => {
| const intl = useIntl();
| const { styles } = useStyles();
|
| React.useEffect(() => {
| }, []);
|
| const floorChange = (floor) => {
| props.setCurFloor(floor);
| }
|
| return (
| <>
| <div className={styles.floorBox}>
| <Segmented
| size={'large'}
| options={floorSelectOptions}
| value={props.curFloor}
| onChange={floorChange}
| style={{
| opacity: .8
| }}
| />
| </div>
| </>
| )
| }
|
| export default MapFloor;
|
|
