var __assign = this && this.__assign || function () {
  __assign = Object.assign || function (t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
      s = arguments[i];

      for (var p in s) {
        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
      }
    }

    return t;
  };

  return __assign.apply(this, arguments);
};

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import * as React from 'react';
import classNames from 'classnames';
import "./style/map-info-window.css";
import { useCallback, useEffect, useMemo, useState } from 'react';
import { ItemList } from "./components/item-list";
import { ItemDetail } from "./components/item-detail";
import find from 'lodash/find';
import every from 'lodash/every';
import toastApi from "../toast";
var prefixCls = 'dmc-map-info-window';

var convert2Str = function convert2Str(v) {
  if (typeof v === 'number') {
    return v.toString();
  }

  return v;
};

var MapInfoWindow = function MapInfoWindow(props) {
  var _a, _b;

  var className = props.className,
      onClose = props.onClose,
      dataSources = props.dataSources,
      dataSourceRecordUniqueKey = props.dataSourceRecordUniqueKey,
      handleShowIndexChange = props.handleShowIndexChange,
      _c = props.showClose,
      showClose = _c === void 0 ? true : _c,
      headerTools = props.headerTools,
      renderHeaderTools = props.renderHeaderTools,
      footerTools = props.footerTools,
      renderFooterTools = props.renderFooterTools,
      style = props.style,
      getPreviewPopupContainer = props.getPreviewPopupContainer,
      getTooltipContainer = props.getTooltipContainer,
      contentFontSize = props.contentFontSize,
      _d = props.maxHeight,
      maxHeight = _d === void 0 ? 380 : _d,
      _e = props.width,
      width = _e === void 0 ? 266 : _e;

  var _dataSourceDataUniqueKey = dataSourceRecordUniqueKey || 'id'; // 左侧列表选中数据包（ds）uuid


  var _f = useState(''),
      dsId = _f[0],
      setDsId = _f[1]; // 左侧列表选中记录 (ds > data) uuid


  var _g = useState(''),
      recId = _g[0],
      setRecId = _g[1];

  var _h = useState(dataSources[0]),
      curDataSource = _h[0],
      setCurDataSource = _h[1];

  var _j = useState((_b = (_a = dataSources[0]) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b[0]),
      curRecord = _j[0],
      setCurRecord = _j[1];

  var hasMultiRecs = useMemo(function () {
    var _a, _b;

    return dataSources.length > 1 || ((_b = (_a = dataSources[0]) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.length) > 1;
  }, [dataSources]);
  var handleSelPkgChange = useCallback(function (id) {
    var _a;

    var curDs = find(dataSources, function (i) {
      var _dataSourceUniqueKey = i.dataSourceUniqueKey || 'packageUuid';

      return i[_dataSourceUniqueKey] === id;
    }) || {};
    setDsId(id);
    setCurDataSource(curDs);

    if (!find(curDs === null || curDs === void 0 ? void 0 : curDs.data, function (i) {
      return convert2Str(i[_dataSourceDataUniqueKey]) === convert2Str(recId);
    })) {
      var rec = ((_a = curDs === null || curDs === void 0 ? void 0 : curDs.data) === null || _a === void 0 ? void 0 : _a[0]) || {};
      setRecId(rec[_dataSourceDataUniqueKey]);
      setCurRecord(rec);
    }
  }, [_dataSourceDataUniqueKey, dataSources, recId]);
  var handleSelRecChange = useCallback(function (pkgId, recId) {
    var curDs = find(dataSources, function (i) {
      var _dataSourceUniqueKey = i.dataSourceUniqueKey || 'packageUuid';

      return i[_dataSourceUniqueKey] === dsId;
    }) || {};
    var _a = curDs.data,
        data = _a === void 0 ? [] : _a;
    setDsId(pkgId);
    setRecId(recId);
    setCurDataSource(curDs);
    setCurRecord(find(data, function (i) {
      return convert2Str(i[_dataSourceDataUniqueKey]) === convert2Str(recId);
    }) || {});
  }, [_dataSourceDataUniqueKey, dataSources, dsId]);
  useEffect(function () {
    var _a; // validation


    if (!every(dataSources, function (ds) {
      var _dataSourceUniqueKey = ds.dataSourceUniqueKey || 'packageUuid';

      return ds[_dataSourceUniqueKey] && Array.isArray(ds.data);
    })) {
      toastApi.error('MapInfoWindow DataSource 参数错误');
      throw new Error('MapInfoWindow DataSource 参数错误');
    }

    if (!dataSourceRecordUniqueKey && !every(dataSources, function (ds) {
      return every(ds.data, function (d) {
        return d[_dataSourceDataUniqueKey];
      });
    })) {
      toastApi.error('MapInfoWindow DataSource 内部参数 data 错误 - 没有唯一标识符');
      throw new Error('MapInfoWindow DataSource 内部参数 data 错误 - 未通过 dataSourceDataUniqueKey 设置唯一标识符');
    }

    var firstDs = dataSources[0];
    var curRecord = ((_a = firstDs === null || firstDs === void 0 ? void 0 : firstDs.data) === null || _a === void 0 ? void 0 : _a[0]) || {};
    var curDsId = firstDs === null || firstDs === void 0 ? void 0 : firstDs[firstDs.dataSourceUniqueKey || 'packageUuid'];
    setCurDataSource(firstDs);
    setCurRecord(curRecord);
    setDsId(curDsId);
    setRecId(curRecord[_dataSourceDataUniqueKey]);
  }, [_dataSourceDataUniqueKey, dataSourceRecordUniqueKey, dataSources]);
  useEffect(function () {
    if (recId && dsId) {
      handleShowIndexChange === null || handleShowIndexChange === void 0 ? void 0 : handleShowIndexChange({
        packageUuid: dsId,
        recordUuid: recId
      });
    }
  }, [handleShowIndexChange, recId, dsId]);
  return _jsx(_Fragment, {
    children: curDataSource && curRecord && _jsxs("div", __assign({
      className: classNames(prefixCls, className),
      style: __assign(__assign({}, style), {
        maxHeight: maxHeight,
        width: width
      })
    }, {
      children: [hasMultiRecs && _jsx(ItemList, {
        recId: recId,
        prefixCls: prefixCls,
        dataSources: dataSources,
        selectDataSourceId: dsId,
        handleSelPkgChange: handleSelPkgChange,
        handleSelRecChange: handleSelRecChange,
        dataSourceDataUniqueKey: _dataSourceDataUniqueKey,
        getTooltipContainer: getTooltipContainer
      }, void 0), _jsx(ItemDetail, {
        prefixCls: prefixCls,
        record: curRecord,
        dataSource: curDataSource,
        showClose: showClose,
        onClose: onClose,
        headerTools: headerTools,
        renderHeaderTools: renderHeaderTools,
        footerTools: footerTools,
        renderFooterTools: renderFooterTools,
        hasMultiRecs: hasMultiRecs,
        contentFontSize: contentFontSize,
        maxHeight: maxHeight,
        width: width,
        getPreviewPopupContainer: getPreviewPopupContainer
      }, void 0), _jsx("div", __assign({
        className: prefixCls + "-triangle-border"
      }, {
        children: _jsx("div", {
          className: prefixCls + "-triangle"
        }, void 0)
      }), void 0)]
    }), void 0)
  }, void 0);
};

MapInfoWindow.displayName = 'MapInfoWindow';
export default MapInfoWindow;
var MapInfoWindowMemo = /*#__PURE__*/React.memo(MapInfoWindow);
MapInfoWindowMemo.displayName = 'MapInfoWindowMemo';
export { MapInfoWindowMemo };

