function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { ajax, BizDialog, BizGlobalDataContext, BizSearchInput, IconFont } from '@zgfe/business-lib';
import { Space, Tabs } from 'antd';
import _ from 'lodash';
import React, { useContext, useEffect, useState } from 'react';
import apis from "../apis";
import VisualContext from "./context";
import emptyImg from "./images/empty@2x.png";
import "./styles/listPanel.less";
var prefix = "visual-workbench-list-panel";
var List = function List(_ref) {
  var isAll = _ref.isAll;
  var _useContext = useContext(VisualContext),
    eventList = _useContext.eventList,
    currentPage = _useContext.currentPage,
    setEventList = _useContext.setEventList,
    editEvent = _useContext.editEvent,
    setEditEvent = _useContext.setEditEvent,
    pageData = _useContext.pageData,
    setCurrentElement = _useContext.setCurrentElement,
    setSimilarRules = _useContext.setSimilarRules;
  var _useState = useState(''),
    _useState2 = _slicedToArray(_useState, 2),
    search = _useState2[0],
    setSearch = _useState2[1];
  var _useState3 = useState(),
    _useState4 = _slicedToArray(_useState3, 2),
    currentEvent = _useState4[0],
    setCurrentEvent = _useState4[1];
  var _useState5 = useState(false),
    _useState6 = _slicedToArray(_useState5, 2),
    loading = _useState6[0],
    setLoading = _useState6[1];
  var _useContext2 = useContext(BizGlobalDataContext),
    currentApp = _useContext2.currentApp;
  var _useState7 = useState([]),
    _useState8 = _slicedToArray(_useState7, 2),
    showList = _useState8[0],
    setShowList = _useState8[1];
  useEffect(function () {
    setShowList(eventList.filter(function (item) {
      var include = isAll ? true : item.pagePath === currentPage;
      return include && new RegExp(_.escapeRegExp(search), 'i').test(item.eventName);
    }));
  }, [search, eventList, currentPage, isAll]);
  function onDel() {
    setLoading(true);
    ajax(apis.delEvent, {
      method: 'post',
      data: {
        appId: currentApp === null || currentApp === void 0 ? void 0 : currentApp.appId,
        eventId: currentEvent === null || currentEvent === void 0 ? void 0 : currentEvent.id
      }
    }).then(function (res) {
      if (!res) return;
      setCurrentEvent(undefined);
      if (setEventList) {
        setEventList(function (list) {
          return list.filter(function (item) {
            return item.id !== currentEvent.id;
          });
        });
      }
      if (editEvent) {
        if (setEditEvent) setEditEvent(undefined);
        if (setCurrentElement) setCurrentElement(undefined);
        if (setSimilarRules) setSimilarRules({});
      }
    }).catch(function (err) {
      console.error('删除事件失败', err);
    }).finally(function () {
      setLoading(false);
    });
  }

  /**
   * 点击事件后，定位打开编辑面板
   * @param event
   */
  function onClick(event) {
    if (isAll) return;
    if (setEditEvent) {
      setEditEvent(event);
    }
    // 定位到对应的元素
    if (pageData) {
      var element = pageData.allBtns.find(function (item) {
        // 点击的事件逐个与页面上的元素进行匹配
        var map = {
          id: 'identification',
          index: 'zgSupViewIndex',
          viewName: 'viewName'
        };
        var match = true;
        Object.keys(event.elementConditions || {}).forEach(function (key) {
          if (event.elementConditions[key] !== String(item[map[key]])) {
            match = false;
          }
        });
        return match;
      });
      if (element && setCurrentElement) {
        setCurrentElement(element);
      } else {
        console.log('未找到对应的元素', event, pageData.allBtns);
      }
    }
  }
  if (!eventList.length) {
    return /*#__PURE__*/React.createElement("div", {
      className: "".concat(prefix, "-empty")
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("img", {
      src: emptyImg
    }), /*#__PURE__*/React.createElement("span", null, "\u8BF7\u5728\u53F3\u4FA7\u9875\u9762\u9009\u62E9\u5143\u7D20\u6216\u8005\u9875\u9762\u8FDB\u884C\u5B9A\u4E49")));
  }
  return /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefix, "-to-list")
  }, /*#__PURE__*/React.createElement(BizSearchInput, {
    onChange: setSearch
  }), /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefix, "-list")
  }, showList.map(function (event) {
    return /*#__PURE__*/React.createElement(Space, {
      className: "".concat(prefix, "-item"),
      align: "center",
      key: event.id,
      onClick: onClick.bind(undefined, event)
    }, event.eventName, /*#__PURE__*/React.createElement(IconFont, {
      type: "qingchu",
      onClick: function onClick(e) {
        e.stopPropagation();
        setCurrentEvent(event);
        return false;
      }
    }));
  }), showList.length === 0 ? /*#__PURE__*/React.createElement("div", {
    style: {
      textAlign: 'center',
      color: '#999',
      fontSize: 14,
      padding: '20px 0'
    }
  }, "\u6682\u65E0\u6570\u636E") : null), currentEvent && /*#__PURE__*/React.createElement(BizDialog, {
    open: true,
    title: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconFont, {
      type: "tishi1"
    }), "\u63D0\u793A"),
    className: "".concat(prefix, "-confirm"),
    okButtonProps: {
      loading: loading
    },
    onCancel: setCurrentEvent.bind(undefined, undefined),
    onOk: onDel
  }, "\u786E\u5B9A\u5220\u9664\u6B64\u4E8B\u4EF6\u5417\uFF1F"));
};
var ListPanel = function ListPanel() {
  return /*#__PURE__*/React.createElement("div", {
    className: prefix
  }, /*#__PURE__*/React.createElement(Tabs, {
    centered: true,
    className: "".concat(prefix, "-tabs"),
    items: [{
      label: '当前页面事件',
      key: 'current',
      children: /*#__PURE__*/React.createElement(List, {
        isAll: false
      })
    }, {
      label: '所有事件',
      key: 'all',
      children: /*#__PURE__*/React.createElement(List, {
        isAll: true
      })
    }]
  }));
};
export default ListPanel;