import React, { useState } from 'react'
import DrpChart from '../charts/RealDrpPop/DrpChart';
import HDChart from '../charts/RealHDPop/HDChart';
import {
  CloseOutlined,
} from '@ant-design/icons';
import { Modal, Tabs } from 'antd';
import DrpSearch from '../components/DrpSearch';
import Glfzdx from '../components/Glfzdx'
import SummarizeRain from "../../../../components/summarizeRain";
import Jcsj from "../components/Jcsj";
import DrpStAround from '../components/DrpStAround'
import {ylLevel} from "../../../../utils/dictType";
import moment from "moment"
import BaseInfo from '../components/BaseInfo'

function RealDrpTip({ id, data, dispatch }) {
  console.log("雨量弹框数据porps",data);
  const [visible, setVisible] = useState(false);



  const closePop = () => {
    dispatch.runtime.closeFeaturePop(id);
  };

  const width = 1050;

  const [hzyqVisible, setHzyqVisible] = useState(false);

  const handleCancel = () => {
    setHzyqVisible(false);
  }
  console.log(data,'-------');

  const ylLevel2 = (val)=>{
    if(val===null){
      return '-'
    }else if(val<0.1){
        return '无降雨'
    }else if(val>=0.1 && val<10){
        return '小雨';
    }else if(val>=10 && val<25){
        return '中雨';
    }else if(val>=25 && val<50){
        return '大雨';
    }else if(val>=50 && val<100){
        return '暴雨';
    }else if(val>=100 && val<250){
        return '大暴雨';
    }else{
        return '特大暴雨';
    }
}

  return (
    <>
      <div className="dp-popup" style={{ position: 'absolute', top: 0, left: 0, width, lineHeight: 1 }}>
        <div className="dp-popup-content" style={{borderRadius:'10px'}}>
          <div className="content-body tyb skpop" id='tyb' style={{ height: '100%' }}>
            <div className="normalModalStyle" style={{borderRadius:10}}>
            <div className="normalModalStyle_title" style={{marginBottom:10}}>
                        <div className="normalModalStyle_title_icon"></div>
                        <span>{data?.stnm}&emsp;</span>
                        {data?.sttp &&
            <span style={
              { 
                display:"inline-block",
                padding: "5px 10px",
                color: "#74a7ff",
                border: "1px solid #74a7ff",
                borderRadius: "5px"
              }
            }> {{MM: '气象站',PP: '雨量站',RR: '水库水文站',ZZ: '河道水位站',ZQ:"河道水文站"}?.[data?.sttp]}</span>}
                        <div className="normalModalStyle_title_cancel">
                  <CloseOutlined onClick={closePop} style={{color:"#333"}}/>
                </div>
              </div>
              <div style={{ paddingLeft: 15,paddingTop:15,background:"#fff",borderRadius:'0 0 10px 10px' }} className='drp-box' >
              <Jcsj record={data}/>
              </div>
          </div>
          </div>
          <div className="boxfoot"></div>
        </div>
      </div>
    </>
  )
}

export default React.memo(RealDrpTip);