import { Col, Row } from 'antd';
import _ from 'lodash';
import { useContext } from 'react';
import { VmLineCharts, VmPieCharts, VmWrapper } from "../../../../_components";
import { CcService } from "../../../api";
import { CarContext } from "../../../index";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
var StaticInfo = function StaticInfo(_ref) {
  var startDate = _ref.startDate,
    endDate = _ref.endDate;
  var _useContext = useContext(CarContext),
    id = _useContext.id;
  var _CcService$useGetAbno = CcService.useGetAbnormalSummary({
      objectId: id,
      startDay: startDate,
      endDay: endDate
    }),
    summaryData = _CcService$useGetAbno.summaryData,
    loading = _CcService$useGetAbno.loading;
  var total = _.sumBy(summaryData, 'labelValue');
  var list = [];
  var dataList = [];
  var groupByLabel = _.groupBy(summaryData, 'labelName');
  Object.keys(groupByLabel).forEach(function (label) {
    var data = _.sortBy(groupByLabel[label], 'reportDate');
    list.push({
      name: label,
      value: _.sumBy(data, 'labelValue')
    });
    dataList.push({
      name: label,
      data: _.map(data, 'labelValue')
    });
  });
  var xAxis = _.sortBy(_.uniqBy(summaryData, 'reportDate'), 'reportDate').map(function (item) {
    return item.reportDate;
  });
  return /*#__PURE__*/_jsxs(Row, {
    gutter: [16, 16],
    style: {
      height: 360
    },
    children: [/*#__PURE__*/_jsx(Col, {
      span: 12,
      children: /*#__PURE__*/_jsx(VmWrapper, {
        title: '报警汇总',
        children: /*#__PURE__*/_jsx(VmPieCharts, {
          dataList: list,
          name: '报警类型',
          title: '报警总次数',
          total: total,
          loading: loading,
          unit: '次'
        })
      })
    }), /*#__PURE__*/_jsx(Col, {
      span: 12,
      children: /*#__PURE__*/_jsx(VmWrapper, {
        title: '报警趋势分析',
        children: /*#__PURE__*/_jsx(VmLineCharts, {
          xAxis: xAxis,
          dataList: dataList,
          unit: "\u6B21",
          loading: loading,
          legendOption: {
            width: '95%'
          },
          gridOption: {
            top: 70
          }
        })
      })
    })]
  });
};
export default StaticInfo;