@riil-frontend/component-topology 12.0.0-dev.26 → 12.0.0-dev.27

package/es/core/editor/components/Toolbar/widgets/Layout/index.js

@@ -7,7 +7,7 @@ import React, { useState, useMemo } from 'react';
 import LayoutSettings from "./components/LayoutSettings";
 import WidgetBox from "../WidgetBox";
 import DropdownButton from "../components/DropdownButton";
-import { isGroup, isLayer } from "../../../../../../utils/htElementDataUtil";
+import { isGroup, isLayer, isNode } from "../../../../../../utils/htElementDataUtil";
 
 function Layout(props) {
   var topo = props.topo,
@@ -147,7 +147,7 @@ function isLayoutEnabled(props) {
   } //中心节点布局,选中一个节点不是分层的情况下，按钮亮起
 
 
-  if (topoShowType !== 'layers' && selection.length === 1) {
+  if (topoShowType !== 'layers' && selection.length === 1 && (isNode(selection[0]) || isGroup(selection[0]))) {
     return true;
   }
 

package/es/core/editor/utils/edgeTypeStyleUtil.js

@@ -77,29 +77,6 @@ export function isNodeAllEdges(topo) {
   });
   return inEdges;
 }
-/**
- * 遍历连线及子连线
- * @param {*} topo 
- * @param {*} edges 
- * @param {*} operateEdgeFn 
- */
-
-export function loopEdgesAndChildren(topo, edges, operateEdgeFn) {
-  var htTopo = topo.getHtTopo();
-  edges.forEach(function (edge) {
-    operateEdgeFn(edge);
-
-    if (edge.isEdgeGroupAgent()) {
-      // 连线组折叠时同时设置子连线
-      var edgeChildren = edge.getEdgeGroup().getEdges().toArray();
-      htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), true);
-      edgeChildren.forEach(function (edgeChild) {
-        operateEdgeFn(edgeChild);
-      });
-      htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), false);
-    }
-  });
-}
 /**
  * 设置连线及子连线。带回退事务控制
  * @param {*} topo 

package/es/core/hooks/useAlarm.js

@@ -88,12 +88,25 @@ var handleRiskData = function handleRiskData(topo, receivedData) {
     topo.viewProps.onResourceEvent(topo.alarm.getEvents());
   }
 };
+/**
+ * 关联拓扑告警级别消息处理
+ * @param {*} topo 
+ * @param {*} data 
+ */
+
 
 var handleRelateTopoAlarm = function handleRelateTopoAlarm(topo, data) {
   var relateTopoAlarm = _extends({}, topo.store.getModelState('topoAlarm').relateTopoAlarm);
 
   data.forEach(function (item) {
-    relateTopoAlarm[item.topoId] = item.alertLevel;
+    var alertLevel = item.alertLevel;
+
+    if (alertLevel === -1) {
+      // -1表示删除
+      delete relateTopoAlarm[item.topoId];
+    } else {
+      relateTopoAlarm[item.topoId] = item.alertLevel;
+    }
   });
   topo.store.getModelDispatchers('topoAlarm').update({
     relateTopoAlarm: relateTopoAlarm

package/es/core/hooks/useCmpLinkAlarm.js

@@ -1,27 +1,153 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _extends from "@babel/runtime/helpers/extends";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import { useEffect, useState, useMemo } from "react";
+import { useRequest } from 'ahooks';
+import DictCache from "../models/cache/DictCache";
+
+function addCmpLinkOfflineStatusForDisplayLineColor(cis, cmpLinkRunStatusList) {
+  return cis.map(function (ci) {
+    var cmpLinkRunStatusData = cmpLinkRunStatusList.find(function (item) {
+      return item.id === ci.id;
+    });
+
+    if (cmpLinkRunStatusData) {
+      return _extends({}, ci, {
+        manageStatus: cmpLinkRunStatusData.runStatus === '2' ? 0 : 3
+      });
+    }
+
+    return ci;
+  });
+}
+
+function getCmpLinIds(datas) {
+  var linkIds = datas.filter(function (item) {
+    return item.isSubResource && item.typeCode === 'network_link';
+  }).map(function (item) {
+    return item.ciId;
+  });
+  return linkIds;
+}
 /**
- * 分级链路
+ * 分级链路下級鏈路
  * @param {*} props 
  * @returns 
  */
+
+
 export default function useCmpLinkAlarm(props) {
-  var topo = props.topo;
+  var topo = props.topo,
+      resources = props.resources,
+      graphLoaded = props.graphLoaded;
 
-  var _topo$store$useModelS = topo.store.useModelState('topoBizMod'),
-      attrsAndMetrics = _topo$store$useModelS.attrsAndMetrics;
+  var _useState = useState(getCmpLinIds(resources)),
+      cmpLinkIds = _useState[0],
+      setCmpLinkIds = _useState[1];
 
-  var cmpLinkAlarmLevels = attrsAndMetrics.filter(function (item) {
-    return item.typeCode === 'network_link';
-  }) // 3:fault:重要故障; 4:urgently:紧急故障 』为红色
-  .filter(function (item) {
-    return ['3', '4'].includes(item.metrics.run_status);
-  }).map(function (item) {
-    return {
-      id: item.id,
-      level: 1
-    };
-  });
+  var _useState2 = useState([]),
+      cmpLinkRunStatus = _useState2[0],
+      setCmpLinkRunStatus = _useState2[1];
+
+  var cmpLinkAlarmLevels = useMemo(function () {
+    return cmpLinkRunStatus // 3:fault:重要故障; 4:urgently:紧急故障 』为红色
+    .filter(function (item) {
+      return ['3', '4'].includes(item.runStatus);
+    }).map(function (item) {
+      return {
+        id: item.id,
+        level: 1
+      };
+    });
+  }, [cmpLinkRunStatus]);
+  useEffect(function () {
+    var ids = getCmpLinIds(resources);
+
+    if (cmpLinkIds.join(',') !== ids.join(',')) {
+      setCmpLinkIds(ids);
+    }
+  }, [resources]);
+
+  function getCmpLinkRunStatus(_x) {
+    return _getCmpLinkRunStatus.apply(this, arguments);
+  } // 轮询hooks
+
+
+  function _getCmpLinkRunStatus() {
+    _getCmpLinkRunStatus = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(ids) {
+      var _yield$Promise$all, ciMetricsResult;
+
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (ids.length) {
+              _context.next = 2;
+              break;
+            }
+
+            return _context.abrupt("return", []);
+
+          case 2:
+            _context.t0 = Promise;
+            _context.t1 = // 查询指标值
+            topo.serverApi.ciInfo.batchQueryCiInfo({
+              ciId: [],
+              codes: ['run_status'],
+              relationId: ids.map(function (id) {
+                return {
+                  ciId: id,
+                  operation: "delete"
+                };
+              })
+            });
+            _context.next = 6;
+            return DictCache.init();
+
+          case 6:
+            _context.t2 = _context.sent;
+            _context.t3 = [_context.t1, _context.t2];
+            _context.next = 10;
+            return _context.t0.all.call(_context.t0, _context.t3);
+
+          case 10:
+            _yield$Promise$all = _context.sent;
+            ciMetricsResult = _yield$Promise$all[0];
+            return _context.abrupt("return", ciMetricsResult);
+
+          case 13:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return _getCmpLinkRunStatus.apply(this, arguments);
+  }
+
+  var _useRequest = useRequest(getCmpLinkRunStatus, {
+    pollingInterval: 60 * 1000,
+    pollingWhenHidden: false,
+    // debounceInterval: 200,
+    manual: true,
+    onSuccess: function onSuccess(result) {
+      setCmpLinkRunStatus(result.map(function (item) {
+        return {
+          id: "sub:" + item.id,
+          runStatus: item.metrics.run_status
+        };
+      }));
+    }
+  }),
+      run = _useRequest.run;
+
+  useEffect(function () {
+    if (graphLoaded) {
+      run(cmpLinkIds);
+    }
+  }, [graphLoaded, cmpLinkIds]);
   return {
-    cmpLinkAlarmLevels: cmpLinkAlarmLevels
+    cmpLinkRunStatus: cmpLinkRunStatus,
+    cmpLinkAlarmLevels: cmpLinkAlarmLevels,
+    addCmpLinkOfflineStatusForDisplayLineColor: addCmpLinkOfflineStatusForDisplayLineColor
   };
 }
 ;

package/es/core/hooks/useGraphAlarmDisplay.js

@@ -88,12 +88,20 @@ export default function useGraphAlarmDisplay(options) {
       risks = _topo$alarm$useState.risks,
       relateTopoAlarm = _topo$alarm$useState.relateTopoAlarm;
 
-  var resources = topo.dataModel.useCis();
+  var oldResources = topo.dataModel.useCis(); // 分级拓扑下级链路特殊处理
 
   var _useCmpLinkAlarm = useCmpLinkAlarm({
-    topo: topo
+    topo: topo,
+    resources: oldResources,
+    graphLoaded: graphLoaded
   }),
-      cmpLinkAlarmLevels = _useCmpLinkAlarm.cmpLinkAlarmLevels;
+      cmpLinkAlarmLevels = _useCmpLinkAlarm.cmpLinkAlarmLevels,
+      cmpLinkRunStatus = _useCmpLinkAlarm.cmpLinkRunStatus,
+      addCmpLinkOfflineStatusForDisplayLineColor = _useCmpLinkAlarm.addCmpLinkOfflineStatusForDisplayLineColor;
+
+  var resources = useMemo(function () {
+    return addCmpLinkOfflineStatusForDisplayLineColor(oldResources, cmpLinkRunStatus);
+  }, [oldResources, cmpLinkRunStatus]); // ci告警级别
 
   var cisEventLevel = useMemo(function () {
     var levels = [].concat(alarmList || [], cmpLinkAlarmLevels, risks.map(function (item) {
@@ -106,19 +114,6 @@ export default function useGraphAlarmDisplay(options) {
     }));
     return getGraphCiElementAlarmLevels(resources, levels);
   }, [resources, alarmList, cmpLinkAlarmLevels, risks]);
-
-  function getCisEventLevel() {
-    var levels = [].concat(alarmList || [], cmpLinkAlarmLevels, risks.map(function (item) {
-      var _item$resourceId2;
-
-      return {
-        id: (_item$resourceId2 = item.resourceId) !== null && _item$resourceId2 !== void 0 ? _item$resourceId2 : item.ciId,
-        level: 5
-      };
-    }));
-    return getGraphCiElementAlarmLevels(resources, levels);
-  }
-
   useEffect(function () {
     showAlarm();
     showManageStatus({
@@ -127,7 +122,7 @@ export default function useGraphAlarmDisplay(options) {
       isEditMode: isEditMode,
       graphLoaded: graphLoaded,
       alarmSwitch: alarmSwitch,
-      cisEventLevel: getCisEventLevel()
+      cisEventLevel: cisEventLevel
     });
 
     function showAlarm() {
@@ -139,12 +134,11 @@ export default function useGraphAlarmDisplay(options) {
         // 告警静默
         topo.view.loadAlarm([]);
         return;
-      }
+      } // 关联拓扑告警
 
-      var finalAlarms = getCisEventLevel(); // 关联拓扑告警
 
       var relateTopoAlarms = getRelateTopoNodeAlarmLevels(topo, relateTopoAlarm);
-      var elementsAlarmLevels = [].concat(finalAlarms, relateTopoAlarms); // 将告警级别放入ht元素，便于测试
+      var elementsAlarmLevels = [].concat(cisEventLevel, relateTopoAlarms); // 将告警级别放入ht元素，便于测试
 
       getElements(topo.getDataModel()).filter(function (item) {
         return !!item.getTag();
@@ -171,5 +165,5 @@ export default function useGraphAlarmDisplay(options) {
         resources: resources
       });
     };
-  }, [graphLoaded, resources, alarmSwitch, alarmList, risks, relateTopoAlarm, cmpLinkAlarmLevels]);
+  }, [graphLoaded, resources, alarmSwitch, cisEventLevel, relateTopoAlarm]);
 }

package/es/core/hooks/useTopoEdit.js

@@ -95,10 +95,6 @@ var useTopoEdit = function useTopoEdit(params) {
             return topoDispatchers.setTopoType(TPL_TREE);
 
           case 7:
-            // 更新配置
-            // resourceConfig.updateConfig(config);
-            // 更新配置对应的资源、链路
-            // editDispatchers.fetchDataByConfig();
             topo.historyManager.endTransaction();
 
           case 8:

package/es/core/models/TopoApp.js

@@ -24,7 +24,7 @@ import ElementTagTipConfig from "./tagstips/ElementTagTipConfig";
 import SelectionModel from "./SelectionModel";
 import CiCache from "./cache/CiCache"; // eslint-disable-next-line no-undef
 
-var version = typeof "12.0.0-dev.26" === 'string' ? "12.0.0-dev.26" : null;
+var version = typeof "12.0.0-dev.27" === 'string' ? "12.0.0-dev.27" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/es/core/models/utils/linkUtils.js

@@ -2,8 +2,7 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _extends from "@babel/runtime/helpers/extends";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import keyBy from "lodash/keyBy";
-import _ from "lodash";
-import { queryCisByIds, queryModelAsset } from "../../services"; // 查询所有连线
+import _ from "lodash"; // 查询所有连线
 
 import { getEdges } from "../../../utils/htElementUtils";
 import CiTypeCache from "../cache/CiTypeCache";
@@ -32,7 +31,20 @@ export function isCrucialLink(link) {
  */
 
 export function isExitLink(link) {
-  return (link === null || link === void 0 ? void 0 : link.attributes) && !(link !== null && link !== void 0 && link.attributes["destination_id"]);
+  var _link$attributes;
+
+  return (link === null || link === void 0 ? void 0 : (_link$attributes = link.attributes) === null || _link$attributes === void 0 ? void 0 : _link$attributes.destination_type) === "ip";
+}
+/**
+ * 是否聚合链路
+ * @param {*} link 
+ * @returns 
+ */
+
+export function isAggLink(link) {
+  var _link$attributes2, _link$attributes3;
+
+  return (link === null || link === void 0 ? void 0 : (_link$attributes2 = link.attributes) === null || _link$attributes2 === void 0 ? void 0 : _link$attributes2.destination_type) === "network.agg_interface" && (link === null || link === void 0 ? void 0 : (_link$attributes3 = link.attributes) === null || _link$attributes3 === void 0 ? void 0 : _link$attributes3.source_type) === "network.agg_interface";
 }
 export function mergeLinksData(links, linkCis, nodes, interfaceCiMap, interfaceDoc) {
   var linkCiMap = keyBy(links, "id");
@@ -83,7 +95,7 @@ function _getLinksDetail() {
     return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          if (!(!links || !links.length)) {
+          if (links !== null && links !== void 0 && links.length) {
             _context.next = 2;
             break;
           }
@@ -91,9 +103,6 @@ function _getLinksDetail() {
           return _context.abrupt("return", []);
 
         case 2:
-          // const linkCis = await topoService.relation.batchQueryRelation(
-          //   links.map((link) => link.id)
-          // );
           linkCis = links;
           interfaceIds = [].concat(linkCis.map(function (item) {
             return item.attributes.source_id;
@@ -171,17 +180,15 @@ export var showLinkByConfig = function showLinkByConfig(props) {
       if (showType === 1 || showType === true) {
         // 单链路全部显示
         // console.log("单链路全部显示", edge);
-        edge.s("2d.visible", true);
+        edge.s("x.visible", true);
       } else {
-        var _d$attributes, _d$attributes2;
-
         var d = topo.dataModel.getDataById(edge.getTag()); // 判断是否聚合链路
 
-        if ((d === null || d === void 0 ? void 0 : (_d$attributes = d.attributes) === null || _d$attributes === void 0 ? void 0 : _d$attributes.destination_type) === "network.agg_interface" && (d === null || d === void 0 ? void 0 : (_d$attributes2 = d.attributes) === null || _d$attributes2 === void 0 ? void 0 : _d$attributes2.source_type) === "network.agg_interface") {
-          edge.s("2d.visible", showAgg);
+        if (isAggLink(d)) {
+          edge.s("x.visible", showAgg);
         } else {
           // console.log("edge", edge, d, showAgg);
-          edge.s("2d.visible", showPhy);
+          edge.s("x.visible", showPhy);
         }
       }
     });

package/es/core/utils/metricUtil.js

@@ -1,3 +1,4 @@
+import _extends from "@babel/runtime/helpers/extends";
 import { metricValueFormat } from '@riil-frontend/utils';
 import DictCache from "../models/cache/DictCache";
 /**
@@ -15,16 +16,19 @@ export function formatMetric(val, metricModel) {
   if (metricModel) {
     var _result$value;
 
-    // 分级字典特殊处理
-    if (metricModel.dict && !DictCache.getDictObject()[metricModel.code]) {
-      val = metricModel.dict[val];
+    var dictObject = _extends({}, DictCache.getDictObject()); // 分级字典特殊处理
+
+
+    if (metricModel.dict) {
+      // val = metricModel.dict[val]
+      dictObject[metricModel.code] = metricModel.dict;
     }
 
     var result = metricValueFormat({
       value: val,
       dataType: metricModel.dataType,
       changeValue: metricModel.changeValue,
-      dict: DictCache.getDictObject(),
+      dict: dictObject,
       unit: metricModel.unit,
       code: metricModel.code
     });

package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js

@@ -15,6 +15,7 @@ import moment from 'moment';
 import React, { useEffect, useMemo, useState } from 'react';
 import { rlog } from '@riil-frontend/component-topology-utils/lib/rlog';
 import Link from "../../../../../../../components/Link";
+import { getHistory } from '@riil-frontend/component-topology-utils';
 import { queryCisByIds, commonQueryCiData } from "../../../../../../services";
 import service from "../../../../../../services/overview";
 import BaseInfoBlock from "./BaseInfoBlock";
@@ -153,7 +154,13 @@ export default function ResourceOverview(props) {
         window.topo_overview_metric_timer = null;
       }
     };
-  }, []); // 跳转前调用关闭操作
+  }, []);
+
+  var jumpTo = function jumpTo(url) {
+    getHistory.push(url);
+    onClose();
+  }; // 跳转前调用关闭操作
+
 
   function onClose() {
     isAppTopo && resourceOverviewProps.onClose && resourceOverviewProps.onClose();
@@ -332,14 +339,13 @@ export default function ResourceOverview(props) {
       return /*#__PURE__*/React.createElement("div", {
         className: styles['alarm-title'],
         title: value,
-        onClick: onClose
+        onClick: jumpTo(record.link)
       }, /*#__PURE__*/React.createElement(_Icon, {
         type: record.icon,
         size: "xs",
         className: styles['alarm-color-icon'] + " " + record.className
-      }), /*#__PURE__*/React.createElement(Link, {
-        className: styles.link,
-        to: formatUrl(record.link)
+      }), /*#__PURE__*/React.createElement("span", {
+        className: styles.link
       }, value));
     }
   }, {