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, { useMemo, useState } from 'react';
import { observer } from 'mobx-react-lite';
import { Action } from '@choerodon/boot';
import keys from 'lodash/keys';
import MouserOverWrapper from "../../../../../../components/MouseOverWrapper/MouserOverWrapper";
import TimePopover from "../../../../../../components/timePopover/TimePopover";
import KeyValueModal from "../modals/key-value/KeyValueProIndex";
import { useResourceStore } from "../../../../stores";
import { useApplicationStore } from "../stores";
import { useMainStore } from "../../../stores";
import "../configs/index.less";
import StatusIcon from "../../../../../../components/StatusIcon";
var Column = _Table.Column;

var modalKey = _Modal.key();

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

  var _useApplicationStore = useApplicationStore(),
      cipherStore = _useApplicationStore.cipherStore,
      cipherDs = _useApplicationStore.cipherDs,
      CIPHER_TAB = _useApplicationStore.tabs.CIPHER_TAB;

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

  var statusStyle = useMemo(function () {
    return {
      marginRight: '0.08rem'
    };
  }, []);

  function refresh() {
    treeDs.query();
    return cipherDs.query();
  }

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

  function handleEdit(record) {
    _Modal.open({
      key: modalKey,
      style: modalStyle,
      drawer: true,
      title: formatMessage({
        id: "".concat(intlPrefix, ".cipher.edit")
      }),
      children: /*#__PURE__*/React.createElement(KeyValueModal, {
        intlPrefix: intlPrefix,
        title: CIPHER_TAB,
        id: record.get('id'),
        envId: parentId,
        appId: id,
        store: cipherStore,
        refresh: refresh
      }),
      okText: formatMessage({
        id: 'save'
      })
    });
  }

  function renderName(_ref) {
    var value = _ref.value,
        record = _ref.record;
    var commandStatus = record.get('commandStatus');
    var error = record.get('error');
    var disabled = getEnvIsNotRunning() || commandStatus === 'operating';
    return /*#__PURE__*/React.createElement("div", {
      className: "".concat(prefixCls, "-keyValue-name")
    }, /*#__PURE__*/React.createElement(StatusIcon, {
      width: 0.4,
      name: value,
      clickAble: !disabled,
      onClick: handleEdit,
      status: commandStatus || '',
      error: error || '',
      record: record,
      permissionCode: ['choerodon.code.project.deploy.app-deployment.resource.ps.edit-cipher']
    }));
  }

  function renderKey(_ref2) {
    var _ref2$value = _ref2.value,
        value = _ref2$value === void 0 ? [] : _ref2$value,
        record = _ref2.record;
    return /*#__PURE__*/React.createElement(MouserOverWrapper, {
      width: 0.5
    }, keys(record.get('value') || {}).join(','));
  }

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

  function renderAction(_ref4) {
    var record = _ref4.record;
    var commandStatus = record.get('commandStatus');
    var secretId = record.get('id');
    var name = record.get('name');
    var disabled = getEnvIsNotRunning() || commandStatus === 'operating';

    if (disabled) {
      return null;
    }

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

  return /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-mapping-content")
  }, /*#__PURE__*/React.createElement("div", {
    className: "c7ncd-tab-table"
  }, /*#__PURE__*/React.createElement(_Table, {
    dataSet: cipherDs,
    border: false,
    queryBar: "bar"
  }, /*#__PURE__*/React.createElement(Column, {
    sortable: true,
    name: "name",
    header: formatMessage({
      id: "".concat(intlPrefix, ".application.tabs.cipher")
    }),
    renderer: renderName
  }), /*#__PURE__*/React.createElement(Column, {
    renderer: renderAction,
    width: "0.7rem"
  }), /*#__PURE__*/React.createElement(Column, {
    name: "key",
    renderer: renderKey
  }), /*#__PURE__*/React.createElement(Column, {
    sortable: true,
    name: "lastUpdateDate",
    renderer: renderDate,
    width: 105
  }))));
});
export default Cipher;