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

package/es/components/common/teambition/run-param-config-dialog/index.js

@@ -0,0 +1,373 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _Message from "@alifd/next/es/message";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useState, useContext, useMemo, useEffect } from 'react';
+import { Input, Button, Select, Box, Checkbox } from '@teamix/ui';
+import { grouping, transformType } from "./utils";
+import { PipelineRunTextArea, removeDoubleQuote } from "../pipeline-run-confirm";
+import { Title, Tooltip, YunxiaoTable } from '@alife/devops-ui';
+import { StepDialog, StepView } from '@alife/teamix-step-dialog';
+import AppstackChange, { AddAppstackChange, AppstackChangeFooter } from "./files/appstack-change";
+import AppstackRelease from "./files/appstack-release";
+import intl from "../../../../locale";
+import Context, { Provider } from "./context";
+import "./index.scss";
+import { createMapStorageWithLimit } from "../../../../utils";
+import { cloneDeep } from 'lodash';
+import AppstackChangeRun from "./files/appstack-changerun";
+var Column = YunxiaoTable.Column;
+export var RUN_PARAM = 'run-param';
+export var ADD_BRANCH = 'add-branch';
+var pipelineRunCommitKey = 'FLOW_INST_RUNNING_COMMENT';
+var tooltip = function tooltip(trigger, text) {
+  return /*#__PURE__*/React.createElement(Title, {
+    trigger: trigger,
+    align: "t"
+  }, text);
+};
+var prefix = 'run-param-config';
+var RunParamConfig = function RunParamConfig(props) {
+  var _appstack$changeConfi2, _appstack$changeConfi3, _appstack$changeConfi4, _appstack$changeConfi5, _appstack$changeConfi6, _appstack$changeConfi7, _appstack$changeConfi8, _appstack$changeConfi9;
+  var visible = props.visible,
+    onClose = props.onClose,
+    onOk = props.onOk,
+    loading = props.loading,
+    field = props.field,
+    runningGlobalParams = props.runningGlobalParams,
+    branchRepoConfigs = props.branchRepoConfigs,
+    setBranchRepoConfigs = props.setBranchRepoConfigs,
+    disabled = props.disabled,
+    pipelineId = props.pipelineId,
+    prevRunningComment = props.prevRunningComment,
+    appstack = props.appstack;
+  var _useContext = useContext(Context),
+    currentStep = _useContext[0].currentStep,
+    updateContext = _useContext[1];
+  var _useState = useState(true),
+    footerStatus = _useState[0],
+    setFooterStatus = _useState[1];
+  var _useState2 = useState(intl.get({
+      id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.RunConfiguration',
+      defaultMessage: '运行配置'
+    })),
+    title = _useState2[0],
+    setTitle = _useState2[1];
+  var runConfigStorage = createMapStorageWithLimit('FLOW_PIPELINE_RUN_PARAM_CONFIG', 50);
+  var lastRunConfig = useMemo(function () {
+    return runConfigStorage.get(String(pipelineId));
+  }, [pipelineId]);
+  var runConfigAutoFillCheckboxStorage = createMapStorageWithLimit('FLOW_PIPELINE_RUN_PARAM_CONFIG_AUTOFILL', 50);
+  var lastRunConfigAutoFillChecked = runConfigAutoFillCheckboxStorage.get(String(pipelineId));
+  var _useState3 = useState(lastRunConfigAutoFillChecked),
+    autoFillChecked = _useState3[0],
+    setAutoFillChecked = _useState3[1];
+  useEffect(function () {
+    // 弹窗点开，如果之前已经勾选过了，执行填充逻辑
+    if (lastRunConfigAutoFillChecked) {
+      setTimeout(function () {
+        fillLastRunParams();
+      }, 1000);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var onOkClick = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var values;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.prev = 0;
+            values = cloneDeep(field.getValues());
+            _context.next = 4;
+            return onOk();
+          case 4:
+            field.reset();
+            // 成功触发运行 才记录参数
+            runConfigStorage.set(String(pipelineId), values);
+            _context.next = 10;
+            break;
+          case 8:
+            _context.prev = 8;
+            _context.t0 = _context["catch"](0);
+          case 10:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[0, 8]]);
+    }));
+    return function onOkClick() {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  var fillLastRunParams = function fillLastRunParams() {
+    if (lastRunConfig) {
+      Object.entries(lastRunConfig).forEach(function (_ref2) {
+        var lastKey = _ref2[0],
+          lastValue = _ref2[1];
+        // 条目存在才填充，防止流水线被编辑过已经发生变化。条目存在则都有默认值，可以以此判断
+        if (field.getValue(lastKey) !== undefined) {
+          field.setValue(lastKey, lastValue);
+        }
+        var savedComment = lastRunConfig[pipelineRunCommitKey];
+        if (savedComment) {
+          field.setValue(pipelineRunCommitKey, savedComment);
+        }
+        field.validate();
+      });
+      _Message.show({
+        title: intl.get({
+          id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.LastRunParameterFilled',
+          defaultMessage: '已填充上次运行参数'
+        })
+      });
+    }
+  };
+  var footer = /*#__PURE__*/React.createElement(Box, {
+    justify: "space-between",
+    align: "center",
+    direction: "row"
+  }, lastRunConfig ? /*#__PURE__*/React.createElement(Tooltip, {
+    align: "t",
+    trigger: /*#__PURE__*/React.createElement(Checkbox, {
+      checked: autoFillChecked,
+      onChange: function onChange(v) {
+        runConfigAutoFillCheckboxStorage.set(String(pipelineId), v);
+        setAutoFillChecked(v);
+        if (v) {
+          fillLastRunParams();
+        }
+      }
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.AutomaticallyFillInTheLast',
+      defaultMessage: '自动填充上一次运行配置参数'
+    }))
+  }, /*#__PURE__*/React.createElement("span", null, intl.get({
+    id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.SelectThisOptionToAutomatically',
+    defaultMessage: '勾选此项，下一次手动触发运行时自动填充上一次运行参数；不勾选则填充默认参数'
+  }))) : /*#__PURE__*/React.createElement("span", null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
+    onClick: onClose,
+    type: "normal",
+    key: "run-param-close"
+  }, intl.get({
+    id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.Cancel',
+    defaultMessage: '取消'
+  })), /*#__PURE__*/React.createElement(Button, {
+    onClick: onOkClick,
+    type: "primary",
+    disabled: disabled,
+    loading: loading,
+    key: "run-param-ok"
+  }, intl.get({
+    id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.Run',
+    defaultMessage: '运行'
+  }))));
+  var getRunConfig = function getRunConfig() {
+    if (!(branchRepoConfigs && !!branchRepoConfigs.length)) return null;
+    var newBranchRepoConfigs = grouping(branchRepoConfigs);
+    var result = Object.entries(newBranchRepoConfigs || {}).map(function (_ref3) {
+      var _appstack$changeConfi;
+      var key = _ref3[0],
+        _ref3$ = _ref3[1],
+        val = _ref3$ === void 0 ? [] : _ref3$;
+      if (!val.length) return null;
+      var Component = transformType(key);
+      return /*#__PURE__*/React.createElement(React.Fragment, null, Component && /*#__PURE__*/React.createElement(Component, {
+        isDisabled: (appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi = appstack.changeConfig) === null || _appstack$changeConfi === void 0 ? void 0 : _appstack$changeConfi.ciType) === 'SPECIFIC_BRANCH',
+        key: key + "-" + JSON.stringify(val),
+        dataSource: val,
+        field: field,
+        setBranchRepoConfigs: setBranchRepoConfigs,
+        branchRepoConfigs: branchRepoConfigs,
+        setFooterStatus: setFooterStatus,
+        pipelineId: pipelineId
+        // Component=codesource 用到，模拟 step dialog
+        ,
+        setTitle: setTitle,
+        appstack: appstack
+      }));
+    });
+    return result;
+  };
+  var getGlobalParams = function getGlobalParams() {
+    if (!(runningGlobalParams && !!runningGlobalParams.length)) return null;
+    var validator = function validator(_rule, value, callback) {
+      if (value.indexOf("'") !== -1) {
+        callback(intl.get({
+          id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.TheParameterRulefieldContainsInvalid',
+          defaultMessage: '变量{ruleField}中含有非法字符'
+        }, {
+          ruleField: _rule.field
+        }));
+        return;
+      }
+      callback();
+    };
+    var renderInput = function renderInput(_, __, _ref4) {
+      var type = _ref4.type,
+        key = _ref4.key,
+        _ref4$metaData = _ref4.metaData,
+        metaData = _ref4$metaData === void 0 ? '' : _ref4$metaData,
+        _ref4$optionType = _ref4.optionType,
+        optionType = _ref4$optionType === void 0 ? 'single' : _ref4$optionType,
+        value = _ref4.value;
+      var commonProps = _extends({}, field.init(key, {
+        rules: [{
+          required: true,
+          message: intl.get({
+            id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.TheParameterValueMustBe',
+            defaultMessage: '变量值不能为空'
+          })
+        }, {
+          validator: validator
+        }]
+      }), {
+        style: {
+          width: '100%'
+        }
+      });
+      if (optionType == 'single' && typeof field.getValue(key) === 'object') {
+        field.setValue(key, value);
+      }
+      if (optionType == 'multiple' && typeof field.getValue(key) === 'string') {
+        field.setValue(key, [value]);
+      }
+      if (type === 'multiple') {
+        var selectDataSource;
+        var _metaData;
+        try {
+          _metaData = JSON.parse(metaData);
+        } catch (error) {
+          _metaData = metaData;
+        }
+        if (Array.isArray(_metaData)) {
+          selectDataSource = _metaData.map(function (i) {
+            return {
+              value: i,
+              label: i
+            };
+          });
+        } else {
+          selectDataSource = String(_metaData).split(',').map(function (i) {
+            return {
+              value: i,
+              label: i
+            };
+          });
+        }
+        return /*#__PURE__*/React.createElement(Select, _extends({
+          showSearch: true,
+          mode: optionType,
+          popupClassName: prefix + "-variable-select",
+          autoWidth: true,
+          dataSource: selectDataSource
+        }, commonProps));
+      }
+      return /*#__PURE__*/React.createElement(Input, _extends({
+        trim: true,
+        className: "variable-input"
+      }, commonProps));
+    };
+    return /*#__PURE__*/React.createElement(YunxiaoTable, {
+      hasBorder: true,
+      dataSource: runningGlobalParams,
+      style: footerStatus ? {
+        marginBottom: 18
+      } : {
+        display: 'none'
+      },
+      maxBodyHeight: "unset"
+    }, /*#__PURE__*/React.createElement(Column, {
+      title: intl.get({
+        id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.CommonVariables',
+        defaultMessage: '通用变量'
+      }),
+      dataIndex: "key",
+      width: 200,
+      cell: function cell(v) {
+        return tooltip(/*#__PURE__*/React.createElement("div", {
+          style: {
+            width: 200,
+            display: 'inline'
+          }
+        }, v), v);
+      }
+    }), /*#__PURE__*/React.createElement(Column, {
+      title: intl.get({
+        id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.ParameterDescribe',
+        defaultMessage: '描述'
+      }),
+      dataIndex: "description",
+      width: 200,
+      cell: function cell(v) {
+        return tooltip(/*#__PURE__*/React.createElement("div", {
+          style: {
+            width: 200,
+            display: 'inline'
+          }
+        }, v), v);
+      }
+    }), /*#__PURE__*/React.createElement(Column, {
+      title: intl.get({
+        id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.Value',
+        defaultMessage: '值'
+      }),
+      cell: renderInput
+    }));
+  };
+  var runNote = /*#__PURE__*/React.createElement(PipelineRunTextArea, _extends({
+    style: {
+      marginBottom: 20
+    },
+    extraDisabled: !prevRunningComment,
+    onExtraClick: function onExtraClick() {
+      field.setValue(pipelineRunCommitKey, removeDoubleQuote(prevRunningComment));
+    }
+  }, field.init(pipelineRunCommitKey)));
+  return /*#__PURE__*/React.createElement(StepDialog, {
+    v2: false,
+    visible: visible,
+    className: prefix,
+    style: {
+      width: 800
+    },
+    noBodyPadding: true,
+    onClose: onClose,
+    current: currentStep,
+    prefix: "next-",
+    onStepChange: function onStepChange(current) {
+      return updateContext({
+        currentStep: current
+      });
+    }
+  }, /*#__PURE__*/React.createElement(StepView, {
+    id: "home",
+    title: title,
+    footer: footerStatus && footer
+  }, (appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi2 = appstack.changeConfig) === null || _appstack$changeConfi2 === void 0 ? void 0 : _appstack$changeConfi2.ciType) === 'CR' && /*#__PURE__*/React.createElement(AppstackChange, _extends({
+    branchRepoConfigs: branchRepoConfigs,
+    setBranchRepoConfigs: setBranchRepoConfigs
+  }, appstack)), (appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi3 = appstack.changeConfig) === null || _appstack$changeConfi3 === void 0 ? void 0 : _appstack$changeConfi3.ciType) === 'APP_RELEASE' && /*#__PURE__*/React.createElement(AppstackRelease, appstack), (appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi4 = appstack.changeConfig) === null || _appstack$changeConfi4 === void 0 ? void 0 : _appstack$changeConfi4.ciType) !== 'APP_RELEASE' && (appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi5 = appstack.changeConfig) === null || _appstack$changeConfi5 === void 0 ? void 0 : _appstack$changeConfi5.ciType) !== 'SINGLE_CR' && getRunConfig(), (appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi6 = appstack.changeConfig) === null || _appstack$changeConfi6 === void 0 ? void 0 : _appstack$changeConfi6.ciType) === 'SINGLE_CR' && /*#__PURE__*/React.createElement(AppstackChangeRun, _extends({
+    setAppstackChanges: appstack === null || appstack === void 0 ? void 0 : appstack.setAppstackChanges
+  }, appstack)), getGlobalParams(), footerStatus && runNote), /*#__PURE__*/React.createElement(StepView, {
+    id: "add-appstack-change",
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.teambition.run-param-config-dialog.IntegrationChangesThatCanBe',
+      defaultMessage: '可添加的集成变更'
+    }),
+    footer: /*#__PURE__*/React.createElement(AppstackChangeFooter, {
+      appstackChangs: appstack === null || appstack === void 0 ? void 0 : appstack.appstackChangs,
+      setAppstackChanges: appstack === null || appstack === void 0 ? void 0 : appstack.setAppstackChanges
+    })
+  }, /*#__PURE__*/React.createElement(AddAppstackChange, {
+    selectedChanges: (appstack === null || appstack === void 0 ? void 0 : appstack.appstackChangs) || [],
+    queryChangeList: appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi7 = appstack.changeConfig) === null || _appstack$changeConfi7 === void 0 ? void 0 : _appstack$changeConfi7.queryChangeList,
+    setAppstackChanges: appstack === null || appstack === void 0 ? void 0 : appstack.setAppstackChanges,
+    codeRepo: appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi8 = appstack.changeConfig) === null || _appstack$changeConfi8 === void 0 ? void 0 : _appstack$changeConfi8.codeRepo,
+    onChangeClick: appstack === null || appstack === void 0 ? void 0 : (_appstack$changeConfi9 = appstack.changeConfig) === null || _appstack$changeConfi9 === void 0 ? void 0 : _appstack$changeConfi9.onChangeClick
+  })));
+};
+var Wrapper = function Wrapper(props) {
+  return /*#__PURE__*/React.createElement(Provider, null, /*#__PURE__*/React.createElement(RunParamConfig, props));
+};
+export default Wrapper;

package/es/components/common/teambition/run-param-config-dialog/index.scss

@@ -0,0 +1,40 @@
+$prefix: run-param-config;
+
+.#{$prefix} {
+  top: 100px !important;
+  overflow: visible;
+  .next-dialog-body {
+    min-height: auto !important;
+    padding: 20px 20px 0 20px;
+    margin-right: 0 !important;
+    .disable_bid {
+      unicode-bidi: normal !important;
+      &::before,
+      &::after {
+        content: '\200E';
+      }
+    }
+    .variable-input:not(.next-focus) {
+      // border-width: 0;
+      // &:hover {
+      //   border-width: 1px;
+      // }
+    }
+  }
+
+  &__branch-name {
+    overflow: hidden;
+  }
+
+  &__item {
+    margin-bottom: 18px;
+    label {
+      color: var(--color-text1-4, #292929);
+      line-height: 2;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+  }
+}
+

package/es/components/common/teambition/run-param-config-dialog/utils.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare const repoMatch: (repo: any) => RegExpMatchArray | [];
+export declare const grouping: (data?: any[]) => any;
+export declare const transformType: (type: any) => (props: any) => JSX.Element;
+export declare const commonStyle: {
+    maxWidth: number;
+    overflow: string;
+    textOverflow: string;
+    whiteSpace: string;
+    direction: string;
+    unicodeBidi: string;
+};

package/es/components/common/teambition/run-param-config-dialog/utils.js

@@ -0,0 +1,54 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["type"];
+/* eslint-disable import/no-cycle */
+/* eslint-disable import/prefer-default-export */
+import CodeSource from "./files/code-source";
+import Jenkins from "./files/jenkins";
+import Flow from "./files/flow";
+import { ARTIFACT_SOURCE, CODE_SOURCE, FLOW_SOURCE, JENKINS_SOURCE } from "../pipeline-source/util";
+import { ArtifactTypes } from "../pipeline-source/artifact-source";
+import ArtifactSource from "./files/artifact-source";
+export var repoMatch = function repoMatch(repo) {
+  return ("" + repo + (repo.endsWith('.git') ? '' : '.git')).match(/:([^:]+)\.git$/) || [];
+};
+export var grouping = function grouping(data) {
+  var _config;
+  if (data === void 0) {
+    data = [];
+  }
+  var config = (_config = {}, _config[CODE_SOURCE] = [], _config[JENKINS_SOURCE] = [], _config[FLOW_SOURCE] = [], _config[ARTIFACT_SOURCE] = [], _config);
+  var result = data.reduce(function (prev, _ref) {
+    var type = _ref.type,
+      others = _objectWithoutPropertiesLoose(_ref, _excluded);
+    var key = prev[type] ? type : 'code_source';
+    if (ArtifactTypes.includes(type)) {
+      key = ARTIFACT_SOURCE;
+    }
+    prev[key].push(_extends({
+      type: type
+    }, others));
+    return prev;
+  }, config);
+  return result;
+};
+export var transformType = function transformType(type) {
+  switch (type) {
+    case 'jenkins':
+      return Jenkins;
+    case 'flow':
+      return Flow;
+    case ARTIFACT_SOURCE:
+      return ArtifactSource;
+    default:
+      return CodeSource;
+  }
+};
+export var commonStyle = {
+  maxWidth: 200,
+  overflow: 'hidden',
+  textOverflow: 'ellipsis',
+  whiteSpace: 'nowrap',
+  direction: 'rtl',
+  unicodeBidi: 'bidi-override'
+};

package/es/components/common/teambition/run-pipeline-btn/index.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import './index.scss';
+declare class RunPipelineButton extends React.Component {
+    constructor(props: any);
+    componentDidUpdate(prevProps: any, prevState: any): void;
+    setBranchRepoConfigs: (branchRepoConfigs: any) => void;
+    setAppstackChanges: (appstackChangs: any) => void;
+    setAppstackReleaseBranch: (appstackReleaseBranch: any) => void;
+    setAppReleaseSn: (appReleaseSn: any) => void;
+    submitRunPipeline: () => Promise<void>;
+    getLatestPiepline: () => Promise<any>;
+    executePipeline: (data?: {}) => Promise<void>;
+    handleNewbieTaskStatus: () => void;
+    executePipeline2: (pipeline: any) => void;
+    alert: (addAppstackChangeSn?: string) => Promise<void>;
+    render(): JSX.Element;
+}
+export default RunPipelineButton;