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

package/es/components/common/teambition/pipeline-source/credential-form-item/index.js

@@ -0,0 +1,397 @@
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["credentials", "showCreateCredential"];
+import React, { Component } from 'react';
+import { Form, Select, Button, Message, Radio, Balloon } from '@teamix/ui';
+import { YunxiaoIcon } from '@alife/devops-ui';
+import exceed from "../../../../../utils/apimap";
+import Link from "../../help-link";
+import helpLink from "../../../../../utils/helplink";
+import Credential from "../credential";
+import RegionKeyPair from "./keypair";
+import intl from "../../../../../locale";
+import "./index.scss";
+import { getFeature } from "../../../../../utils";
+import NewItem from "./newItem";
+var FormItem = Form.Item;
+var Option = Select.Option;
+var currentUser = window.AK_GLOBAL.currentUser.workid;
+var scGrayEnable = window.YUNXIAO_COMMON.serviceConnectionGrayRegion === 'true';
+var tooltip = function tooltip(text, trigger) {
+  return /*#__PURE__*/React.createElement(Balloon.Tooltip, {
+    align: "t",
+    trigger: trigger
+  }, text);
+};
+var labelWithHint = function labelWithHint(labelText) {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", null, labelText, tooltip(/*#__PURE__*/React.createElement("span", null, intl.get({
+    id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.TheEnterprisePublicKeyDoes',
+    defaultMessage: '企业公钥不支持Github， 通过企业公钥，可帮助您快速连接企业的代码库'
+  }), helpLink('ssh_key') && /*#__PURE__*/React.createElement(React.Fragment, null, intl.get({
+    id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.ForBestPracticesPlease',
+    defaultMessage: '，最佳实践方案请'
+  }), /*#__PURE__*/React.createElement(Link, {
+    href: helpLink('ssh_key')
+  }))), /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "question-line",
+    style: {
+      color: 'var(--color-text1-7, #8b8b8b)',
+      marginLeft: 5,
+      cursor: 'pointer'
+    }
+  }))));
+};
+var FieldExtraWrapper = function FieldExtraWrapper(_ref) {
+  var showCreateCredential = _ref.showCreateCredential;
+  return /*#__PURE__*/React.createElement(Button, {
+    text: true,
+    type: "primary",
+    onClick: function onClick() {
+      return showCreateCredential();
+    }
+  }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "add-fill"
+  }), intl.get({
+    id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.CreateACertificate',
+    defaultMessage: '新建证书'
+  }));
+};
+var FieldWrapper = function FieldWrapper(_ref2) {
+  var credentials = _ref2.credentials,
+    showCreateCredential = _ref2.showCreateCredential,
+    props = _objectWithoutPropertiesLoose(_ref2, _excluded);
+  return /*#__PURE__*/React.createElement(Select, _extends({
+    showSearch: true,
+    className: "credential-select",
+    container: function container(trigger) {
+      return trigger.parentNode;
+    }
+  }, props), credentials.map(function (credential) {
+    return /*#__PURE__*/React.createElement(Option, {
+      value: credential.value,
+      key: credential.value
+    }, credential.label, credential.owner === currentUser && /*#__PURE__*/React.createElement(Button, {
+      text: true,
+      className: "edit-credential-btn",
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        showCreateCredential(credential.value);
+      }
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.Editing',
+      defaultMessage: '编辑'
+    })));
+  }));
+};
+var CredentialFormItem = /*#__PURE__*/function (_Component) {
+  function CredentialFormItem(props) {
+    var _this;
+    _this = _Component.call(this, props) || this;
+    _this.onChange = function (credential) {
+      if (credential === void 0) {
+        credential = {};
+      }
+      var _credential = credential,
+        value = _credential.value,
+        label = _credential.label;
+      _this.field.setValues({
+        credential: value,
+        credentialLabel: label
+      });
+      _this.props.onChange && _this.props.onChange({
+        credential: value,
+        credentialLabel: label
+      });
+    };
+    _this.onCredentialTypeChange = function (credentialType) {
+      if (credentialType === 'region-ssh') {
+        _this.field.setValues({
+          credentialType: credentialType,
+          credential: _this.state.publicKeyId,
+          credentialLabel: intl.get({
+            id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.EnterprisePublicKey',
+            defaultMessage: '{orgName}公钥'
+          }, {
+            orgName: getFeature('org.name')
+          })
+        });
+      } else if (credentialType === 'personal-usernamepassword') {
+        _this.field.setValues({
+          credentialType: credentialType,
+          credential: null
+        });
+      } else if (credentialType === 'none') {
+        _this.field.setValues({
+          credentialType: null,
+          credential: null,
+          connection: null
+        });
+      } else {
+        _this.onChange({});
+      }
+    };
+    _this.getCredentialValue = function () {
+      return _this.field.getValue('credential');
+    };
+    _this.getCredentialLabel = function () {
+      return _this.field.getValue('credentialLabel');
+    };
+    _this.getRegionKeyPair = function (onResponse) {
+      if (onResponse === void 0) {
+        onResponse = function onResponse() {};
+      }
+      exceed.fetch({
+        api: 'Credential.region.keypair'
+      }).then(function (res) {
+        if (res.successful) {
+          _this.setState({
+            publicKey: res.object.publicKey,
+            publicKeyId: res.object.id
+          });
+        }
+        onResponse(res);
+      });
+    };
+    _this.getCustomCredentials = function () {
+      exceed.fetch({
+        api: 'Credential.currentuser.all'
+      }).then(function (data) {
+        if (data.successful) {
+          var currentValue = _this.getCredentialValue();
+          if (currentValue && !data.object.find(function (credential) {
+            return credential.id === currentValue;
+          })) {
+            var label = _this.getCredentialLabel();
+            if (label) {
+              data.object.push({
+                name: label,
+                id: currentValue
+              });
+            }
+          }
+          var credentials = data.object.filter(function (item) {
+            return item.scope !== 'GLOBAL_PUBLIC';
+          }).map(function (e) {
+            return {
+              label: e.name,
+              value: e.id,
+              owner: e.owner,
+              scope: e.scope
+            };
+          });
+          if (!_this.getCredentialValue() && credentials.length > 0) {
+            _this.onChange(credentials[0]);
+          }
+          _this.setState({
+            credentials: credentials
+          });
+        } else {
+          Message.error({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.FailedToObtainTheCertificate',
+              defaultMessage: '获取证书列表失败，{dataErrorMsg}'
+            }, {
+              dataErrorMsg: data.errorMsg
+            })
+          });
+        }
+      }).fail(function (res, msg) {
+        Message.error({
+          title: intl.get({
+            id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.FailedToObtainTheCertificate.1',
+            defaultMessage: '获取证书列表失败，{msg}'
+          }, {
+            msg: msg
+          })
+        });
+      });
+    };
+    _this.afterCreate = function (id, name) {
+      var credential = {
+        label: name,
+        value: id,
+        owner: currentUser
+      };
+      _this.setState({
+        credentials: _this.state.credentials.concat([credential])
+      });
+      _this.onChange(credential);
+    };
+    _this.afterDelete = function (id) {
+      _this.setState({
+        credentials: _this.state.credentials.filter(function (credential) {
+          return credential.value !== id;
+        })
+      });
+      if (id === _this.getCredentialValue()) {
+        _this.onChange();
+      }
+    };
+    _this.showCreateCredential = function (editCredentialId) {
+      _this.setState({
+        shouldShowCreateCredential: true,
+        editCredentialId: editCredentialId
+      });
+    };
+    _this.resetKeyPair = function () {
+      exceed.fetch({
+        api: 'Credential.region.keypair.reset'
+      }).then(function (res) {
+        if (res.successful) {
+          _this.setState({
+            publicKey: res.object.publicKey
+          });
+          Message.success({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.TheEnterpriseKeyPairHas',
+              defaultMessage: '企业秘钥对重置成功'
+            }),
+            duration: 2000
+          });
+        }
+      });
+    };
+    _this.state = {
+      credentials: [],
+      shouldShowCreateCredential: false,
+      publicKey: 'Loading'
+    };
+    _this.field = props.field;
+    return _this;
+  }
+  _inheritsLoose(CredentialFormItem, _Component);
+  var _proto = CredentialFormItem.prototype;
+  _proto.componentDidMount = function componentDidMount() {
+    var _this2 = this;
+    this.getRegionKeyPair(function () {
+      _this2.getCustomCredentials();
+      if (_this2.field.getValue('credentialType') === undefined) {
+        _this2.onCredentialTypeChange('personal-usernamepassword');
+      }
+    });
+  };
+  _proto.render = function render() {
+    var _this3 = this;
+    var _this$props = this.props,
+      field = _this$props.field,
+      supportNoCredential = _this$props.supportNoCredential;
+    var init = field.init;
+    var credentialOptions = [{
+      label: intl.get({
+        id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.PersonalCertificate',
+        defaultMessage: '个人证书'
+      }),
+      value: 'personal-usernamepassword'
+    }, {
+      label: intl.get({
+        id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.EnterprisePublicKey',
+        defaultMessage: '{orgName}公钥'
+      }, {
+        orgName: getFeature('org.name')
+      }),
+      value: 'region-ssh'
+    }];
+    if (supportNoCredential) {
+      credentialOptions.unshift({
+        label: intl.get({
+          id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.none',
+          defaultMessage: '不使用凭证'
+        }),
+        value: 'none'
+      });
+    }
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Credential, {
+      afterCreate: this.afterCreate,
+      afterDelete: this.afterDelete,
+      visible: this.state.shouldShowCreateCredential,
+      onCancel: function onCancel() {
+        return _this3.setState({
+          shouldShowCreateCredential: false
+        });
+      },
+      onClose: function onClose() {
+        return _this3.setState({
+          shouldShowCreateCredential: false
+        });
+      },
+      editCredentialId: this.state.editCredentialId,
+      tokenHint: this.props.tokenHint,
+      userNameHint: this.props.userNameHint,
+      sourceType: this.props.sourceType,
+      sourceTypeName: this.props.sourceTypeName
+    }), !window.AK_GLOBAL.isAliVpc && this.props.sourceType !== 'jenkins' && /*#__PURE__*/React.createElement(FormItem, {
+      label: intl.get({
+        id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.SelectACredentialType',
+        defaultMessage: '选择凭证类型'
+      }),
+      className: "next-top"
+    }, /*#__PURE__*/React.createElement(Radio.Group, _extends({
+      dataSource: credentialOptions
+    }, init('credentialType', {
+      rules: [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.SelectACredentialType.1',
+          defaultMessage: '请选择凭证类型'
+        })
+      }],
+      props: {
+        onChange: function onChange(credentialType) {
+          _this3.onCredentialTypeChange(credentialType);
+        }
+      }
+    })))), field.getValue('credentialType') === 'region-ssh' && /*#__PURE__*/React.createElement(Form.Item, {
+      className: "next-top label-with-ops",
+      label: labelWithHint(intl.get({
+        id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.EnterprisePublicKey',
+        defaultMessage: '{orgName}公钥'
+      }, {
+        orgName: getFeature('org.name')
+      }), this.resetKeyPair)
+    }, /*#__PURE__*/React.createElement(RegionKeyPair, _extends({
+      publickKey: this.state.publicKey,
+      resetKeyPair: this.resetKeyPair
+    }, init('credential', {
+      rules: [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.CheckTheEnterpriseCertificateConfiguration',
+          defaultMessage: '请检查企业证书配置'
+        })
+      }]
+    })))), field.getValue('credentialType') === 'personal-usernamepassword' && /*#__PURE__*/React.createElement(FormItem, {
+      className: "next-top credential-selector",
+      label: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", null, intl.get({
+        id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.PersonalCertificate',
+        defaultMessage: '个人证书'
+      })), /*#__PURE__*/React.createElement("div", {
+        className: "extra"
+      }, /*#__PURE__*/React.createElement(FieldExtraWrapper, {
+        showCreateCredential: this.showCreateCredential
+      })))
+    }, /*#__PURE__*/React.createElement(FieldWrapper, _extends({
+      credentials: this.state.credentials,
+      publicKey: this.state.publicKey,
+      showCreateCredential: this.showCreateCredential
+    }, init('credential', {
+      rules: [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.SelectACertificate',
+          defaultMessage: '请选择证书'
+        })
+      }],
+      props: {
+        onChange: function onChange(value) {
+          var credential = _this3.state.credentials.find(function (item) {
+            return item.value === value;
+          });
+          _this3.onChange(credential);
+        }
+      }
+    })))));
+  };
+  return CredentialFormItem;
+}(Component);
+export default scGrayEnable ? NewItem : CredentialFormItem;

package/es/components/common/teambition/pipeline-source/credential-form-item/index.scss

@@ -0,0 +1,90 @@
+.credential-select {
+  .next-select-values {
+    .next-btn {
+      display: none;
+    }
+  }
+}
+
+.service-connection-options-wrap {
+  .next-select-menu-item {
+    .next-menu-item-text {
+      display: flex;
+      justify-content: space-between;
+      max-width: 100%;
+      .next-btn {
+        line-height: normal;
+        float: unset;
+        .next-btn-helper {
+          color: var(--color-brand1-6, #1b9aee) !important;
+          vertical-align: unset;
+        }
+      }
+      .item-ops {
+        display: flex;
+        flex-shrink: 0;
+      }
+    }
+  }
+}
+
+.next-select-menu-item {
+  .next-menu-item-text {
+    .next-btn {
+      float: right;
+      line-height: 36px;
+      height: 36px;
+
+      .next-btn-space {
+        display: none;
+      }
+    }
+  }
+}
+
+.edit-credential-btn {
+  color: var(--color-brand1-6, #1b9aee) !important;
+}
+
+.help-tip {
+  color: var(--color-white, #fff) !important;
+}
+
+.label-with-ops {
+  .next-form-item-label {
+    width: 100%;
+    padding-right: 0;
+    // padding-bottom: 2px;
+
+    label {
+      width: 100%;
+      display: block;
+
+      > div {
+        display: flex;
+        justify-content: space-between;
+
+        > button {
+          padding: 1px;
+          height: 22px;
+          line-height: 22px;
+        }
+      }
+    }
+  }
+}
+
+
+.credential-keypair-disabled {
+  height: 46px;
+  display: flex;
+  align-items: center;
+  border-radius: 4px;
+  background: #F2F5F7;
+  padding: 0 16px;
+  margin-top: 10px;
+
+  span {
+    color: #ADADAD;
+  }
+}

package/es/components/common/teambition/pipeline-source/credential-form-item/keypair.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const RegionKeyPair: ({ publickKey, resetKeyPair }: {
+    publickKey: any;
+    resetKeyPair?: () => void;
+}) => JSX.Element;
+export default RegionKeyPair;

package/es/components/common/teambition/pipeline-source/credential-form-item/keypair.js

@@ -0,0 +1,80 @@
+import React from 'react';
+import { Input, Dialog, Button, Divider } from '@teamix/ui';
+import { YunxiaoIcon } from '@alife/devops-ui';
+import { CopyToClipboard } from 'react-copy-to-clipboard';
+import { tireToast } from "../../../../../utils";
+import intl from "../../../../../locale";
+var PERMISSION_KEYPAIR_ADMIN = 'tb.role.keypair.admin';
+var _ref = window.AK_GLOBAL.currentUser || {},
+  permissions = _ref.permissions;
+var canView = permissions.includes(PERMISSION_KEYPAIR_ADMIN);
+var RegionKeyPair = function RegionKeyPair(_ref2) {
+  var publickKey = _ref2.publickKey,
+    _ref2$resetKeyPair = _ref2.resetKeyPair,
+    resetKeyPair = _ref2$resetKeyPair === void 0 ? function () {} : _ref2$resetKeyPair;
+  var confirmReset = function confirmReset() {
+    Dialog.confirm({
+      messageProps: {
+        type: 'notice'
+      },
+      title: intl.get({
+        id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.keypair.ConfirmToResetTheEnterprise',
+        defaultMessage: '确认重置企业公钥'
+      }),
+      content: intl.get({
+        id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.keypair.AfterResettingANewEnterprise',
+        defaultMessage: '重置后将生成新的企业秘钥对，已配置使用公钥克隆的代码库需要重新导入公钥。'
+      }),
+      onOk: function onOk() {
+        resetKeyPair();
+      }
+    });
+  };
+  if (!canView) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "credential-keypair-disabled"
+    }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "link-line"
+    }), /*#__PURE__*/React.createElement(Divider, {
+      direction: "ver"
+    }), /*#__PURE__*/React.createElement("span", null, intl.get({
+      id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.keypair.YouAreNotAuthorizedTo',
+      defaultMessage: '您暂无权限查看企业公钥'
+    })));
+  }
+  return /*#__PURE__*/React.createElement(Input, {
+    className: "credential-keypair",
+    value: publickKey,
+    readOnly: true,
+    addonTextBefore: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "link-line"
+    }),
+    addonTextAfter: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CopyToClipboard, {
+      text: publickKey,
+      onCopy: function onCopy() {
+        return tireToast({
+          title: intl.get({
+            id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.keypair.CopiedToClipboard',
+            defaultMessage: '成功复制到剪贴板'
+          })
+        }, 'copyWebhook', 'success', '500');
+      }
+    }, /*#__PURE__*/React.createElement(Button, {
+      text: true,
+      type: "primary"
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.keypair.Copy',
+      defaultMessage: '复制'
+    }))), /*#__PURE__*/React.createElement("span", null, "\xA0|\xA0"), /*#__PURE__*/React.createElement(Button, {
+      text: true,
+      type: "primary",
+      onClick: function onClick() {
+        confirmReset();
+      }
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.pipeline-source.credential-form-item.keypair.Reset',
+      defaultMessage: '重置'
+    })))
+  });
+};
+export default RegionKeyPair;

package/es/components/common/teambition/pipeline-source/credential-form-item/newItem.d.ts

@@ -0,0 +1,15 @@
+import { Component } from 'react';
+import './index.scss';
+declare class CredentialFormItem extends Component {
+    constructor(props: any);
+    componentDidMount(): void;
+    onChange: (connection?: {}) => void;
+    onCredentialTypeChange: (credentialType: any, connection: any) => void;
+    getConnectionValue: () => any;
+    getConnectionLabel: () => any;
+    getRegionKeyPair: (onResponse?: () => void) => void;
+    getCustomCredentials: () => void;
+    resetKeyPair: () => void;
+    render(): JSX.Element;
+}
+export default CredentialFormItem;