import cardBg from '@/assets/images/SecurityServiceOverview/cardBg1.png';
import services from '@/services';
import { useModel, useRequest } from '@umijs/max';
import { useMemo } from 'react';
import CustomCard from '../../components/CustomCard';
import DisposeFlow from './DisposeFlow';
import styles from './index.less';
import IndustryWiget from './IndustryWiget';
import StatusWiget from './StatusWiget';
const IndustryWarn = ({
  warnLevel,
  setWarnLevel,
}: {
  warnLevel: number;
  setWarnLevel: (val: number) => void;
}) => {
  const { selectAreaId } = useModel('safetyAreaId');
  //道路桥梁
  const { data: dq } = useRequest(
    () =>
      services.DataBase.getSjdzInfoData({
        typeCode: 'zzcc-aq-qldlsl',
        data: {
          regionCode: selectAreaId,
        },
      }),
    {
      refreshDeps: [selectAreaId],
    },
  );
  //环卫
  const { data: hwgf } = useRequest(
    () =>
      services.DataBase.getSjdzInfoData({
        typeCode: 'zzcc-aq-hwgcsl',
        data: {
          regionCode: selectAreaId,
        },
      }),
    {
      refreshDeps: [selectAreaId],
    },
  );
  //固废处置
  const { data: gfcz } = useRequest(
    services.DataBase.getSjdzInfoData({
      typeCode: 'zzcc-aq-tmcfssl',
      data: {
        regionCode: selectAreaId,
      },
    }),
    {
      refreshDeps: [selectAreaId],
    },
  );
  //道路桥梁
  const dlql = useMemo(() => {
    // return data?.find((item: any) => item?.typeCode === 'dlql');
    return {
      typeCode: 'dlql',
      typeName: '道路桥梁',
      parentCode: null,
      total: '50',
      children: [
        {
          typeCode: 'zzcc-aq-dllxfz',
          typeName: '道路',
          parentCode: 'dlql',
          typeField: 'lb',
          total: dq?.data?.records?.[0]?.dl ?? '--',
          listTypeCode: 'zzcc-aq-dlmx',
          columnsFields: {
            name: 'roadname',
            type: 'jishuguanlifenlei',
            descgldw: 'guanlidanwei',
            address: 'region_name',
            status: 'objstate',
          },
          icon: require('@/assets/images/SecurityServiceOverview/daoluIcon.png'),
        },
        {
          listTypeCode: 'zzcc-aq-qlmxlb',
          typeName: '桥梁',
          typeField: 'lx',
          parentCode: 'dlql',
          typeCode: 'zzcc-aq-qllxfz',
          total: dq?.data?.records?.[0]?.ql ?? '--',
          icon: require('@/assets/images/SecurityServiceOverview/qiaoliang.png'),
        },
      ],
    };
  }, [dq]);
  //城市环卫
  const hw = useMemo(() => {
    // return data?.find((item: any) => item?.typeCode === 'hw');
    return {
      typeCode: 'hw',
      typeName: '环卫',
      parentCode: null,
      total: hwgf?.data?.records?.[0]?.fxys ?? '--',
      children: [
        {
          typeCode: 'dl',
          listTypeCode: 'zzcc-aq-ljzymx',
          typeName: '垃圾转运站',
          parentCode: 'dlql',
          total: hwgf?.data?.records?.[0]?.zyz ?? '--',
          icon: require('@/assets/images/SecurityServiceOverview/hwzy.png'),
          columnsFields: {
            name: 'objcode',
            type: 'industry_name',
            descgldw: 'deptname1',
            address: 'region_name',
            status: 'objstate',
          },
        },
        {
          typeCode: 'dl',
          listTypeCode: 'zzcc-aq-hwgcmx',
          typeName: '环卫公厕',
          parentCode: 'dlql',
          columnsFields: {
            address: 'address',
            descgldw: 'yydw_name',
          },
          total: hwgf?.data?.records?.[0]?.hwgc ?? '--',
          icon: require('@/assets/images/SecurityServiceOverview/gongche.png'),
        },
        {
          typeCode: '',
          // listTypeCode: 'zzcc-aq-qlmxlb',
          typeName: '环卫车辆',
          parentCode: 'dlql',
          total: hwgf?.data?.records?.[0]?.hwcl ?? '--',
          icon: require('@/assets/images/SecurityServiceOverview/hwcl.png'),
        },
      ],
    };
  }, [hwgf]);
  //固废
  const gf = useMemo(() => {
    // return data?.find((item: any) => item?.typeCode === 'gf');
    return {
      typeCode: 'gf',
      typeName: '固废',
      parentCode: null,
      total: '--',
      children: [
        {
          typeCode: 'dl',
          typeName: '填埋场',
          parentCode: 'dlql',
          listTypeCode: 'zzcc-aq-hwgf-fylb',
          total: gfcz?.data?.records?.[0]?.tmc ?? '--',
          factorytypecode: 'TMC',
          pageNo: 0, //数据底座分页接口，有的重0开始有的从1开始
          columnsFields: {
            name: 'name',
            type: 'jishuguanlifenlei',
            descgldw: 'guanlidanwei',
            address: 'address',
            status: 'objstate',
          },
          icon: require('@/assets/images/SecurityServiceOverview/feigu.png'),
        },
        {
          typeCode: 'dl',
          typeName: '焚烧发电厂',
          parentCode: 'dlql',
          listTypeCode: 'zzcc-aq-hwgf-fylb',
          total: gfcz?.data?.records?.[0]?.fsfdc ?? '--',
          factorytypecode: 'FSC',
          pageNo: 0, //数据底座分页接口，有的重0开始有的从1开始
          columnsFields: {
            name: 'name',
            type: 'jishuguanlifenlei',
            descgldw: 'guanlidanwei',
            address: 'address',
            status: 'objstate',
          },
          icon: require('@/assets/images/SecurityServiceOverview/shengchan.png'),
        },
        {
          listTypeCode: 'zzcc-aq-hwgf-fylb',
          typeCode: 'dl',
          typeName: '餐厨厂',
          parentCode: 'dlql',
          total: gfcz?.data?.records?.[0]?.canchu ?? '--',
          factorytypecode: 'CCC',
          pageNo: 0, //数据底座分页接口，有的重0开始有的从1开始
          columnsFields: {
            name: 'name',
            type: 'jishuguanlifenlei',
            descgldw: 'guanlidanwei',
            address: 'address',
            status: 'objstate',
          },
          icon: require('@/assets/images/SecurityServiceOverview/feigu.png'),
        },
      ],
    };
  }, [gfcz]);

  return (
    <div className={styles.container}>
      <CustomCard
        title="道路桥梁"
        width={353}
        height={394}
        style={{
          paddingTop: 16,
          paddingRight: 18,
          backdropFilter: 'blur(2px)',
          backgroundImage: `url(${cardBg})`,
          backgroundSize: '100% 100%',
        }}
        // extra={<StatusWiget industryCode="0401" />}
        extra={<StatusWiget />}
      >
        <div className={styles.content}>
          <div
            className={styles.warp}
            style={{
              display: 'flex',
              alignItems: 'flex-start',
              paddingTop: 50,
            }}
          >
            {dlql?.children?.map((item: any, index: number) => {
              return (
                <IndustryWiget
                  key={index}
                  data={{
                    ...item,
                    // typeCode: dlql?.typeCode,
                    generalList: [
                      { typeName: '当前异常数', total: 0 },
                      { typeName: '风险管控数', total: item?.total },
                      { typeName: `${item?.typeName}总数`, total: item?.total },
                    ],
                    controlTotal: item?.total
                    // warn: 33,
                  }}
                  // style={{ width: 170 }}
                />
              );
            })}
          </div>
          <div className={styles.flow}>
            <DisposeFlow industryCode="0401" />
          </div>
        </div>
      </CustomCard>
      <CustomCard
        title="环卫作业"
        width={353}
        height={394}
        style={{
          paddingTop: 16,
          paddingRight: 18,
          backdropFilter: 'blur(2px)',
          backgroundImage: `url(${cardBg})`,
          backgroundSize: '100% 100%',
        }}
        extra={<StatusWiget />}
      >
        <div className={styles.content}>
          <div className={styles.warp}>
            {hw?.children?.map((item: any, index: number) => {
              return (
                <IndustryWiget
                  key={index}
                  data={{
                    ...item,
                    generalList: [
                      { typeName: '当前异常数', total: 0 },
                      { typeName: '风险管控数', total: item?.total },
                      { typeName: `${item?.typeName}总数`, total: item?.total },
                    ],
                    controlTotal: item?.total
                  
                  }}
                  style={{ width: 170 }}
                />
              );
            })}
          </div>
          <div className={styles.flow}>
            <DisposeFlow />
          </div>
        </div>
      </CustomCard>
      <CustomCard
        title="固废处置"
        width={353}
        height={394}
        style={{
          paddingTop: 16,
          paddingRight: 18,
          backdropFilter: 'blur(2px)',
          backgroundImage: `url(${cardBg})`,
          backgroundSize: '100% 100%',
        }}
        extra={<StatusWiget />}
      >
        <div className={styles.content}>
          <div className={styles.warp}>
            {gf?.children?.map((item: any, index: number) => {
              return (
                <IndustryWiget
                  key={index}
                  data={{
                    ...item,

                    typeCode: gf?.typeCode,
                    parentData: gf,
                  }}
                  style={item.typeName === '焚烧发电厂' ? { width: 170 } : {}}
                />
              );
            })}
          </div>
          <div className={styles.flow}>
            <DisposeFlow />
          </div>
        </div>
      </CustomCard>
    </div>
  );
};
export default IndustryWarn;
