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

package/es/components/dashboardMain/pipelines/index.js

@@ -0,0 +1,1061 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _extends from "@babel/runtime/helpers/extends";
+var _excluded = ["id", "name"];
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+function _createForOfIteratorHelperLoose(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (t) return (t = t.call(r)).next.bind(t); if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var o = 0; return function () { return o >= r.length ? { done: !0 } : { done: !1, value: r[o++] }; }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+import React, { useEffect, useState } from 'react';
+import { Message, Pagination, Loading, Dialog, Button, Balloon } from '@teamix/ui';
+import Loadable from "../../../utils/loadable";
+import permissionUtils from "../../../utils/permissionUtil";
+import PipelineInfo from "../../common/teambition/pipeline-info";
+import RunPipelineButton from "../../common/teambition/run-pipeline-btn";
+import { pureObjs, intervalEnterTime, setLocalStorageCache } from "../../../utils";
+import { Router, navigate } from '@reach/router';
+import { navigateWithContexPath } from "../../../utils/route-utils";
+import { Footer, Content, YunxiaoIcon } from '@alife/devops-ui';
+import exceed from "../../../utils/apimap";
+import track from "../../../utils/track";
+import { omit } from 'lodash-es';
+import intl from "../../../locale";
+import { fetchPipelines, getStarInfo, mergePipelines } from "./util";
+import CopyPipeline from "./copyPipeline";
+import "./index.scss";
+var PipelineTable = Loadable({
+  loader: function loader() {
+    return import("../components/pipeline-table");
+  }
+});
+var PipelineList = Loadable({
+  loader: function loader() {
+    return import("../components/pipeline-list");
+  }
+});
+var PipelinePanel = Loadable({
+  loader: function loader() {
+    return import("../components/pipeline-panel");
+  }
+});
+var PipelineEmpty = Loadable({
+  loader: function loader() {
+    return import("../components/pipeline-empty");
+  }
+});
+var NewPipelineDialog = Loadable({
+  loader: function loader() {
+    return import("../../pipeline/new");
+  }
+});
+var refObjectId = window.AK_GLOBAL.currentUser.workid;
+var orgId = window.userInfos.orgId;
+var Tooltip = Balloon.Tooltip;
+export var PERMISSION_PIPELINE_CREATE = 'tb.role.pipeline.create';
+export var PERMISSION_PIPELINE_EDIT = 'tb.flow.pipeline.edit';
+export var PERMISSION_PIPELINE_RUN = 'tb.flow.pipeline.run';
+export var PERMISSION_PIPELINE_GROUP_ADMIN = 'tb.role.pipelineGroup.admin';
+export var BASE_INFO = 'base-info';
+export var MEMBER_MANAGEMENT = 'member-management';
+var PIPELINE_NAME_WIDTH = 'pipeline-name-width';
+// const PREFIX = 'pipeline-content';
+var PIPELINE_SIZE = 'main-pipeline-size';
+var DEFAULT_SIZE = 8;
+var pipelineNameMiniWidth = 160;
+var _track = function _track(params) {
+  if (params === void 0) {
+    params = {};
+  }
+  track(_extends({
+    page: 'main page',
+    daysinceenterflow: intervalEnterTime()
+  }, params));
+};
+var getDefaultPipelineNameWidth = function getDefaultPipelineNameWidth() {
+  var width = localStorage.getItem(PIPELINE_NAME_WIDTH + "/" + orgId);
+  if (!width || parseInt(width, 10) < pipelineNameMiniWidth) {
+    return pipelineNameMiniWidth;
+  }
+  return parseInt(width, 10);
+};
+var Index = function Index(props) {
+  var api = props.api,
+    type = props.type,
+    _props$loading = props.loading,
+    loading = _props$loading === void 0 ? true : _props$loading,
+    searchParams = props.searchParams,
+    tabPanelHeight = props.tabPanelHeight,
+    contentLoading = props.contentLoading,
+    groupId = props.groupId,
+    viewMode = props.viewMode,
+    pageSort = props.pageSort,
+    searchPipelineName = props.searchPipelineName,
+    refreshFalg = props.refreshFalg,
+    pipelineGroups = props.pipelineGroups,
+    _props$currentGroupIn = props.currentGroupInfo,
+    currentGroupInfo = _props$currentGroupIn === void 0 ? {} : _props$currentGroupIn,
+    _props$createPermissi = props.createPermission,
+    createPermission = _props$createPermissi === void 0 ? false : _props$createPermissi,
+    _props$permissions = props.permissions,
+    permissions = _props$permissions === void 0 ? [] : _props$permissions,
+    hasPipelines = props.hasPipelines,
+    setHasPipelines = props.setHasPipelines;
+  var actions = props.actions,
+    setLoading = props.setLoading,
+    setContentLoading = props.setContentLoading,
+    composeTargetUrl = props.composeTargetUrl;
+  var _useState = useState({
+      pipelines: [],
+      viewedPipelines: []
+    }),
+    pipelinesInfo = _useState[0],
+    setPipelinesInfo = _useState[1];
+  useEffect(function () {
+    window.TB_NAVIGATION && window.TB_NAVIGATION.ready(function () {
+      window.TB_NAVIGATION.setHomePageFlag(true);
+    });
+    // 监听 title 容器子节点变化
+    var titleWrap = document.querySelector('.system-bar-left');
+    var callback = function callback(mutations) {
+      var _window$TB_NAVIGATION;
+      if (!((_window$TB_NAVIGATION = window.TB_NAVIGATION_CONFIG) !== null && _window$TB_NAVIGATION !== void 0 && _window$TB_NAVIGATION.isHomePage)) {
+        for (var _iterator = _createForOfIteratorHelperLoose(mutations), _step; !(_step = _iterator()).done;) {
+          var mutation = _step.value;
+          if (mutation.type === 'childList') {
+            var _mutation$removedNode = mutation.removedNodes,
+              removedNodes = _mutation$removedNode === void 0 ? [] : _mutation$removedNode;
+            for (var i = 0; i < removedNodes.length; i++) {
+              if (removedNodes[i].className === 'tb-navigation-contextSwitcher') {
+                var _window$TB_NAVIGATION2;
+                (_window$TB_NAVIGATION2 = window.TB_NAVIGATION) === null || _window$TB_NAVIGATION2 === void 0 ? void 0 : _window$TB_NAVIGATION2.setHomePageFlag(true);
+              }
+            }
+          }
+        }
+      }
+    };
+    var observer = new MutationObserver(callback);
+    if (titleWrap) {
+      observer.observe(titleWrap, {
+        childList: true
+      });
+    }
+    return function () {
+      observer.disconnect();
+    };
+  }, []);
+
+  // url页码信息
+  var query = new URLSearchParams(location.search);
+  var pathnameInFlow = window.location.origin + window.location.pathname;
+  var _useState2 = useState({
+      total: -1,
+      pageNum: parseInt(query.get('page'), 10) || 1,
+      pageSize: localStorage.getItem(PIPELINE_SIZE) || DEFAULT_SIZE
+    }),
+    paginationInfo = _useState2[0],
+    setPaginationInfo = _useState2[1];
+  var _useState3 = useState({}),
+    pipelinePermissionResult = _useState3[0],
+    setPipelinePermissionResult = _useState3[1];
+  var _useState4 = useState(false),
+    pipelineStatusBack = _useState4[0],
+    setPipelineStatusBack = _useState4[1];
+  var _useState5 = useState([]),
+    selectedMachineGroups = _useState5[0],
+    setSelectedMachineGroups = _useState5[1];
+  var _useState6 = useState([]),
+    collectPipelineIds = _useState6[0],
+    setCollectPipelineIds = _useState6[1];
+  var _useState7 = useState({}),
+    currEditPipelineInfo = _useState7[0],
+    setCurrEditPipelineInfo = _useState7[1];
+  var _useState8 = useState(getDefaultPipelineNameWidth()),
+    pipelineNameWidth = _useState8[0],
+    setPipelineNameWidth = _useState8[1];
+  var _useState9 = useState(false),
+    tagDefaultSelectVisible = _useState9[0],
+    setTagDefaultSelectVisible = _useState9[1];
+  var _useState10 = useState(false),
+    searchFlag = _useState10[0],
+    setSearchFlag = _useState10[1]; // 首次挂载不修改 url 携带的页码信息
+
+  var _useState11 = useState(false),
+    copyVisible = _useState11[0],
+    setCopyVisible = _useState11[1];
+  var _useState12 = useState({}),
+    copyPipelineInfo = _useState12[0],
+    setCopyPipelineInfo = _useState12[1];
+  var pipelines = pipelinesInfo.pipelines,
+    viewedPipelines = pipelinesInfo.viewedPipelines;
+  var pageSize = paginationInfo.pageSize,
+    pageNum = paginationInfo.pageNum,
+    total = paginationInfo.total;
+  useEffect(function () {
+    if (total > 0 && pipelines.length === 0) {
+      navigate(pathnameInFlow + "?page=" + (pageNum - 1 || 1));
+    }
+  }, [total]);
+  var getPipelines = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(params, l) {
+      var pageStart, advancedSearchParams, advancedParams, data, _yield$fetchPipelines, object, successful, errorMsg, newViewedPipelines;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (params === void 0) {
+              params = {};
+            }
+            if (l === void 0) {
+              l = true;
+            }
+            !contentLoading && l && setContentLoading(true);
+            pageStart = (params.pageSize || pageSize) * ((params.pageNum || pageNum) - 1);
+            advancedSearchParams = Object.keys(searchParams || {}).reduce(function (m, k) {
+              var val = searchParams[k];
+              if (/Time$/.test(k) && val) {
+                try {
+                  val = new Date(val).getTime();
+                } catch (err) {
+                  console.error(err);
+                }
+              }
+              m[k] = val;
+              return m;
+            }, {});
+            advancedParams = Object.keys(params || {}).reduce(function (m, k) {
+              var val = params[k];
+              if (/Time$/.test(k) && val) {
+                try {
+                  val = new Date(val).getTime();
+                } catch (err) {
+                  console.error(err);
+                }
+              }
+              m[k] = val;
+              return m;
+            }, {});
+            if (!(location.pathname.includes('system') && !props.pipelineSystemType)) {
+              _context.next = 15;
+              break;
+            }
+            if (!props.loadingTypes) {
+              _context.next = 11;
+              break;
+            }
+            return _context.abrupt("return");
+          case 11:
+            setContentLoading(false);
+            setLoading(false);
+            setPaginationInfo(function (prev) {
+              return _extends({}, prev, {
+                total: 0
+              });
+            });
+            return _context.abrupt("return", []);
+          case 15:
+            data = _extends({
+              type: type,
+              pageSize: params.pageSize || pageSize,
+              pageStart: pageStart,
+              refObjectId: refObjectId,
+              pageOrder: 'DESC',
+              refObjectType: 'PERSON'
+            }, pureObjs(_extends({}, advancedSearchParams, {
+              pageSort: pageSort,
+              pipelineSystemType: props.pipelineSystemType,
+              pipelineName: searchPipelineName
+            }, omit(advancedParams, ['pageSize', 'pageNum']))));
+            _context.next = 18;
+            return fetchPipelines(api, data, pureObjs({
+              id: groupId
+            }));
+          case 18:
+            _yield$fetchPipelines = _context.sent;
+            object = _yield$fetchPipelines.object;
+            successful = _yield$fetchPipelines.successful;
+            errorMsg = _yield$fetchPipelines.errorMsg;
+            setContentLoading(false);
+            setLoading(false);
+            if (successful) {
+              _context.next = 26;
+              break;
+            }
+            return _context.abrupt("return", Message.error({
+              title: intl.get({
+                id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+                defaultMessage: '失败'
+              }),
+              content: errorMsg
+            }));
+          case 26:
+            newViewedPipelines = mergePipelines(viewedPipelines, object.dataList);
+            setPipelinesInfo(function (prev) {
+              return _extends({}, prev, {
+                pipelines: object.dataList,
+                viewedPipelines: newViewedPipelines
+              });
+            });
+            setPaginationInfo(function (prev) {
+              return _extends({}, prev, {
+                total: object.total
+              });
+            });
+            return _context.abrupt("return", object.dataList);
+          case 30:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function getPipelines(_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  var batchGetResourcePermission = function batchGetResourcePermission(pipelineList) {
+    if (pipelineList === void 0) {
+      pipelineList = [];
+    }
+    permissionUtils.batchCheckPermissionList([PERMISSION_PIPELINE_EDIT, PERMISSION_PIPELINE_RUN], pipelineList.map(function (_ref2) {
+      var pipelineId = _ref2.pipelineId;
+      return pipelineId;
+    }), 'pipeline', refObjectId).then(setPipelinePermissionResult);
+  };
+  var getCollectPipelineIds = function getCollectPipelineIds() {
+    exceed.fetch({
+      api: 'Pipeline.collect.ids'
+    }).then(function (_ref3) {
+      var successful = _ref3.successful,
+        object = _ref3.object;
+      if (!successful) {
+        return;
+      }
+      setCollectPipelineIds(object);
+    }).fail(console.error);
+  };
+  var initialize = /*#__PURE__*/function () {
+    var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(params, l) {
+      var _pipelines;
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            if (params === void 0) {
+              params = {};
+            }
+            getCollectPipelineIds();
+            _context2.next = 4;
+            return getPipelines(params, l);
+          case 4:
+            _pipelines = _context2.sent;
+            if ((_pipelines || []).length) {
+              batchGetResourcePermission(_pipelines);
+            }
+          case 6:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+    return function initialize(_x3, _x4) {
+      return _ref4.apply(this, arguments);
+    };
+  }();
+  useEffect(function () {
+    var homePage;
+    if (type === 'groups') {
+      homePage = "/groups/" + groupId;
+    }
+    if (!homePage && (type || '').includes('groups')) {
+      homePage = "/" + type + "/" + groupId;
+    }
+    if (!homePage) {
+      homePage = "/" + type;
+    }
+    setLocalStorageCache("homePage/flow/" + orgId, homePage, false);
+  }, [type, groupId]);
+  useEffect(function () {
+    if (!groupId) return;
+    selectedMachineGroups.length && setSelectedMachineGroups([]);
+  }, [groupId]);
+  useEffect(function () {
+    if ((type === 'groups' || (type || '').includes('groups')) && !groupId) {
+      return;
+    }
+    var params = _extends({}, searchParams, {
+      searchPipelineName: searchPipelineName
+    });
+
+    // 有搜索条件，回到第一页
+    if (Object.keys(_extends({}, params)).length && pageNum !== 1 && searchFlag) {
+      setPaginationInfo(function (prev) {
+        return _extends({}, prev, {
+          pageNum: 1
+        });
+      });
+      navigate(pathnameInFlow + "?page=1");
+      params.pageNum = 1;
+    }
+    initialize(params);
+    if (!searchFlag) setSearchFlag(true);
+  }, [pageSort, searchParams, refreshFalg].concat(type === 'groups' || (type || '').includes('groups') ? [groupId] : []));
+
+  // url page发生变化更新数据
+  useEffect(function () {
+    if (!location.pathname.split('/').includes('new')) {
+      var params = new URLSearchParams(location.search);
+      if (!params.get('page')) {
+        setPaginationInfo(function (prev) {
+          return _extends({}, prev, {
+            pageNum: 1
+          });
+        });
+        navigate(pathnameInFlow + "?page=1", {
+          replace: true
+        });
+        return;
+      }
+      var urlPage = parseInt(params.get('page'), 10) || 1;
+      if (urlPage !== pageNum) {
+        setPaginationInfo(function (prev) {
+          return _extends({}, prev, {
+            pageNum: urlPage
+          });
+        });
+        initialize(_extends({}, searchParams, {
+          pageSize: pageSize,
+          pageNum: urlPage
+        }));
+      }
+    }
+  }, [location.search]);
+  var onRefreshPipelines = function onRefreshPipelines(l) {
+    initialize(_extends({}, searchParams, {
+      pageSort: pageSort,
+      pipelineName: searchPipelineName
+    }), l);
+  };
+  var onPipelineStar = function onPipelineStar(pipelineInfo, _ref5) {
+    var label = _ref5.label,
+      action = _ref5.action;
+    var pipelineName = pipelineInfo.pipelineName,
+      pipelineId = pipelineInfo.pipelineId;
+    _track({
+      action: action === 'DELETE' ? 'cancel collect pipeline' : 'collect pipeline'
+    });
+    var config = {
+      api: 'Pipeline.collect',
+      data: {
+        type: action,
+        empId: refObjectId,
+        pipelineId: pipelineId
+      }
+    };
+    return new Promise(function (resolve, reject) {
+      exceed.fetch(config).then(function (_ref6) {
+        var successful = _ref6.successful;
+        if (!successful) {
+          reject();
+          return Message.error({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.dashboardMain.pipelines.PipelinenameNotLabel',
+              defaultMessage: '{pipelineName} 未{label}'
+            }, {
+              pipelineName: pipelineName,
+              label: label
+            })
+          });
+        }
+        // Message.success({
+        //   title: intl.get(
+        //     {
+        //       id: 'rdc-tb-cd-assets.dashboardMain.pipelines.PipelinenameAlreadyLabel',
+        //       defaultMessage: '{pipelineName} 已{label}',
+        //     },
+        //     { pipelineName, label },
+        //   ),
+        // });
+        var collecIds = [].concat(collectPipelineIds);
+        if (action === 'DELETE') {
+          collecIds.splice(collecIds.indexOf(pipelineId), 1);
+        } else {
+          collecIds.push(pipelineId);
+        }
+        setCollectPipelineIds(Object.assign([], collecIds));
+        resolve();
+      })["catch"](reject).fail(console.error);
+    });
+  };
+  var onEditPipelineInfo = function onEditPipelineInfo(pipeline, trackFlag) {
+    if (trackFlag === void 0) {
+      trackFlag = true;
+    }
+    var _ref7 = pipeline || {},
+      pipelineName = _ref7.pipelineName,
+      pipelineId = _ref7.pipelineId,
+      _ref7$extendInfoVo = _ref7.extendInfoVo,
+      _ref7$extendInfoVo2 = _ref7$extendInfoVo === void 0 ? {} : _ref7$extendInfoVo,
+      _ref7$extendInfoVo2$e = _ref7$extendInfoVo2.envObj,
+      envObj = _ref7$extendInfoVo2$e === void 0 ? [] : _ref7$extendInfoVo2$e,
+      _ref7$extendInfoVo2$t = _ref7$extendInfoVo2.tagList,
+      tagList = _ref7$extendInfoVo2$t === void 0 ? [] : _ref7$extendInfoVo2$t,
+      gId = _ref7$extendInfoVo2.groupId,
+      uuid = _ref7.uuid;
+    var envId = envObj.length > 0 ? envObj[0].envId : '';
+    setCurrEditPipelineInfo({
+      uuid: uuid,
+      envId: envId,
+      tagList: tagList,
+      pipelineId: pipelineId,
+      pipelineName: pipelineName,
+      groupId: gId,
+      tagIdList: tagList.map(function (_ref8) {
+        var id = _ref8.id;
+        return id;
+      })
+    });
+    trackFlag && _track({
+      action: 'setting pipeline'
+    });
+  };
+  var onExecutePipeline = function onExecutePipeline(_ref9) {
+    var pipelineId = _ref9.pipelineId,
+      pipelineName = _ref9.pipelineName;
+    var onOk = function onOk() {
+      return new Promise(function (resolve, reject) {
+        setContentLoading(true);
+        _track({
+          action: 'execute pipeline'
+        });
+        var config = {
+          api: 'Pipeline.batchExecute',
+          data: {
+            pipelineIds: pipelineId
+          }
+        };
+        exceed.fetch(config).then(function (_ref10) {
+          var errorMsg = _ref10.errorMsg,
+            successful = _ref10.successful;
+          if (!successful) {
+            reject();
+            return Message.error({
+              title: intl.get({
+                id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+                defaultMessage: '失败'
+              }),
+              content: errorMsg
+            });
+          }
+          onRefreshPipelines();
+          Message.success({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.detailMain.histories.Success',
+              defaultMessage: '成功'
+            }),
+            content: pipelineName + " " + intl.get({
+              id: 'rdc-tb-cd-assets.teambition.group-status.RunSuccessfully',
+              defaultMessage: '运行成功'
+            })
+          });
+          resolve();
+        })["catch"](function () {
+          Message.error({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+              defaultMessage: '失败'
+            }),
+            content: intl.get({
+              id: 'rdc-tb-cd-assets.teambition.group-status.FailedToRun',
+              defaultMessage: '运行失败'
+            })
+          });
+          setContentLoading(false);
+          reject();
+        });
+      });
+    };
+    Dialog.confirm({
+      messageProps: {
+        type: 'notice'
+      },
+      title: intl.get({
+        id: 'rdc-tb-cd-assets.dashboardMain.main.main.Run',
+        defaultMessage: '运行'
+      }),
+      content: intl.get({
+        id: 'rdc-tb-cd-assets.dashboardMain.pipelines.AreYouSureYouWant',
+        defaultMessage: '确定运行【{pipelineName}】流水线吗？'
+      }, {
+        pipelineName: pipelineName
+      }),
+      animation: {
+        "in": 'expandInDown',
+        out: 'expandOutUp'
+      },
+      onOk: onOk
+    });
+  };
+  var onCopyPipeline = function onCopyPipeline(pipelineInfo) {
+    var pipelineId = pipelineInfo.pipelineId,
+      pipelineName = pipelineInfo.pipelineName,
+      _pipelineInfo$pipelin = pipelineInfo.pipelineType,
+      pipelineType = _pipelineInfo$pipelin === void 0 ? '' : _pipelineInfo$pipelin;
+    var onOk = function onOk() {
+      return new Promise(function (resolve, reject) {
+        setContentLoading(true);
+        _track({
+          action: 'copy pipeline'
+        });
+        exceed.fetch({
+          api: pipelineType === 'PIPELINEASCODE' ? 'Pipeline2.clone' : 'Pipeline.clone',
+          params: {
+            pipelineId: pipelineId
+          }
+        }).then(function (_ref11) {
+          var errorMsg = _ref11.errorMsg,
+            successful = _ref11.successful;
+          if (!successful) {
+            reject();
+            setContentLoading(false);
+            return Message.error({
+              title: intl.get({
+                id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+                defaultMessage: '失败'
+              }),
+              content: errorMsg
+            });
+          }
+          onRefreshPipelines();
+          Message.success({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.dashboardMain.main.pipelineTable.CopiedSuccessfully',
+              defaultMessage: '复制成功'
+            })
+          });
+          resolve();
+        })["catch"](function () {
+          Message.error({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+              defaultMessage: '失败'
+            }),
+            content: intl.get({
+              id: 'rdc-tb-cd-assets.dashboardMain.main.pipelineTable.ReplicationFailed',
+              defaultMessage: '复制失败'
+            })
+          });
+          setContentLoading(false);
+          reject();
+        });
+      });
+    };
+    setCopyVisible(true);
+    setCopyPipelineInfo(pipelineInfo);
+  };
+  var onDeletePipeline = function onDeletePipeline(_ref12) {
+    var pipelineId = _ref12.pipelineId,
+      pipelineName = _ref12.pipelineName;
+    var onOk = function onOk() {
+      return new Promise(function (resolve, reject) {
+        _track({
+          action: 'delete pipeline'
+        });
+        var config = {
+          api: 'Pipeline.delete',
+          params: {
+            pipelineId: pipelineId
+          }
+        };
+        exceed.fetch(config).then(function (_ref13) {
+          var errorMsg = _ref13.errorMsg,
+            successful = _ref13.successful;
+          if (!successful) {
+            reject();
+            return Message.error({
+              title: intl.get({
+                id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+                defaultMessage: '失败'
+              }),
+              content: errorMsg
+            });
+          }
+          onRefreshPipelines();
+          Message.success({
+            title: pipelineName + " " + intl.get({
+              id: 'rdc-tb-cd-assets.components.variableGroup.deleteVariableGroupDialog.DeletedSuccessfully',
+              defaultMessage: '删除成功'
+            })
+          });
+          resolve();
+        })["catch"](function () {
+          Message.error({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+              defaultMessage: '失败'
+            }),
+            content: pipelineName + " " + intl.get({
+              id: 'rdc-tb-cd-assets.components.variableGroup.deleteVariableGroupDialog.FailedToDelete',
+              defaultMessage: '删除失败'
+            })
+          });
+          setContentLoading(false);
+          reject();
+        });
+      });
+    };
+    Dialog.alert({
+      messageProps: {
+        type: 'error'
+      },
+      animation: {
+        "in": 'expandInDown',
+        out: 'expandOutUp'
+      },
+      title: intl.get({
+        id: 'rdc-tb-cd-assets.dashboardMain.main.pipelineTable.DeletePipeline',
+        dfaultMessage: '删除流水线'
+      }),
+      content: /*#__PURE__*/React.createElement("div", {
+        style: {
+          maxWidth: 366
+        }
+      }, intl.get({
+        id: 'rdc-tb-cd-assets.dashboardMain.main.pipelineTable.AfterDeletionItCannotBe_tips',
+        defaultMessage: '删除流水线将同时删除流水线正在运行的实例，删除后将无法恢复，请谨慎操作'
+      })),
+      okProps: {
+        children: intl.get({
+          id: 'rdc-tb-cd-assets.dashboardMain.tag-page.Delete',
+          defaultMessage: '删除'
+        })
+      },
+      cancelProps: {
+        children: intl.get({
+          id: 'rdc-tb-cd-assets.dashboardMain.main.pipelineTable.GiveUp',
+          defaultMessage: '放弃'
+        })
+      },
+      onOk: onOk,
+      footerActions: ['cancel', 'ok']
+    });
+  };
+  var onAddPipelineTag = function onAddPipelineTag(pipeline) {
+    if (!pipeline) {
+      return Message.error({
+        title: intl.get({
+          id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+          defaultMessage: '失败'
+        }),
+        content: intl.get({
+          id: 'A system error occurred. Refresh the page and try again.',
+          defaultMessage: '系统出错了，请刷新页面重试'
+        })
+      });
+    }
+    setTagDefaultSelectVisible(true);
+    onEditPipelineInfo(pipeline, false);
+    _track({
+      action: 'tag pipeline'
+    });
+  };
+  var onPipelineMoveGroup = function onPipelineMoveGroup(pipelineIds, groupInfo, refresh) {
+    if (pipelineIds === void 0) {
+      pipelineIds = [];
+    }
+    if (refresh === void 0) {
+      refresh = true;
+    }
+    return new Promise(function (resolve, reject) {
+      var config = {
+        api: 'Pipeline.set.piplines.group',
+        params: {
+          id: groupInfo.groupId
+        },
+        data: {
+          pipelines: pipelineIds
+        }
+      };
+      exceed.fetch(config).then(function (_ref14) {
+        var successful = _ref14.successful,
+          _ref14$object = _ref14.object,
+          object = _ref14$object === void 0 ? [] : _ref14$object;
+        if (!successful) {
+          return reject();
+        }
+        var succesLen = pipelineIds.length - object.length;
+        if (succesLen === pipelineIds.length) {
+          Message.success({
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.dashboardMain.pipelines.SucceslenPipelinesHaveBeenMoved',
+              defaultMessage: '{succesLen} 条流水线已移动至【{groupInfoGroupName}】'
+            }, {
+              succesLen: succesLen,
+              successLen: succesLen,
+              groupInfoGroupName: groupInfo.groupName
+            })
+          });
+        } else {
+          Message.warning({
+            duration: 8000,
+            title: intl.get({
+              id: 'rdc-tb-cd-assets.dashboardMain.pipelines.SucceslenPipelinesHaveBeenMoved.1',
+              defaultMessage: '{succesLen} 条流水线已移动至【{groupInfoGroupName}】，{objectLength} 条流水线无权移动，仅流水线拥有者或管理员有权限移动'
+            }, {
+              succesLen: succesLen,
+              groupInfoGroupName: groupInfo.groupName,
+              objectLength: object.length
+            })
+          });
+        }
+        actions.getPipelineGroups();
+        resolve();
+        if (refresh) {
+          var clock = setTimeout(function () {
+            onRefreshPipelines(false);
+            clearTimeout(clock);
+          }, 300);
+        }
+      });
+    });
+  };
+  var onResizePipelineNameWidth = function onResizePipelineNameWidth(_, value) {
+    var width = Number(pipelineNameWidth) + value;
+    if (width <= pipelineNameMiniWidth) return;
+    setPipelineNameWidth(width);
+    setLocalStorageCache(PIPELINE_NAME_WIDTH + "/" + orgId, width, false);
+  };
+  var renderRunPipelineButton = function renderRunPipelineButton(_ref15, text, t) {
+    var pipelineId = _ref15.pipelineId;
+    if (text === void 0) {
+      text = '';
+    }
+    if (t === void 0) {
+      t = true;
+    }
+    var btn = /*#__PURE__*/React.createElement(Button, {
+      text: true,
+      type: "normal"
+    }, /*#__PURE__*/React.createElement(YunxiaoIcon, {
+      type: "play-line"
+    }), text);
+    var tooltip = /*#__PURE__*/React.createElement(Tooltip, {
+      align: "t",
+      trigger: btn
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.dashboardMain.main.main.Run',
+      defaultMessage: '运行'
+    }));
+    return /*#__PURE__*/React.createElement(RunPipelineButton, {
+      notJump: true,
+      id: pipelineId,
+      trackInfo: {
+        page: 'main page'
+      },
+      trigger: t ? tooltip : btn,
+      onRunPost: function onRunPost() {
+        // 延迟刷新列表，避免主线程任务过多卡顿
+        var clock = setTimeout(function () {
+          onRefreshPipelines();
+          clearTimeout(clock);
+        }, 150);
+      }
+    });
+  };
+  var onNewPipelineDialogClose = function onNewPipelineDialogClose() {
+    var url = composeTargetUrl();
+    navigateWithContexPath(url + "?page=" + pageNum);
+  };
+  var onCopyPipelineOk = function onCopyPipelineOk(pipelineName, cloneToPac) {
+    var pipelineId = copyPipelineInfo.pipelineId,
+      _copyPipelineInfo$pip = copyPipelineInfo.pipelineType,
+      pipelineType = _copyPipelineInfo$pip === void 0 ? '' : _copyPipelineInfo$pip;
+    setContentLoading(true);
+    _track({
+      action: 'copy pipeline'
+    });
+    exceed.fetch({
+      api: pipelineType === 'PIPELINEASCODE' ? 'Pipeline2.clone' : 'Pipeline.clone',
+      params: {
+        pipelineId: pipelineId
+      },
+      data: {
+        pipelineName: pipelineName,
+        cloneToPac: cloneToPac
+      }
+    }).then(function (_ref16) {
+      var errorMsg = _ref16.errorMsg,
+        successful = _ref16.successful;
+      setTimeout(function () {
+        setCopyVisible(false);
+      }, 300);
+      if (!successful) {
+        setContentLoading(false);
+        return Message.error({
+          title: intl.get({
+            id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+            defaultMessage: '失败'
+          }),
+          content: errorMsg
+        });
+      }
+      onRefreshPipelines();
+      Message.success({
+        title: intl.get({
+          id: 'rdc-tb-cd-assets.dashboardMain.main.pipelineTable.CopiedSuccessfully',
+          defaultMessage: '复制成功'
+        })
+      });
+    })["catch"](function () {
+      Message.error({
+        title: intl.get({
+          id: 'rdc-tb-cd-assets.pipeline.new.Failed',
+          defaultMessage: '失败'
+        }),
+        content: intl.get({
+          id: 'rdc-tb-cd-assets.dashboardMain.main.pipelineTable.ReplicationFailed',
+          defaultMessage: '复制失败'
+        })
+      });
+      setCopyVisible(false);
+      setContentLoading(false);
+    });
+  };
+  var componentProps = {
+    pageSize: pageSize,
+    pageNum: pageNum,
+    pipelines: pipelines,
+    getStarInfo: getStarInfo,
+    onPipelineStar: onPipelineStar,
+    pipelineGroups: pipelineGroups,
+    viewedPipelines: viewedPipelines,
+    tabPanelHeight: tabPanelHeight,
+    onEditPipelineInfo: onEditPipelineInfo,
+    pipelineStatusBack: pipelineStatusBack,
+    collectPipelineIds: collectPipelineIds,
+    loading: contentLoading,
+    pipelinePermissionResult: pipelinePermissionResult,
+    pipelineNameWidth: pipelineNameWidth,
+    onResizePipelineNameWidth: onResizePipelineNameWidth,
+    selectionPipelines: selectedMachineGroups,
+    setSelectionPipelines: setSelectedMachineGroups,
+    onRefreshPipelines: onRefreshPipelines,
+    onExecutePipeline: onExecutePipeline,
+    onCopyPipeline: onCopyPipeline,
+    onDeletePipeline: onDeletePipeline,
+    onAddPipelineTag: onAddPipelineTag,
+    onPipelineMoveGroup: onPipelineMoveGroup,
+    renderRunPipelineButton: renderRunPipelineButton,
+    currentGroupInfo: currentGroupInfo,
+    permissions: permissions,
+    isGroup: !!groupId
+  };
+  var isEmpty = Object.values(_extends({}, searchParams, {
+    searchPipelineName: searchPipelineName
+  })).filter(Boolean).length && !contentLoading ? false : !loading && !contentLoading && total === 0;
+  if (isEmpty !== !hasPipelines) {
+    setHasPipelines(!isEmpty);
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, function () {
+    if (loading) {
+      return /*#__PURE__*/React.createElement(Loading, {
+        inline: false,
+        style: {
+          height: 150
+        }
+      });
+    }
+    if (isEmpty) {
+      return /*#__PURE__*/React.createElement(PipelineEmpty, {
+        disabled: !createPermission,
+        isGroup: !!groupId,
+        type: type,
+        onCreate: function onCreate() {
+          var url = composeTargetUrl();
+          navigateWithContexPath(url + "/new");
+        }
+      });
+    }
+    var Component = {
+      table: PipelineTable,
+      panel: PipelinePanel,
+      list: PipelineList
+    }[viewMode];
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Content, null, Component && /*#__PURE__*/React.createElement(Component, _extends({
+      key: !!groupId
+    }, componentProps))), total >= 6 && /*#__PURE__*/React.createElement(Footer, {
+      style: {
+        paddingLeft: 'var(--layout-padding-left-and-right, 24px)',
+        paddingRight: 'var(--layout-padding-left-and-right, 24px)'
+      }
+    }, /*#__PURE__*/React.createElement(Pagination, {
+      total: total,
+      current: pageNum,
+      pageSize: pageSize,
+      pageSizeSelector: "dropdown",
+      pageSizeList: [8, 16, 24, 32],
+      popupProps: {
+        align: 'bl tl',
+        offset: [0, -2]
+      },
+      onPageSizeChange: function onPageSizeChange(size) {
+        setPaginationInfo(function (prev) {
+          return _extends({}, prev, {
+            pageSize: size,
+            pageNum: 1
+          });
+        });
+        initialize(_extends({}, searchParams, {
+          pageSize: size,
+          pageNum: 1
+        }));
+        setLocalStorageCache(PIPELINE_SIZE, size, false);
+        navigate(pathnameInFlow + "?page=1");
+      },
+      onChange: function onChange(current) {
+        initialize(_extends({}, searchParams, {
+          pageSize: pageSize,
+          pageNum: current
+        }));
+        setPaginationInfo(function (prev) {
+          return _extends({}, prev, {
+            pageNum: current
+          });
+        });
+        navigate(pathnameInFlow + "?page=" + current);
+      }
+    })));
+  }(), !!Object.keys(currEditPipelineInfo).length && /*#__PURE__*/React.createElement(PipelineInfo, {
+    visible: true,
+    pipeline: currEditPipelineInfo,
+    defaultTab: BASE_INFO,
+    onRefresh: onRefreshPipelines,
+    defaultSelectVisible: tagDefaultSelectVisible,
+    groupDataSource: (pipelineGroups || []).map(function (_ref17) {
+      var id = _ref17.id,
+        name = _ref17.name,
+        others = _objectWithoutPropertiesLoose(_ref17, _excluded);
+      return _extends({
+        name: String(id) === '0' ? intl.get({
+          id: 'rdc-tb-cd-assets.dashboardMain.pipelines.NotGrouped',
+          defaultMessage: '未分组'
+        }) : name,
+        id: id
+      }, others);
+    }),
+    onClose: function onClose() {
+      setCurrEditPipelineInfo({});
+      setTagDefaultSelectVisible(false);
+    }
+  }), createPermission && /*#__PURE__*/React.createElement(Router, null, /*#__PURE__*/React.createElement(NewPipelineDialog, {
+    visible: true,
+    type: type,
+    groupId: groupId,
+    path: "new",
+    onClose: onNewPipelineDialogClose
+  })), /*#__PURE__*/React.createElement(CopyPipeline, {
+    visible: copyVisible,
+    setCopyVisible: setCopyVisible,
+    copyPipelineInfo: copyPipelineInfo,
+    pipelineName: copyPipelineInfo === null || copyPipelineInfo === void 0 ? void 0 : copyPipelineInfo.pipelineName,
+    onOkNew: onCopyPipelineOk
+  }));
+};
+export default /*#__PURE__*/React.memo(Index);