import React, { useCallback } from 'react'
import { Button, Modal, Space } from 'antd';
import { useDispatch, useSelector } from 'react-redux'

import PciStPop from './PciStPop';
import HdswPop from './HdswPop';
import HdswPop2 from './HdswPop2'
import ShuikuPop from './ShuikuPop';
import ShuikuPop2 from './ShuikuPop2'
import ShuiDianZhanPop from './ShuiDianZhanPop';
import SmallSkRiskPop from './SmallSkRiskPop';
import DrpPop from './DrpPop';
import XjDrpPop from './XjDrpPop';
import AdcdPop from './AdcdPop';
import WxqPop from './DcpjPop/WxqPop';

import PlacementPop from './DcpjPop/PlacementPop';
import TransferPop from './DcpjPop/TransferPop';
import FlrvvlgPop from './DcpjPop/FlrvvlgPop';
import BsnssinfoPop from './DcpjPop/BsnssinfoPop';
import BridgePop from './DcpjPop/BridgePop';
import CulvertPop from './DcpjPop/CulvertPop';
import SluicePop from './DcpjPop/SluicePop';
import DaminfoPop from './DcpjPop/DaminfoPop';
import DikePop from './DcpjPop/DikePop';
import WbrinfoPop from './DcpjPop/WbrinfoPop';

import YbyjPlanPop from './YbyjPlanPop';

import RainPreviewPop from './RainPreviewPop';
import RiskPop from './RiskPop';
import ShyjPop from './ShyjPop';
import DingWeiFu from './DingWeiFu';

import WXQ from './Wxq'
import AZD from './AnZhiDian'
import QSYDW from './QSYDW'
import YHJMH from  './YHJMH'
import ShenYa from './ShenYa/index.js';
import ShenLiu from './ShenLiu/index.js';
import WeiYi from './WeiYi/index.js';
import XunJian from './XunJian.js'
import DaiChuLi from './DaiChuLi.js'


import YinShuiGongCheng from './YinShuiGongCheng';//这个先不搞
import TangYanBa from './TangYanBa';
import YiFaZaiHaiDian from './YiFaZaiHaiDian';
import DiZhiZaiHaiDian from './DiZhiZaiHaiDian';
import DianXingZaiHaiShiJian from './DianXingZaiHaiShiJian'
import HeLiu from './HeLiu';
import GongShuiPop from './GongShuiPop';
import "./TangYanBa.less"
export const InfoPopNames = {
  RealSkPop: 'RealSkPop',
  RealHDPop: 'RealHDPop',
  RealDrpPop: 'RealDrpPop',
  PicStPop: 'PicStPop',
};


function FeaturePops({ mapobj }) {
  const popups = useSelector(s => s.runtime.featurePops);
  const dispatch = useDispatch();
  useSelector(s => s.runtime.viewTick);
  if (!mapobj || !popups || !popups.length) {
    return null;
  }
  
  return (
    <>
      {
        popups.map(({ type, lgtd, lttd, elev, data, id }) => {
          const pixels = mapobj.coordinateToPixel(lgtd, lttd, elev);
          let left = null
          let top = null
          let zIndex = null
          console.log("type",type);
          if (!pixels) {
            return null;
          }
          let Comp = null;
          if (type === 'tuxiang') {
            //视频点
            Comp = PciStPop;
            return (
              <Modal width={800}  bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <PciStPop id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }else if (type === 'hdsw') {
            // Comp = HdswPop;
            return (
              <Modal width={1050} wrapClassName='home_modal' bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <HdswPop2 id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }else if (type === 'shuiku' || type === InfoPopNames.RealSkPop) {
            // 水库
            // Comp = ShuikuPop;
            return (
              <Modal width={1050} wrapClassName='home_modal' bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <ShuikuPop id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }else if(type === 'shuiku2'){
            Comp = ShuikuPop2;
          }else if (type === 'shuidianzhan') {
            Comp = ShuiDianZhanPop;
          }else if (type === 'drp' || type === InfoPopNames.RealDrpPop) {
            // 雨情
            // Comp = DrpPop;
            return (
              <Modal width={1050} wrapClassName='home_modal'  bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <DrpPop id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }else if (type === "gongshui" ) {
            // 供水
            return (
              <Modal width={1050} wrapClassName='home_modal'  bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <GongShuiPop id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }
          else if (type === 'xjDrp') {
            Comp = XjDrpPop;
          }else if (type === 'adcd') {
            Comp = AdcdPop;
          }else if (type === 'danad') {
            Comp = WxqPop;
          }else if (type === 'placement') {
            Comp = PlacementPop;
          }else if (type === 'transfer') {
            Comp = TransferPop;
          }else if (type === 'flrvvlg') {
            Comp = FlrvvlgPop;
          }else if (type === 'bsnssinfo') {
            Comp = BsnssinfoPop;
          }else if (type === 'bridge') {
            Comp = BridgePop;
          }else if (type === 'culvert') {
            Comp = CulvertPop;
          }else if (type === 'sluice') {
            Comp = SluicePop;
          }else if (type === 'daminfo') {
            Comp = DaminfoPop;
          }else if (type === 'dike') {
            Comp = DikePop;
          }else if (type === 'wbrinfo') {
            Comp = WbrinfoPop;
          }else if (type === 'YbyjPlanPop') {
            Comp = YbyjPlanPop;
          }else if (type === 'RainPreviewPop') {
            Comp = RainPreviewPop;
          }else if (type === 'RiskPop') {
            Comp = RiskPop;
          }else if (type === 'smallSkRisk'){
            Comp = SmallSkRiskPop;
          }else if (type === 'yinshuigongcheng'){
            Comp = YinShuiGongCheng;
          }else if (type === 'tangyanba'){
            Comp = TangYanBa;
          }else if (type === 'yifazaihaidian'){
            Comp = YiFaZaiHaiDian;
          }else if (type === 'dizhizaihaidian'){
            Comp = DiZhiZaiHaiDian
          }else if (type === 'dianxingzaihaishijian'){
            Comp = DianXingZaiHaiShiJian
          }else if (type === 'heliu'){
            Comp = HeLiu
          }else if (type === 'shanhongyujing'){
            Comp = ShyjPop
          }else if (type === 'DingWeiFu'){
            Comp = DingWeiFu
          }else if (type === 'wxq'){
            //危险区
            Comp = WXQ
          }else if (type === 'anzhidian'){
            //安置点
            Comp = AZD
          }else if (type === 'qishiyedanwei'){
            //企事业单位
            Comp = QSYDW
          }else if (type === 'yanhejuminhu'){
            //沿河居民户
            Comp = YHJMH
          }else if (type === 'shenliu'){
            //渗流
            // Comp = ShenLiu
            return (
              <Modal width={1000} wrapClassName='home_modal' bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <ShenLiu id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }else if (type === 'shenya'){
            //渗压
            // Comp = ShenYa
            return (
              <Modal width={1000} wrapClassName='home_modal' bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <ShenYa id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }else if (type === 'weiyi'){
            //位移
            // Comp = WeiYi
            return (
              <Modal width={1000} wrapClassName='home_modal'  bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <WeiYi id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }else if (type === 'xunjian'){
            Comp = XunJian
          }else if (type === 'daichuli'){
            return (
              <Modal width={1050} wrapClassName='home_modal'  bodyStyle={{padding:0}}  title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
                <DaiChuLi id={id} data={data} dispatch={dispatch} record={data}/>
              </Modal>
            )
          }
          else{
            return null;
          }

          return (
            <div key={id} style={{ left: pixels[0], top: pixels[1], position: 'absolute', zIndex: zIndex?112:101, borderRadius: 3 }}>
              <Comp id={id} data={data} dispatch={dispatch} record={data}/>
            </div>
          )
        })
      }
    </>
  )
}

export default FeaturePops;