import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import _extends from "@babel/runtime/helpers/extends";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _Select from "@alifd/next/es/select";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import React, { Component, useEffect, useState } from "react";
import { t } from "../../../src/locale";
import { useWalletConnect } from "@cverse/core-connector-beta";
import { WebApi } from "@cverse/core-lib-beta";
import { getLocationParamsByName, handleRenderByFormKeyData } from "../../_utils/utils";
import { toNumber } from "lodash";
import BoxSlotComponent from "../_components/boxSlotComponent";
import { WebSelectType } from "./type";
import RenderByFormKey from "../_components/renderByFormKey";
import { getRelationList } from "../../_utils/formKeyType";
import { handleStringToRequest } from "../cBehavior-setter/config/utils";
var Option = _Select.Option;
var _useWalletConnect = useWalletConnect(),
  walletConnect = _useWalletConnect.walletConnect;
var webApi = new WebApi();
var WebListOptions = [{
  label: t('setter.webSelectDefault'),
  value: WebSelectType["default"]
}, {
  label: t('setter.webSelectCustom'),
  value: WebSelectType.custom
}];
var CWebListSetter = function CWebListSetter(props) {
  var value = props.value,
    onChange = props.onChange;
  var _useState = useState((value === null || value === void 0 ? void 0 : value.webType) || WebSelectType["default"]),
    webType = _useState[0],
    setWebType = _useState[1];
  var _useState2 = useState((value === null || value === void 0 ? void 0 : value.webGid) || ''),
    webGid = _useState2[0],
    setWebGid = _useState2[1];
  var _useState3 = useState(handleStringToRequest((value === null || value === void 0 ? void 0 : value.webGidParams) || value)),
    webGidParams = _useState3[0],
    setWebGidParams = _useState3[1];
  var _useState4 = useState([]),
    webList = _useState4[0],
    setWebList = _useState4[1];
  var currentWebGid = getLocationParamsByName("webGid");
  var _useState5 = useState([]),
    telegramRelationOption = _useState5[0],
    setTelegramRelationOption = _useState5[1];
  //  请求当前项目下的网页
  useEffect(function () {
    setTelegramRelationOption(getRelationList());
    var fetchData = /*#__PURE__*/function () {
      var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
        var projectId, _webListRes$data, _webListRes$data$data, webListRes;
        return _regeneratorRuntime.wrap(function _callee$(_context) {
          while (1) switch (_context.prev = _context.next) {
            case 0:
              projectId = getLocationParamsByName("pId");
              if (!projectId) {
                _context.next = 6;
                break;
              }
              _context.next = 4;
              return webApi.getWebList({
                projectId: toNumber(projectId),
                page: 1,
                rows: 1000
              });
            case 4:
              webListRes = _context.sent;
              if (webListRes.code === 200 && (_webListRes$data = webListRes.data) !== null && _webListRes$data !== void 0 && (_webListRes$data$data = _webListRes$data.data) !== null && _webListRes$data$data !== void 0 && _webListRes$data$data.length) {
                setWebList(webListRes.data.data);
              }
            case 6:
            case "end":
              return _context.stop();
          }
        }, _callee);
      }));
      return function fetchData() {
        return _ref.apply(this, arguments);
      };
    }();
    fetchData();
  }, []);
  useEffect(function () {
    var obj = {
      webType: webType,
      webGid: webGid,
      webGidParams: webGidParams
    };
    onChange(obj);
  }, [webType, webGid, webGidParams]);
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(BoxSlotComponent, {
    title: t("setter.webType")
  }, /*#__PURE__*/React.createElement(_Select, {
    className: "itemOne_select",
    style: {
      width: 100 + "%",
      minWidth: 0
    },
    placeholder: t("setter.selectPlaceHolder"),
    notFoundContent: t('setter.notFoundContent'),
    dataSource: WebListOptions,
    value: webType,
    onChange: function onChange(v) {
      setWebType(v);
    }
  })), /*#__PURE__*/React.createElement(BoxSlotComponent, {
    title: t("setter.webOrigin")
  }, webType === WebSelectType["default"] && /*#__PURE__*/React.createElement(_Select, {
    className: "itemOne_select",
    style: {
      width: 100 + "%",
      minWidth: 0
    },
    placeholder: t("setter.webListSelectTip"),
    value: webGid,
    onChange: function onChange(gid) {
      setWebGid(gid);
    }
  }, webList.map(function (web) {
    if (web.gid !== currentWebGid) {
      return /*#__PURE__*/React.createElement(Option, {
        value: web.gid
      }, web.name);
    }
  })), webType === WebSelectType.custom && /*#__PURE__*/React.createElement(RenderByFormKey, {
    relationOption: telegramRelationOption,
    value: webGidParams,
    onChange: function onChange(v) {
      handleRenderByFormKeyData(v, function (newItem) {
        var newData = _extends({}, webGidParams, newItem);
        setWebGidParams(newData);
      });
    }
  })));
};
var _default = /*#__PURE__*/function (_Component) {
  function _default() {
    return _Component.apply(this, arguments) || this;
  }
  _inheritsLoose(_default, _Component);
  var _proto = _default.prototype;
  _proto.render = function render() {
    return /*#__PURE__*/React.createElement(CWebListSetter, this.props);
  };
  return _default;
}(Component);
export { _default as default };