import "choerodon-ui/pro/lib/select-box/style";
import _SelectBox from "choerodon-ui/pro/lib/select-box";
import "choerodon-ui/pro/lib/button/style";
import _Button from "choerodon-ui/pro/lib/button";
import "choerodon-ui/pro/lib/form/style";
import _Form from "@hzero-front-ui/c7n-ui/lib/FormPro";
import "choerodon-ui/pro/lib/text-field/style";
import _TextField from "choerodon-ui/pro/lib/text-field";
import "choerodon-ui/pro/lib/icon/style";
import _Icon from "choerodon-ui/pro/lib/icon";
import "choerodon-ui/lib/spin/style";
import _Spin from "@hzero-front-ui/c7n-ui/lib/Spin";
import "choerodon-ui/pro/lib/select/style";
import _Select from "choerodon-ui/pro/lib/select";

function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }

function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }

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 = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

import React, { useMemo, useState } from 'react';
import { injectIntl, FormattedMessage } from 'react-intl';
import { observer } from 'mobx-react-lite';
import map from 'lodash/map';
import { axios } from '@choerodon/boot';
import { mapping } from "./stores/ManualDeployDataSet";
import YamlEditor from "../../../../components/yamlEditor";
import Tips from "../../../../components/new-tips";
import { useManualDeployStore } from "./stores";
var Option = _Select.Option;
var HostDeployForm = injectIntl(observer(function (_ref) {
  var getMarketItem = _ref.getMarketItem,
      getMarketAndVersionContent = _ref.getMarketAndVersionContent;

  var _useManualDeployStore = useManualDeployStore(),
      manualDeployDs = _useManualDeployStore.manualDeployDs,
      projectId = _useManualDeployStore.AppState.currentMenuType.projectId,
      deployUseStore = _useManualDeployStore.deployUseStore,
      prefixCls = _useManualDeployStore.prefixCls;

  var record = manualDeployDs.current;

  var _useState = useState(''),
      _useState2 = _slicedToArray(_useState, 2),
      testStatus = _useState2[0],
      setTestStatus = _useState2[1];

  var isMarket = record.get(mapping.deploySource.value) === (mapping.deploySource.options.length > 1 ? mapping.deploySource.options[1].value : '');
  var isDocker = record.get(mapping.deployObject.value) === mapping.deployObject.options[0].value;
  var getWorkPathTips = useMemo(function () {
    return /*#__PURE__*/React.createElement(Tips, {
      helpText: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("p", {
        style: {
          margin: 0
        }
      }, "\u9ED8\u8BA4\u5DE5\u4F5C\u76EE\u5F55\uFF0C\u5F53\u524D\u5DE5\u4F5C\u76EE\u5F55(./)\uFF0Cjar\u5305\u4E0B\u8F7D\u5B58\u653E\u76EE\u5F55\u4E3A\uFF1A./temp-jar/xxx.jar \u65E5\u5FD7\u5B58\u653E\u76EE\u5F55\u4E3A\uFF1A./temp-log/xxx.log"), /*#__PURE__*/React.createElement("p", {
        style: {
          margin: 0
        }
      }, "\u586B\u5199\u5DE5\u4F5C\u76EE\u5F55\uFF0Cjar\u5305\u4E0B\u8F7D\u5B58\u653E\u76EE\u5F55\u4E3A\uFF1A\u5DE5\u4F5C\u76EE\u5F55/temp-jar/xxx.jar \u65E5\u5FD7\u5B58\u653E\u76EE\u5F55\u4E3A\uFF1A\u5DE5\u4F5C\u76EE\u5F55/temp-jar/xxx.log"))
    });
  }, []);
  /**
   * 主机名称下拉改变回调 设置ip和端口
   * @param value
   */

  var handleChangeHostName = function handleChangeHostName(value) {
    var _record$getField = record.getField(mapping.hostName.value),
        lookup = _record$getField.lookup;

    var item = lookup.find(function (l) {
      return l.id === value;
    });

    if (item) {
      var hostIp = item.hostIp,
          sshPort = item.sshPort;
      record.set(mapping.ip.value, hostIp);
      record.set(mapping.port.value, sshPort);
    } else {
      record.set(mapping.ip.value, undefined);
      record.set(mapping.port.value, undefined);
    }
  };

  var getTestDom = function getTestDom() {
    var res = {
      loading: /*#__PURE__*/React.createElement("div", {
        className: "testConnectCD"
      }, "\u6B63\u5728\u8FDB\u884C\u8FDE\u63A5\u6D4B\u8BD5", /*#__PURE__*/React.createElement(_Spin, null)),
      success: /*#__PURE__*/React.createElement("div", {
        style: {
          background: 'rgba(0,191,165,0.04)',
          borderColor: 'rgba(0,191,165,1)'
        },
        className: "testConnectCD"
      }, /*#__PURE__*/React.createElement("span", {
        style: {
          color: '#3A345F'
        }
      }, "\u6D4B\u8BD5\u8FDE\u63A5\uFF1A"), /*#__PURE__*/React.createElement("span", {
        style: {
          color: '#00BFA5'
        }
      }, /*#__PURE__*/React.createElement(_Icon, {
        style: {
          border: '1px solid rgb(0, 191, 165)',
          borderRadius: '50%',
          marginRight: 2,
          fontSize: '9px'
        },
        type: "done"
      }), "\u6210\u529F")),
      error: /*#__PURE__*/React.createElement("div", {
        style: {
          background: 'rgba(247,122,112,0.04)',
          borderColor: 'rgba(247,122,112,1)'
        },
        className: "testConnectCD"
      }, /*#__PURE__*/React.createElement("span", {
        style: {
          color: '#3A345F'
        }
      }, "\u6D4B\u8BD5\u8FDE\u63A5\uFF1A"), /*#__PURE__*/React.createElement("span", {
        style: {
          color: '#F77A70'
        }
      }, /*#__PURE__*/React.createElement(_Icon, {
        style: {
          border: '1px solid #F77A70',
          borderRadius: '50%',
          marginRight: 2,
          fontSize: '9px'
        },
        type: "close"
      }), "\u5931\u8D25"))
    };
    return res[testStatus];
  };
  /**
   * 测试连接逻辑
   */


  var handleTestConnect = /*#__PURE__*/function () {
    var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
      return regeneratorRuntime.wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              return _context.abrupt("return", new Promise(function (resolve) {
                setTestStatus('loading');
                var hostIp = record.get(mapping.ip.value);
                var hostPort = record.get(mapping.port.value);
                var hostId = record.get(mapping.hostName.value);
                axios.post("/devops/v1/projects/".concat(projectId, "/hosts/connection_test_by_id?host_id=").concat(hostId), {
                  hostIp: hostIp,
                  hostPort: hostPort
                }).then(function (res) {
                  setTestStatus(res ? 'success' : 'error');
                  resolve();
                })["catch"](function () {
                  setTestStatus('error');
                  resolve();
                });
              }));

            case 1:
            case "end":
              return _context.stop();
          }
        }
      }, _callee);
    }));

    return function handleTestConnect() {
      return _ref2.apply(this, arguments);
    };
  }();

  return /*#__PURE__*/React.createElement("div", {
    style: {
      width: '80%'
    }
  }, /*#__PURE__*/React.createElement("div", {
    className: "c7ncd-deploy-manual-deploy-divided"
  }), /*#__PURE__*/React.createElement("p", {
    className: "c7ncd-deploy-manual-deploy-title"
  }, "\u4E3B\u673A\u8BBE\u7F6E"), /*#__PURE__*/React.createElement(_Form, {
    record: record,
    columns: 2
  }, /*#__PURE__*/React.createElement(_Select, {
    colSpan: 1,
    name: mapping.hostName.value,
    onChange: handleChangeHostName,
    addonAfter: /*#__PURE__*/React.createElement(Tips, {
      helpText: "\u60A8\u9700\u5728\u6B64\u9009\u62E9\u4E00\u4E2A\u6B64\u9879\u76EE\u4E0B\u201D\u4E3B\u673A\u914D\u7F6E\u201C\u4E2D\u5DF2\u6709\u7684\u4E3B\u673A\u4F5C\u4E3A\u90E8\u7F72\u7684\u8F7D\u4F53",
      placement: "bottom"
    })
  }), /*#__PURE__*/React.createElement("div", {
    style: {
      display: 'flex',
      alignItems: 'flex-start'
    },
    colSpan: 1
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      width: '70%'
    }
  }, /*#__PURE__*/React.createElement(_TextField, {
    style: {
      width: '100%'
    },
    name: mapping.ip.value
  })), /*#__PURE__*/React.createElement("div", {
    style: {
      marginLeft: 10,
      flex: 1
    }
  }, /*#__PURE__*/React.createElement(_TextField, {
    name: mapping.port.value
  })))), /*#__PURE__*/React.createElement(_Button, {
    color: "primary",
    funcType: "raised",
    disabled: !record.get(mapping.ip.value) || !record.get(mapping.port.value),
    onClick: handleTestConnect
  }, "\u6D4B\u8BD5\u8FDE\u63A5"), getTestDom(), /*#__PURE__*/React.createElement("div", {
    style: {
      marginTop: 10
    },
    className: "c7ncd-deploy-manual-deploy-divided"
  }), /*#__PURE__*/React.createElement("p", {
    className: "c7ncd-deploy-manual-deploy-title"
  }, "\u90E8\u7F72\u6A21\u5F0F"), /*#__PURE__*/React.createElement(_Form, {
    columns: 7,
    record: record,
    style: {
      width: '125%'
    }
  }, /*#__PURE__*/React.createElement(_SelectBox, {
    colSpan: 4,
    name: mapping.deploySource.value
  }, mapping.deploySource.options.map(function (o) {
    return /*#__PURE__*/React.createElement(Option, {
      value: o.value
    }, /*#__PURE__*/React.createElement("span", {
      className: "".concat(prefixCls, "-manual-deploy-radio")
    }, o.label));
  })), /*#__PURE__*/React.createElement(_SelectBox, {
    colSpan: 1,
    name: mapping.deployObject.value
  }, mapping.deployObject.options.map(function (o) {
    return /*#__PURE__*/React.createElement(Option, {
      value: o.value
    }, /*#__PURE__*/React.createElement("span", {
      className: "".concat(prefixCls, "-manual-deploy-radio")
    }, /*#__PURE__*/React.createElement("img", {
      src: o.img
    }), o.label));
  }))), /*#__PURE__*/React.createElement(_Form, {
    columns: 2,
    record: record
  }, !isMarket && (isDocker ? [/*#__PURE__*/React.createElement(_Select, {
    newLine: true,
    name: mapping.projectImageRepo.value,
    colSpan: 1,
    onChange: function onChange() {
      record.init(mapping.image.value);
      record.init(mapping.imageVersion.value);
    }
  }), /*#__PURE__*/React.createElement(_Select, {
    name: mapping.image.value,
    colSpan: 1,
    onChange: function onChange() {
      record.init(mapping.imageVersion.value);
    }
  }), /*#__PURE__*/React.createElement(_Select, {
    name: mapping.imageVersion.value,
    colSpan: 1
  }), /*#__PURE__*/React.createElement(_TextField, {
    name: mapping.containerName.value,
    colSpan: 1
  }), /*#__PURE__*/React.createElement(YamlEditor, {
    colSpan: 2,
    readOnly: false // modeChange={false}
    ,
    value: deployUseStore.getImageYaml,
    onValueChange: function onValueChange(value) {
      return deployUseStore.setImageYaml(value);
    }
  })] : [/*#__PURE__*/React.createElement(_Select, {
    newLine: true,
    name: mapping.nexus.value,
    colSpan: 1
  }), /*#__PURE__*/React.createElement(_Select, {
    name: mapping.projectProduct.value,
    colSpan: 1
  }), /*#__PURE__*/React.createElement(_Select, {
    name: mapping.groupId.value,
    colSpan: 1
  }), /*#__PURE__*/React.createElement(_Select, {
    name: mapping.artifactId.value,
    colSpan: 1
  }), /*#__PURE__*/React.createElement(_Select, {
    name: mapping.jarVersion.value,
    colSpan: 1
  }), /*#__PURE__*/React.createElement(_TextField, {
    name: mapping.workPath.value,
    colSpan: 1,
    addonAfter: getWorkPathTips
  }), /*#__PURE__*/React.createElement(YamlEditor, {
    colSpan: 2,
    readOnly: false,
    modeChange: false,
    value: deployUseStore.getJarYaml,
    onValueChange: function onValueChange(value) {
      return deployUseStore.setJarYaml(value);
    }
  })])), isMarket && /*#__PURE__*/React.createElement(_Form, {
    columns: 7,
    record: record,
    style: {
      width: '125%'
    }
  }, getMarketItem(2), isDocker ? [/*#__PURE__*/React.createElement(_TextField, {
    name: mapping.containerName.value,
    colSpan: 2
  }), /*#__PURE__*/React.createElement(YamlEditor, {
    colSpan: 7,
    readOnly: false,
    value: deployUseStore.getImageYaml,
    onValueChange: function onValueChange(value) {
      return deployUseStore.setImageYaml(value);
    }
  })] : [/*#__PURE__*/React.createElement(_TextField, {
    name: mapping.workPath.value,
    addonAfter: getWorkPathTips,
    colSpan: 2
  }), /*#__PURE__*/React.createElement(YamlEditor, {
    colSpan: 7,
    readOnly: false,
    modeChange: false,
    value: deployUseStore.getJarYaml,
    onValueChange: function onValueChange(value) {
      return deployUseStore.setJarYaml(value);
    }
  })]));
}));
export default HostDeployForm;