import "choerodon-ui/pro/lib/modal/style";
import _Modal from "choerodon-ui/pro/lib/modal";
import "choerodon-ui/pro/lib/table/style";
import _Table from "@hzero-front-ui/c7n-ui/lib/TablePro";
import React, { Fragment, useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { observer } from 'mobx-react-lite';
import { Action } from '@choerodon/boot';
import StatusIcon from "../../../../../components/StatusIcon";
import TimePopover from "../../../../../components/timePopover";
import { useResourceStore } from "../../../stores";
import { useCustomStore } from "./stores";
import Modals from "./modals";
import CustomForm from "./modals/form-view";
import { useMainStore } from "../../stores";
import ResourceListTitle from "../../components/resource-list-title";
import "./index.less";
var Column = _Table.Column;

var modalKey = _Modal.key();

var modalStyle = {
  width: 'calc(100vw - 3.52rem)'
};
var CustomContent = observer(function () {
  var _useResourceStore = useResourceStore(),
      prefixCls = _useResourceStore.prefixCls,
      intlPrefix = _useResourceStore.intlPrefix,
      parentId = _useResourceStore.resourceStore.getSelectedMenu.parentId,
      treeDs = _useResourceStore.treeDs;

  var _useCustomStore = useCustomStore(),
      customDs = _useCustomStore.customDs,
      formatMessage = _useCustomStore.intl.formatMessage;

  var _useMainStore = useMainStore(),
      customStore = _useMainStore.customStore;

  function refresh() {
    treeDs.query();
    customDs.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 value = _ref.value,
        record = _ref.record;
    var commandStatus = record.get('commandStatus');
    var error = record.get('commandErrors');
    return /*#__PURE__*/React.createElement(StatusIcon, {
      status: commandStatus,
      name: value,
      error: error
    });
  }

  function renderTime(_ref2) {
    var value = _ref2.value;
    return /*#__PURE__*/React.createElement(TimePopover, {
      content: value
    });
  }

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

    if (disabled) {
      return null;
    }

    var buttons = [{
      service: ['choerodon.code.project.deploy.app-deployment.resource.ps.custome-resource.update'],
      text: formatMessage({
        id: 'edit'
      }),
      action: openShow
    }, {
      service: ['choerodon.code.project.deploy.app-deployment.resource.ps.custom-resource.delete'],
      text: formatMessage({
        id: 'delete'
      }),
      action: handleDelete
    }];
    return /*#__PURE__*/React.createElement(Action, {
      data: buttons
    });
  }

  function openShow() {
    _Modal.open({
      key: modalKey,
      style: modalStyle,
      drawer: true,
      title: formatMessage({
        id: 'resource.edit.header'
      }),
      children: /*#__PURE__*/React.createElement(CustomForm, {
        id: customDs.current.get('id'),
        envId: parentId,
        type: "edit",
        store: customStore,
        refresh: refresh
      }),
      okText: formatMessage({
        id: 'save'
      })
    });
  }

  function handleDelete() {
    var record = customDs.current;
    var modalProps = {
      title: formatMessage({
        id: "".concat(intlPrefix, ".custom.delete.title")
      }, {
        name: record.get('name')
      }),
      children: formatMessage({
        id: "".concat(intlPrefix, ".custom.delete.des")
      }),
      okText: formatMessage({
        id: 'delete'
      }),
      okProps: {
        color: 'red'
      },
      cancelProps: {
        color: 'dark'
      }
    };
    customDs["delete"](record, modalProps);
  }

  return /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-ingress-table")
  }, /*#__PURE__*/React.createElement(Modals, null), /*#__PURE__*/React.createElement(ResourceListTitle, {
    type: "customResources"
  }), /*#__PURE__*/React.createElement(_Table, {
    dataSet: customDs,
    border: false,
    queryBar: "bar"
  }, /*#__PURE__*/React.createElement(Column, {
    name: "name",
    renderer: renderName,
    sortable: true
  }), /*#__PURE__*/React.createElement(Column, {
    renderer: renderAction,
    width: 60
  }), /*#__PURE__*/React.createElement(Column, {
    name: "k8sKind"
  }), /*#__PURE__*/React.createElement(Column, {
    name: "lastUpdateDate",
    renderer: renderTime,
    width: 105,
    sortable: true
  })));
});
export default CustomContent;