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

package/es/components/common/teambition/pipeline-flow-dialog/index.scss

@@ -0,0 +1,111 @@
+@import '../bem.scss';
+
+$PREFIX: pipeline-flow-dialog;
+
+@include block($PREFIX) {
+  position: fixed !important;
+  top: 0 !important;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100vw;
+  height: 100vh;
+  background: var(--color-brand3-1, #f2f5f7);
+  overflow: inherit!important;
+  max-width: 100%;
+  max-height: unset !important;
+  .next-loading, .next-loading-wrap {
+    height: 100%;
+  }
+  .next-dialog-body {
+    padding: 0;
+    overflow-y: hidden !important;
+    max-height: 100% !important;
+    height: 100%;
+  }
+  @include element(header) {
+    width: 100%;
+    height: 56px;
+    display: flex;
+    align-items: center;
+    padding: 0 21px;
+    border-bottom: 1px solid var(--color-brand3-2, #e9edf0);
+    background: white;
+    position: fixed;
+    top: 0;
+    @include modifier_1(left) {
+      text-align: left;
+      display: inline-flex;
+      align-items: center;
+      width: 360px;
+      .title {
+        overflow: hidden;
+        .editable-label__text {
+          font-size: 18px;
+          font-family: PingFangSC-Medium;
+          font-weight: normal;
+          color: var(--color-text1-4, #292929);
+        }
+        .editable-label__btns__edit {
+          color: var(--color-text1-2, #6e6e6e) !important;
+          margin-top: 1px !important;
+        }
+      }
+      .btn {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        background-color: var(--color-brand3-1, #f2f5f7);
+        color: var(--color-text1-2, #6e6e6e);
+        width: 32px;
+        height: 32px;
+        border-radius: 4px;
+        margin-right: 12px;
+        cursor: pointer;
+      }
+    }
+    @include modifier_1(middle) {
+      text-align: center;
+      flex: 1;
+    }
+    @include modifier_1(right) {
+      text-align: right;
+      min-width: 420px;
+      .text {
+        color: var(--color-text1-7, #8b8b8b);
+        margin-right: 20px;
+        &.link {
+          cursor: pointer;
+          color: var(--color-brand1-6, #1b9aee);
+          &.error {
+            color: var(--color-brand1-6, #1b9aee) !important;
+            text-decoration: none;
+          }
+        }
+      }
+    }
+  }
+  @include element(content) {
+    margin-top: 56px;
+    overflow: hidden;
+    height: calc(100% - 56px);
+  }
+}
+
+// 几个设置Tab的Layout hack和原 s-title 样式
+.pipeline-flow-setting-layout {
+  background-color: var(--color-white, #fff);
+  color: var(--color-text1-4, #292929);
+
+  .s-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 16px 0;
+    &__text {
+      color: var(--color-text1-4, #292929);
+      font-size: 14px;
+      font-weight: 500;
+    }
+  }
+}

package/es/components/common/teambition/pipeline-flow-dialog/type.d.ts

@@ -0,0 +1,14 @@
+export interface PipelineFlowDialogProps {
+  pipelineId: number;
+  visible: boolean;
+  onClose: Function;
+
+  type?: 'template';
+  model?: 'create' | 'add' | 'edit';
+  setCustoModel?: Function;
+
+  pipelineTemplateId?: any;
+  setPipelineTemplateId?: Function;
+
+  pipelineVo?: any;
+}

package/es/components/common/teambition/pipeline-flow-dialog/utils.d.ts

@@ -0,0 +1,18 @@
+export declare const PIPELINE_DRAFT_CACHE = "pipeline_dratf_cache";
+export declare const PIPELINE_ORIGINAL_FLOW_CACHE = "pipeline_original_flow_cache";
+export declare const SERVICE_CONNECTION = "SERVICE_CONNECTION";
+export declare const MACHINE_GROUP = "MACHINE_GROUP";
+export declare const STEPS_CACHE_KEY = "pipeline-execution-steps";
+export declare const PLUGINS_CACHE_KEY = "pipeline-plugins";
+/** 判断是否是 gotemplate 流水线 */
+export declare const isStringWithTemplateMark: (content: string) => boolean;
+export declare const extractRel: ({ pipelineVo, pipelineObjRelList }: {
+    pipelineVo: any;
+    pipelineObjRelList: any;
+}) => any;
+export declare const attachSources: (pipelineVo: any) => any;
+export declare const transformPipelineVo: (pipelineVo: any) => any;
+export declare const saveOriginalFlow: (flow: any, pipelineId: any) => void;
+export declare const getOriginalFlow: (pipelineId: any) => any;
+export declare const clearOriginalFlow: (pipelineId: any) => void;
+export declare const addBranchModeFlagForSources: (flow: any, sources?: any[]) => any[];

package/es/components/common/teambition/pipeline-flow-dialog/utils.js

@@ -0,0 +1,167 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["envObj", "tagList", "members"];
+import YAML from 'js-yaml';
+import { setLocalStorageCache, getLocalStorageCache, removeLocalStorageCache } from "../../../../utils";
+import { set, get, cloneDeep } from 'lodash-es';
+export var PIPELINE_DRAFT_CACHE = 'pipeline_dratf_cache';
+export var PIPELINE_ORIGINAL_FLOW_CACHE = 'pipeline_original_flow_cache';
+export var SERVICE_CONNECTION = 'SERVICE_CONNECTION';
+export var MACHINE_GROUP = 'MACHINE_GROUP';
+export var STEPS_CACHE_KEY = 'pipeline-execution-steps';
+export var PLUGINS_CACHE_KEY = 'pipeline-plugins';
+
+/** 判断是否是 gotemplate 流水线 */
+export var isStringWithTemplateMark = function isStringWithTemplateMark(content) {
+  var _content$match;
+  return !!(content !== null && content !== void 0 && (_content$match = content.match) !== null && _content$match !== void 0 && _content$match.call(content, /^\s*# template=true\b/));
+};
+export var extractRel = function extractRel(_ref) {
+  var pipelineVo = _ref.pipelineVo,
+    pipelineObjRelList = _ref.pipelineObjRelList;
+  if (!pipelineVo || (pipelineVo === null || pipelineVo === void 0 ? void 0 : pipelineVo.type) === 'PIPELINEASCODE') {
+    return pipelineObjRelList;
+  }
+  var flow = YAML.load(pipelineVo.pipelineConfigVo.flow);
+  var relList = pipelineObjRelList.filter(function (rel) {
+    return rel.refObjectType !== SERVICE_CONNECTION && rel.refObjectType !== MACHINE_GROUP;
+  });
+  var pushStepConnectionRel = function pushStepConnectionRel(step, prop) {
+    if (step[prop]) {
+      relList.push({
+        pipelineId: pipelineVo.id,
+        refObjectType: SERVICE_CONNECTION,
+        refObjectId: step[prop],
+        priority: 0
+      });
+    }
+  };
+  (flow.pipeline || []).forEach(function (group) {
+    (group.stages || []).forEach(function (stage) {
+      (stage.jobs || []).forEach(function (job) {
+        if (job.params && job.params.steps) {
+          job.params.steps.forEach(function (step) {
+            pushStepConnectionRel(step, 'SERVICE_CONNECTION_ID');
+            pushStepConnectionRel(step, 'KUBERNETES_CONNECTION_ID');
+          });
+        }
+        if (job.params && job.params.machine_group) {
+          if (job.params.machine_group) {
+            var machineGroupId = JSON.parse(job.params.machine_group).id;
+            relList.push({
+              pipelineId: pipelineVo.id,
+              refObjectType: MACHINE_GROUP,
+              refObjectId: machineGroupId,
+              priority: 0
+            });
+          }
+        }
+        if (job.params && job.params.machine_group_id) {
+          var _machineGroupId = job.params.machine_group_id;
+          relList.push({
+            pipelineId: pipelineVo.id,
+            refObjectType: MACHINE_GROUP,
+            refObjectId: _machineGroupId,
+            priority: 0
+          });
+        }
+      });
+    });
+  });
+  if (pipelineVo.pipelineConfigVo.sources) {
+    var sources = JSON.parse(pipelineVo.pipelineConfigVo.sources);
+    sources.forEach(function (source) {
+      var data = source.data;
+      if (data.connection) {
+        relList.push({
+          pipelineId: pipelineVo.id,
+          refObjectType: SERVICE_CONNECTION,
+          refObjectId: data.connection,
+          priority: 0
+        });
+      }
+    });
+  }
+  return relList;
+};
+export var attachSources = function attachSources(pipelineVo) {
+  var sources = JSON.parse(pipelineVo.pipelineConfigVo.sources);
+  (sources || []).forEach(function (source) {
+    if (!source.data.events || source.data.events === '' || source.data.events === 'null') {
+      console.log('attach default events');
+      source.data.events = ['push'];
+    }
+  });
+  pipelineVo.pipelineConfigVo.sources = JSON.stringify(sources);
+  return pipelineVo;
+};
+export var transformPipelineVo = function transformPipelineVo(pipelineVo) {
+  if (!pipelineVo) return {};
+  var _ref2 = pipelineVo || {},
+    _ref2$envObj = _ref2.envObj,
+    envObj = _ref2$envObj === void 0 ? [] : _ref2$envObj,
+    _ref2$tagList = _ref2.tagList,
+    tagList = _ref2$tagList === void 0 ? [] : _ref2$tagList,
+    members = _ref2.members,
+    others = _objectWithoutPropertiesLoose(_ref2, _excluded);
+  var _ref3 = envObj[0] || {},
+    _ref3$envId = _ref3.envId,
+    envId = _ref3$envId === void 0 ? '' : _ref3$envId;
+  var tagIds = (tagList || []).map(function (_ref4) {
+    var id = _ref4.id;
+    return "" + id;
+  }).join(',');
+  return _extends({
+    envId: envId,
+    tagIds: tagIds,
+    tagList: tagList,
+    envObj: envObj,
+    members: members || ''
+  }, others);
+};
+export var saveOriginalFlow = function saveOriginalFlow(flow, pipelineId) {
+  setLocalStorageCache(PIPELINE_ORIGINAL_FLOW_CACHE + "-" + pipelineId, flow);
+};
+export var getOriginalFlow = function getOriginalFlow(pipelineId) {
+  var cache = getLocalStorageCache(PIPELINE_ORIGINAL_FLOW_CACHE + "-" + pipelineId, false);
+  if (!cache) {
+    return null;
+  }
+  return JSON.parse(cache);
+};
+export var clearOriginalFlow = function clearOriginalFlow(pipelineId) {
+  removeLocalStorageCache(PIPELINE_ORIGINAL_FLOW_CACHE + "-" + pipelineId);
+};
+export var addBranchModeFlagForSources = function addBranchModeFlagForSources(flow, sources) {
+  if (sources === void 0) {
+    sources = [];
+  }
+  var result = cloneDeep(sources);
+  if (!result.length) {
+    return result;
+  }
+  var _get = get(flow, 'pipeline.[0]', {}),
+    mode = _get.mode,
+    single = _get.single,
+    stages = _get.stages;
+  if (!single || mode !== 'branch') {
+    return result;
+  }
+  var branchPath = '[0].jobs[0].params.steps[0]';
+  var _get2 = get(stages, branchPath, {}),
+    BASE_BRANCH = _get2.BASE_BRANCH,
+    stepType = _get2.stepType;
+  if (!BASE_BRANCH || !stepType) {
+    return result;
+  }
+  var branchModeIndex = result.findIndex(function (_ref5) {
+    var _ref5$data = _ref5.data,
+      data = _ref5$data === void 0 ? {} : _ref5$data;
+    return data.isBranchMode;
+  });
+  if (branchModeIndex === -1) {
+    return result;
+  }
+  set(result, "[" + branchModeIndex + "].data.baseBranch", BASE_BRANCH);
+  return result;
+};

package/es/components/common/teambition/pipeline-flow-dialog/validate.d.ts

@@ -0,0 +1,11 @@
+/**
+ * validate 参数校验
+ * @param {object} payload 待检查的参数对象，如不是对象请封装一下
+ * @param {object[]} rules 校验规格
+ *   @params {string} rules.path 从 payload 中取值路径 'a[0].test'
+ *   @params {string} rules.msg 当校验未通过时 message 出的错误信息
+ *   @params {function} rules.test 手动处理的回调函数，第一个参数为从 payload 中取出的值
+ * @returns {boolean} 是否通过
+ */
+declare const _default: (payload?: {}, rules?: any[]) => boolean;
+export default _default;

package/es/components/common/teambition/pipeline-flow-dialog/validate.js

@@ -0,0 +1,43 @@
+import { get } from 'lodash-es';
+import { Message } from '@teamix/ui';
+
+/**
+ * validate 参数校验
+ * @param {object} payload 待检查的参数对象，如不是对象请封装一下
+ * @param {object[]} rules 校验规格
+ *   @params {string} rules.path 从 payload 中取值路径 'a[0].test'
+ *   @params {string} rules.msg 当校验未通过时 message 出的错误信息
+ *   @params {function} rules.test 手动处理的回调函数，第一个参数为从 payload 中取出的值
+ * @returns {boolean} 是否通过
+ */
+
+export default (function (payload, rules) {
+  if (payload === void 0) {
+    payload = {};
+  }
+  if (rules === void 0) {
+    rules = [];
+  }
+  var defaultValue = null;
+  for (var index = 0; index < rules.length; index += 1) {
+    var _rules$index = rules[index],
+      path = _rules$index.path,
+      msg = _rules$index.msg,
+      test = _rules$index.test;
+    var value = get(payload, path, defaultValue);
+    if (!test) {
+      if (value === defaultValue || value === '') {
+        Message.warning({
+          title: msg
+        });
+        return false;
+      }
+    } else if (!test(value, get)) {
+      Message.warning({
+        title: msg
+      });
+      return false;
+    }
+  }
+  return true;
+});

package/es/components/common/teambition/pipeline-flow-info/flow-info/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const FlowInfo: (props: any) => JSX.Element;
+export default FlowInfo;