import React,{Component} from 'react';
import ReactDOM from 'react-dom';
import { FlvCom ,Timer,ImgCom,AreaSelete} from "./components/index"
// import {FlvCom,Timer,ImgCom,AreaSelete} from "../dist/index.js"
class App extends Component{
    constructor(){
        super();
        this.state = {
            imgUrl:"C:/imagelib/imgalarm/2020/12/21/192.168.166.155/192.168.166.155_00_20201221181716755_ALARM_210_9891_HEL_SNAP.jpg",
            serviceData: [[20, 15], [20, 80], [100, 15]],
            serviceData2:[]
        }
    }
    clickIt(){

        this.setState({
            serviceData2:[[20,21],[20,80]]
        })
    }
    change(val){
        console.log(val)
    }
    render(){
        let {imgUrl,serviceData,serviceData2} = this.state;
        return (
            <div style={{
                width: "500px", height: "500px"
            }}>
                <button onClick={()=>this.clickIt()}>切换</button>
                <div style={{width:"81.2%",height:"80%"}}>
                    <AreaSelete serviceData={serviceData} change={(val)=>this.change(val)}></AreaSelete>
                    {/* <AreaSelete ref={(inst) => { this.myRef = inst } } serviceData={serviceData2} change={(val)=>this.change(val)}></AreaSelete> */}
                </div>
                {/* <ImgCom httpImg="http://112.125.25.140:8083/syboxms/getImgDataByPath"  imgUrl={imgUrl}></ImgCom> */}
                {/* <FlvCom vidoeUrl=""></FlvCom>
                <Timer className="timerComCssss" type="YYYY-MM-DD HH:mm:ss"></Timer>  */}
                
            </div>
        )
    }
}

ReactDOM.render(<App />, document.getElementById('root'));