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

package/es/components/common/teambition/flow-engine/dialogs/createJenkinsCredential/index.js

@@ -0,0 +1,179 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useState } from 'react';
+import { Dialog, Button, Form, Field, Input, Message } from '@teamix/ui';
+import { YunxiaoIcon } from '@alife/devops-ui';
+import { getLabel, createCredential } from "../../../pipeline-source/jenkins/utils";
+import track from "../../../../../../utils/track";
+import intl from "../../../../../../locale";
+import "./index.scss";
+var prefix = 'c-jenkins-credential';
+var FormItem = Form.Item;
+var CreateJenkinsCredential = function CreateJenkinsCredential(props) {
+  var _props$title = props.title,
+    title = _props$title === void 0 ? '' : _props$title;
+  var _useState = useState(false),
+    visible = _useState[0],
+    setVisible = _useState[1];
+  var _useState2 = useState(false),
+    btnLoading = _useState2[0],
+    setBtnLoading = _useState2[1];
+  var field = Field.useField();
+  var handelVisible = function handelVisible(v) {
+    setVisible(v);
+  };
+  var checkSite = function checkSite(_, value, callback) {
+    if (!/^http(s)?:\/\/.+/.test(value)) {
+      return callback(intl.get({
+        id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.StartWithHttpOrHttps',
+        defaultMessage: '请以http或https开头'
+      }));
+    }
+    callback();
+  };
+  var _createCredential = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            field.validate(/*#__PURE__*/function () {
+              var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(e) {
+                var _yield$createCredenti, successful;
+                return _regeneratorRuntime.wrap(function _callee$(_context) {
+                  while (1) switch (_context.prev = _context.next) {
+                    case 0:
+                      if (!e) {
+                        _context.next = 2;
+                        break;
+                      }
+                      return _context.abrupt("return");
+                    case 2:
+                      setBtnLoading(true);
+                      _context.next = 5;
+                      return createCredential(field.getValues());
+                    case 5:
+                      _yield$createCredenti = _context.sent;
+                      successful = _yield$createCredenti.successful;
+                      if (successful) {
+                        _context.next = 10;
+                        break;
+                      }
+                      setBtnLoading(false);
+                      return _context.abrupt("return");
+                    case 10:
+                      track({
+                        action: 'add jenkins account',
+                        page: 'source page'
+                      });
+                      Message.success({
+                        title: intl.get({
+                          id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.BoundSuccessfully',
+                          defaultMessage: '绑定成功'
+                        })
+                      });
+                      handelVisible(false);
+                      setBtnLoading(false);
+                    case 14:
+                    case "end":
+                      return _context.stop();
+                  }
+                }, _callee);
+              }));
+              return function (_x) {
+                return _ref2.apply(this, arguments);
+              };
+            }());
+          case 1:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+    return function _createCredential() {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+    text: true,
+    type: "primary",
+    className: prefix + "__btn",
+    onClick: function onClick() {
+      return handelVisible(true);
+    }
+  }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "add-fill"
+  }), title), /*#__PURE__*/React.createElement(Dialog, {
+    title: title,
+    visible: visible,
+    onClose: function onClose() {
+      return handelVisible(false);
+    },
+    onCancel: function onCancel() {
+      return handelVisible(false);
+    },
+    onOk: _createCredential,
+    okProps: {
+      loading: btnLoading
+    },
+    animation: {
+      "in": 'expandInDown',
+      out: 'expandOutUp'
+    },
+    style: {
+      width: 600
+    }
+  }, /*#__PURE__*/React.createElement("section", {
+    className: prefix + "__account"
+  }, /*#__PURE__*/React.createElement("header", {
+    className: "header"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "text"
+  }, intl.get({
+    id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.BindAJenkinsAccount',
+    defaultMessage: '请绑定Jenkins账号'
+  }))), /*#__PURE__*/React.createElement(Form, {
+    field: field
+  }, /*#__PURE__*/React.createElement(FormItem, {
+    required: true,
+    validator: checkSite,
+    requiredMessage: intl.get({
+      id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.EnterTheJenkinsMasterAddress',
+      defaultMessage: '请输入Jenkins Master地址'
+    }),
+    label: getLabel('name')
+  }, /*#__PURE__*/React.createElement(Input, {
+    name: "name",
+    placeholder: intl.get({
+      id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.Enter',
+      defaultMessage: '请输入'
+    })
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    required: true,
+    requiredMessage: intl.get({
+      id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.EnterAUsername',
+      defaultMessage: '请输入用户名'
+    }),
+    label: getLabel('username')
+  }, /*#__PURE__*/React.createElement(Input, {
+    name: "username",
+    placeholder: intl.get({
+      id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.Enter',
+      defaultMessage: '请输入'
+    })
+  })), /*#__PURE__*/React.createElement(FormItem, {
+    required: true,
+    requiredMessage: intl.get({
+      id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.EnterAPassword',
+      defaultMessage: '请输入密码'
+    }),
+    label: getLabel('password')
+  }, /*#__PURE__*/React.createElement(Input, {
+    name: "password",
+    placeholder: intl.get({
+      id: 'rdc-tb-cd-assets.dialogs.createJenkinsCredential.Enter',
+      defaultMessage: '请输入'
+    }),
+    htmlType: "password"
+  }))))));
+};
+export default CreateJenkinsCredential;

package/es/components/common/teambition/flow-engine/dialogs/createJenkinsCredential/index.scss

@@ -0,0 +1,32 @@
+$prefix: c-jenkins-credential;
+
+
+.#{$prefix} {
+  &__btn {
+    position: absolute;
+    right: 0;
+  }
+  &__account {
+    width: 100%;
+    height: auto;
+    background: var(--color-fill1-2, #f7f7f7);
+    border: 1px solid var(--color-brand3-2, #e9edf0);
+    box-shadow: 0 1px 2px 0 rgba(38, 38, 38, 0.10);
+    border-radius: 4px;
+    padding: 20px;
+    .header {
+      display: flex;
+      justify-content: space-between;
+      margin-bottom: 10px;
+      .text {
+        font-size: 18px;
+        color: var(--color-text1-4, #292929);
+      }
+    }
+    label {
+      &::after {
+        content: '' !important;
+      }
+    }
+  }
+}

package/es/components/common/teambition/flow-engine/dialogs/dialog.d.ts

@@ -0,0 +1,8 @@
+import { Component } from 'react';
+declare class Dialog extends Component {
+    constructor(props: any);
+    UNSAFE_componentWillMount(): void;
+    componentDidMount(): void;
+    render(): JSX.Element;
+}
+export default Dialog;

package/es/components/common/teambition/flow-engine/dialogs/dialog.js

@@ -0,0 +1,59 @@
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import React, { Component } from 'react';
+var Dialog = /*#__PURE__*/function (_Component) {
+  function Dialog(props) {
+    var _this;
+    _this = _Component.call(this, props) || this;
+    _this.state = {};
+    return _this;
+  }
+  _inheritsLoose(Dialog, _Component);
+  var _proto = Dialog.prototype;
+  _proto.UNSAFE_componentWillMount = function UNSAFE_componentWillMount() {
+    var _this$props = this.props,
+      identifier = _this$props.identifier,
+      globalProps = _this$props.globalProps,
+      contextField = _this$props.contextField,
+      createable = _this$props.createable;
+    if (createable && createable.props) {
+      var context = {};
+      Object.keys(createable.props).forEach(function (key) {
+        var value = createable.props[key];
+        var matchResult = value.match(/\$\{[^}]*\}/g);
+        if (matchResult) {
+          matchResult.forEach(function (matched) {
+            var name = matched.replace(/\$\{([^}]*)}/, '$1');
+            if (name.indexOf('global_props.') > -1) {
+              value = value.replace(matched, globalProps[name.replace('global_props.', '')]);
+            } else {
+              value = value.replace(matched, contextField.getValue(name + "____" + identifier) || '');
+            }
+          });
+        }
+        value = value === 'undefined' ? '' : value;
+        context[key] = value;
+      });
+      // eslint-disable-next-line react/no-unused-state
+      this.setState({
+        context: context
+      });
+    }
+  };
+  _proto.componentDidMount = function componentDidMount() {
+    var field = this.props.field;
+    field.reset();
+    if (!this.onSubmit) {
+      console.log('%c This DialogComponent should implement the method onSubmit. Please see example like AddApp Component', 'background: #222; color: #bada55; font-size: 20px; padding: 6px 0');
+      return;
+    }
+    field.setValue('_cb', this.onSubmit);
+    if (this.onComponentDidMount) {
+      this.onComponentDidMount();
+    }
+  };
+  _proto.render = function render() {
+    return /*#__PURE__*/React.createElement("h2", null, "Hi Please Implement the DialogComponent");
+  };
+  return Dialog;
+}(Component);
+export default Dialog;

package/es/components/common/teambition/flow-engine/dialogs/emas-app/index.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import Dialog from '../dialog';
+import './index.scss';
+declare class EmasApp extends Dialog {
+    prefix: string;
+    STEP_BASIC: string;
+    STEP_CERT: string;
+    constructor(props: any);
+    parseKeystore: (fileList: any) => void;
+    removeKeystore: () => void;
+    createProject: (scId: any, productName: any, resolve: any, reject: any) => Promise<void>;
+    onSubmit: () => Promise<unknown>;
+    onSelectNavKey: (key: any) => void;
+    get renderBasicForm(): JSX.Element;
+    get renderCertForm(): JSX.Element;
+    render(): JSX.Element;
+}
+export default EmasApp;

package/es/components/common/teambition/flow-engine/dialogs/emas-app/index.js

@@ -0,0 +1,377 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React from 'react';
+import { Form, Field, Input, Upload, Checkbox } from '@teamix/ui';
+import exceed from "../../../../../../utils/apimap";
+import Dialog from "../dialog";
+import Nav from '@alife/teamix-at-nav';
+import cls from 'classnames';
+import "./index.scss";
+import intl from "../../../../../../locale";
+import { YunxiaoIcon } from '@alife/devops-ui';
+var NavItem = Nav.Item;
+var FormItem = Form.Item;
+var EmasApp = /*#__PURE__*/function (_Dialog) {
+  function EmasApp(props) {
+    var _this;
+    _this = _Dialog.call(this, props) || this;
+    _this.prefix = 'emas-app';
+    _this.STEP_BASIC = 'step-basic';
+    _this.STEP_CERT = 'step-cert';
+    _this.parseKeystore = function (fileList) {
+      var file = fileList[0];
+      _this.keyStoreFileName = file.name;
+      var reader = new FileReader();
+      reader.addEventListener('load', function () {
+        _this.setState({
+          keystoreBase64Content: btoa(reader.result),
+          keystoreFileError: null
+        });
+      }, false);
+      if (file) {
+        reader.readAsBinaryString(file.originFileObj);
+      }
+    };
+    _this.removeKeystore = function () {
+      _this.keyStoreFileName = null;
+      _this.setState({
+        keystoreBase64Content: null
+      });
+    };
+    _this.createProject = /*#__PURE__*/function () {
+      var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(scId, productName, resolve, reject) {
+        var res;
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.next = 2;
+              return exceed.fetch({
+                api: 'emas.product.create',
+                data: {
+                  scId: scId,
+                  productName: productName
+                }
+              });
+            case 2:
+              res = _context.sent;
+              if (res.successful && res.object) {
+                resolve({
+                  label: productName,
+                  value: res.object
+                });
+              } else {
+                reject();
+              }
+            case 4:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+      return function (_x, _x2, _x3, _x4) {
+        return _ref.apply(this, arguments);
+      };
+    }();
+    _this.onSubmit = function () {
+      return new Promise(function (resolve, reject) {
+        _this.field.validate(function (errors, vals) {
+          var _ref2 = vals || {},
+            appName = _ref2.appName,
+            packageName = _ref2.packageName,
+            keyPassword = _ref2.keyPassword,
+            credential = _ref2.credential,
+            keyAlias = _ref2.keyAlias,
+            createCert = _ref2.createCert;
+          var _this2 = _this,
+            keystoreBase64Content = _this2.state.keystoreBase64Content,
+            _this2$props = _this2.props,
+            productId = _this2$props.productId,
+            connectionId = _this2$props.connectionId;
+          if (errors) {
+            if (appName && packageName) {
+              _this.setState({
+                selectedKey: _this.STEP_CERT
+              });
+            }
+            if (keyPassword && credential && keyAlias && keystoreBase64Content) {
+              _this.setState({
+                selectedKey: _this.STEP_BASIC
+              });
+            }
+            return reject();
+          }
+          if (createCert && (!_this.keyStoreFileName || !keystoreBase64Content)) {
+            _this.setState({
+              keystoreFileError: intl.get({
+                id: 'rdc-tb-cd-assets.dialogs.emas-app.UploadTheKeystoreFile',
+                defaultMessage: '请上传keystore文件'
+              })
+            });
+            reject();
+            return;
+          }
+          exceed.fetch({
+            api: 'emas.app.create',
+            data: {
+              appName: appName,
+              packageName: packageName,
+              createCert: createCert,
+              credential: credential,
+              keyAlias: keyAlias,
+              keyPassword: keyPassword,
+              productId: productId,
+              scId: connectionId,
+              keyStoreName: _this.keyStoreFileName,
+              certificate: keystoreBase64Content,
+              type: 2
+            }
+          }).then(function (res) {
+            if (res.successful && res.object) {
+              resolve({
+                label: appName,
+                value: res.object
+              });
+            } else {
+              reject();
+            }
+          });
+        });
+      });
+    };
+    _this.onSelectNavKey = function (key) {
+      _this.setState({
+        selectedKey: key
+      });
+    };
+    _this.field = new Field(_this);
+    _this.keyStoreFileName = null;
+    _this.state = {
+      selectedKey: _this.STEP_BASIC,
+      keystoreFileError: null,
+      keystoreBase64Content: null,
+      droping: false
+    };
+    return _this;
+  }
+  _inheritsLoose(EmasApp, _Dialog);
+  var _proto = EmasApp.prototype;
+  _proto.render = function render() {
+    var selectedKey = this.state.selectedKey,
+      prefix = this.prefix;
+    return /*#__PURE__*/React.createElement("div", {
+      className: prefix
+    }, /*#__PURE__*/React.createElement("div", {
+      className: prefix + "__sidebar"
+    }, /*#__PURE__*/React.createElement(Nav, {
+      selectedKey: selectedKey,
+      onSelect: this.onSelectNavKey
+    }, /*#__PURE__*/React.createElement(NavItem, {
+      key: this.STEP_BASIC,
+      label: intl.get({
+        id: 'rdc-tb-cd-assets.dialogs.emas-app.BasicInformation',
+        defaultMessage: '基础信息'
+      })
+    }), /*#__PURE__*/React.createElement(NavItem, {
+      key: this.STEP_CERT,
+      label: intl.get({
+        id: 'rdc-tb-cd-assets.dialogs.emas-app.CertificateInformation',
+        defaultMessage: '证书信息'
+      })
+    }))), /*#__PURE__*/React.createElement("div", {
+      className: prefix + "__content"
+    }, this.renderBasicForm, this.renderCertForm));
+  };
+  return _createClass(EmasApp, [{
+    key: "renderBasicForm",
+    get: function get() {
+      var selectedKey = this.state.selectedKey,
+        prefix = this.prefix,
+        field = this.field;
+      var classes = cls(prefix + "__" + (selectedKey === this.STEP_BASIC ? 'show' : 'hide'));
+      var appNamerRules = [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.EnterAnApplicationName',
+          defaultMessage: '请填写应用名'
+        })
+      }, {
+        maxLength: 26,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.UpToDigits',
+          defaultMessage: '最长26位'
+        })
+      }];
+      var packageNameRules = [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.EnterThePackageName',
+          defaultMessage: '请填写包名称'
+        })
+      }];
+      return /*#__PURE__*/React.createElement(Form, {
+        field: field,
+        className: classes
+      }, /*#__PURE__*/React.createElement(FormItem, {
+        label: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.ApplicationName',
+          defaultMessage: '应用名称'
+        }),
+        required: true
+      }, /*#__PURE__*/React.createElement(Input, _extends({}, field.init('appName', {
+        rules: appNamerRules
+      }), {
+        placeholder: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.EnterAnApplicationNameWith',
+          defaultMessage: '请输入应用名称，不超过26位'
+        })
+      }))), /*#__PURE__*/React.createElement(FormItem, {
+        label: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.PackageName',
+          defaultMessage: '包名称'
+        }),
+        required: true
+      }, /*#__PURE__*/React.createElement(Input, _extends({}, field.init('packageName', {
+        rules: packageNameRules
+      }), {
+        placeholder: "com.company.android"
+      }))), /*#__PURE__*/React.createElement("div", {
+        style: {
+          height: 30,
+          opacity: 0
+        }
+      }));
+    }
+  }, {
+    key: "renderCertForm",
+    get: function get() {
+      var _this3 = this;
+      var _this$state = this.state,
+        selectedKey = _this$state.selectedKey,
+        keystoreFileError = _this$state.keystoreFileError,
+        droping = _this$state.droping,
+        prefix = this.prefix,
+        field = this.field;
+      var classes = cls(prefix + "__" + (selectedKey === this.STEP_CERT ? 'show' : 'hide'));
+      var dropContent = /*#__PURE__*/React.createElement("div", {
+        className: cls('next-upload-drag', {
+          'next-upload-drag-over': droping
+        })
+      }, /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+        type: "resource-pool-line",
+        size: "large"
+      })), /*#__PURE__*/React.createElement("p", null, intl.get({
+        id: 'rdc-tb-cd-assets.dialogs.emas-app.ClickOrDragTheKeystore',
+        defaultMessage: '点击或将Keystore文件拖拽到这里上传'
+      })));
+      var credentialRules = [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.EnterTheKeystorePassword',
+          defaultMessage: '请填写Keystore密码'
+        })
+      }];
+      var keyAliasRules = [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.EnterTheKeyAlias',
+          defaultMessage: '请填写 Key 别名'
+        })
+      }];
+      var keyPasswordRules = [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.EnterTheKeyAndPassword',
+          defaultMessage: '请填写 Key 密码'
+        })
+      }];
+      var createCert = field.getValue('createCert');
+      return /*#__PURE__*/React.createElement(Form, {
+        field: field,
+        className: classes
+      }, /*#__PURE__*/React.createElement(FormItem, {
+        label: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.AddCertificate',
+          defaultMessage: '添加证书'
+        })
+      }, /*#__PURE__*/React.createElement(Checkbox, field.init('createCert', {
+        initValue: false
+      }))), createCert && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormItem, {
+        label: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.CertificateKeystoreFile',
+          defaultMessage: '证书 Keystore 文件'
+        }),
+        required: true
+      }, /*#__PURE__*/React.createElement(Upload.Dragger, {
+        limit: 1,
+        listType: "text",
+        autoUpload: false,
+        onDragOver: function onDragOver() {
+          return _this3.setState({
+            droping: true
+          });
+        },
+        onDragLeave: function onDragLeave() {
+          return _this3.setState({
+            droping: false
+          });
+        },
+        onDrop: function onDrop() {
+          return _this3.setState({
+            droping: false
+          });
+        },
+        onSelect: this.parseKeystore,
+        onRemove: this.removeKeystore
+      }, dropContent), keystoreFileError && /*#__PURE__*/React.createElement("span", {
+        style: {
+          color: 'red'
+        }
+      }, keystoreFileError)), /*#__PURE__*/React.createElement(FormItem, {
+        label: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.KeystorePassword',
+          defaultMessage: 'Keystore 密码'
+        }),
+        required: true
+      }, /*#__PURE__*/React.createElement(Input, _extends({}, field.init('credential', {
+        rules: credentialRules
+      }), {
+        placeholder: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.Enter',
+          defaultMessage: '请输入'
+        }),
+        htmlType: "password"
+      }))), /*#__PURE__*/React.createElement(FormItem, {
+        label: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.KeyAlias',
+          defaultMessage: 'Key 别名'
+        }),
+        required: true
+      }, /*#__PURE__*/React.createElement(Input, _extends({}, field.init('keyAlias', {
+        rules: keyAliasRules
+      }), {
+        placeholder: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.Enter',
+          defaultMessage: '请输入'
+        })
+      }))), /*#__PURE__*/React.createElement(FormItem, {
+        label: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.KeyAndPassword',
+          defaultMessage: 'Key 密码'
+        }),
+        required: true
+      }, /*#__PURE__*/React.createElement(Input, _extends({}, field.init('keyPassword', {
+        rules: keyPasswordRules
+      }), {
+        placeholder: intl.get({
+          id: 'rdc-tb-cd-assets.dialogs.emas-app.Enter',
+          defaultMessage: '请输入'
+        }),
+        htmlType: "password"
+      })))));
+    }
+  }]);
+}(Dialog);
+export default EmasApp;