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";
/* eslint-disable @typescript-eslint/no-unused-vars */

import React, { Fragment, useCallback, useEffect, useMemo, useState } from 'react';
import { Input } from "../../input";
import Draggable from 'react-draggable';
import map from 'lodash/map';
import includes from 'lodash/includes';
import cloneDeep from 'lodash/cloneDeep';
import "../style/item-list.css";
import Icon from "../../icon";
import reduce from 'lodash/reduce';
import Scrollbar from "../../scrollbar";

var getIconName = function getIconName(geometryType) {
  switch (geometryType) {
    case 'point':
      return 'location';

    case 'line':
      return 'line';

    case 'polygon':
      return 'layer';

    case 'point_to_polygon':
      return 'location-to';

    default:
      return 'location';
  }
};

export var ItemList = /*#__PURE__*/React.memo(function (props) {
  var recId = props.recId,
      dataSources = props.dataSources,
      prefixCls = props.prefixCls,
      selectDataSourceId = props.selectDataSourceId,
      handleSelPkgChange = props.handleSelPkgChange,
      handleSelRecChange = props.handleSelRecChange,
      dataSourceDataUniqueKey = props.dataSourceDataUniqueKey;
  var moreThanOneRec = dataSources.length >= 1 || dataSources.length === 1 && dataSources[0].data.length > 1;

  var _a = useState(dataSources),
      _dataSources = _a[0],
      setInnerDataSources = _a[1];

  var _b = useState(160),
      searchWidth = _b[0],
      setSearchWidth = _b[1];

  var _c = useState(160),
      originWidth = _c[0],
      setOriginWidth = _c[1];

  var _d = useState(0),
      originClientX = _d[0],
      setOriginClientX = _d[1];

  var totalDataLen = useMemo(function () {
    return reduce(dataSources, function (acc, _a) {
      var data = _a.data;
      return acc + data.length;
    }, 0);
  }, [dataSources]);
  var style = useMemo(function () {
    return {
      width: searchWidth,
      left: Math.min(-searchWidth, 0)
    };
  }, [searchWidth]);
  var handleSearch = useCallback(function (e) {
    var _a;

    var v = (_a = e.target) === null || _a === void 0 ? void 0 : _a.value;

    if (v) {
      var ds = cloneDeep(dataSources);
      var curDataSources = ds.reduce(function (acc, i) {
        if (i.objectType.includes(v)) {
          acc.push(i);
          return acc;
        } else {
          var validRec = i.data.filter(function (d) {
            var _a;

            return ((_a = i.infoCfg) === null || _a === void 0 ? void 0 : _a.some(function (cfg) {
              return includes(d[cfg.key], v);
            })) || Object.values(d).some(function (val) {
              return includes(val, v);
            });
          });

          if (validRec.length > 0) {
            acc.push(__assign(__assign({}, i), {
              data: validRec
            }));
          }
        }

        return acc;
      }, []);
      setInnerDataSources(curDataSources);
    }
  }, [dataSources]);
  var handleChange = useCallback(function (e) {
    var v = e.target.value;

    if (v === '') {
      setInnerDataSources(dataSources);
    }
  }, [dataSources]);

  var _handleSelPkgChange = useCallback(function (e) {
    var el = e.currentTarget;
    el && handleSelPkgChange(el.dataset.pkgUuid || '');
  }, [handleSelPkgChange]);

  var _handleSelRecChange = useCallback(function (e) {
    var el = e.currentTarget;

    if (el) {
      var pkgUuid = el.dataset.pkgUuid || '';
      var recUuid = el.dataset.recUuid || '';
      handleSelRecChange(pkgUuid, recUuid);
    }
  }, [handleSelRecChange]);

  var onDragStart = useCallback(function (e) {
    var clientX = e.clientX;
    setOriginClientX(clientX);
  }, []);
  var onDrag = useCallback(function (e) {
    var clientX = e.clientX;
    var x = clientX - originClientX;
    var curWidth = originWidth - x;
    setSearchWidth(Math.max(160, curWidth));
  }, [originWidth, originClientX]);
  var onDragEnd = useCallback(function () {
    setOriginWidth(searchWidth);
  }, [searchWidth]);
  useEffect(function () {
    setInnerDataSources(dataSources);
  }, [dataSources]);
  return _jsx(_Fragment, {
    children: moreThanOneRec && _jsxs("div", __assign({
      className: prefixCls + "-list",
      style: style
    }, {
      children: [_jsx(Draggable, __assign({
        axis: "x",
        onStart: onDragStart,
        onDrag: onDrag,
        onStop: onDragEnd,
        bounds: {
          right: 10
        }
      }, {
        children: _jsx("div", {
          className: prefixCls + "-list-draggable"
        }, void 0)
      }), void 0), _jsxs("div", __assign({
        className: prefixCls + "-list-cnt"
      }, {
        children: ["\u5171", totalDataLen, "\u6761\u6570\u636E"]
      }), void 0), _jsx(Input, {
        prefixIcon: "search",
        placeholder: "\u641C\u7D22\u6570\u636E",
        size: "compact",
        onPressEnter: handleSearch,
        onChange: handleChange
      }, void 0), _jsx(Scrollbar, {
        children: _jsx("div", __assign({
          className: prefixCls + "-list-content"
        }, {
          children: _dataSources.map(function (ds) {
            return _jsxs(Fragment, {
              children: [_jsx("div", __assign({
                "data-pkg-uuid": ds.packageUuid,
                className: prefixCls + "-list-content-item " + prefixCls + "-list-content-pkg-item",
                onClick: _handleSelPkgChange
              }, {
                children: ds.objectType
              }), void 0), ds.packageUuid === selectDataSourceId && map(ds.data, function (d) {
                var _a, _b;

                var firstColumnKey = (_b = (_a = ds.infoCfg) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.key;
                var name = d.name || (firstColumnKey ? d[firstColumnKey] : '');

                var _id = typeof d[dataSourceDataUniqueKey] === 'number' ? d[dataSourceDataUniqueKey].toString() : d[dataSourceDataUniqueKey]; // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                // @ts-ignore


                var _recId = typeof recId === 'number' ? recId.toString() : recId;

                return _jsxs("div", __assign({
                  "data-rec-uuid": d[dataSourceDataUniqueKey],
                  "data-pkg-uuid": ds.packageUuid,
                  className: prefixCls + "-list-content-item " + prefixCls + "-list-content-rec-item",
                  onClick: _handleSelRecChange
                }, {
                  children: [_jsx("div", __assign({
                    className: prefixCls + "-list-content-rec-item-checked-icon"
                  }, {
                    children: _recId === _id && _jsx(Icon, {
                      icon: "done-check",
                      size: 14
                    }, void 0)
                  }), void 0), ds.geometryType && _jsx(Icon, {
                    icon: getIconName(ds.geometryType),
                    size: 16
                  }, void 0), _jsx("div", __assign({
                    className: prefixCls + "-list-content-rec-item-name"
                  }, {
                    children: name
                  }), void 0)]
                }), d[dataSourceDataUniqueKey]);
              })]
            }, ds.packageUuid);
          })
        }), void 0)
      }, void 0)]
    }), void 0)
  }, void 0);
});

