You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
100 lines
3.2 KiB
100 lines
3.2 KiB
import React, { useEffect, useState } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import { Spin, Card } from 'antd';
|
|
import Build from './footer/build'
|
|
import '../style.less';
|
|
import Header from './heand';
|
|
import Footer from './footer';
|
|
import ProTable, { TableDropdown } from '@ant-design/pro-table';
|
|
|
|
const MAPID = 'screenGis'
|
|
|
|
const Example = (props) => {
|
|
const { dispatch, actions, user, loading } = props
|
|
const [tabKey, setTabKey] = useState('leadership')
|
|
|
|
// useEffect(() => {
|
|
// dispatch(actions.example.getMembers(user.orgId))
|
|
// }, [])
|
|
const tabChange = (tab) => {
|
|
//leader 领导驾驶舱 site 工地 toilet 公厕 light 照明 water水质 encomic经济 environment 生态环境 security 智慧安监
|
|
// setCurrentTab(tab);
|
|
setTabKey(tab)
|
|
// dispatch({ type: 'TAB-CHANGE', data: tab })
|
|
}
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
const map = new AMap.Map(MAPID, {
|
|
//resizeEnable: true,
|
|
center: [115.912663, 28.543149],//地图中心点，初始定位加载显示楼块
|
|
// center: [115.857952, 28.683003],//地图中心点
|
|
zoom: 13,//地图显示的缩放级别
|
|
zooms: [8, 18],
|
|
pitch: 65, // 地图俯仰角度，有效范围 0 度- 83 度
|
|
viewMode: '3D', // 地图模式
|
|
// rotation: 60
|
|
// showLabel: false
|
|
});
|
|
let styleName = 'amap://styles/fb26776387242721c2fc32e2cb1daccc';
|
|
map.setMapStyle(styleName);
|
|
|
|
let mapComplete = false;
|
|
let windowOnload = false;
|
|
window.onload = function () {
|
|
windowOnload = true;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
//主题样式
|
|
|
|
return () => {
|
|
const amapKeys = Object.keys(localStorage).filter(key => key.match(/^_AMap_/)) // 销毁地图
|
|
amapKeys.forEach(key => {
|
|
localStorage.removeItem(key)
|
|
})
|
|
map.clearMap();
|
|
if (map) map.destroy();
|
|
|
|
}
|
|
}, [])
|
|
|
|
|
|
return (
|
|
<Spin tip="biubiubiu~" spinning={loading}>
|
|
<div style={{
|
|
backgroundColor: "#031839", width: "100vw", height: "100vh", /* transform: `scale(${Math.min(
|
|
document.body.clientWidth / 1920,
|
|
document.body.clientHeight / 1080
|
|
)})`, */
|
|
}}>
|
|
<div id={MAPID} style={{ position: 'absolute', width: "100%", height: "100%" }}></div>
|
|
<div style={{ width: "100%", height: "10%" }}>
|
|
<Header tabChange={tabChange} tabKey={tabKey} dispatch={dispatch} />
|
|
</div>
|
|
|
|
<div style={{ position: 'absolute', width: "100%", height: "90%" }}>
|
|
<Footer tabKey={tabKey} />
|
|
</div>
|
|
{/* </div> */}
|
|
|
|
</div>
|
|
</Spin>
|
|
)
|
|
}
|
|
|
|
function mapStateToProps(state) {
|
|
const { auth, global, members } = state;
|
|
return {
|
|
loading: members.isRequesting,
|
|
user: auth.user,
|
|
actions: global.actions,
|
|
members: members.data
|
|
};
|
|
}
|
|
|
|
export default connect(mapStateToProps)(Example);
|
|
|