import React from 'react';
import { Tree } from 'antd';
import axios from 'axios';
import {
  DownOutlined,
  EyeOutlined,
  EyeInvisibleOutlined,
} from '@ant-design/icons';
import SetLogoImagePath from './SetLogoImagePath'
import '../../../index.less';

class LayerData extends React.Component {
    constructor () {
        super ();
        this.state = {
            treeData: [],
            layerId: '',
        }
    }

    // 获取基础图层菜单栏
    getBasicLayerMenu = (adcode) => {
        return axios.get('/api/basicMap/getBasicLayerMenu', {
            params: {
                adcode: adcode
            }
        }).then((e) => {
            let basicLayeData = e.data.data;
            let basicLayeList = [];
            for (var i in basicLayeData) {
                basicLayeList.push({
                    key: basicLayeData[i].id,
                    title : basicLayeData[i].name,
                    selectable: false,
                    children: this.getLayerList(basicLayeData[i].layerList, i),
                })
            }
            this.setState ({
                treeData: basicLayeList
            })
        });
    }
    getLayerList = (layerList, i) => {
        var cLayerList = [];
        for (let i in layerList) {
            cLayerList.push({
                'key': i + '-' + layerList[i].id + '-' + new Date(),
                'title': layerList[i].name + '(' + layerList[i].geoUnitAmount + ')',
                'icon': ({ selected }) => (selected ? [<EyeOutlined key={new Date().getTime()} />,<SetLogoImagePath logoImagePath={layerList[i].logoImagePath} key={new Date().getTime() + 1}/>]
                     : [<EyeInvisibleOutlined key={new Date().getTime()} />,<SetLogoImagePath logoImagePath={layerList[i].logoImagePath}  key={new Date().getTime() + 1}/>]),
                'type': layerList[i].type,
            })
        }
        return cLayerList;
    }
    // 选中图层
    onLayerSelect = (selectedKeys, info) => {
        let layerId = info.node.key.split('-')[1];
        this.setState({
            layerId: layerId
        })
        if (info.node.type === 1 || info.node.type === 4) {
            this.props.getLayerPoints(layerId, info.selected, info.node.type);
        } else if (info.node.type === 2) {
            this.props.getLayerShapes(layerId, info.selected);
        }
    }

    render() {
        return (
            <div className='layer-data-wrap'>
                <Tree
                    multiple
                    showIcon
                    defaultSelectedKeys={[]}
                    switcherIcon={<DownOutlined />}
                    treeData={this.state.treeData}
                    onSelect={this.onLayerSelect}
                />
            </div >
        );
    }
}
export default LayerData