@devops-flow/devops-flow-pipeline-detail 0.0.37

package/es/components/common/teambition/deploy-group-dialog/host-info/index.js

@@ -0,0 +1,122 @@
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import React, { Component } from 'react';
+import { Field, Result } from '@teamix/ui';
+import BaseInfo from "../../pipeline-info/baseInfo";
+import Member from "../../yunxiao-member";
+import HostTable from "../host-table";
+import { DEPLOY_GROUP_ADD_HOST } from "../config";
+import intl from "../../../../../locale";
+import "./index.scss";
+var prefix = 'host-info';
+var HostInfo = /*#__PURE__*/function (_Component) {
+  function HostInfo() {
+    var _this;
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _Component.call.apply(_Component, [this].concat(args)) || this;
+    _this.baseInfoField = new Field(_this, {
+      autoUnmount: false,
+      onChange: function onChange(name, value) {
+        _this.baseInfoField.setValue(name, value);
+        _this.props.cheangeHostInfoFormData(name, value);
+      }
+    });
+    _this.onDelete = function (_ref) {
+      var instanceId = _ref.instanceId;
+      _this.props.deleteSelectHost && _this.props.deleteSelectHost(instanceId);
+    };
+    _this.onStepChange = function () {
+      _this.props.onStepChange && _this.props.onStepChange(DEPLOY_GROUP_ADD_HOST);
+    };
+    return _this;
+  }
+  _inheritsLoose(HostInfo, _Component);
+  var _proto = HostInfo.prototype;
+  _proto.componentDidMount = function componentDidMount() {
+    var _this$props = this.props,
+      name = _this$props.name,
+      envId = _this$props.envId,
+      tagIdList = _this$props.tagIdList;
+    this.baseInfoField.setValues({
+      name: name,
+      envId: envId,
+      tagIdList: tagIdList
+    });
+  };
+  _proto.render = function render() {
+    var _this$props2 = this.props,
+      groupId = _this$props2.groupId,
+      type = _this$props2.type,
+      hostTableData = _this$props2.hostTableData,
+      purpose = _this$props2.purpose,
+      ecsAddType = _this$props2.ecsAddType;
+    var _this$props3 = this.props,
+      onChangeMemberList = _this$props3.onChangeMemberList,
+      cheangeHostInfoFormData = _this$props3.cheangeHostInfoFormData;
+    return /*#__PURE__*/React.createElement("div", {
+      className: prefix
+    }, /*#__PURE__*/React.createElement(BaseInfo, {
+      field: this.baseInfoField,
+      tagSelectAloneMode: false,
+      needName: true,
+      needUuid: true,
+      cheangeHostInfoFormData: cheangeHostInfoFormData,
+      lableNames: {
+        envName: intl.get({
+          id: 'rdc-tb-cd-assets.deploy-group-dialog.host-info.HostGroupEnvironment',
+          defaultMessage: '主机组环境'
+        })
+      },
+      needEnv: !purpose
+    }), /*#__PURE__*/React.createElement("div", {
+      style: {
+        minHeight: 28,
+        margin: '16px 0'
+      }
+    }, !purpose && /*#__PURE__*/React.createElement(Member, {
+      isAsync: true,
+      inviteVisible: true,
+      disabled: false,
+      onChange: onChangeMemberList,
+      objId: groupId,
+      objType: "deployGroup",
+      onReady: onChangeMemberList
+    })), (ecsAddType === 'ECS_ALIYUN' || ecsAddType === 'ECS_MANAGED') && /*#__PURE__*/React.createElement("div", {
+      className: prefix + "-header"
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-info.Host',
+      defaultMessage: '主机'
+    })), (ecsAddType === 'ECS_ALIYUN' || ecsAddType === 'ECS_MANAGED') && /*#__PURE__*/React.createElement(HostTable, {
+      operation: true,
+      type: type,
+      groupId: groupId,
+      rowSelection: false,
+      dataSource: hostTableData,
+      onDelete: this.onDelete,
+      style: {
+        minHeight: 0,
+        marginBottom: 20
+      },
+      emptyContent: /*#__PURE__*/React.createElement(Result, {
+        img: "none",
+        desc: /*#__PURE__*/React.createElement("div", {
+          className: prefix + "-empty"
+        }, intl.get({
+          id: 'rdc-tb-cd-assets.deploy-group-dialog.host-info.YourHostGroupHasBeen',
+          defaultMessage: '你的主机组已被清空，请'
+        }), /*#__PURE__*/React.createElement("span", {
+          onClick: this.onStepChange
+        }, intl.get({
+          id: 'rdc-tb-cd-assets.deploy-group-dialog.host-info.ReturnsYouAddedInThe',
+          defaultMessage: '返回上一步添加'
+        }))),
+        theme: "yunxiao",
+        imageTheme: "yunxiao",
+        size: "small"
+      })
+    }));
+  };
+  return HostInfo;
+}(Component);
+export default HostInfo;

package/es/components/common/teambition/deploy-group-dialog/host-info/index.scss

@@ -0,0 +1,21 @@
+$prefix: host-info;
+
+.#{$prefix} {
+  padding: 0 20px;
+  width: 100%;
+  height: 100%;
+  overflow-y: auto;
+  &-header {
+    font-size: 14px;
+    padding-bottom: 8px;
+    margin-top: 16px;
+  }
+  &-empty {
+    font-size: 14px;
+    color: var(--color-text1-7, #8b8b8b);
+    span {
+      color: var(--color-brand1-6, #1b9aee);
+      cursor: pointer;
+    }
+  }
+}

package/es/components/common/teambition/deploy-group-dialog/host-list/index.d.ts

@@ -0,0 +1,3 @@
+import './index.scss';
+declare const _default: any;
+export default _default;

package/es/components/common/teambition/deploy-group-dialog/host-list/index.js

@@ -0,0 +1,61 @@
+import React, { useEffect } from 'react';
+import { Button } from '@teamix/ui';
+import { YunxiaoIcon } from '@alife/devops-ui';
+import HostTable from "../host-table";
+import intl from "../../../../../locale";
+import "./index.scss";
+var prefix = 'host-list';
+var timer = null;
+var HostList = function HostList(props) {
+  var type = props.type,
+    mode = props.mode,
+    newly = props.newly,
+    groupId = props.groupId,
+    hostTableList = props.hostTableList,
+    setEditAddHostVisible = props.setEditAddHostVisible,
+    deleteHostSave = props.deleteHostSave,
+    editHostTableLiading = props.editHostTableLiading;
+  useEffect(function () {
+    return function () {
+      return timer && clearTimeout(timer);
+    };
+  }, []);
+  var onDelete = function onDelete(item) {
+    deleteHostSave && deleteHostSave(item);
+  };
+  var addHost = function addHost() {
+    setEditAddHostVisible(true);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: prefix
+  }, /*#__PURE__*/React.createElement("div", {
+    className: prefix + "-title"
+  }, /*#__PURE__*/React.createElement("span", null, intl.get({
+    id: 'rdc-tb-cd-assets.deploy-group-dialog.host-list.HostList',
+    defaultMessage: '主机列表'
+  })), mode !== 'view' && /*#__PURE__*/React.createElement(Button, {
+    text: true,
+    type: "primary",
+    onClick: addHost,
+    disabled: editHostTableLiading || !(hostTableList.length >= 0)
+  }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "add-fill"
+  }), intl.get({
+    id: 'rdc-tb-cd-assets.deploy-group-dialog.host-list.AddHost',
+    defaultMessage: '添加主机'
+  }))), /*#__PURE__*/React.createElement(HostTable, {
+    operation: mode !== 'view',
+    type: type,
+    newly: newly,
+    groupId: groupId,
+    rowSelection: false,
+    dataSource: hostTableList,
+    loading: editHostTableLiading,
+    onDelete: onDelete,
+    style: {
+      minHeight: 0,
+      marginBottom: 20
+    }
+  }));
+};
+export default /*#__PURE__*/React.memo(HostList);

package/es/components/common/teambition/deploy-group-dialog/host-list/index.scss

@@ -0,0 +1,13 @@
+$prefix: host-list;
+
+.#{$prefix} {
+  &-title {
+    display: flex;
+    justify-content: space-between;
+    padding: 15px 0;
+  }
+}
+
+.edit-add-host {
+  width: 670px;
+}

package/es/components/common/teambition/deploy-group-dialog/host-table/index.d.ts

@@ -0,0 +1,3 @@
+import './index.scss';
+declare const _default: any;
+export default _default;

package/es/components/common/teambition/deploy-group-dialog/host-table/index.js

@@ -0,0 +1,261 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React from 'react';
+import { Balloon, Dialog, Message, Loading } from '@teamix/ui';
+import { YunxiaoIcon, Title, YunxiaoTable } from '@alife/devops-ui';
+import intl from "../../../../../locale";
+import exceed from "../../../../../utils/apimap";
+import "./index.scss";
+var Column = YunxiaoTable.Column;
+var Tooltip = Balloon.Tooltip;
+var titleTooltip = function titleTooltip(trigger, text) {
+  return /*#__PURE__*/React.createElement(Title, {
+    trigger: trigger,
+    align: "t"
+  }, text || trigger);
+};
+var tooltip = function tooltip(trigger, text) {
+  return /*#__PURE__*/React.createElement(Tooltip, {
+    trigger: trigger,
+    align: "t"
+  }, text || trigger);
+};
+var prefix = 'host-table';
+var HostTable = function HostTable(props) {
+  var _props$dataSource = props.dataSource,
+    dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
+    _props$groupId = props.groupId,
+    groupId = _props$groupId === void 0 ? '' : _props$groupId,
+    _props$selectedRowKey = props.selectedRowKeys,
+    selectedRowKeys = _props$selectedRowKey === void 0 ? [] : _props$selectedRowKey,
+    _props$rowSelection = props.rowSelection,
+    rowSelection = _props$rowSelection === void 0 ? true : _props$rowSelection,
+    _props$operation = props.operation,
+    operation = _props$operation === void 0 ? false : _props$operation,
+    emptyContent = props.emptyContent,
+    style = props.style,
+    _props$loading = props.loading,
+    loading = _props$loading === void 0 ? false : _props$loading,
+    newly = props.newly,
+    onRefresh = props.onRefresh,
+    purpose = props.purpose;
+  var onChange = props.onChange,
+    onDelete = props.onDelete;
+  var getHostOccupyStatus = function getHostOccupyStatus(_, __, item) {
+    var machineGroupId = item.machineGroupId,
+      machineGroupName = item.machineGroupName;
+    var isOccupy = machineGroupId && machineGroupId !== (groupId || '').toString();
+    var text = intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.NotOccupied',
+      defaultMessage: '未占用'
+    });
+    var dotColor = '#64D16D';
+    if (isOccupy) {
+      var groupIdArr = ("" + (machineGroupId || '')).split('|');
+      var groupNameArr = ("" + (machineGroupName || '')).split('|');
+      if (groupIdArr.includes((groupId || '').toString())) {
+        groupNameArr.splice(groupIdArr.findIndex(function (i) {
+          return i === (groupId || '').toString();
+        }), 1);
+      }
+      var name = groupNameArr.join('，');
+      text = intl.get({
+        id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.TheHostIsOccupiedBy',
+        defaultMessage: '主机已被主机组【{name}】占用'
+      }, {
+        name: name
+      });
+      dotColor = 'red';
+    }
+    return tooltip(/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      className: prefix + "-table-dot",
+      style: dotColor ? {
+        background: dotColor
+      } : {}
+    }), isOccupy ? intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.Occupied',
+      defaultMessage: '已占用'
+    }) : text), text);
+  };
+  var getHostStatus = function getHostStatus(_, __, item) {
+    var status = item.status;
+    var isStatus = status === 'ok' || status === 'Running';
+    var text = intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.Normal',
+      defaultMessage: '正常'
+    });
+    if (isStatus) return text;
+    text = intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.TheHostCannotBeConnected',
+      defaultMessage: '主机无法连接'
+    });
+    return titleTooltip(text);
+  };
+  var getOperation = /*#__PURE__*/React.createElement(Column, {
+    lock: "right",
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.Operation',
+      defaultMessage: '操作'
+    }),
+    width: 80,
+    cell: function cell(_, __, item) {
+      return /*#__PURE__*/React.createElement(YunxiaoIcon, {
+        type: "delete-line",
+        onClick: function onClick() {
+          return onDelete && onDelete(item);
+        },
+        className: prefix + "-delete"
+      });
+    }
+  });
+  var onRemoveBySn = function onRemoveBySn(instanceId, instanceName, uuid) {
+    var onOk = /*#__PURE__*/function () {
+      var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.next = 2;
+              return exceed.fetch({
+                api: 'SaMachine.removeBySn',
+                params: {
+                  sn: uuid || instanceId,
+                  purpose: purpose === 'BUILD_GROUP' ? 'BUILD_GROUP' : 'DEPLOY_GROUP'
+                },
+                data: {}
+              });
+            case 2:
+              onRefresh && onRefresh();
+              Message.success({
+                title: intl.get({
+                  id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.InstancenameTheHostHasBeen',
+                  defaultMessage: '【{instanceName}】主机删除成功'
+                }, {
+                  instanceName: instanceName
+                })
+              });
+            case 4:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+      return function onOk() {
+        return _ref.apply(this, arguments);
+      };
+    }();
+    Dialog.alert({
+      messageProps: {
+        type: 'error'
+      },
+      title: intl.get({
+        id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.DeleteHost',
+        defaultMessage: '删除主机'
+      }),
+      content: intl.get({
+        id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.AreYouSureYouWant',
+        defaultMessage: '确认删除【{instanceName}】主机吗？'
+      }, {
+        instanceName: instanceName
+      }),
+      animation: {
+        "in": 'expandInDown',
+        out: 'expandOutUp'
+      },
+      onOk: onOk
+    });
+  };
+  var renderDelete = function renderDelete() {
+    return /*#__PURE__*/React.createElement(Column, {
+      lock: "right",
+      title: intl.get({
+        id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.Operation',
+        defaultMessage: '操作'
+      }),
+      width: 80,
+      cell: function cell(_, __, _ref2) {
+        var instanceId = _ref2.instanceId,
+          instanceName = _ref2.instanceName,
+          status = _ref2.status,
+          uuid = _ref2.uuid;
+        if (status === 'ok' || status === 'Running') {
+          return '--';
+        }
+        return /*#__PURE__*/React.createElement(YunxiaoIcon, {
+          type: "delete-line",
+          onClick: function onClick() {
+            return onRemoveBySn(instanceId, instanceName, uuid);
+          },
+          className: prefix + "-delete"
+        });
+      }
+    });
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: prefix
+  }, /*#__PURE__*/React.createElement("div", {
+    style: _extends({}, style)
+  }, /*#__PURE__*/React.createElement(Loading, {
+    inline: false,
+    visible: loading
+  }, /*#__PURE__*/React.createElement(YunxiaoTable, _extends({
+    primaryKey: "instanceId",
+    hasBorder: true,
+    fixedHeader: true,
+    maxBodyHeight: 350,
+    className: "table-content",
+    emptyContent: newly && emptyContent,
+    dataSource: (dataSource || []).filter(Boolean)
+  }, rowSelection ? {
+    rowSelection: {
+      mode: 'multiple',
+      onChange: onChange,
+      selectedRowKeys: selectedRowKeys,
+      columnProps: function columnProps() {
+        return {
+          lock: 'none'
+        };
+      }
+    }
+  } : {}), /*#__PURE__*/React.createElement(Column, {
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.InstanceId',
+      defaultMessage: '实例ID'
+    }),
+    dataIndex: "instanceId",
+    cell: function cell(v) {
+      return titleTooltip(v);
+    }
+  }), /*#__PURE__*/React.createElement(Column, {
+    title: "IP",
+    dataIndex: "ipAddress",
+    width: 126,
+    cell: function cell(v) {
+      return tooltip(/*#__PURE__*/React.createElement("div", {
+        className: "ip"
+      }, v), v);
+    }
+  }), /*#__PURE__*/React.createElement(Column, {
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.HostName',
+      defaultMessage: '主机名'
+    }),
+    dataIndex: "instanceName",
+    cell: function cell(v) {
+      return titleTooltip(v);
+    }
+  }), /*#__PURE__*/React.createElement(Column, {
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.Usage',
+      defaultMessage: '占用情况'
+    }),
+    cell: getHostOccupyStatus
+  }), /*#__PURE__*/React.createElement(Column, {
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.deploy-group-dialog.host-table.HostStatus',
+      defaultMessage: '主机状态'
+    }),
+    cell: getHostStatus
+  }), operation && getOperation, props.type === 'PUBLIC_MACHINE' && newly && props.ecsAddType !== 'ECS_MANAGED' ? renderDelete() : null))));
+};
+export default /*#__PURE__*/React.memo(HostTable);

package/es/components/common/teambition/deploy-group-dialog/host-table/index.scss

@@ -0,0 +1,42 @@
+$prefix: host-table;
+
+.#{$prefix} {
+  .table-content {
+    padding-bottom: 0 !important;
+    .teamix-title-tooltip-trigger {
+      cursor: unset;
+    }
+    thead {
+      th {
+        .next-table-cell-wrapper {
+          padding-right: 19px;
+        }
+      }
+    }
+    .ip {
+      width: 94px;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+  }
+
+  &-table-dot {
+    display: inline-block;
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    background: #64d16d;
+    margin-right: 5px;
+  }
+
+  &-delete {
+    color: var(--color-fill1-7, #595959);
+    font-size: 17px !important;
+    cursor: pointer;
+
+    &:hover {
+      color: red;
+    }
+  }
+}

package/es/components/common/teambition/deploy-group-dialog/host-type/index.d.ts

@@ -0,0 +1,3 @@
+import './index.scss';
+declare const _default: any;
+export default _default;