@riil-frontend/component-topology 2.14.2-alpha.13 → 2.14.2-alpha.18

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

@@ -5,31 +5,157 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports["default"] = ResourceOverview;
 
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
 var _table = _interopRequireDefault(require("@alifd/next/lib/table"));
 
 var _divider = _interopRequireDefault(require("@alifd/next/lib/divider"));
 
+var _button = _interopRequireDefault(require("@alifd/next/lib/button"));
+
+var _icon = _interopRequireDefault(require("@alifd/next/lib/icon"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _reactRouterDom = require("react-router-dom");
+
+var _utils = require("@riil-frontend/utils");
+
+var _moment = _interopRequireDefault(require("moment"));
+
 var _componentTopologyGraph = require("@riil-frontend/component-topology-graph");
 
 var _topoData = require("../../../../../../../utils/topoData");
 
+var _alert = _interopRequireDefault(require("@riil-frontend/component-topology-common/es/services/alert"));
+
+var _topo = _interopRequireDefault(require("@riil-frontend/component-topology-common/es/services/topo"));
+
+var _overview = _interopRequireDefault(require("../../../../../../services/overview"));
+
 var _NoDataPage = _interopRequireDefault(require("@riil-frontend/component-topology-common/es/components/NoDataPage"));
 
+var _DictCache = _interopRequireDefault(require("../../../../../../models/cache/DictCache"));
+
 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; }
 
+// import riskService from '@riil-frontend/component-topology-common/es/services/risk';
 // import ResourceDiplayInfoSetting from './Setting';
 // bimport '@riil-frontend/css/lib/index.scss';
-// 关键指标
-function indicatorRander(data) {
+// 基本信息
+function BaseInfoRender(type, data) {
+  if (type === 'link') {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"]['base-info']
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].row
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item,
+      style: {
+        width: '100%'
+      }
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u94FE\u8DEF\u5E26\u5BBD\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.rated_bandwidth))), /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].row
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u6E90IP\u5730\u5740\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.source_ipv4)), /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u76EE\u7684IP\u5730\u5740\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.destination_ipv4))), /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].row
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u6E90\u63A5\u53E3\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.source_Interface)), /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u76EE\u7684\u63A5\u53E3\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.destination_Interface))));
+  } else {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"]['base-info']
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].row
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u8D44\u6E90\u540D\u79F0\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.display_name)), /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "IP\u5730\u5740\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.ipv4_address))), /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].row
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u8D44\u4EA7\u7F16\u53F7\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.asset_number)), /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u8D44\u6E90\u7C7B\u578B\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.ciName))), /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].row
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: _indexModule["default"].item,
+      style: {
+        width: '100%'
+      }
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].label
+    }, "\u8D44\u6E90\u4F4D\u7F6E\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
+      className: _indexModule["default"].content
+    }, data.res_address))));
+  }
+} // 关键指标
+
+
+function indicatorRander(type, data) {
   console.log('indicatorRander', data);
+
+  function formatValue(itemData) {
+    var format = (0, _utils.metricValueFormat)({
+      value: itemData.value,
+      dataType: itemData.dataType,
+      dict: _DictCache["default"].getDictObject(),
+      unit: itemData.unit,
+      code: itemData.code
+    });
+    return format.value;
+  }
+
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"].indicator
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -40,10 +166,10 @@ function indicatorRander(data) {
       key: item.code
     }, /*#__PURE__*/_react["default"].createElement("span", {
       className: _indexModule["default"].content
-    }, item.value ? item.value + item.unit : '暂无数据'), /*#__PURE__*/_react["default"].createElement("span", {
+    }, formatValue(item)), /*#__PURE__*/_react["default"].createElement("span", {
       className: _indexModule["default"].label
     }, item.name));
-  })), /*#__PURE__*/_react["default"].createElement("div", {
+  })), type === 'node' ? /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"].row
   }, data.slice(3, 6).map(function (item) {
     return /*#__PURE__*/_react["default"].createElement("div", {
@@ -51,10 +177,10 @@ function indicatorRander(data) {
       key: item.code
     }, /*#__PURE__*/_react["default"].createElement("span", {
       className: _indexModule["default"].content
-    }, item.value ? item.value + item.unit : '暂无数据'), /*#__PURE__*/_react["default"].createElement("span", {
+    }, formatValue(item)), /*#__PURE__*/_react["default"].createElement("span", {
       className: _indexModule["default"].label
     }, item.name));
-  })));
+  })) : '');
 }
 /**
  * 资源概览
@@ -64,23 +190,35 @@ function indicatorRander(data) {
 function ResourceOverview(props) {
   var topo = props.topo,
       id = props.id,
-      ciType = props.ciType;
+      type = props.type,
+      ciType = props.ciType,
+      ciName = props.ciName;
 
   var _topo$store$useModelS = topo.store.useModelState('topoBizMod'),
       attrsAndMetrics = _topo$store$useModelS.attrsAndMetrics;
 
   var _useState = (0, _react.useState)({
+    // 资源
     display_name: '',
     // 资源名称/显示名称
     ipv4_address: '',
     // IP地址
     asset_number: '',
     // 资产编号
-    type: '',
+    ciName: '',
     // 资源类型
-    b: '',
+    res_address: '',
     // 资源位置
-    c: '' // 责任人
+    // 链路
+    rated_bandwidth: '',
+    // 链路带宽
+    source_ipv4: '',
+    // 源IP地址
+    destination_ipv4: '',
+    // 目的IP地址
+    source_Interface: '',
+    // 源接口
+    destination_Interface: '' // 目的接口
 
   }),
       baseInfo = _useState[0],
@@ -90,113 +228,281 @@ function ResourceOverview(props) {
       indicator = _useState2[0],
       setIndicator = _useState2[1];
 
+  var _useState3 = (0, _react.useState)([]),
+      alarmRiskList = _useState3[0],
+      setAlarmRiskList = _useState3[1];
+
   (0, _react.useEffect)(function () {
     init();
-  }, [attrsAndMetrics]);
+  }, [attrsAndMetrics, id]);
 
   function init() {
-    var _findItem2, _findItem3, _findItem4, _findItem5;
+    var _topo$options$resourc, _attributeMap$source_, _attributeMap$destina;
+
+    // 指标模型
+    var _topo$ciTyeCache$getC = topo.ciTyeCache.getCiType(ciType),
+        modelMetrics = _topo$ciTyeCache$getC.metrics;
+
+    var topModelMetrics = modelMetrics.slice(0, 6);
+    console.log('topModelMetrics', topModelMetrics); // 应用拓扑处理
+
+    if ((_topo$options$resourc = topo.options.resourceOverviewDrawer) !== null && _topo$options$resourc !== void 0 && _topo$options$resourc.getData) {
+      var _topo$options$resourc3;
+
+      topo.resourceOverviewDrawer && (topo.resourceOverviewDrawer['refreshData'] = init);
+
+      var _topo$options$resourc2 = (_topo$options$resourc3 = topo.options.resourceOverviewDrawer) === null || _topo$options$resourc3 === void 0 ? void 0 : _topo$options$resourc3.getData({
+        id: id,
+        metrics: topModelMetrics
+      }),
+          _metrics = _topo$options$resourc2.metrics,
+          alarms = _topo$options$resourc2.alarms;
+
+      console.log('应用拓扑 参数获取', _metrics, alarms);
+      getAttribute(id);
+      setIndicator(topModelMetrics.map(function (item) {
+        return (0, _extends2["default"])({}, item, {
+          value: _metrics[item.code] || ''
+        });
+      }));
+      setAlarmRiskList(alarms || []);
+      return;
+    } // 拓扑（默认） ---------------------------
+    // 基本信息
+
 
-    // 资源-基本信息
     console.log('资源-基本信息------------------------', id, attrsAndMetrics);
 
     var _findItem = (0, _topoData.findItem)(attrsAndMetrics, 'id', id),
-        attributes = _findItem.attributes,
+        attributeMap = _findItem.attributeMap,
         metrics = _findItem.metrics;
 
-    console.log('000', (0, _topoData.findItem)(attrsAndMetrics, 'id', id));
-    console.log('111', attributes, (0, _topoData.findItem)(attributes, 'code', 'display_name'));
-    setBaseInfo({
-      display_name: (_findItem2 = (0, _topoData.findItem)(attributes, 'code', 'display_name')) === null || _findItem2 === void 0 ? void 0 : _findItem2.value,
-      ipv4_address: (_findItem3 = (0, _topoData.findItem)(attributes, 'code', 'ipv4_address')) === null || _findItem3 === void 0 ? void 0 : _findItem3.value,
-      asset_number: (_findItem4 = (0, _topoData.findItem)(attributes, 'code', 'asset_number')) === null || _findItem4 === void 0 ? void 0 : _findItem4.value,
-      type: (_findItem5 = (0, _topoData.findItem)(attributes, 'code', 'type')) === null || _findItem5 === void 0 ? void 0 : _findItem5.value
-    }); // 链路-基本信息
-    // 资源/链路-关键指标 数据 metrics，模型 topo.ciTyeCache.getCiType(ciType)
+    console.log('attributeMap', attributeMap);
+    var res_address = '-';
 
-    console.log('资源/链路-关键指标------------------------', id, metrics);
+    if (attributeMap.owned_computer_room) {
+      res_address = attributeMap.owned_computer_room + " " + attributeMap.owned_cabinet + " " + attributeMap.start_u_location + "-" + attributeMap.end_u_location;
+    }
 
-    var _topo$ciTyeCache$getC = topo.ciTyeCache.getCiType(ciType),
-        modelMetrics = _topo$ciTyeCache$getC.metrics;
+    setBaseInfo({
+      // 资源
+      display_name: attributeMap.display_name || '-',
+      ipv4_address: attributeMap.ipv4_address || '-',
+      asset_number: attributeMap.asset_number || '-',
+      // type: findItem(attributes, 'code', 'type')?.value || '-',
+      ciName: ciName || '-',
+      res_address: res_address,
+      // 链路
+      rated_bandwidth: attributeMap.rated_bandwidth || '-',
+      // 额定带宽
+      // rated_bandwidth:[network_link.actual_bandwidth] || '-',// 实际带宽
+      source_ipv4: attributeMap.source_ipv4 || '-',
+      destination_ipv4: attributeMap.destination_ipv4 || '-',
+      source_Interface: ((_attributeMap$source_ = attributeMap.source_id_object) === null || _attributeMap$source_ === void 0 ? void 0 : _attributeMap$source_.displayName) || '-',
+      destination_Interface: ((_attributeMap$destina = attributeMap.destination_id_object) === null || _attributeMap$destina === void 0 ? void 0 : _attributeMap$destina.displayName) || '-'
+    }); // 资源/链路-关键指标 数据 metrics，模型 topo.ciTyeCache.getCiType(ciType)
 
-    setIndicator(modelMetrics.slice(0, 6).map(function (item) {
-      var _findItem6;
+    console.log('资源/链路-关键指标------------------------', id, metrics);
+    setIndicator(topModelMetrics.map(function (item) {
+      var _findItem2;
 
       return (0, _extends2["default"])({}, item, {
-        value: (_findItem6 = (0, _topoData.findItem)(metrics, 'code', item.code)) === null || _findItem6 === void 0 ? void 0 : _findItem6.value
+        value: ((_findItem2 = (0, _topoData.findItem)(metrics, 'code', item.code)) === null || _findItem2 === void 0 ? void 0 : _findItem2.value) || ''
       });
+    })); // 资源-告警/风险
+
+    getAlarmRiskData(id);
+  } // 获取属性信息（应用拓扑）
+
+
+  function getAttribute(_x) {
+    return _getAttribute.apply(this, arguments);
+  } // 获取告警/风险信息
+
+
+  function _getAttribute() {
+    _getAttribute = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(id) {
+      var res, _ref, attributes, attributeMap, res_address;
+
+      return _regenerator["default"].wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _context.next = 2;
+              return _topo["default"].ciInfo.batchQueryCiInfo({
+                ciId: [{
+                  ciId: id,
+                  operation: 'delete'
+                }],
+                codes: [],
+                relationId: []
+              });
+
+            case 2:
+              res = _context.sent;
+              console.log('应用拓扑 查询结果 res', res);
+              _ref = res[0] || {}, attributes = _ref.attributes;
+              attributeMap = {};
+              attributes.forEach(function (item) {
+                attributeMap[item.code] = item.value;
+              });
+              res_address = '-';
+
+              if (attributeMap.owned_computer_room) {
+                res_address = attributeMap.owned_computer_room + " " + attributeMap.owned_cabinet + " " + attributeMap.start_u_location + "-" + attributeMap.end_u_location;
+              }
+
+              setBaseInfo({
+                // 资源
+                display_name: attributeMap.display_name || '-',
+                ipv4_address: attributeMap.ipv4_address || '-',
+                asset_number: attributeMap.asset_number || '-',
+                ciName: ciName || '-',
+                res_address: res_address
+              });
+
+            case 10:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
     }));
+    return _getAttribute.apply(this, arguments);
+  }
+
+  function getAlarmRiskData(_x2) {
+    return _getAlarmRiskData.apply(this, arguments);
+  }
+
+  function _getAlarmRiskData() {
+    _getAlarmRiskData = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(id) {
+      var _yield$alertService$g, alarmList, _yield$service$getRis, riskList;
+
+      return _regenerator["default"].wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              _context2.next = 2;
+              return _alert["default"].getAlarmByIds({
+                ciIdList: [id],
+                alertStatusList: ['toDeal', 'dealing'],
+                // toDeal: 待处理, dealing：处理中
+                pageNum: 1,
+                pageSize: 10,
+                sortField: "alertLevel",
+                sortOrder: "asc"
+              });
+
+            case 2:
+              _yield$alertService$g = _context2.sent;
+              alarmList = _yield$alertService$g.datas;
+              alarmList = alarmList.map(function (item) {
+                return {
+                  type: 'alarm',
+                  icon: 'gaojing-3',
+                  className: "alarm-color-icon-lv" + item.alertLevel,
+                  title: "[" + item.alertObject + "] " + item.alertTitle,
+                  link: "/default/pagecenter/alertDetail/view/" + record.alertId + "?alertId=" + record.alertId + "&resId=" + record.ciId + "&title=" + record.alertObject,
+                  time: item.createTime,
+                  status: item.status
+                };
+              });
+              _context2.next = 7;
+              return _overview["default"].getRiskByIds({
+                ciIdList: [id],
+                statusList: ['toDeal', 'dealing'],
+                current: 1,
+                pageSize: 10
+              });
+
+            case 7:
+              _yield$service$getRis = _context2.sent;
+              riskList = _yield$service$getRis.content;
+              riskList = alarmList.map(function (item) {
+                return {
+                  type: 'risk',
+                  icon: 'Overall_risk_full',
+                  className: 'risk-icon',
+                  title: item.itemName,
+                  link: '/default/inspectionTaskList/inspectionReport?title=tomcat(172.17.162.192:8888)&reportId=20&reportTime=1644768602413&reportType=0&reportName=tomcat(172.17.162.192:8888)',
+                  time: ''
+                };
+              });
+              /* {
+                "id": "5815",
+                "executeId": "20",
+                "taskId": "5737",
+                "checkItemId": "5801",
+                "itemName": "tomcat(172.17.162.192:8888)存在运行风险",
+                "itemCode": "m.tomcat_metric_item",
+                "checkType": "速率类风险",
+                "ciId": "00000000aff84a9c",
+                "ciName": "tomcat(172.17.162.192:8888)",
+                "ciTypeCode": "tomcat",
+                "ipAddress": "172.17.162.192",
+                "firstFoundTime": 1644486885000,
+                "processTime": null,
+                "endTime": 1644894567198,
+                "state": 127,
+                "duration": 431239035,
+                "status": "closed",
+                "executeTime": 1644768602413,
+                "viewType": 0
+              } */
+
+              console.log('资源-告警/风险', alarmList, riskList);
+              setAlarmRiskList([].concat(alarmList, riskList));
+
+            case 12:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+    return _getAlarmRiskData.apply(this, arguments);
   }
 
-  var topoBizMod = topo.store.useModelState('topoBizMod');
-  (0, _react.useEffect)(function () {
-    console.log('topoBizMod', topoBizMod);
-  }, [topoBizMod]);
   var columns = [{
     title: '事件',
-    dataIndex: 'a',
-    key: 'a' // width: 144,
-    // cell: (alertTitle, index, record) => (
-    //   <Link
-    //     to={`/default/pagecenter/${PAGE_TYPE.ALERT_DETAIL}/view/${record.alertId}?alertId=${record.alertId}&resId=${record.ciId}&title=${record.alertObject}`}
-    //   >
-    //     <div title={alertTitle}>{alertTitle}</div>
-    //   </Link>
-    // ),
-
+    dataIndex: 'alertTitle',
+    key: 'alertTitle',
+    cell: function cell(value, index, record) {
+      return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
+        type: "gaojing-3",
+        size: "xs",
+        className: _indexModule["default"]["alarm-color-icon"] + " alarm-color-icon-lv" + record.alertLevel
+      }), /*#__PURE__*/_react["default"].createElement(_reactRouterDom.Link, {
+        to: "/default/pagecenter/alertDetail/view/" + record.alertId + "?alertId=" + record.alertId + "&resId=" + record.ciId + "&title=" + record.alertObject
+      }, "[" + record.alertObject + "] " + value));
+    }
   }, {
     title: '时间',
     dataIndex: 'createTime',
     key: 'createTime',
-    width: 128 // cell: (createTime, index, record) => (
-    //   <div title={moment(createTime).format('YYYY-MM-DD HH:mm')}>
-    //     {moment(createTime).format('YYYY-MM-DD HH:mm')}
-    //   </div>
-    // ),
-
+    width: 128,
+    cell: function cell(createTime, index, record) {
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        title: (0, _moment["default"])(createTime).format('YYYY-MM-DD HH:mm')
+      }, (0, _moment["default"])(createTime).format('YYYY-MM-DD HH:mm'));
+    }
   }, {
     title: '操作',
-    dataIndex: 'alertType',
-    key: 'alertType',
-    width: 64 // cell: (alertType, index, record) => (
-    //   <div title={alertType}>{alertType}</div>
-    // ),
-
-  }];
-  var dataSource = [{
-    id: 1,
-    a: 12312
-  }, {
-    id: 2,
-    a: 12312
-  }, {
-    id: 3,
-    a: 12312
-  }, {
-    id: 4,
-    a: 12312
-  }, {
-    id: 5,
-    a: 12312
-  }, {
-    id: 6,
-    a: 12312
-  }, {
-    id: 7,
-    a: 12312
-  }, {
-    id: 8,
-    a: 12312
-  }, {
-    id: 9,
-    a: 12312
-  }, {
-    id: 10,
-    a: 12312
+    dataIndex: 'status',
+    key: 'status',
+    width: 64,
+    cell: function cell(status, index, record) {
+      return status === 'toDeal' ? /*#__PURE__*/_react["default"].createElement(_button["default"], {
+        text: true,
+        type: "primary"
+      }, "\u53D7\u7406") : /*#__PURE__*/_react["default"].createElement(_button["default"], {
+        disabled: true,
+        text: true,
+        type: "primary"
+      }, "\u5DF2\u53D7\u7406");
+    }
   }];
-
-  function BaseInfo(type, data) {}
-
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"]['resource-overview']
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -207,51 +513,7 @@ function ResourceOverview(props) {
     direction: "ver"
   }), "\u57FA\u672C\u4FE1\u606F"), /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"].body
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"]['base-info']
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].row
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].item
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].label
-  }, "\u8D44\u6E90\u540D\u79F0\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].content
-  }, baseInfo.display_name)), /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].item
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].label
-  }, "IP\u5730\u5740\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].content
-  }, baseInfo.ipv4_address))), /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].row
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].item
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].label
-  }, "\u8D44\u4EA7\u7F16\u53F7\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].content
-  }, baseInfo.asset_number)), /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].item
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].label
-  }, "\u8D44\u6E90\u7C7B\u578B\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].content
-  }, baseInfo.type))), /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].row
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].item
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].label
-  }, "\u8D44\u6E90\u4F4D\u7F6E\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].content
-  }, baseInfo.b)), /*#__PURE__*/_react["default"].createElement("div", {
-    className: _indexModule["default"].item
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].label
-  }, "\u8D23\u4EFB\u4EBA\uFF1A"), /*#__PURE__*/_react["default"].createElement("span", {
-    className: _indexModule["default"].content
-  }, baseInfo.c)))))), /*#__PURE__*/_react["default"].createElement("div", {
+  }, BaseInfoRender(type, baseInfo))), /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"]['block-box']
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"].title
@@ -261,7 +523,7 @@ function ResourceOverview(props) {
     className: _indexModule["default"].body
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"].indicator
-  }, indicatorRander(indicator)))), /*#__PURE__*/_react["default"].createElement("div", {
+  }, indicatorRander(type, indicator)))), /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"]['block-box']
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"].title
@@ -274,7 +536,7 @@ function ResourceOverview(props) {
   }, /*#__PURE__*/_react["default"].createElement(_table["default"], {
     hasBorder: false,
     columns: columns,
-    dataSource: dataSource,
+    dataSource: alarmRiskList,
     emptyContent: /*#__PURE__*/_react["default"].createElement(_NoDataPage["default"], {
       type: "table"
     })