From 96043ed80e351a7164bd656174808b0d1c9b12c8 Mon Sep 17 00:00:00 2001
From: guguji5 <604821528@qq.com>
Date: Tue, 14 Dec 2021 14:32:21 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20add=20tooltip=20on=20the=20dashboar?=
 =?UTF-8?q?d=20chart=20title=20=E5=91=8A=E8=AD=A6=E8=AF=A6=E6=83=85?=
 =?UTF-8?q?=E9=A1=B5=E8=8E=B7=E5=8F=96group=5Fid=E4=B8=BA=E4=B8=9A?=
 =?UTF-8?q?=E5=8A=A1=E7=BB=84id=EF=BC=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                       |  2 +-
 src/pages/dashboard/chartGroup.tsx |  8 +++--
 src/pages/event/detail.tsx         | 54 +++++++++++++++++-------------
 3 files changed, 38 insertions(+), 26 deletions(-)

diff --git a/package.json b/package.json
index 067d673b..a00b4d4c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "n9e-fe",
-  "version": "5.0.0-ga-03",
+  "version": "5.0.0-ga-04",
   "scripts": {
     "dev": "vite --port 8765 --host",
     "preinstall": "sh beforeinstall.sh",
diff --git a/src/pages/dashboard/chartGroup.tsx b/src/pages/dashboard/chartGroup.tsx
index eae71828..e235fc17 100644
--- a/src/pages/dashboard/chartGroup.tsx
+++ b/src/pages/dashboard/chartGroup.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useContext, useCallback, ReactElement, RefObject } from 'react';
-import { Button, Collapse, Modal, Menu, Dropdown, Divider, Popover, Checkbox } from 'antd';
+import { Button, Collapse, Modal, Menu, Dropdown, Divider, Popover, Checkbox, Tooltip } from 'antd';
 import { Responsive, WidthProvider } from 'react-grid-layout';
 const ResponsiveReactGridLayout = WidthProvider(Responsive);
 const { Panel } = Collapse;
@@ -527,7 +527,11 @@ export default function ChartGroup(props: Props) {
                 legend: legend,
                 step,
                 range,
-                title: name,
+                title: (
+                  <Tooltip title={name}>
+                    <span>{name}</span>
+                  </Tooltip>
+                ),
                 promqls,
                 legendTitleFormats,
               }}
diff --git a/src/pages/event/detail.tsx b/src/pages/event/detail.tsx
index e5138080..5d356beb 100644
--- a/src/pages/event/detail.tsx
+++ b/src/pages/event/detail.tsx
@@ -2,7 +2,7 @@ import PageLayout from '@/components/pageLayout';
 import React, { useEffect, useState } from 'react';
 import { useHistory, useParams } from 'react-router';
 import { getAlertEventsById, getHistoryEventsById } from '@/services/warning';
-import { Button, Card, Col, Row, Space, Spin, Tag, Typography } from 'antd';
+import { Button, Card, Col, message, Row, Space, Spin, Tag, Typography } from 'antd';
 import { priorityColor } from '@/utils/constant';
 import './detail.less';
 import moment from 'moment';
@@ -56,7 +56,7 @@ const EventDetailPage: React.FC = () => {
       label: '事件标签',
       key: 'tags',
       render(tags) {
-        return tags.map((tag) => <Tag color='blue'>{tag}</Tag>);
+        return tags ? tags.map((tag) => <Tag color='blue'>{tag}</Tag>) : '';
       },
     },
     { label: '对象备注', key: 'target_note' },
@@ -124,20 +124,22 @@ const EventDetailPage: React.FC = () => {
       label: '告警接收组',
       key: 'notify_groups_obj',
       render(groups) {
-        return groups.map((group) => <Tag color='blue'>{group.name}</Tag>);
+        return groups ? groups.map((group) => <Tag color='blue'>{group.name}</Tag>) : '';
       },
     },
     {
       label: '回调地址',
       key: 'callbacks',
       render(callbacks) {
-        return callbacks.map((callback) => (
-          <Tag>
-            <Paragraph copyable style={{ margin: 0 }}>
-              {callback}
-            </Paragraph>
-          </Tag>
-        ));
+        return callbacks
+          ? callbacks.map((callback) => (
+              <Tag>
+                <Paragraph copyable style={{ margin: 0 }}>
+                  {callback}
+                </Paragraph>
+              </Tag>
+            ))
+          : '';
       },
     },
     {
@@ -174,14 +176,16 @@ const EventDetailPage: React.FC = () => {
                     type='primary'
                     onClick={() => {
                       history.push('/alert-mutes/add', {
-                        tags: eventDetail.tags.map((tag) => {
-                          const [key, value] = tag.split('=');
-                          return {
-                            func: '==',
-                            key,
-                            value,
-                          };
-                        }),
+                        tags: eventDetail.tags
+                          ? eventDetail.tags.map((tag) => {
+                              const [key, value] = tag.split('=');
+                              return {
+                                func: '==',
+                                key,
+                                value,
+                              };
+                            })
+                          : [],
                       });
                     }}
                   >
@@ -190,11 +194,15 @@ const EventDetailPage: React.FC = () => {
                   {!isHistory && (
                     <Button
                       danger
-                      onClick={() =>
-                        deleteAlertEventsModal(busiId, [Number(eventId)], () => {
-                          history.replace('/alert-cur-events');
-                        })
-                      }
+                      onClick={() => {
+                        if (eventDetail.group_id) {
+                          deleteAlertEventsModal(eventDetail.group_id, [Number(eventId)], () => {
+                            history.replace('/alert-cur-events');
+                          });
+                        } else {
+                          message.warn('该告警未返回业务组ID');
+                        }
+                      }}
                     >
                       删除
                     </Button>