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

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

@@ -0,0 +1,64 @@
+.help-icon {
+  padding-left: 8px !important;
+}
+
+.cluster-card {
+  background: var(--color-white, #fff);
+  border: 1px solid var(--color-brand3-2, #e9edf0);
+  border-radius: 4px;
+  width: 92px;
+  height: 90px;
+  display: inline-block;
+  margin: 0 12px 12px 0;
+  cursor: pointer;
+
+  &--selected {
+    border-color: var(--color-brand1-6, #1b9aee);
+  }
+
+  &--disabled {
+    cursor: not-allowed !important;
+    opacity: 0.5;
+    border: 1px solid var(--color-brand3-2, #e9edf0) !important;
+  }
+
+  &:hover {
+    border-color: var(--color-brand1-6, #1b9aee);
+  }
+
+  i {
+    display: block;
+    margin: 13px auto 10px;
+  }
+
+  &__label {
+    font-size: 14px;
+    color: var(--color-fill1-7, #595959);
+    font-weight: 500;
+    letter-spacing: 0;
+    text-align: center;
+    padding: 0 8px;
+  }
+}
+
+
+.cluster__wrap {
+  display: grid;
+  grid-template-columns: 160px 1fr;
+  height: calc(100vh - 250px);
+  width: 789px;
+
+  &__sideBar {
+    height: 100%;
+    border-right: 1px solid var(--color-brand3-1, #f2f5f7);
+    @import "src/components/common/at-dialog-nav.scss";
+  }
+
+  &__content {
+    height: 100%;
+    min-width: 550px;
+    overflow: hidden;
+    padding: 20px;
+    overflow-y: auto;
+  }
+}

package/es/components/common/teambition/flow-engine/dialogs/kubeconfig-connection/types/ack.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare const ACK: ({ init, field, readonly, update }: {
+    init: any;
+    field: any;
+    readonly?: boolean;
+    update?: boolean;
+}) => JSX.Element;
+export default ACK;

package/es/components/common/teambition/flow-engine/dialogs/kubeconfig-connection/types/ack.js

@@ -0,0 +1,240 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useEffect, useState } from 'react';
+import { Form, Select, Button, Input, Message } from '@teamix/ui';
+import exceed from "../../../../../../../utils/apimap";
+import track from "../../../../../../../utils/track";
+import { CopyToClipboard } from 'react-copy-to-clipboard';
+import { YunxiaoIcon, Title, ButtonIcon } from '@alife/devops-ui';
+import { AliyunConnect } from "../../../../service-connection";
+import intl from "../../../../../../../locale";
+import utils from "../../../../../../../utils";
+var title = function title(trigger, text) {
+  return /*#__PURE__*/React.createElement(Title, {
+    trigger: trigger,
+    align: "t"
+  }, text || trigger);
+};
+var ACK = function ACK(_ref) {
+  var init = _ref.init,
+    field = _ref.field,
+    _ref$readonly = _ref.readonly,
+    readonly = _ref$readonly === void 0 ? false : _ref$readonly,
+    _ref$update = _ref.update,
+    update = _ref$update === void 0 ? false : _ref$update;
+  var _useState = useState([]),
+    clusters = _useState[0],
+    setClusters = _useState[1];
+  var _useState2 = useState(''),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
+  useEffect(function () {
+    if (field.getValue('id')) {
+      setClusters([{
+        value: field.getValue('clusterId'),
+        label: field.getValue('name')
+      }]);
+    }
+    if (!field.getValue('uuid') && !(readonly || update)) {
+      var _uuid = utils.uuidStartWithALetter(16);
+      field.setValue('uuid', _uuid);
+    }
+  }, []);
+  var getAckClusters = function getAckClusters() {
+    var connectionId = field.getValue('connectionId');
+    if (connectionId === 0) {
+      return;
+    }
+    setLoading('loading');
+    exceed.fetch({
+      api: 'ack.cluster.list',
+      data: {
+        connection: field.getValue('connectionId')
+      }
+    }).then(function (_ref2) {
+      var successful = _ref2.successful,
+        object = _ref2.object;
+      if (successful) {
+        setClusters(object.map(function (_ref3) {
+          var cluster_id = _ref3.cluster_id,
+            name = _ref3.name;
+          return {
+            label: name,
+            value: cluster_id
+          };
+        }));
+      }
+      setLoading('');
+    })["catch"](function () {
+      setClusters([]);
+      setLoading('');
+    });
+  };
+  var getLabel = function getLabel() {
+    var onClick = function onClick() {
+      window.open('https://cs.console.aliyun.com/');
+      track({
+        action: 'create aliyun serve',
+        page: 'edit page',
+        type: 'kubernetes-ack'
+      });
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        display: 'flex',
+        alignItems: 'center'
+      }
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.kubeconfig-connection.types.ack.AckCluster',
+      defaultMessage: 'ACK集群'
+    }), !readonly && /*#__PURE__*/React.createElement(Button, {
+      text: true,
+      type: "secondary",
+      onClick: onClick
+    }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "add-fill"
+    })));
+  };
+  var itemRender = function itemRender(_ref4) {
+    var label = _ref4.label;
+    return /*#__PURE__*/React.createElement("span", {
+      className: "label"
+    }, title(label));
+  };
+  var onChangeServiceConnection = function onChangeServiceConnection(id, _, force) {
+    if (force === void 0) {
+      force = false;
+    }
+    if (field.getValue('connectionId') === id) return;
+    field.setValues(_extends({}, force ? {
+      clusterId: undefined,
+      name: undefined
+    } : {}, {
+      connectionId: id
+    }));
+    setClusters([]);
+  };
+  var onServiceConnectionReset = function onServiceConnectionReset() {
+    field.setValue('clusterId', '');
+  };
+  var child = function child(forceDisable) {
+    if (forceDisable === void 0) {
+      forceDisable = false;
+    }
+    var disabled = forceDisable || readonly;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Form.Item, {
+      label: getLabel(),
+      className: "next-top"
+    }, /*#__PURE__*/React.createElement(Select, _extends({
+      style: {
+        width: '100%'
+      },
+      state: loading,
+      dataSource: clusters,
+      showSearch: true,
+      popupClassName: "common-select-hide",
+      itemRender: itemRender,
+      placeholder: intl.get({
+        id: 'rdc-tb-cd-assets.kubeconfig-connection.types.ack.SelectAckClustersOrMore',
+        defaultMessage: '请选择ACK集群/更多ACK集群请按名称搜索'
+      })
+    }, init('clusterId', {
+      rules: [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.kubeconfig-connection.types.ack.TheClusterCannotBeEmpty',
+          defaultMessage: '集群不能为空'
+        })
+      }],
+      props: {
+        onChange: function onChange(clusterId) {
+          var _ref5 = clusters.find(function (_ref6) {
+              var value = _ref6.value;
+              return value === clusterId;
+            }) || {},
+            label = _ref5.label;
+          field.setValue('name', label);
+        }
+      }
+    }), {
+      onFocus: function onFocus() {
+        getAckClusters();
+      },
+      disabled: disabled
+    }))), /*#__PURE__*/React.createElement(Form.Item, {
+      label: intl.get({
+        id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.Uuid',
+        defaultMessage: '集群 ID'
+      })
+    }, /*#__PURE__*/React.createElement(Input, _extends({
+      trim: true,
+      hasLimitHint: true,
+      maxLength: 16,
+      disabled: disabled,
+      placeholder: intl.get({
+        id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.EnterUuid',
+        defaultMessage: '请输入集群 ID'
+      })
+    }, init('uuid', {
+      rules: [{
+        required: true,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.EnterUuid',
+          defaultMessage: '请输入集群 ID'
+        })
+      }, {
+        pattern: /^[a-zA-Z][\w.-]*$/,
+        message: intl.get({
+          id: 'rdc-tb-cd-assets.pipeline-as-code.uuid.PatternMsg',
+          defaultMessage: "只能包含字母和数字、 '_'，且只能以字母开头"
+        })
+      }, {
+        validator: function validator(rule, value, callback) {
+          if (value.length < 8) {
+            return callback(intl.get({
+              id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.UuidLengthTips',
+              defaultMessage: '集群 ID 长度 8-16 个字符'
+            }));
+          }
+          callback();
+        }
+      }]
+    }), {
+      addonTextAfter: disabled && /*#__PURE__*/React.createElement(CopyToClipboard, {
+        text: field.getValue('uuid'),
+        onCopy: function onCopy() {
+          return Message.success({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.pipeline-source.webhook.webhook.CopiedToClipboard',
+              defaultMessage: '成功复制到剪贴板'
+            })
+          });
+        }
+      }, /*#__PURE__*/React.createElement(ButtonIcon, {
+        name: "copy-line"
+      }))
+    }))));
+  };
+  if (update || readonly) {
+    return child(true);
+  }
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(AliyunConnect, _extends({
+    type: "ack",
+    redirectRam: true,
+    field: field,
+    fieldName: "connectionId",
+    readonly: readonly,
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.kubeconfig-connection.types.ack.InUse',
+      defaultMessage: '正在使用：'
+    }),
+    getByUserId: false
+  }, init('connectionId'), {
+    enable: function enable(data) {
+      console.log(data);
+    },
+    onChangeServiceConnection: onChangeServiceConnection,
+    update: update,
+    reset: onServiceConnectionReset
+  }), child()));
+};
+export default ACK;

package/es/components/common/teambition/flow-engine/dialogs/kubeconfig-connection/types/custom.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare const Custom: ({ init, field, readonly, view }: {
+    init: any;
+    field: any;
+    readonly: any;
+    view: any;
+}) => JSX.Element;
+export default Custom;

package/es/components/common/teambition/flow-engine/dialogs/kubeconfig-connection/types/custom.js

@@ -0,0 +1,143 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useEffect } from 'react';
+import YAML from 'js-yaml';
+import { Form, Input, Button, Message } from '@teamix/ui';
+import { YunxiaoIcon, ButtonIcon } from '@alife/devops-ui';
+import { CopyToClipboard } from 'react-copy-to-clipboard';
+import helpLink from "../../../../../../../utils/helplink";
+import intl from "../../../../../../../locale";
+import utils from "../../../../../../../utils";
+var Custom = function Custom(_ref) {
+  var init = _ref.init,
+    field = _ref.field,
+    readonly = _ref.readonly,
+    view = _ref.view;
+  useEffect(function () {
+    if (!view) {
+      var _uuid = utils.uuidStartWithALetter(16);
+      field.setValue('uuid', _uuid);
+    }
+  }, []);
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Form.Item, {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.ClusterName',
+      defaultMessage: '集群名称'
+    }),
+    className: "next-top"
+  }, /*#__PURE__*/React.createElement(Input, _extends({
+    placeholder: intl.get({
+      id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.ClusterName',
+      defaultMessage: '集群名称'
+    })
+  }, init('name', {
+    rules: [{
+      required: true,
+      message: intl.get({
+        id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.TheClusterNameMustBe',
+        defaultMessage: '集群名称不能为空'
+      })
+    }]
+  }), {
+    disabled: readonly
+  }))), /*#__PURE__*/React.createElement(Form.Item, {
+    label: intl.get({
+      id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.Uuid',
+      defaultMessage: '集群 ID'
+    }),
+    className: "next-top"
+  }, /*#__PURE__*/React.createElement(Input, _extends({
+    trim: true,
+    hasLimitHint: true,
+    maxLength: 16,
+    disabled: view,
+    placeholder: intl.get({
+      id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.EnterUuid',
+      defaultMessage: '请输入集群 ID'
+    })
+  }, init('uuid', {
+    rules: [{
+      required: true,
+      message: intl.get({
+        id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.EnterUuid',
+        defaultMessage: '请输入集群 ID'
+      })
+    }, {
+      pattern: /^[a-zA-Z][\w.-]*$/,
+      message: intl.get({
+        id: 'rdc-tb-cd-assets.pipeline-as-code.uuid.PatternMsg',
+        defaultMessage: "只能包含字母和数字、 '_'，且只能以字母开头"
+      })
+    }, {
+      validator: function validator(rule, value, callback) {
+        if (value.length < 8) {
+          return callback(intl.get({
+            id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.UuidLengthTips',
+            defaultMessage: '集群 ID 长度 8-16 个字符'
+          }));
+        }
+        callback();
+      }
+    }]
+  }), {
+    addonTextAfter: view && /*#__PURE__*/React.createElement(CopyToClipboard, {
+      text: field.getValue('uuid'),
+      onCopy: function onCopy() {
+        return Message.success({
+          title: intl.get({
+            id: 'rdc-tb-cd-assets.pipeline-source.webhook.webhook.CopiedToClipboard',
+            defaultMessage: '成功复制到剪贴板'
+          })
+        });
+      }
+    }, /*#__PURE__*/React.createElement(ButtonIcon, {
+      name: "copy-line"
+    }))
+  }))), /*#__PURE__*/React.createElement(Form.Item, {
+    label: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", null, intl.get({
+      id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.ClusterConfigurationFile',
+      defaultMessage: '集群配置文件'
+    })), helpLink('k8s_cluster_config_file') && /*#__PURE__*/React.createElement(Button, {
+      className: "help-icon",
+      text: true,
+      onClick: function onClick() {
+        return window.open(helpLink('k8s_cluster_config_file'));
+      }
+    }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "question-line"
+    }))),
+    className: "next-top"
+  }, /*#__PURE__*/React.createElement(Input.TextArea, _extends({
+    placeholder: "~/.kube/config",
+    htmlType: "password",
+    disabled: readonly
+  }, init('kubeConfig', {
+    rules: [{
+      required: true,
+      message: intl.get({
+        id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.TheClusterConfigurationMustBe',
+        defaultMessage: '集群配置不能为空'
+      })
+    }, {
+      validator: function validator(_rule, value, callback) {
+        try {
+          var config = YAML.load(value);
+          if (!config.apiVersion || !config.clusters) {
+            callback(intl.get({
+              id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.EnterAValidConfigFile',
+              defaultMessage: '请输入合法的config文件内容'
+            }));
+            return;
+          }
+        } catch (err) {
+          callback(intl.get({
+            id: 'rdc-tb-cd-assets.kubeconfig-connection.types.custom.MakeSureThatTheConfig',
+            defaultMessage: '请确保config文件为合法的YAML格式'
+          }));
+          return;
+        }
+        callback();
+      }
+    }]
+  })))));
+};
+export default Custom;

package/es/components/common/teambition/flow-engine/dialogs/kubeconfig-connection/types/index.d.ts

@@ -0,0 +1,35 @@
+/// <reference types="react" />
+export declare const handlers: (type: any, update?: boolean) => (values: any) => Promise<unknown>;
+export declare const categorys: (type: any) => (({ init, field, readonly, update }: {
+    init: any;
+    field: any;
+    readonly?: boolean;
+    update?: boolean;
+}) => JSX.Element) | (({ init, field, readonly, view }: {
+    init: any;
+    field: any;
+    readonly: any;
+    view: any;
+}) => JSX.Element);
+export declare const types: (boolean | {
+    label: any;
+    type: string;
+    icon: JSX.Element;
+    component: ({ init, field, readonly, view }: {
+        init: any;
+        field: any;
+        readonly: any;
+        view: any;
+    }) => JSX.Element;
+} | {
+    label: any;
+    type: string;
+    icon: JSX.Element;
+    component: ({ init, field, readonly, update }: {
+        init: any;
+        field: any;
+        readonly?: boolean;
+        update?: boolean;
+    }) => JSX.Element;
+})[];
+export default types;

package/es/components/common/teambition/flow-engine/dialogs/kubeconfig-connection/types/index.js

@@ -0,0 +1,113 @@
+import React from 'react';
+import exceed from "../../../../../../../utils/apimap";
+import track from "../../../../../../../utils/track";
+import ACK from "./ack";
+import Custom from "./custom";
+import { intervalEnterTime, getFeature } from "../../../../../../../utils";
+import intl from "../../../../../../../locale";
+import YunxiaoIcon from '@alife/yunxiao-icon';
+export var handlers = function handlers(type, update) {
+  if (update === void 0) {
+    update = false;
+  }
+  switch (type) {
+    case 'ack':
+      return function (values) {
+        track({
+          action: 'save or update ack',
+          page: 'edit page',
+          daysinceenterflow: intervalEnterTime()
+        });
+        var id = values.id,
+          name = values.name;
+        if (!update) {
+          return new Promise(function (resolve, reject) {
+            exceed.fetch({
+              api: 'service-connection.ack.credential.create',
+              data: values
+            }).then(function (res) {
+              if (res.successful) {
+                return resolve({
+                  value: res.object,
+                  label: name
+                });
+              }
+              reject();
+            });
+          });
+        } else {
+          return new Promise(function (resolve) {
+            setTimeout(function () {
+              resolve({
+                value: id,
+                label: name
+              });
+            }, 100);
+          });
+        }
+      };
+    default:
+      return function (values) {
+        track({
+          action: 'save or update kubernetes',
+          page: 'edit page',
+          daysinceenterflow: intervalEnterTime()
+        });
+        return new Promise(function (resolve, reject) {
+          var name = values.name;
+          exceed.fetch({
+            api: 'service-connection.k8s.credential.create',
+            data: Object.assign(values, {
+              force: true
+            })
+          }).then(function (res) {
+            if (res.successful) {
+              return resolve({
+                value: res.object,
+                label: name
+              });
+            }
+            reject();
+          });
+        });
+      };
+  }
+};
+export var categorys = function categorys(type) {
+  switch (type) {
+    case 'ack':
+      return ACK;
+    default:
+      return Custom;
+  }
+};
+export var types = [{
+  label: intl.get({
+    id: 'rdc-tb-cd-assets.kubeconfig-connection.types.CustomCluster',
+    defaultMessage: '自定义集群'
+  }),
+  type: 'custom',
+  icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    style: {
+      color: 'var(--color-brand1-6, #1b9aee)'
+    },
+    size: "xl",
+    type: "kubernetes-fill"
+  }),
+  component: Custom
+}, getFeature('service.connection.ack') ? {
+  label: intl.get({
+    id: 'rdc-tb-cd-assets.kubeconfig-connection.types.ContainerServiceCluster',
+    defaultMessage: '阿里云集群'
+  }),
+  type: 'ack',
+  icon: /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    style: {
+      color: 'var(--color-brand1-6, #1b9aee)'
+    },
+    size: "xl",
+    type: "aliyun-fill"
+  }),
+  component: ACK
+} : false];
+export default types;

package/es/components/common/teambition/flow-engine/dialogs/shell-magnifying/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import './index.scss';
+declare const ShellMagnifying: (props: any) => JSX.Element;
+export default ShellMagnifying;

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

@@ -0,0 +1,40 @@
+import React, { useState } from 'react';
+import { Button, Dialog } from '@teamix/ui';
+import { YunxiaoIcon } from '@alife/devops-ui';
+import "./index.scss";
+var ShellMagnifying = function ShellMagnifying(props) {
+  var _useState = useState(false),
+    visible = _useState[0],
+    setVisible = _useState[1];
+  var onClose = function onClose() {
+    setVisible(false);
+    props.onRefresh();
+  };
+  var onShow = function onShow() {
+    setVisible(true);
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+    text: true,
+    onClick: onShow,
+    className: "template-container-create-btn"
+  }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+    type: "extend-2-line"
+  })), /*#__PURE__*/React.createElement(Dialog, {
+    footer: false,
+    title: props.title,
+    visible: visible,
+    onClose: onClose,
+    onCancel: onClose,
+    style: {
+      width: 'calc(100vw - 400px)'
+    },
+    className: "shell-magnifying"
+  }, /*#__PURE__*/React.cloneElement(props.children, {
+    cancelSaveRef: true,
+    style: {
+      height: 'calc(100vh - 200px)',
+      width: 'auto'
+    }
+  })));
+};
+export default ShellMagnifying;

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

@@ -0,0 +1,13 @@
+.shell-magnifying {
+  .ace_editor {
+    border-radius: 0;
+  }
+
+  .ace_print-margin {
+    opacity: 0;
+  }
+
+  .next-dialog-body {
+    padding: 0 !important;
+  }
+}

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

@@ -0,0 +1,10 @@
+declare const fetch: ({ url, method, data, crossOrigin, withCredentials, useCachedAsyncData, }: {
+    url: any;
+    method?: string;
+    data?: {};
+    crossOrigin?: boolean;
+    withCredentials?: boolean;
+    useCachedAsyncData?: boolean;
+}) => any;
+export declare const fetchWithErrorHanding: (url: any, successMsg: any, errorMsg: any, cb: any, method: any) => any;
+export default fetch;