@riil-frontend/component-topology 3.1.6 → 3.1.9

package/lib/core/models/AttributeMetricDisplay.js

@@ -52,8 +52,10 @@ var filterByPermission = function filterByPermission(resource, items) {
 
 var AttributeMetricDisplay = /*#__PURE__*/function () {
   function AttributeMetricDisplay(topo) {
+    var _this$topo$options$ta;
+
     this.topo = topo;
-    var ExtElementTagTipBuilder = this.topo.options.ExtElementTagTipBuilder;
+    var ExtElementTagTipBuilder = (_this$topo$options$ta = this.topo.options.tagTip) === null || _this$topo$options$ta === void 0 ? void 0 : _this$topo$options$ta.ExtElementTagTipBuilder;
 
     if (ExtElementTagTipBuilder) {
       this.extElementTagTipBuilder = new ExtElementTagTipBuilder(this);
@@ -253,10 +255,12 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
       return filterUnExistedFields(items, ciTypeMeta);
     }
 
-    var defaultLinkTagTipConfig = this.topo.options.defaultLinkTagTipConfig;
+    var tagTipOptions = this.topo.options.tagTip;
+    var defaultLinkTagConfig = tagTipOptions !== null && tagTipOptions !== void 0 && tagTipOptions.getDefaultLinkTagConfig ? tagTipOptions === null || tagTipOptions === void 0 ? void 0 : tagTipOptions.getDefaultLinkTagConfig(link) : null;
+    var defaultLinkTipConfig = tagTipOptions !== null && tagTipOptions !== void 0 && tagTipOptions.getDefaultLinkTipConfig ? tagTipOptions === null || tagTipOptions === void 0 ? void 0 : tagTipOptions.getDefaultLinkTipConfig(link) : null;
     return {
-      tags: getItems(linkTag || (defaultLinkTagTipConfig === null || defaultLinkTagTipConfig === void 0 ? void 0 : defaultLinkTagTipConfig.tag)),
-      tips: getItems(linkTip || (defaultLinkTagTipConfig === null || defaultLinkTagTipConfig === void 0 ? void 0 : defaultLinkTagTipConfig.tip))
+      tags: getItems(linkTag || defaultLinkTagConfig),
+      tips: getItems(linkTip || defaultLinkTipConfig)
     };
   };
 

package/lib/core/models/TopoApp.js

@@ -48,7 +48,7 @@ var _PluginManager = _interopRequireDefault(require("./PluginManager"));
 var _topoFactory = _interopRequireDefault(require("./topoFactory"));
 
 // eslint-disable-next-line no-undef
-var version = typeof "3.1.6" === 'string' ? "3.1.6" : null;
+var version = typeof "3.1.9" === 'string' ? "3.1.9" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/lib/core/viewer/components/plugins/{BaseInfo/index.js → ResourceDetail/ResourceDetail.js}

@@ -19,18 +19,20 @@ var _menuButton = _interopRequireDefault(require("@alifd/next/lib/menu-button"))
 
 var _search = _interopRequireDefault(require("@alifd/next/lib/search"));
 
-var _react = _interopRequireWildcard(require("react"));
+var _componentTopologyGraph = require("@riil-frontend/component-topology-graph");
 
 var _utils = require("@riil-frontend/utils");
 
-var _componentTopologyGraph = require("@riil-frontend/component-topology-graph");
+var _react = _interopRequireWildcard(require("react"));
 
-var _overview = _interopRequireDefault(require("../../../../services/overview"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _indexModule = _interopRequireDefault(require("./index.module.scss"));
+var _overview = _interopRequireDefault(require("../../../../services/overview"));
 
 var _ResourceOverview = _interopRequireDefault(require("./components/ResourceOverview"));
 
+var _indexModule = _interopRequireDefault(require("./index.module.scss"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -95,8 +97,9 @@ function Title(_ref) {
 } // 基本信息
 
 
-function BaseInfo(props) {
-  var topo = props.topo;
+function ResourceDetail(props) {
+  var topo = props.topo,
+      canShow = props.canShow;
 
   var _topo$store$useModel = topo.store.useModel('topoBaseInfoOverview'),
       topoState = _topo$store$useModel[0],
@@ -212,8 +215,6 @@ function BaseInfo(props) {
   }
 
   function init(data, targetType) {
-    var _topo$options$resourc;
-
     console.log('初始化基本信息', data, targetType);
     var id = data.id,
         name = data.name,
@@ -222,11 +223,15 @@ function BaseInfo(props) {
         ciName = data.ciName,
         operation = data.operation; // 仅展示资源和链路的概览
 
-    if (!['node', 'link', 'linkGroup'].includes(type)) return; // 应用拓扑中没有链路详情
-
-    if ((_topo$options$resourc = topo.options.resourceOverviewDrawer) !== null && _topo$options$resourc !== void 0 && _topo$options$resourc.getData && type === 'link') return; // 没有权限不显示
+    if (!['node', 'link', 'linkGroup'].includes(type)) return; // 没有权限不显示
 
     if (!operation) return;
+    var htElement = topo.getDataModel().getDataByTag(id);
+
+    if (!canShow(htElement)) {
+      return;
+    }
+
     setActiveData({
       id: id,
       name: name,
@@ -296,5 +301,13 @@ function BaseInfo(props) {
   }))))));
 }
 
-var _default = BaseInfo;
+ResourceDetail.propTypes = {
+  canShow: _propTypes["default"].func
+};
+ResourceDetail.defaultProps = {
+  canShow: function canShow(htElement) {
+    return true;
+  }
+};
+var _default = ResourceDetail;
 exports["default"] = _default;

package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetailPlugin.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ResourceDetail = _interopRequireDefault(require("./ResourceDetail"));
+
+function ResourceDetailPlugin(props) {
+  var viewerProps = props.viewerProps;
+  var resourceDetailProps = viewerProps === null || viewerProps === void 0 ? void 0 : viewerProps.resourceDetailProps;
+  return /*#__PURE__*/_react["default"].createElement(_ResourceDetail["default"], (0, _extends2["default"])({}, props, resourceDetailProps));
+}
+
+var _default = ResourceDetailPlugin;
+exports["default"] = _default;

package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/BaseInfo.js

@@ -0,0 +1,141 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = BaseInfo;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactRouterDom = require("react-router-dom");
+
+var _indexModule = _interopRequireDefault(require("./index.module.scss"));
+
+// url 处理，UICBB 的地址需截取前缀
+function formatUrl(url) {
+  var _window, _window$location;
+
+  var prefix = '/default/pagecenter';
+
+  if (((_window = window) === null || _window === void 0 ? void 0 : (_window$location = _window.location) === null || _window$location === void 0 ? void 0 : _window$location.pathname.indexOf(prefix)) === 0 && (url === null || url === void 0 ? void 0 : url.indexOf(prefix)) === 0) {
+    return url.split(prefix)[1];
+  } else {
+    return url;
+  }
+}
+
+function AttributeItem(props) {
+  var style = props.style,
+      key = props.key,
+      label = props.label,
+      contentTitle = props.contentTitle,
+      children = props.children;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: _indexModule["default"].item,
+    style: style || {},
+    key: key
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: _indexModule["default"].label
+  }, label), /*#__PURE__*/_react["default"].createElement("span", {
+    className: _indexModule["default"].content,
+    title: contentTitle
+  }, children));
+}
+
+function BaseInfoContent(props) {
+  var _itemCols$type;
+
+  var topo = props.topo,
+      type = props.type,
+      data = props.data;
+  var itemCols = {
+    node: [{
+      label: '资源名称：',
+      objKey: 'resource',
+      render: function render(valueData, key) {
+        var display_name = valueData.display_name,
+            link = valueData.link;
+        return /*#__PURE__*/_react["default"].createElement(AttributeItem, {
+          key: key,
+          label: "\u8D44\u6E90\u540D\u79F0\uFF1A",
+          contentTitle: display_name
+        }, valueData ? /*#__PURE__*/_react["default"].createElement(_reactRouterDom.Link, {
+          className: _indexModule["default"].link,
+          to: formatUrl(link)
+        }, display_name || '-') : '-');
+      }
+    }, {
+      label: 'IP地址：',
+      objKey: 'ipv4_address'
+    }, {
+      label: '资产编号：',
+      objKey: 'asset_number'
+    }, {
+      label: '资源类型：',
+      objKey: 'ciName'
+    }, {
+      label: '资源位置：',
+      objKey: 'res_address'
+    } // {
+    //   label: '负责人：',
+    //   objKey: 'principal'
+    // },
+    ],
+    link: [{
+      label: '链路带宽：',
+      objKey: 'rated_bandwidth',
+      style: {
+        width: '100%'
+      }
+    }, {
+      label: '源IP地址：',
+      objKey: 'source_ipv4'
+    }, {
+      label: '目的IP地址：',
+      objKey: 'destination_ipv4'
+    }, {
+      label: '源端口：',
+      objKey: 'source_Interface'
+    }, {
+      label: '目的端口：',
+      objKey: 'destination_Interface'
+    }]
+  };
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (_itemCols$type = itemCols[type]) === null || _itemCols$type === void 0 ? void 0 : _itemCols$type.map(function (_ref, key) {
+    var label = _ref.label,
+        objKey = _ref.objKey,
+        style = _ref.style,
+        render = _ref.render;
+    return data[objKey] === false ? '' : render ? render(data[objKey], key) : /*#__PURE__*/_react["default"].createElement(AttributeItem, {
+      key: key,
+      label: label,
+      style: style || {},
+      contentTitle: data[objKey]
+    }, data[objKey] || '-');
+  }));
+} // 基本信息
+
+
+function BaseInfo(props) {
+  var topo = props.topo,
+      type = props.type,
+      data = props.data,
+      baseInfo = props.baseInfo,
+      renderContent = props.renderContent;
+  var content = renderContent ? renderContent({
+    type: type,
+    data: data,
+    AttributeItem: AttributeItem
+  }) : null;
+
+  if (!content) {
+    content = /*#__PURE__*/_react["default"].createElement(BaseInfoContent, {
+      type: type,
+      data: baseInfo
+    });
+  }
+
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: _indexModule["default"]['base-info']
+  }, content);
+}

package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/BaseInfoBlock.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = BaseInfoBlock;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _BaseInfo = _interopRequireDefault(require("./BaseInfo"));
+
+var _BlockBox = _interopRequireDefault(require("./BlockBox"));
+
+var _SingleResourceStrategyLink = _interopRequireDefault(require("./SingleResourceStrategyLink"));
+
+function BaseInfoBlock(props) {
+  var topo = props.topo,
+      data = props.data,
+      ciTypeMeta = props.ciTypeMeta,
+      headerExtra = props.headerExtra,
+      renderContent = props.renderContent,
+      baseInfo = props.baseInfo;
+  var id = data.id,
+      ciType = data.ciType,
+      type = data.type,
+      name = data.name;
+  return /*#__PURE__*/_react["default"].createElement(_BlockBox["default"], {
+    headerTitle: "\u57FA\u672C\u4FE1\u606F",
+    headerExtra: headerExtra ? headerExtra(props) : ciType === 'network_link' && /*#__PURE__*/_react["default"].createElement(_SingleResourceStrategyLink["default"], {
+      id: id,
+      ciType: ciType,
+      name: name
+    })
+  }, /*#__PURE__*/_react["default"].createElement(_BaseInfo["default"], {
+    topo: topo,
+    type: type,
+    data: data,
+    ciTypeMeta: ciTypeMeta,
+    renderContent: renderContent,
+    baseInfo: baseInfo
+  }));
+}

package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverviewMetric.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = ResourceOverviewMetric;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _utils = require("@riil-frontend/utils");
+
+var _indexModule = _interopRequireDefault(require("./index.module.scss"));
+
+// 关键指标
+function ResourceOverviewMetric(props) {
+  var topo = props.topo,
+      type = props.type,
+      data = props.data;
+
+  function formatValue(itemData) {
+    var format = (0, _utils.metricValueFormat)({
+      value: itemData.value,
+      dataType: itemData.dataType,
+      dict: topo.dictCache.getDictObject(),
+      unit: itemData.unit,
+      code: itemData.code
+    });
+    return format.value + " " + (format.value === '-' ? '' : format.unit);
+  }
+
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: _indexModule["default"].indicator
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: _indexModule["default"].row
+  }, data.slice(0, 3).map(function (item) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item,
+      key: item.code
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, formatValue(item)), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, item.name));
+  })), type === 'node' ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: _indexModule["default"].row
+  }, data.slice(3, 6).map(function (item) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item,
+      key: item.code
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, formatValue(item)), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, item.name));
+  })) : '');
+}

package/lib/core/viewer/components/plugins/{BaseInfo → ResourceDetail}/components/ResourceOverview/SingleResourceStrategyLink.js

@@ -12,9 +12,11 @@ var _reactRouterDom = require("react-router-dom");
 function SingleResourceStrategyLink(props) {
   var id = props.id,
       ciType = props.ciType,
-      name = props.name;
+      name = props.name,
+      _props$label = props.label,
+      label = _props$label === void 0 ? '监控策略' : _props$label;
   var url = "/default/singleResourceStrategy/" + id + "?title=" + encodeURIComponent(name) + "-\u76D1\u63A7\u914D\u7F6E&ciId=" + id + "&ciType=" + ciType + "&ciName=" + encodeURIComponent(name);
   return /*#__PURE__*/_react["default"].createElement(_reactRouterDom.Link, {
     to: url
-  }, "\u76D1\u63A7\u7B56\u7565");
+  }, label);
 }