import React from 'react';
import { JzljDfTpdContext } from "../..";
import { VmFactorList, VmWrapper } from "../../../_components";
import useSettings from "../../../_hooks/useSettings";
import { overviewApis } from "../../api";
import "./index.less";
import overview_czz_zl_dark from "../../imgs/overview_czz_zl_dark.png";
import overview_czz_zs_light from "../../imgs/overview_czz_zs_light.png";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export default function CZZ(_ref) {
  var unitStr = _ref.unitStr;
  var _React$useContext = React.useContext(JzljDfTpdContext),
    id = _React$useContext.id,
    theme = _React$useContext.theme;
  var _useSettings = useSettings(),
    isDark = _useSettings.isDark;
  var _overviewApis$useCzz = overviewApis.useCzz(id),
    data = _overviewApis$useCzz.data;
  var _data$totalCzzCount = data.totalCzzCount,
    totalCzzCount = _data$totalCzzCount === void 0 ? 0 : _data$totalCzzCount,
    _data$sxzCzzCount = data.sxzCzzCount,
    sxzCzzCount = _data$sxzCzzCount === void 0 ? 0 : _data$sxzCzzCount,
    _data$baWeight = data.baWeight,
    baWeight = _data$baWeight === void 0 ? 0 : _data$baWeight,
    _data$yysWeight = data.yysWeight,
    yysWeight = _data$yysWeight === void 0 ? 0 : _data$yysWeight,
    _data$syWeight = data.syWeight,
    syWeight = _data$syWeight === void 0 ? 0 : _data$syWeight;
  var dataList_top = [{
    name: '生效中处置证数量',
    unit: '张',
    value: totalCzzCount,
    img: isDark ? overview_czz_zl_dark : overview_czz_zs_light,
    fontType: 'blue',
    unitStyle: {
      fontSize: 14
    }
  }];
  var dataList_yssy = [{
    name: '已运量',
    unit: unitStr,
    value: yysWeight,
    unitStyle: {
      fontSize: 14
    },
    style: {
      flex: 1,
      justifyContent: 'center',
      textAlign: 'center'
    }
  }, {
    name: '剩余量',
    unit: unitStr,
    value: syWeight,
    unitStyle: {
      fontSize: 14
    },
    style: {
      flex: 1,
      justifyContent: 'center',
      textAlign: 'center'
    }
  }];
  return /*#__PURE__*/_jsx("div", {
    className: "df-tpd-overview-right-top-left ".concat(theme),
    children: /*#__PURE__*/_jsx(VmWrapper, {
      title: "\u5904\u7F6E\u8BC1\u4FE1\u606F",
      children: /*#__PURE__*/_jsxs("div", {
        className: "df-tpd-overview-right-top-left-czz",
        children: [/*#__PURE__*/_jsx("div", {
          className: "df-tpd-overview-right-top-left-czz-top",
          children: /*#__PURE__*/_jsx(VmFactorList, {
            list: dataList_top,
            style: {
              justifyContent: 'center'
            }
          })
        }), /*#__PURE__*/_jsx(VmFactorList, {
          list: dataList_yssy,
          style: {
            background: 'unset'
          }
        })]
      })
    })
  });
}