import services from '@/services';
import { useRequest } from '@umijs/max';
import WarnProgress from '../WarnProgress';
import styles from './index.less';
const WarnWiget = ({
 
  verticalWarn,
  typeCode,
  yj,
  cy
}: {
  
  verticalWarn?: boolean;
  typeCode?: string;
  yj:any,
  cy:any
}) => {
  const { data } = useRequest(
    () => {
      if (typeCode) {
        return services.CityRiskApi.getstatisticalEvent({
          parentTypeCode: typeCode,
        });
        
      }
    },
    {
      refreshDeps: [typeCode],
    },
  );
// console.log(data);


  return (
    <div className={styles.container}>
      {yj!= '0' && yj ? (
        <>
          <div className={styles.infoWarp}>
            <div className={styles.warnCount}>
              <img
                src={require('@/assets/images/SecurityServiceOverview/errorIc.png')}
                alt=""
                className={styles.icon}
              />
              {verticalWarn ? (
                <>
                  <div>
                    <div
                      className={styles.warnCountv}
                      style={{ color: 'rgb(227, 80, 80)' }}
                    >
                      {yj}
                    </div>
                    <div>预警数</div>
                  </div>
                  <div>
                    <div
                      className={styles.warnCountv}
                      style={{ color: 'rgb(35, 194, 255)' }}
                    >
                      {cy}
                    </div>
                    <div>已处置</div>
                  </div>
                </>
              ) : (
                <>
                  <div className={styles.text}>
                    预警数<span> {yj}</span>
                  </div>
                  <div className={styles.text}>
                    已处置
                    <span style={{ color: 'rgb(35, 194, 255)' }}>
                      {cy}
                    </span>
                  </div>
                </>
              )}
            </div>
          </div>
          <WarnProgress
            size={{ height: 14 }}
            percent={yj}
            success={{ percent: cy }}
          />
        </>
      ) : (
        <div className={styles.notWarn}>
          <div className={styles.content}>
            <img
              src={require('@/assets/images/SecurityServiceOverview/notWarnIcon.png')}
              alt=""
              className={styles.icon}
            />
            <span className={styles.text}>无风险预警</span>
          </div>
        </div>
      )}
    </div>
  );
};
export default WarnWiget;
