import React, {PureComponent} from 'react'
import './FirstPage.css'
import {GIS, updateLanguage} from "iclient3d-plot-diy";
import {Button, Input} from "antd";

export default class FirstPage extends PureComponent {
    constructor(props) {
        super(props);
        this.state = {};
    }

    componentDidMount() {

        let airInfos = [{
            code: '123',
            bz: true,
            jbwb: "R:00017",
            bzlx: 'detail',
            type: "2002",
            lon: 4,
            lat: 30,
            height: 0,
            useModify: false,
            // points: [{lon:4, lat:30, height:0}]
        }];

        setTimeout(()=>{
            this.mapFunction.mapApiService.appendBh('air',airInfos);
        },1000)
    }


    updatePlotUrl(event) {
        localStorage.setItem('plot_url', this.state.plotUrl || '');
        alert('plotUrl服务地址设置成功');
    }

    updateImageUrl(event) {
        localStorage.setItem('plot_image', this.state.imageUrl || '');
        alert('plotUrl服务地址设置成功');
    }

    updateDemUrl(event) {
        localStorage.setItem('plot_dem', this.state.demUrl || '');
        alert('plotUrl服务地址设置成功');
    }

    updateLanguage1() {
        updateLanguage('zh-CN')
        alert('切换语言成功');
    }

    updateLanguage2() {
        updateLanguage('en-US')
        alert('切换语言成功');
    }

    updateLanguage3() {
        updateLanguage('fr-FR')
        alert('切换语言成功');
    }

    render() {
        return (
            <div className={"plot-map-container"}>
                <GIS refs={e => {
                    this.mapFunction = e
                }}
                     plotUrl={this.state.plotUrl}
                     mapRef={this}
                     global={[3,29,4,31]}
                />

                <div className={"button_wrapper"}>

                    <span>公共plotUrl服务地址：</span>
                    <Input.Group compact>
                        <Input
                            placeholder={'请输入标绘服务地址'}
                            defaultValue={this.state['plotUrl']}
                            onChange={(v) => this.setState({plotUrl: v.target.value})}
                        />
                        <Button type="primary" onClick={this.updatePlotUrl.bind(this)}>设置</Button>
                    </Input.Group>
                    <br/>
                    <span>公共影像图地址：</span>
                    <Input.Group compact>
                        <Input
                            placeholder={'请输入标绘服务地址'}
                            defaultValue={this.state['imageUrl']}
                            onChange={(v) => this.setState({imageUrl: v.target.value})}
                        />
                        <Button type="primary" onClick={this.updateImageUrl.bind(this)}>设置</Button>
                    </Input.Group>
                    <br/>
                    <span>公共Dem地址：</span>
                    <Input.Group compact>
                        <Input
                            placeholder={'请输入标绘服务地址'}
                            defaultValue={this.state['demUrl']}
                            onChange={(v) => this.setState({demUrl: v.target.value})}
                        />
                        <Button type="primary" onClick={this.updateDemUrl.bind(this)}>设置</Button>
                    </Input.Group>
                    <br/>
                    <span>公共语言：</span>
                    <Button type="primary" onClick={this.updateLanguage1.bind(this)}>中文</Button>
                    <Button type="primary" onClick={this.updateLanguage2.bind(this)}>英文</Button>
                    <Button type="primary" onClick={this.updateLanguage3.bind(this)}>法语</Button>
                    <br/>
                </div>
            </div>
        )
    }
}