import "choerodon-ui/lib/tooltip/style";
import _Tooltip from "choerodon-ui/lib/tooltip";
import "choerodon-ui/pro/lib/icon/style";
import _Icon from "choerodon-ui/pro/lib/icon";
import "choerodon-ui/pro/lib/table/style";
import _Table from "@hzero-front-ui/c7n-ui/lib/TablePro";
import "choerodon-ui/pro/lib/modal/style";
import _Modal from "choerodon-ui/pro/lib/modal";
import React, { Fragment, useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { observer } from 'mobx-react-lite';
import { Action } from '@choerodon/boot';
import map from 'lodash/map';
import StatusIcon from "../../../../../components/StatusIcon";
import { useResourceStore } from "../../../stores";
import { useIngressStore } from "./stores";
import Modals from "./modals";
import MouserOverWrapper from "../../../../../components/MouseOverWrapper";
import DomainForm from "../../components/domain-form";
import { useMainStore } from "../../stores";
import ResourceListTitle from "../../components/resource-list-title";
import "./index.less";

var modalKey = _Modal.key();

var modalStyle = {
  width: 740
};
var Column = _Table.Column;
var IngressContent = observer(function () {
  var _useResourceStore = useResourceStore(),
      prefixCls = _useResourceStore.prefixCls,
      intlPrefix = _useResourceStore.intlPrefix,
      parentId = _useResourceStore.resourceStore.getSelectedMenu.parentId,
      treeDs = _useResourceStore.treeDs;

  var _useIngressStore = useIngressStore(),
      ingressDs = _useIngressStore.ingressDs,
      formatMessage = _useIngressStore.intl.formatMessage;

  var _useMainStore = useMainStore(),
      ingressStore = _useMainStore.ingressStore,
      openDeleteModal = _useMainStore.mainStore.openDeleteModal;

  function refresh() {
    treeDs.query();
    ingressDs.query();
  }

  function getEnvIsNotRunning() {
    var envRecord = treeDs.find(function (record) {
      return record.get('key') === parentId;
    });
    var connect = envRecord.get('connect');
    return !connect;
  }

  function renderName(_ref) {
    var record = _ref.record;
    var name = record.get('name');
    var status = record.get('status');
    var error = record.get('error');
    var disabled = getEnvIsNotRunning() || status === 'operating';
    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StatusIcon, {
      name: name,
      status: status || '',
      error: error || ''
    }));
  }

  function renderDomain(_ref2) {
    var value = _ref2.value;
    return /*#__PURE__*/React.createElement(MouserOverWrapper, {
      text: value,
      width: 0.18
    }, value);
  }

  function renderPath(_ref3) {
    var value = _ref3.value;
    return map(value, function (_ref4) {
      var path = _ref4.path;
      return /*#__PURE__*/React.createElement("div", {
        key: path,
        className: "".concat(prefixCls, "-ingress-path")
      }, /*#__PURE__*/React.createElement(MouserOverWrapper, {
        text: path,
        width: 0.1
      }, /*#__PURE__*/React.createElement("span", null, path)));
    });
  }

  function renderService(_ref5) {
    var record = _ref5.record;
    return map(record.get('pathList'), function (_ref6) {
      var serviceStatus = _ref6.serviceStatus,
          serviceName = _ref6.serviceName,
          serviceError = _ref6.serviceError,
          serviceId = _ref6.serviceId;
      return /*#__PURE__*/React.createElement("div", {
        className: "c7n-network-service",
        key: serviceId
      }, /*#__PURE__*/React.createElement(MouserOverWrapper, {
        text: serviceName,
        width: 0.1,
        className: "c7n-status-text"
      }, /*#__PURE__*/React.createElement("span", {
        className: serviceStatus === 'deleted' ? 'c7n-status-deleted' : ''
      }, serviceName)), (serviceStatus === 'deleted' || serviceStatus === 'failed') && /*#__PURE__*/React.createElement(_Tooltip, {
        title: serviceError ? "failed: ".concat(serviceError) : formatMessage({
          id: serviceStatus
        })
      }, /*#__PURE__*/React.createElement(_Icon, {
        type: "error",
        className: "c7n-status-failed"
      })));
    });
  }

  function renderAction(_ref7) {
    var record = _ref7.record;
    var status = record.get('status');
    var disabled = getEnvIsNotRunning() || status === 'operating';

    if (disabled) {
      return null;
    }

    var id = record.get('id');
    var name = record.get('name');
    var buttons = [{
      service: ['choerodon.code.project.deploy.app-deployment.resource.ps.update.domain'],
      text: formatMessage({
        id: 'edit'
      }),
      action: openModal
    }, {
      service: ['choerodon.code.project.deploy.app-deployment.resource.ps.delete-domain'],
      text: formatMessage({
        id: 'delete'
      }),
      action: function action() {
        return openDeleteModal(parentId, id, name, 'ingress', refresh);
      }
    }];
    return /*#__PURE__*/React.createElement(Action, {
      data: buttons
    });
  }

  function openModal() {
    _Modal.open({
      key: modalKey,
      style: modalStyle,
      drawer: true,
      title: formatMessage({
        id: 'domain.update.head'
      }),
      children: /*#__PURE__*/React.createElement(DomainForm, {
        envId: parentId,
        ingressId: ingressDs.current.get('id'),
        refresh: refresh,
        intlPrefix: intlPrefix,
        prefixCls: prefixCls
      }),
      okText: formatMessage({
        id: 'save'
      })
    });
  }

  return /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-ingress-table")
  }, /*#__PURE__*/React.createElement(Modals, null), /*#__PURE__*/React.createElement(ResourceListTitle, {
    type: "ingresses"
  }), /*#__PURE__*/React.createElement(_Table, {
    dataSet: ingressDs,
    border: false,
    queryBar: "bar",
    rowHeight: "auto"
  }, /*#__PURE__*/React.createElement(Column, {
    name: "name",
    renderer: renderName,
    sortable: true
  }), /*#__PURE__*/React.createElement(Column, {
    renderer: renderAction,
    width: 60
  }), /*#__PURE__*/React.createElement(Column, {
    name: "domain",
    renderer: renderDomain
  }), /*#__PURE__*/React.createElement(Column, {
    name: "pathList",
    renderer: renderPath
  }), /*#__PURE__*/React.createElement(Column, {
    renderer: renderService,
    header: formatMessage({
      id: 'network'
    })
  })));
});
export default IngressContent;