@riil-frontend/component-topology 6.0.20 → 7.0.0-dev.2

package/es/core/components/TopoView/topoView.js

@@ -149,7 +149,19 @@ var Topology = function Topology(props) {
     topo.selectionModel.init();
     topoDispatchers.update({
       graphLoaded: true
-    });
+    }); // url选中元素
+
+    var _topo$store$getModelS = topo.store.getModelState('selection'),
+        initSelectionId = _topo$store$getModelS.initSelectionId;
+
+    if (initSelectionId) {
+      var ele = topo.getHtTopo().getGraphView().dm().getDataByTag(initSelectionId);
+      topo.getHtTopo().getGraphView().sm().setSelection([ele]);
+      var selectionDispatchers = topo.store.getModelDispatchers('selection');
+      selectionDispatchers.update({
+        initSelectionId: null
+      });
+    }
 
     if (onLoaded) {
       onLoaded(topoData);

package/es/core/editor/components/Toolbar/widgets/FontStyleButton.js

@@ -52,16 +52,8 @@ function FontStyleButton(props) {
     underline: underline
   })),
       value = _useState2[0],
-      setValue = _useState2[1]; // 选中的元素
+      setValue = _useState2[1];
 
-
-  var selection = topo.selectionModel.useHtSelection();
-  useEffect(function () {
-    var containText = selection.filter(function (ele) {
-      return isText(ele);
-    }).length;
-    setDisabled(!containText);
-  }, [selection]);
   useEffect(function () {
     setValue(buildValue({
       bold: bold,

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/edgeTag.js

@@ -4,21 +4,20 @@ var _excluded = ["color", "background", "opacity", "bold", "italic"];
 import fontStyleUtil from "../../../../../../settings/common/text/fontStyleUtil";
 import { formatBackgroundRgbaColor, parseBackground, parseColor } from "../colorUtil";
 export function getTextStyle(element) {
-  var underline = null;
   return _extends({
     color: parseColor(element.a('edge.tag.color')),
     fontFamily: element.a('edge.tag.fontFamily') || '微软雅黑',
-    underline: underline
+    bold: !!element.a('edge.tag.fontBold'),
+    itatic: !!element.a('edge.tag.fontItalic')
   }, parseBackground(element.a('edge.tag.background')));
 }
 export function setTextStyle(element, style, topo) {
-  var _fontStyleUtil$remove = fontStyleUtil.removeBoldItalic(style),
-      color = _fontStyleUtil$remove.color,
-      background = _fontStyleUtil$remove.background,
-      opacity = _fontStyleUtil$remove.opacity,
-      bold = _fontStyleUtil$remove.bold,
-      italic = _fontStyleUtil$remove.italic,
-      otherStyle = _objectWithoutPropertiesLoose(_fontStyleUtil$remove, _excluded);
+  var color = style.color,
+      background = style.background,
+      opacity = style.opacity,
+      bold = style.bold,
+      italic = style.italic,
+      otherStyle = _objectWithoutPropertiesLoose(style, _excluded);
 
   var tagStyle = _extends({}, otherStyle);
 
@@ -55,11 +54,11 @@ export function setTextStyle(element, style, topo) {
  */
 
 export function getEnabledFields(element) {
-  return ['fontFamily', 'color', 'background', 'opacity'];
+  return ['fontFamily', 'color', 'background', 'opacity', 'fontSize', 'bold', 'italic'];
 }
 export function getFieldDisabled(element) {
   return {
-    fontSize: true
+    fontSize: false
   };
 }
 export default {

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/nodeTag.js

@@ -4,20 +4,19 @@ var _excluded = ["color", "background", "opacity", "bold", "italic"];
 import fontStyleUtil from "../../../../../../settings/common/text/fontStyleUtil";
 import { formatBackgroundRgbaColor, parseBackground, parseColor } from "../colorUtil";
 export function getTextStyle(element) {
-  var underline = null;
+  var underline = !!element.a('node.tag.fontUnderline');
   return _extends({
     color: parseColor(element.a('ht.color')),
     underline: underline
   }, fontStyleUtil.toMap(element.a('ht.font')), parseBackground(element.a('ht.background')));
 }
 export function setTextStyle(element, style, topo) {
-  var _fontStyleUtil$remove = fontStyleUtil.removeBoldItalic(style),
-      color = _fontStyleUtil$remove.color,
-      background = _fontStyleUtil$remove.background,
-      opacity = _fontStyleUtil$remove.opacity,
-      bold = _fontStyleUtil$remove.bold,
-      italic = _fontStyleUtil$remove.italic,
-      otherStyle = _objectWithoutPropertiesLoose(_fontStyleUtil$remove, _excluded);
+  var color = style.color,
+      background = style.background,
+      opacity = style.opacity,
+      bold = style.bold,
+      italic = style.italic,
+      otherStyle = _objectWithoutPropertiesLoose(style, _excluded);
 
   var tagStyle = _extends({}, otherStyle);
 
@@ -48,7 +47,7 @@ export function setTextStyle(element, style, topo) {
   }
 }
 export function getEnabledFields(element) {
-  return ['fontFamily', 'color', 'background', 'opacity'];
+  return ['fontFamily', 'color', 'background', 'opacity', 'fontSize', 'bold', 'italic', 'underline'];
 }
 /**
  * 获得字段是否禁用
@@ -59,10 +58,10 @@ export function getEnabledFields(element) {
 
 export function getFieldDisabled(element) {
   return {
-    fontSize: true,
-    bold: true,
-    italic: true,
-    underline: true
+    fontSize: false,
+    bold: false,
+    italic: false,
+    underline: false
   };
 }
 export default {

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/GlobalTagStyleSetting.js

@@ -4,10 +4,10 @@ var _excluded = ["Component"];
 import React, { useMemo } from 'react';
 import { setGlobalTagStyle, useValues } from "./globalTag";
 var fieldDisabled = {
-  fontSize: true,
-  bold: true,
-  italic: true,
-  underline: true
+  fontSize: false,
+  bold: false,
+  italic: false,
+  underline: false
 };
 
 function GlobalTagStyleSetting(props) {

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/globalTag.js

@@ -1,7 +1,7 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/extends";
 var _excluded = ["color", "background", "opacity"],
-    _excluded2 = ["color", "background", "opacity", "bold", "italic"];
+    _excluded2 = ["color", "background", "opacity", "bold", "italic", "underline"];
 import fontStyleUtil from "../../../../../settings/common/text/fontStyleUtil";
 import { formatBackgroundRgbaColor, parseBackground, formatRgbaColor } from "../ElementTextStyleSetting/colorUtil";
 var defaultStyle = {
@@ -15,7 +15,10 @@ export function useValues(topo) {
   return _extends({
     color: (nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.color) || defaultStyle.color,
     fontFamily: (nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontFamily) || defaultStyle.fontFamily,
-    fontSize: nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontSize
+    fontSize: nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontSize,
+    bold: nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.bold,
+    italic: nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.italic,
+    underline: nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.underline
   }, parseBackground(nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.background));
 }
 export var setGlobalTagStyle = function setGlobalTagStyle(topo, styleData) {
@@ -61,13 +64,13 @@ function buildStyle(styleData, prevTagStyle) {
 }
 
 function buildGlobalStyle(styleData) {
-  var _fontStyleUtil$remove = fontStyleUtil.removeBoldItalic(styleData),
-      color = _fontStyleUtil$remove.color,
-      background = _fontStyleUtil$remove.background,
-      opacity = _fontStyleUtil$remove.opacity,
-      bold = _fontStyleUtil$remove.bold,
-      italic = _fontStyleUtil$remove.italic,
-      otherStyle = _objectWithoutPropertiesLoose(_fontStyleUtil$remove, _excluded2);
+  var color = styleData.color,
+      background = styleData.background,
+      opacity = styleData.opacity,
+      bold = styleData.bold,
+      italic = styleData.italic,
+      underline = styleData.underline,
+      otherStyle = _objectWithoutPropertiesLoose(styleData, _excluded2);
 
   var tagStyle = _extends({}, otherStyle);
 
@@ -83,6 +86,10 @@ function buildGlobalStyle(styleData) {
     tagStyle.fontItalic = italic;
   }
 
+  if ('underline' in styleData) {
+    tagStyle.fontUnderline = underline;
+  }
+
   if ('background' in styleData) {
     // 背景颜色
     tagStyle.background = formatRgbaColor(background);

package/es/core/editor/hooks/useUpdateHtTopoDefaultTagStyle.js

@@ -13,12 +13,12 @@ function useUpdateHtTopoDefaultTagStyle(props) {
   var nodeLabelStyle = displayConfig.nodeLabelStyle,
       defaultEdgeLabelStyle = displayConfig.defaultEdgeLabelStyle;
   useEffect(function () {
-    if (nodeLabelStyle) {
+    if (nodeLabelStyle && topo.getHtTopo().setDefaultNodeLabelStyle) {
       topo.getHtTopo().setDefaultNodeLabelStyle(nodeLabelStyle);
     }
   }, [nodeLabelStyle]);
   useEffect(function () {
-    if (defaultEdgeLabelStyle) {
+    if (defaultEdgeLabelStyle && topo.getHtTopo().setDefaultEdgeTagStyle) {
       topo.getHtTopo().setDefaultEdgeTagStyle(defaultEdgeLabelStyle);
     }
   }, [defaultEdgeLabelStyle]);

package/es/core/models/TopoApp.js

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

package/es/core/store/coreModels.js

@@ -11,6 +11,7 @@ import selection from "./models/selection"; // 显示模式
 
 import topoAlarm from "./models/topoAlarm";
 import displayConfig from "./models/displayConfig";
+import resourceDetail from "./models/viewer/resourceDetail";
 import topoBaseInfoOverview from "./models/topoBaseInfoOverview";
 import lock from "./models/viewer/lock";
 export default {
@@ -26,6 +27,7 @@ export default {
   // 显示模式
   topoAlarm: topoAlarm,
   displayConfig: displayConfig,
+  resourceDetail: resourceDetail,
   topoBaseInfoOverview: topoBaseInfoOverview,
   lock: lock
 };

package/es/core/store/models/selection.js

@@ -10,7 +10,9 @@ export default {
   // 定义 model 的初始 state
   state: {
     selection: [],
-    selectionIds: []
+    selectionIds: [],
+    initSelectionId: null // 初始化选中元素
+
   },
   // 定义改变该模型状态的纯函数
   reducers: {

package/es/core/store/models/viewer/resourceDetail.js

@@ -0,0 +1,31 @@
+import _extends from "@babel/runtime/helpers/extends";
+
+/**
+ * 资源概览
+ */
+import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+export default {
+  // 定义 model 的初始 state
+  state: {
+    visible: false,
+    id: null // 资源id
+
+  },
+  // 定义改变该模型状态的纯函数
+  reducers: {
+    update: function update(prevState, payload) {
+      return _extends({}, prevState, payload);
+    },
+    reset: function reset(prevState, payload) {
+      return {
+        visible: false,
+        id: null // 资源id
+
+      };
+    }
+  },
+  // 定义处理该模型副作用的函数
+  effects: function effects(dispatch) {
+    return {};
+  }
+};

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

@@ -11,10 +11,7 @@ export default function ResourceDetail(props) {
   var topo = props.topo,
       userId = props.userId,
       activeData = props.activeData,
-      resourceData = props.resourceData; // {/* <Tab.Item title="操作" key="2">操作</Tab.Item>
-  //     <Tab.Item title="网络信息表" key="3">网络信息表</Tab.Item>
-  //     <Tab.Item title="Web工作台" key="4">Web工作台</Tab.Item> */}
-
+      resourceData = props.resourceData;
   var tabBodys = [{
     title: '资源概览',
     content: /*#__PURE__*/React.createElement(ResourceOverview, _extends({}, props, activeData, {
@@ -33,7 +30,7 @@ export default function ResourceDetail(props) {
       data: resourceData,
       topo: topo
     }),
-    visible: activeData.type === 'node' && !!((_topo$viewProps = topo.viewProps) !== null && _topo$viewProps !== void 0 && (_topo$viewProps$topoC = _topo$viewProps.topoContext) !== null && _topo$viewProps$topoC !== void 0 && _topo$viewProps$topoC.isNetworkTopo)
+    visible: resourceData.type === 'node' && !!((_topo$viewProps = topo.viewProps) !== null && _topo$viewProps !== void 0 && (_topo$viewProps$topoC = _topo$viewProps.topoContext) !== null && _topo$viewProps$topoC !== void 0 && _topo$viewProps$topoC.isNetworkTopo)
   }].filter(function (item) {
     return item.visible !== false;
   });

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

@@ -4,19 +4,16 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { TopoEvent } from '@riil-frontend/component-topology-graph';
 import PropTypes from 'prop-types';
-import React, { useEffect, useId, useState } from 'react';
-import Tab from "../../../../../components/FullheightTab";
+import React, { useEffect, useMemo, useState } from 'react';
 import service from "../../../../services/overview";
-import ClusterMemberTable from "./components/ClusterMemberTable";
 import Title from "./components/DrawerTitle";
-import ResourceOverview from "./components/ResourceOverview";
-import WebConsole from "./components/WebConsole/WebConsoleContainer";
 import styles from "./index.module.scss";
 import ResourceDetail from "./ResourceDetail"; // 基本信息
 
 function ResourceDetailDrawer(props) {
   var topo = props.topo,
-      canShow = props.canShow;
+      canShow = props.canShow,
+      viewerProps = props.viewerProps;
 
   var _topo$store$useModel = topo.store.useModel('topoBaseInfoOverview'),
       topoState = _topo$store$useModel[0],
@@ -29,26 +26,35 @@ function ResourceDetailDrawer(props) {
   var _topo$store$useModelS2 = topo.store.useModelState("lock"),
       lock = _topo$store$useModelS2.lock;
 
-  var _useState = useState(false),
-      visible = _useState[0],
-      setVisible = _useState[1];
-
-  var _useState2 = useState({
-    id: '',
-    name: '',
-    type: '',
-    // 类型： node、link
-    ciType: '',
-    ciName: ''
-  }),
-      activeData = _useState2[0],
-      setActiveData = _useState2[1];
-
-  var _useState3 = useState(''),
-      userId = _useState3[0],
-      setUserId = _useState3[1];
-
-  var resourceData = topo.dataModel.useDataById(activeData.id);
+  var _topo$store$useModel2 = topo.store.useModel('resourceDetail'),
+      resourceDetailState = _topo$store$useModel2[0],
+      resourceDetailDispatchers = _topo$store$useModel2[1];
+
+  var visible = resourceDetailState.visible,
+      id = resourceDetailState.id;
+  var resourceData = topo.dataModel.useDataById(id);
+  var activeData = useMemo(function () {
+    return resourceData ? {
+      id: resourceData.id,
+      name: resourceData.name,
+      type: resourceData.type === 'node' ? 'node' : 'link',
+      // 类型： node、link
+      ciType: resourceData.ciType,
+      ciName: resourceData.ciName
+    } : {
+      id: '',
+      name: '',
+      type: '',
+      // 类型： node、link
+      ciType: '',
+      ciName: ''
+    };
+  }, [resourceData]);
+
+  var _useState = useState(''),
+      userId = _useState[0],
+      setUserId = _useState[1];
+
   useEffect(function () {
     var notifier = topo.view.topoClient.notifier;
     notifier.on(TopoEvent.EVENT_DOUBLE_CLICK, openOverview);
@@ -62,10 +68,17 @@ function ResourceDetailDrawer(props) {
         metricCodes: []
       });
     };
-  }, [lock]); // 解决切换拓扑图隐藏概览
+  }, [lock]);
+  useEffect(function () {
+    return function () {
+      resourceDetailDispatchers.reset();
+    };
+  }, []); // 解决切换拓扑图隐藏概览
 
   useEffect(function () {
-    setVisible(false); // TODO 其他数据重置
+    resourceDetailDispatchers.update({
+      visible: false
+    }); // TODO 其他数据重置
   }, [topoId]);
 
   function getUser() {
@@ -164,28 +177,31 @@ function ResourceDetailDrawer(props) {
 
     if (!canShow(htElement)) {
       return;
-    }
+    } // 显示隐藏
+
 
-    setActiveData({
-      id: id,
-      name: name,
-      type: {
-        linkGroup: 'link',
-        group: 'node'
-      }[type] || type,
-      ciType: ciType,
-      ciName: ciName
-    }); // 显示隐藏
+    if (targetType === 'doubleClick') {
+      resourceDetailDispatchers.update({
+        visible: true,
+        id: id
+      });
+    } else {
+      resourceDetailDispatchers.update({
+        id: id
+      });
+    } // userId
 
-    targetType === 'doubleClick' && setVisible(true); // userId
 
     getUser();
   }
 
   var renderContent = function renderContent() {
-    return /*#__PURE__*/React.createElement(ResourceDetail, _extends({}, props, {
+    var _viewerProps$resource;
+
+    var ResourceDetailWidget = (viewerProps === null || viewerProps === void 0 ? void 0 : (_viewerProps$resource = viewerProps.resourceDetailProps) === null || _viewerProps$resource === void 0 ? void 0 : _viewerProps$resource.ResourceDetailWidget) || ResourceDetail;
+    return /*#__PURE__*/React.createElement(ResourceDetailWidget, _extends({}, props, {
       topo: topo,
-      userId: useId,
+      userId: userId,
       activeData: activeData,
       resourceData: resourceData
     }));
@@ -202,7 +218,9 @@ function ResourceDetailDrawer(props) {
     width: 580,
     hasMask: false,
     onClose: function onClose() {
-      return setVisible(false);
+      return resourceDetailDispatchers.update({
+        visible: false
+      });
     }
   }, visible && resourceData && renderContent()));
 }

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

@@ -0,0 +1,136 @@
+import _Message from "@alifd/next/es/message";
+import _Table from "@alifd/next/es/table";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _Button from "@alifd/next/es/button";
+import _Icon from "@alifd/next/es/icon";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React from 'react';
+import moment from 'moment';
+import BlockBox from "./BlockBox";
+import Link from "../../../../../../../components/Link";
+import service from "../../../../../../services/overview";
+import styles from "./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 EventsCard(props) {
+  var alarmRiskList = props.alarmRiskList,
+      closeDetailDrawer = props.closeDetailDrawer,
+      onHandleAlarm = props.onHandleAlarm; // 告警table列配置
+
+  var columns = [{
+    title: '描述',
+    dataIndex: 'title',
+    key: 'title',
+    cell: function cell(value, index, record) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: styles['alarm-title'],
+        title: value,
+        onClick: closeDetailDrawer
+      }, /*#__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)
+      }, value));
+    }
+  }, {
+    title: '时间',
+    dataIndex: 'time',
+    key: 'time',
+    width: 144,
+    cell: function cell(value, index, record) {
+      return /*#__PURE__*/React.createElement("div", {
+        title: moment(value).format('YYYY-MM-DD HH:mm:ss')
+      }, moment(value).format('YYYY-MM-DD HH:mm:ss'));
+    }
+  }, {
+    title: '操作',
+    dataIndex: 'status',
+    key: 'status',
+    width: 64,
+    cell: function cell(status, index, record) {
+      if (record.type === 'alarm') {
+        return status === 'toDeal' ? /*#__PURE__*/React.createElement(_Button, {
+          text: true,
+          type: "primary",
+          onClick: function onClick() {
+            return alarmRiskOperation(record.type, record.params);
+          }
+        }, "\u53D7\u7406") : /*#__PURE__*/React.createElement(_Button, {
+          disabled: true,
+          text: true,
+          type: "primary"
+        }, "\u5DF2\u53D7\u7406");
+      } else {
+        // return <Button text type="primary" onClick={() => alarmRiskOperation(record.type, record)}>受理</Button>
+        return '';
+      }
+    }
+  }]; // 告警/风险 操作 (受理)
+
+  function alarmRiskOperation(_x, _x2) {
+    return _alarmRiskOperation.apply(this, arguments);
+  }
+
+  function _alarmRiskOperation() {
+    _alarmRiskOperation = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(type, params) {
+      var res;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!(type === 'alarm')) {
+                _context.next = 6;
+                break;
+              }
+
+              _context.next = 3;
+              return service.handleAlarm(params);
+
+            case 3:
+              res = _context.sent;
+
+              _Message.success('受理成功');
+
+              onHandleAlarm();
+
+            case 6:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+    return _alarmRiskOperation.apply(this, arguments);
+  }
+
+  return /*#__PURE__*/React.createElement(BlockBox, {
+    headerTitle: "\u6700\u8FD1\u7684\u544A\u8B66\u548C\u98CE\u9669"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.alarm
+  }, /*#__PURE__*/React.createElement(_Table, {
+    hasBorder: false,
+    fixedHeader: true,
+    columns: columns,
+    maxBodyHeight: "auto",
+    dataSource: alarmRiskList,
+    emptyContent: /*#__PURE__*/React.createElement("div", {
+      className: styles['no-data']
+    }, "\u6682\u65E0\u6570\u636E")
+  })));
+}
+
+export default EventsCard;

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

@@ -1,5 +1,4 @@
 import _Message from "@alifd/next/es/message";
-import _Table from "@alifd/next/es/table";
 import _extends from "@babel/runtime/helpers/extends";
 import _Button from "@alifd/next/es/button";
 import _Icon from "@alifd/next/es/icon";
@@ -28,7 +27,8 @@ import useCiAttrAndMetricData from "./useCiAttrAndMetricData";
 import Configurator from "./components/Configurator";
 import { formatMetric } from "../../../../../../models/attributeFormatter";
 import LinkTopoCard from "./components/LinkTopo/LinkTopoCard";
-import { rlog } from '@riil-frontend/component-topology-utils/lib/rlog'; // url 处理，UICBB 的地址需截取前缀
+import { rlog } from '@riil-frontend/component-topology-utils/lib/rlog';
+import EventsCard from "./EventsCard"; // url 处理，UICBB 的地址需截取前缀
 
 function formatUrl(url) {
   var _window, _window$location;
@@ -943,18 +943,11 @@ export default function ResourceOverview(props) {
     },
     data: metric,
     loading: metricInitLoading
-  })), /*#__PURE__*/React.createElement(BlockBox, {
-    headerTitle: "\u6700\u8FD1\u7684\u544A\u8B66\u548C\u98CE\u9669"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.alarm
-  }, /*#__PURE__*/React.createElement(_Table, {
-    hasBorder: false,
-    fixedHeader: true,
-    columns: columns,
-    maxBodyHeight: "auto",
-    dataSource: alarmRiskList,
-    emptyContent: /*#__PURE__*/React.createElement("div", {
-      className: styles['no-data']
-    }, "\u6682\u65E0\u6570\u636E")
-  }))));
+  })), /*#__PURE__*/React.createElement(EventsCard, {
+    alarmRiskList: alarmRiskList,
+    closeDetailDrawer: onClose,
+    onHandleAlarm: function onHandleAlarm() {
+      getAlarmRiskData(id);
+    }
+  }));
 }

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

@@ -120,7 +120,7 @@ export default function ResourceOverviewMetric(props) {
         padding: 0,
         appendPadding: [2, 0],
         smooth: true,
-        tooltip: false,
+        tooltip: true,
         line: {
           color: "l(0) 0:" + hexToRgb(rgbToHex(color).hex, 0.05).rgba + " 0.5:" + color + " 1:" + color,
           size: 2