From 6e49dbe720614ad6f831fe4065e5a5aa893da2ba Mon Sep 17 00:00:00 2001 From: m1666 <160663534@qq.com> Date: Fri, 25 Feb 2022 18:26:13 +0800 Subject: [PATCH 01/17] fix: optimize code --- ui/src/models/alarms/useAlarmOperations.ts | 17 ++++ ui/src/models/dataLogs.ts | 2 +- .../CreatedAndUpdatedModal/index.tsx | 1 - .../Alarm/components/Operations/index.tsx | 12 +-- .../pages/DataLogs/hooks/useLogUrlParams.ts | 89 ++++++++++--------- ui/src/services/dataLogs.ts | 2 +- 6 files changed, 75 insertions(+), 48 deletions(-) diff --git a/ui/src/models/alarms/useAlarmOperations.ts b/ui/src/models/alarms/useAlarmOperations.ts index 409cd433d..06f4ba6cd 100644 --- a/ui/src/models/alarms/useAlarmOperations.ts +++ b/ui/src/models/alarms/useAlarmOperations.ts @@ -1,9 +1,22 @@ import { useState } from "react"; +import useRequest from "@/hooks/useRequest/useRequest"; +import baseApi, { DatabaseResponse, TablesResponse } from "@/services/dataLogs"; const useAlarmOperations = () => { const [inputName, setInputName] = useState(); const [selectDid, setSelectDid] = useState(); const [selectTid, setSelectTid] = useState(); + const [tableList, setTableList] = useState([]); + const [databaseList, setDatabaseList] = useState([]); + + const getLogLibraries = useRequest(baseApi.getTableList, { + loadingText: false, + onSuccess: (res) => setTableList(res.data || []), + }); + const getDatabases = useRequest(baseApi.getDatabaseList, { + loadingText: false, + onSuccess: (res) => setDatabaseList(res.data || []), + }); const onChangeInputName = (name: string) => { setInputName(name); @@ -20,6 +33,10 @@ const useAlarmOperations = () => { inputName, selectDid, selectTid, + tableList, + databaseList, + getLogLibraries, + getDatabases, onChangeInputName, onChangeSelectDid, onChangeSelectTid, diff --git a/ui/src/models/dataLogs.ts b/ui/src/models/dataLogs.ts index 36a1e0ba3..12c5bf607 100644 --- a/ui/src/models/dataLogs.ts +++ b/ui/src/models/dataLogs.ts @@ -325,7 +325,7 @@ const DataLogsModel = () => { } }; - const doGetDatabaseList = (selectedInstance?: number | undefined) => { + const doGetDatabaseList = (selectedInstance?: number) => { getDatabases.run(selectedInstance); }; diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx b/ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx index baef96bfe..a427db1fa 100644 --- a/ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx +++ b/ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx @@ -184,7 +184,6 @@ const CreatedAndUpdatedModal = ({ useEffect(() => { if (visible && modalForm.current) { doGetDatabaseList(); - console.log("operations: ", operations); if (operations.selectDid) { modalForm.current.setFieldsValue({ databaseId: operations.selectDid }); getLogLibraries.run(operations.selectDid); diff --git a/ui/src/pages/Alarm/components/Operations/index.tsx b/ui/src/pages/Alarm/components/Operations/index.tsx index 124f0af15..42244b51a 100644 --- a/ui/src/pages/Alarm/components/Operations/index.tsx +++ b/ui/src/pages/Alarm/components/Operations/index.tsx @@ -8,12 +8,14 @@ import { useDebounceFn } from "ahooks"; import { DEBOUNCE_WAIT } from "@/config/config"; const { Option } = Select; const Operations = () => { - const { databaseList, logLibraryList, getLogLibraries, doGetDatabaseList } = - useModel("dataLogs"); + // const { databaseList, logLibraryList, getLogLibraries, doGetDatabaseList } = + // useModel("dataLogs"); const { operations, alarmDraw, doGetAlarms, currentPagination } = useModel("alarm"); + const { tableList, databaseList, getLogLibraries, getDatabases } = operations; + const i18n = useIntl(); const handleOpenDraw = () => { @@ -35,7 +37,7 @@ const Operations = () => { ).run; useEffect(() => { - doGetDatabaseList(); + getDatabases.run(); }, []); return ( @@ -77,8 +79,8 @@ const Operations = () => { id: "alarm.selected.placeholder.logLibrary", })}`} > - {logLibraryList.length > 0 && - logLibraryList.map((item) => ( + {tableList.length > 0 && + tableList.map((item) => ( diff --git a/ui/src/pages/DataLogs/hooks/useLogUrlParams.ts b/ui/src/pages/DataLogs/hooks/useLogUrlParams.ts index 80c6ca54f..344b84a81 100644 --- a/ui/src/pages/DataLogs/hooks/useLogUrlParams.ts +++ b/ui/src/pages/DataLogs/hooks/useLogUrlParams.ts @@ -13,6 +13,8 @@ import { import moment from "moment"; import { currentTimeStamp } from "@/utils/momentUtils"; import { useEffect } from "react"; +import { TableInfoResponse } from "@/services/dataLogs"; +import { BaseRes } from "@/hooks/useRequest/useRequest"; export default function useLogUrlParams() { const [urlState, setUrlState] = useUrlState(); @@ -39,51 +41,58 @@ export default function useLogUrlParams() { doGetLogLibrary, } = useModel("dataLogs"); + const handleResponse = (res: BaseRes, tid: number) => { + if (res.data.database) { + onChangeCurrentDatabase(res.data.database); + } + onChangeLogLibrary({ + id: tid, + tableName: res.data.name, + }); + + const panes = []; + panes.push({ + pane: res.data.name, + paneId: tid, + start: + parseInt(urlState.start) || + moment().subtract(FIFTEEN_TIME, MINUTES_UNIT_TIME).unix(), + end: parseInt(urlState.end) || currentTimeStamp(), + keyword: urlState.kw || undefined, + page: parseInt(urlState.page) || FIRST_PAGE, + pageSize: parseInt(urlState.size) || PAGE_SIZE, + activeTabKey: urlState.tab || TimeRangeType.Relative, + activeIndex: parseInt(urlState.index) || ACTIVE_TIME_INDEX, + }); + + onChangeLogPanes(panes); + onChangeStartDateTime( + parseInt(urlState.start) || + moment().subtract(FIFTEEN_TIME, MINUTES_UNIT_TIME).unix() + ); + onChangeEndDateTime(parseInt(urlState.end) || currentTimeStamp()); + if (urlState.tab) { + onChangeActiveTabKey(urlState.tab); + } + if (urlState.index) { + onChangeActiveTimeOptionIndex(parseInt(urlState.index)); + } + onChangeKeywordInput(urlState.kw); + onChangeLogsPageByUrl( + parseInt(urlState.page) || FIRST_PAGE, + parseInt(urlState.size) || PAGE_SIZE + ); + doParseQuery(urlState.kw); + }; + const doSetUrlQuery = (tid: number) => { try { doGetLogLibrary.run(tid).then((res) => { - if (res?.code === 0) { - if (res.data.database) { - onChangeCurrentDatabase(res.data.database); - } - const panes = []; - onChangeLogLibrary({ - id: tid, - tableName: res.data.name, - }); - panes.push({ - pane: res.data.name, - paneId: tid, - start: - parseInt(urlState.start) || - moment().subtract(FIFTEEN_TIME, MINUTES_UNIT_TIME).unix(), - end: parseInt(urlState.end) || currentTimeStamp(), - keyword: urlState.kw || undefined, - page: parseInt(urlState.page) || FIRST_PAGE, - pageSize: parseInt(urlState.size) || PAGE_SIZE, - activeTabKey: urlState.tab || TimeRangeType.Relative, - activeIndex: parseInt(urlState.index) || ACTIVE_TIME_INDEX, - }); - onChangeLogPanes(panes); - onChangeStartDateTime( - parseInt(urlState.start) || - moment().subtract(FIFTEEN_TIME, MINUTES_UNIT_TIME).unix() - ); - onChangeEndDateTime(parseInt(urlState.end) || currentTimeStamp()); - if (urlState.tab) { - onChangeActiveTabKey(urlState.tab); - } - if (urlState.index) { - onChangeActiveTimeOptionIndex(parseInt(urlState.index)); - } - onChangeKeywordInput(urlState.kw); - onChangeLogsPageByUrl( - parseInt(urlState.page) || FIRST_PAGE, - parseInt(urlState.size) || PAGE_SIZE - ); + if (res?.code !== 0) { + return; } + handleResponse(res, tid); }); - doParseQuery(urlState.kw); } catch (e) { console.log("【Error】: ", e); } diff --git a/ui/src/services/dataLogs.ts b/ui/src/services/dataLogs.ts index b7c4a2ed7..fe52103f4 100644 --- a/ui/src/services/dataLogs.ts +++ b/ui/src/services/dataLogs.ts @@ -194,7 +194,7 @@ export default { }, // Get a list of databases - async getDatabaseList(iid: number | undefined) { + async getDatabaseList(iid?: number) { return request>( `/api/v1/instances/${iid || 0}/databases`, { From a8c48e2fdde1effc7b801055b9bbafb7466bbb25 Mon Sep 17 00:00:00 2001 From: m1666 <160663534@qq.com> Date: Mon, 28 Feb 2022 10:54:12 +0800 Subject: [PATCH 02/17] fix: Update routing configuration --- api/config/resource.yaml | 7 +++++-- ui/config/routes.ts | 11 ++++++++--- ui/src/locales/en-US.ts | 2 ++ ui/src/locales/zh-CN.ts | 2 ++ ui/src/pages/Alarm/Notifications/index.tsx | 4 ++++ .../{ => Rules}/components/AlarmTable/index.tsx | 2 +- .../InspectionFrequencyItem/index.less | 0 .../InspectionFrequencyItem/index.tsx | 2 +- .../CreatedAndUpdatedModal/index.tsx | 0 .../FormAlarmDraw/QueryStatisticsItem/index.less | 0 .../FormAlarmDraw/QueryStatisticsItem/index.tsx | 4 ++-- .../FormAlarmDraw/TriggerConditionItem/index.less | 0 .../FormAlarmDraw/TriggerConditionItem/index.tsx | 2 +- .../components/FormAlarmDraw/index.tsx | 6 +++--- .../{ => Rules}/components/Operations/index.tsx | 2 +- ui/src/pages/Alarm/Rules/index.tsx | 15 +++++++++++++++ ui/src/pages/Alarm/{ => Rules}/styles/index.less | 0 ui/src/pages/Alarm/index.tsx | 15 --------------- 18 files changed, 45 insertions(+), 29 deletions(-) create mode 100644 ui/src/pages/Alarm/Notifications/index.tsx rename ui/src/pages/Alarm/{ => Rules}/components/AlarmTable/index.tsx (98%) rename ui/src/pages/Alarm/{ => Rules}/components/FormAlarmDraw/InspectionFrequencyItem/index.less (100%) rename ui/src/pages/Alarm/{ => Rules}/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx (96%) rename ui/src/pages/Alarm/{ => Rules}/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx (100%) rename ui/src/pages/Alarm/{ => Rules}/components/FormAlarmDraw/QueryStatisticsItem/index.less (100%) rename ui/src/pages/Alarm/{ => Rules}/components/FormAlarmDraw/QueryStatisticsItem/index.tsx (94%) rename ui/src/pages/Alarm/{ => Rules}/components/FormAlarmDraw/TriggerConditionItem/index.less (100%) rename ui/src/pages/Alarm/{ => Rules}/components/FormAlarmDraw/TriggerConditionItem/index.tsx (98%) rename ui/src/pages/Alarm/{ => Rules}/components/FormAlarmDraw/index.tsx (93%) rename ui/src/pages/Alarm/{ => Rules}/components/Operations/index.tsx (98%) create mode 100644 ui/src/pages/Alarm/Rules/index.tsx rename ui/src/pages/Alarm/{ => Rules}/styles/index.less (100%) delete mode 100644 ui/src/pages/Alarm/index.tsx diff --git a/api/config/resource.yaml b/api/config/resource.yaml index 493084b82..baa54fe97 100644 --- a/api/config/resource.yaml +++ b/api/config/resource.yaml @@ -12,11 +12,14 @@ permission: method: GET path: /api/query/tables - name: alarm - path: /alarm + children: + - name: rules + path: /alarm/rules + - name: notifications + path: /alarm/notifications - name: configure path: /configure - name: systemSettings - path: /sys children: - path: /sys/instances name: database diff --git a/ui/config/routes.ts b/ui/config/routes.ts index bf35a4f29..8ddd1e3ff 100644 --- a/ui/config/routes.ts +++ b/ui/config/routes.ts @@ -17,12 +17,17 @@ export default [ component: "./Configure", }, { - path: "/alarm", name: "alarm", - component: "./Alarm", + routes: [ + { path: "/alarm/rules", name: "rules", component: "./Alarm/Rules" }, + { + path: "/alarm/notifications", + name: "notice", + component: "./Alarm/Notifications", + }, + ], }, { - path: "/sys", name: "systemSettings", component: "../layouts/SystemSetting", routes: [ diff --git a/ui/src/locales/en-US.ts b/ui/src/locales/en-US.ts index dcded269c..fb3a9c292 100644 --- a/ui/src/locales/en-US.ts +++ b/ui/src/locales/en-US.ts @@ -50,6 +50,8 @@ export default { "menu.configure": "Config", "menu.log": "Logs", "menu.alarm": "Alarm", + "menu.alarm.rules": "Rules", + "menu.alarm.notifications": "Notifications", "menu.systemSettings": "Setting", "menu.systemSettings.database": "Instances", "menu.systemSettings.cluster": "Cluster", diff --git a/ui/src/locales/zh-CN.ts b/ui/src/locales/zh-CN.ts index 75aa1a9a1..1a680b3d6 100644 --- a/ui/src/locales/zh-CN.ts +++ b/ui/src/locales/zh-CN.ts @@ -50,6 +50,8 @@ export default { "menu.configure": "配置", "menu.log": "日志", "menu.alarm": "报警", + "menu.alarm.rules": "规则配置", + "menu.alarm.notifications": "通知配置", "menu.systemSettings": "系统设置", "menu.systemSettings.database": "实例管理", "menu.systemSettings.cluster": "集群管理", diff --git a/ui/src/pages/Alarm/Notifications/index.tsx b/ui/src/pages/Alarm/Notifications/index.tsx new file mode 100644 index 000000000..5d42ea7b2 --- /dev/null +++ b/ui/src/pages/Alarm/Notifications/index.tsx @@ -0,0 +1,4 @@ +const Notifications = () => { + return
; +}; +export default Notifications; diff --git a/ui/src/pages/Alarm/components/AlarmTable/index.tsx b/ui/src/pages/Alarm/Rules/components/AlarmTable/index.tsx similarity index 98% rename from ui/src/pages/Alarm/components/AlarmTable/index.tsx rename to ui/src/pages/Alarm/Rules/components/AlarmTable/index.tsx index fb07da72e..5c83e640e 100644 --- a/ui/src/pages/Alarm/components/AlarmTable/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/AlarmTable/index.tsx @@ -1,4 +1,4 @@ -import alarmStyles from "@/pages/Alarm/styles/index.less"; +import alarmStyles from "@/pages/Alarm/Rules/styles/index.less"; import { Button, Divider, message, Space, Table, Tooltip } from "antd"; import { ColumnsType } from "antd/es/table"; import { useIntl } from "umi"; diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/InspectionFrequencyItem/index.less b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.less similarity index 100% rename from ui/src/pages/Alarm/components/FormAlarmDraw/InspectionFrequencyItem/index.less rename to ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.less diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx similarity index 96% rename from ui/src/pages/Alarm/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx rename to ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx index 37953d6c0..e6619b12b 100644 --- a/ui/src/pages/Alarm/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx @@ -1,4 +1,4 @@ -import frequencyStyle from "@/pages/Alarm/components/FormAlarmDraw/InspectionFrequencyItem/index.less"; +import frequencyStyle from "@/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.less"; import { Form, InputNumber, Select, Space } from "antd"; import { NamePath, StoreValue } from "rc-field-form/es/interface"; import { useIntl } from "umi"; diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx similarity index 100% rename from ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx rename to ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/index.less b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/index.less similarity index 100% rename from ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/index.less rename to ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/index.less diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/index.tsx b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/index.tsx similarity index 94% rename from ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/index.tsx rename to ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/index.tsx index 0169497e7..11006e0ea 100644 --- a/ui/src/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/index.tsx @@ -1,6 +1,6 @@ -import queryStatisticsStyles from "@/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/index.less"; +import queryStatisticsStyles from "@/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/index.less"; import { Button, Form, Input, Space } from "antd"; -import CreatedAndUpdatedModal from "@/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal"; +import CreatedAndUpdatedModal from "@/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal"; import { useRef, useState } from "react"; import { FormListOperation } from "antd/es/form/FormList"; import { useIntl } from "umi"; diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/TriggerConditionItem/index.less b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/TriggerConditionItem/index.less similarity index 100% rename from ui/src/pages/Alarm/components/FormAlarmDraw/TriggerConditionItem/index.less rename to ui/src/pages/Alarm/Rules/components/FormAlarmDraw/TriggerConditionItem/index.less diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/TriggerConditionItem/index.tsx b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/TriggerConditionItem/index.tsx similarity index 98% rename from ui/src/pages/Alarm/components/FormAlarmDraw/TriggerConditionItem/index.tsx rename to ui/src/pages/Alarm/Rules/components/FormAlarmDraw/TriggerConditionItem/index.tsx index b5fd7e42e..48c1be5f8 100644 --- a/ui/src/pages/Alarm/components/FormAlarmDraw/TriggerConditionItem/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/TriggerConditionItem/index.tsx @@ -1,4 +1,4 @@ -import conditionStyles from "@/pages/Alarm/components/FormAlarmDraw/TriggerConditionItem/index.less"; +import conditionStyles from "@/pages/Alarm/Rules/components/FormAlarmDraw/TriggerConditionItem/index.less"; import { Button, Form, InputNumber, Select, Space } from "antd"; import { useIntl } from "umi"; import classNames from "classnames"; diff --git a/ui/src/pages/Alarm/components/FormAlarmDraw/index.tsx b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/index.tsx similarity index 93% rename from ui/src/pages/Alarm/components/FormAlarmDraw/index.tsx rename to ui/src/pages/Alarm/Rules/components/FormAlarmDraw/index.tsx index 9905739d2..255ea04b1 100644 --- a/ui/src/pages/Alarm/components/FormAlarmDraw/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/index.tsx @@ -1,10 +1,10 @@ import { Button, Drawer, Form, FormInstance, Input, Space, Spin } from "antd"; -import InspectionFrequencyItem from "@/pages/Alarm/components/FormAlarmDraw/InspectionFrequencyItem"; -import QueryStatisticsItem from "@/pages/Alarm/components/FormAlarmDraw/QueryStatisticsItem"; +import InspectionFrequencyItem from "@/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem"; +import QueryStatisticsItem from "@/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem"; import { useModel } from "@@/plugin-model/useModel"; import { useIntl } from "umi"; import { useEffect, useRef } from "react"; -import TriggerConditionItem from "@/pages/Alarm/components/FormAlarmDraw/TriggerConditionItem"; +import TriggerConditionItem from "@/pages/Alarm/Rules/components/FormAlarmDraw/TriggerConditionItem"; import TextArea from "antd/es/input/TextArea"; import { SaveOutlined } from "@ant-design/icons"; diff --git a/ui/src/pages/Alarm/components/Operations/index.tsx b/ui/src/pages/Alarm/Rules/components/Operations/index.tsx similarity index 98% rename from ui/src/pages/Alarm/components/Operations/index.tsx rename to ui/src/pages/Alarm/Rules/components/Operations/index.tsx index 42244b51a..1014c07c0 100644 --- a/ui/src/pages/Alarm/components/Operations/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/Operations/index.tsx @@ -1,4 +1,4 @@ -import alarmStyles from "@/pages/Alarm/styles/index.less"; +import alarmStyles from "@/pages/Alarm/Rules/styles/index.less"; import { Button, Input, Select, Space } from "antd"; import { useModel } from "@@/plugin-model/useModel"; import { useEffect } from "react"; diff --git a/ui/src/pages/Alarm/Rules/index.tsx b/ui/src/pages/Alarm/Rules/index.tsx new file mode 100644 index 000000000..43f181907 --- /dev/null +++ b/ui/src/pages/Alarm/Rules/index.tsx @@ -0,0 +1,15 @@ +import alarmStyles from "@/pages/Alarm/Rules/styles/index.less"; +import classNames from "classnames"; +import Operations from "@/pages/Alarm/Rules/components/Operations"; +import AlarmTable from "@/pages/Alarm/Rules/components/AlarmTable"; +import FormAlarmDraw from "@/pages/Alarm/Rules/components/FormAlarmDraw"; +const Alarm = () => { + return ( +
+ + + +
+ ); +}; +export default Alarm; diff --git a/ui/src/pages/Alarm/styles/index.less b/ui/src/pages/Alarm/Rules/styles/index.less similarity index 100% rename from ui/src/pages/Alarm/styles/index.less rename to ui/src/pages/Alarm/Rules/styles/index.less diff --git a/ui/src/pages/Alarm/index.tsx b/ui/src/pages/Alarm/index.tsx deleted file mode 100644 index 3da766bbe..000000000 --- a/ui/src/pages/Alarm/index.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import alarmStyles from "@/pages/Alarm/styles/index.less"; -import classNames from "classnames"; -import Operations from "@/pages/Alarm/components/Operations"; -import AlarmTable from "@/pages/Alarm/components/AlarmTable"; -import FormAlarmDraw from "@/pages/Alarm/components/FormAlarmDraw"; -const Alarm = () => { - return ( -
- - - -
- ); -}; -export default Alarm; From 70c5e5f43ccab0569191682539d1631bfa97cf19 Mon Sep 17 00:00:00 2001 From: m1666 <160663534@qq.com> Date: Mon, 28 Feb 2022 11:10:29 +0800 Subject: [PATCH 03/17] fix: Update routing configuration --- ui/config/routes.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/config/routes.ts b/ui/config/routes.ts index 8ddd1e3ff..68e58bcf4 100644 --- a/ui/config/routes.ts +++ b/ui/config/routes.ts @@ -22,7 +22,7 @@ export default [ { path: "/alarm/rules", name: "rules", component: "./Alarm/Rules" }, { path: "/alarm/notifications", - name: "notice", + name: "notifications", component: "./Alarm/Notifications", }, ], From 1d0231946238c777b2339403eca1658282ede6c6 Mon Sep 17 00:00:00 2001 From: m1666 <160663534@qq.com> Date: Mon, 28 Feb 2022 11:16:42 +0800 Subject: [PATCH 04/17] fix: Update routing configuration --- ui/src/locales/en-US.ts | 4 ++-- ui/src/locales/zh-CN.ts | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/ui/src/locales/en-US.ts b/ui/src/locales/en-US.ts index fb3a9c292..2726d4492 100644 --- a/ui/src/locales/en-US.ts +++ b/ui/src/locales/en-US.ts @@ -50,8 +50,8 @@ export default { "menu.configure": "Config", "menu.log": "Logs", "menu.alarm": "Alarm", - "menu.alarm.rules": "Rules", - "menu.alarm.notifications": "Notifications", + "menu.alarm.rules": "Alarm rules", + "menu.alarm.notifications": "Notification channel", "menu.systemSettings": "Setting", "menu.systemSettings.database": "Instances", "menu.systemSettings.cluster": "Cluster", diff --git a/ui/src/locales/zh-CN.ts b/ui/src/locales/zh-CN.ts index 1a680b3d6..d4358ce34 100644 --- a/ui/src/locales/zh-CN.ts +++ b/ui/src/locales/zh-CN.ts @@ -50,8 +50,8 @@ export default { "menu.configure": "配置", "menu.log": "日志", "menu.alarm": "报警", - "menu.alarm.rules": "规则配置", - "menu.alarm.notifications": "通知配置", + "menu.alarm.rules": "报警规则", + "menu.alarm.notifications": "通知方式", "menu.systemSettings": "系统设置", "menu.systemSettings.database": "实例管理", "menu.systemSettings.cluster": "集群管理", From 3b2bcc5342bd92c49ab04ae6aacaa322026e78c8 Mon Sep 17 00:00:00 2001 From: m1666 <160663534@qq.com> Date: Mon, 28 Feb 2022 11:55:02 +0800 Subject: [PATCH 05/17] fix: Update routing configuration --- ui/src/hooks/useTimeUnits.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/src/hooks/useTimeUnits.ts b/ui/src/hooks/useTimeUnits.ts index cd7f10a92..69d10ed56 100644 --- a/ui/src/hooks/useTimeUnits.ts +++ b/ui/src/hooks/useTimeUnits.ts @@ -11,8 +11,8 @@ const useTimeUnits = () => { ]; const FixedTimeUnits = [ - { key: 0, label: i18n.formatMessage({ id: "unit.minute" }) }, { key: 1, label: i18n.formatMessage({ id: "unit.second" }) }, + { key: 0, label: i18n.formatMessage({ id: "unit.minute" }) }, { key: 2, label: i18n.formatMessage({ id: "unit.hour" }) }, { key: 3, label: i18n.formatMessage({ id: "unit.day" }) }, { key: 4, label: i18n.formatMessage({ id: "unit.week" }) }, From ee6568a8ac810bb27727123b49c827c378c4754e Mon Sep 17 00:00:00 2001 From: m1666 <160663534@qq.com> Date: Mon, 28 Feb 2022 16:03:59 +0800 Subject: [PATCH 06/17] fix: Update routing configuration --- ui/src/locales/en-US.ts | 66 ++++++++++--------- ui/src/locales/zh-CN.ts | 65 +++++++++--------- ui/src/models/alarms/useAlarmFormDraw.ts | 4 +- .../components/Operations/index.tsx | 16 +++++ ui/src/pages/Alarm/Notifications/index.tsx | 9 ++- .../Alarm/Notifications/styles/index.less | 12 ++++ .../Rules/components/AlarmTable/index.tsx | 10 +-- .../InspectionFrequencyItem/index.tsx | 2 +- .../CreatedAndUpdatedModal/index.tsx | 20 +++--- .../QueryStatisticsItem/index.tsx | 4 +- .../TriggerConditionItem/index.tsx | 4 +- .../Rules/components/FormAlarmDraw/index.tsx | 14 ++-- .../Rules/components/Operations/index.tsx | 8 +-- 13 files changed, 140 insertions(+), 94 deletions(-) create mode 100644 ui/src/pages/Alarm/Notifications/components/Operations/index.tsx create mode 100644 ui/src/pages/Alarm/Notifications/styles/index.less diff --git a/ui/src/locales/en-US.ts b/ui/src/locales/en-US.ts index 2726d4492..023ae4be4 100644 --- a/ui/src/locales/en-US.ts +++ b/ui/src/locales/en-US.ts @@ -345,37 +345,43 @@ export default { "dateTime.option.years": "{num} year{plural}", // Alarm - // Operations - "alarm.selected.placeholder.database": "Please select database", - "alarm.selected.placeholder.logLibrary": "Please select log library", - "alarm.button.created": "Create Alarm", - "alarm.table.alarmName": "Alarm Name", - "alarm.form.title": "Alarm Monitoring Rule", - "alarm.form.alarmName": "Alarm Name", - "alarm.form.description": "Alarm Description", - "alarm.form.placeholder.alarmName": "Please enter a alarm name", - "alarm.form.placeholder.description": "Please enter an alarm description", - "alarm.form.rule.alarmName": + // Rules + "alarm.rules.selected.placeholder.database": "Please select database", + "alarm.rules.selected.placeholder.logLibrary": "Please select log library", + "alarm.rules.button.created": "Create Alarm", + "alarm.rules.table.alarmName": "Alarm Name", + "alarm.rules.form.title": "Alarm Monitoring Rule", + "alarm.rules.form.alarmName": "Alarm Name", + "alarm.rules.form.description": "Alarm Description", + "alarm.rules.form.placeholder.alarmName": "Please enter a alarm name", + "alarm.rules.form.placeholder.description": + "Please enter an alarm description", + "alarm.rules.form.rule.alarmName": "Please enter lowercase letters, uppercase letters, or underscores", - "alarm.inspectionFrequency": "Inspection Frequency", - "alarm.form.inspectionStatistics": "Inspection Statistics", - "alarm.form.inspectionStatistics.error": + "alarm.rules.inspectionFrequency": "Inspection Frequency", + "alarm.rules.form.inspectionStatistics": "Inspection Statistics", + "alarm.rules.form.inspectionStatistics.error": "At least you need to add a inspection statistics", - "alarm.form.triggerCondition": "Trigger condition", - "alarm.form.triggerCondition.error": + "alarm.rules.form.triggerCondition": "Trigger condition", + "alarm.rules.form.triggerCondition.error": "At least you need to add a trigger condition", - "alarm.form.preview": "Preview", - "alarm.form.notPreview.content": "Please click preview first", - "alarm.inspectionFrequency.selectOption.logLibrary": "Log Library", - "alarm.inspectionFrequency.between": "Between", - "alarm.inspectionFrequency.database": "Database", - "alarm.inspectionFrequency.placeholder.database": "Please select database", - "alarm.inspectionFrequency.logLibrary": "Table", - "alarm.inspectionFrequency.placeholder.logLibrary": "Please select a table", - - "alarm.created": "Create alarm success", - "alarm.updated": "Update alarm success", - "alarm.deleted": "Delete alarm success", - "alarm.deleted.loading": "Deleting alarm...", - "alarm.deleted.content": "Are you sure to delete alarm: {alarm}?", + "alarm.rules.form.preview": "Preview", + "alarm.rules.form.notPreview.content": "Please click preview first", + "alarm.rules.inspectionFrequency.selectOption.logLibrary": "Log Library", + "alarm.rules.inspectionFrequency.between": "Between", + "alarm.rules.inspectionFrequency.database": "Database", + "alarm.rules.inspectionFrequency.placeholder.database": + "Please select database", + "alarm.rules.inspectionFrequency.logLibrary": "Table", + "alarm.rules.inspectionFrequency.placeholder.logLibrary": + "Please select a table", + + "alarm.rules.created": "Create alarm success", + "alarm.rules.updated": "Update alarm success", + "alarm.rules.deleted": "Delete alarm success", + "alarm.rules.deleted.loading": "Deleting alarm...", + "alarm.rules.deleted.content": "Are you sure to delete alarm: {alarm}?", + + // Notifications + "alarm.notice.button.created": "Create Channel", }; diff --git a/ui/src/locales/zh-CN.ts b/ui/src/locales/zh-CN.ts index d4358ce34..a5f72a85d 100644 --- a/ui/src/locales/zh-CN.ts +++ b/ui/src/locales/zh-CN.ts @@ -187,7 +187,7 @@ export default { "config.commit.form.placeholder.message": "请描述一下本次变更修改了哪些内容", // configure-modal-createdConfig - "config.createdConfig.title": "新建配置", + "config.createdConfig.title": "新增配置", "config.createdConfig.form.format": "格式", "config.createdConfig.form.fileName": "文件名", "config.createdConfig.form.placeholder.fileName": "请输入文件名", @@ -325,34 +325,37 @@ export default { "dateTime.option.years": "{num} 年", // Alarm - // Operations - "alarm.selected.placeholder.database": "请选择数据库", - "alarm.selected.placeholder.logLibrary": "请选择日志库", - "alarm.button.created": "新增报警", - "alarm.table.alarmName": "报警名称", - "alarm.form.title": "报警监控规则", - "alarm.form.alarmName": "报警名称", - "alarm.form.description": "报警描述", - "alarm.form.placeholder.alarmName": "请输入报警名称", - "alarm.form.placeholder.description": "请输入报警描述", - "alarm.form.rule.alarmName": "请输入小写字母、大写字母，或下划线", - "alarm.inspectionFrequency": "检查频率", - "alarm.form.inspectionStatistics": "检查统计", - "alarm.form.inspectionStatistics.error": "最少需要添加一条检查统计", - "alarm.form.triggerCondition": "触发条件", - "alarm.form.triggerCondition.error": "最少需要添加一条触发条件", - "alarm.form.preview": "预览", - "alarm.form.notPreview.content": "请先点击预览", - "alarm.inspectionFrequency.selectOption.logLibrary": "日志库", - "alarm.inspectionFrequency.between": "查询区间", - "alarm.inspectionFrequency.database": "数据库", - "alarm.inspectionFrequency.placeholder.database": "请选择数据库", - "alarm.inspectionFrequency.logLibrary": "数据表", - "alarm.inspectionFrequency.placeholder.logLibrary": "请选择数据表", - - "alarm.created": "新增报警成功", - "alarm.updated": "更新报警成功", - "alarm.deleted": "删除报警成功", - "alarm.deleted.loading": "正在删除报警...", - "alarm.deleted.content": "确定删除报警：{alarm} 吗？", + // Rules + "alarm.rules.selected.placeholder.database": "请选择数据库", + "alarm.rules.selected.placeholder.logLibrary": "请选择日志库", + "alarm.rules.button.created": "新增报警", + "alarm.rules.table.alarmName": "报警名称", + "alarm.rules.form.title": "报警监控规则", + "alarm.rules.form.alarmName": "报警名称", + "alarm.rules.form.description": "报警描述", + "alarm.rules.form.placeholder.alarmName": "请输入报警名称", + "alarm.rules.form.placeholder.description": "请输入报警描述", + "alarm.rules.form.rule.alarmName": "请输入小写字母、大写字母，或下划线", + "alarm.rules.inspectionFrequency": "检查频率", + "alarm.rules.form.inspectionStatistics": "检查统计", + "alarm.rules.form.inspectionStatistics.error": "最少需要添加一条检查统计", + "alarm.rules.form.triggerCondition": "触发条件", + "alarm.rules.form.triggerCondition.error": "最少需要添加一条触发条件", + "alarm.rules.form.preview": "预览", + "alarm.rules.form.notPreview.content": "请先点击预览", + "alarm.rules.inspectionFrequency.selectOption.logLibrary": "日志库", + "alarm.rules.inspectionFrequency.between": "查询区间", + "alarm.rules.inspectionFrequency.database": "数据库", + "alarm.rules.inspectionFrequency.placeholder.database": "请选择数据库", + "alarm.rules.inspectionFrequency.logLibrary": "数据表", + "alarm.rules.inspectionFrequency.placeholder.logLibrary": "请选择数据表", + + "alarm.rules.created": "新增报警成功", + "alarm.rules.updated": "更新报警成功", + "alarm.rules.deleted": "删除报警成功", + "alarm.rules.deleted.loading": "正在删除报警...", + "alarm.rules.deleted.content": "确定删除报警：{alarm} 吗？", + + // Notifications + "alarm.notify.button.created": "新增渠道", }; diff --git a/ui/src/models/alarms/useAlarmFormDraw.ts b/ui/src/models/alarms/useAlarmFormDraw.ts index a6063f0d8..98e473de2 100644 --- a/ui/src/models/alarms/useAlarmFormDraw.ts +++ b/ui/src/models/alarms/useAlarmFormDraw.ts @@ -20,14 +20,14 @@ const useAlarmFormDraw = () => { const doCreatedAlarm = useRequest(api.createdAlarm, { loadingText: { loading: undefined, - done: formatMessage({ id: "alarm.created" }), + done: formatMessage({ id: "alarm.rules.created" }), }, }); const doUpdatedAlarm = useRequest(api.updatedAlarm, { loadingText: { loading: undefined, - done: formatMessage({ id: "alarm.updated" }), + done: formatMessage({ id: "alarm.rules.updated" }), }, }); diff --git a/ui/src/pages/Alarm/Notifications/components/Operations/index.tsx b/ui/src/pages/Alarm/Notifications/components/Operations/index.tsx new file mode 100644 index 000000000..4b6a427cc --- /dev/null +++ b/ui/src/pages/Alarm/Notifications/components/Operations/index.tsx @@ -0,0 +1,16 @@ +import notificationStyles from "@/pages/Alarm/Notifications/styles/index.less"; +import classNames from "classnames"; +import { Button } from "antd"; +import { PlusOutlined } from "@ant-design/icons"; +import { useIntl } from "umi"; +const Operations = () => { + const i18n = useIntl(); + return ( +
+ +
+ ); +}; +export default Operations; diff --git a/ui/src/pages/Alarm/Notifications/index.tsx b/ui/src/pages/Alarm/Notifications/index.tsx index 5d42ea7b2..16a89bedc 100644 --- a/ui/src/pages/Alarm/Notifications/index.tsx +++ b/ui/src/pages/Alarm/Notifications/index.tsx @@ -1,4 +1,11 @@ +import notificationStyles from "@/pages/Alarm/Notifications/styles/index.less"; +import classNames from "classnames"; +import Operations from "@/pages/Alarm/Notifications/components/Operations"; const Notifications = () => { - return
; + return ( +
+ +
+ ); }; export default Notifications; diff --git a/ui/src/pages/Alarm/Notifications/styles/index.less b/ui/src/pages/Alarm/Notifications/styles/index.less new file mode 100644 index 000000000..96a9ce743 --- /dev/null +++ b/ui/src/pages/Alarm/Notifications/styles/index.less @@ -0,0 +1,12 @@ +.notificationMain { + display: flex; + flex-direction: column; + height: 100%; + padding: 5px 15px; + + .operationMain { + display: flex; + flex: 0 0 42px; + align-items: center; + } +} diff --git a/ui/src/pages/Alarm/Rules/components/AlarmTable/index.tsx b/ui/src/pages/Alarm/Rules/components/AlarmTable/index.tsx index 5c83e640e..e97810c09 100644 --- a/ui/src/pages/Alarm/Rules/components/AlarmTable/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/AlarmTable/index.tsx @@ -41,13 +41,13 @@ const AlarmTable = () => { const handleDelete = (record: AlarmType) => { DeletedModal({ content: i18n.formatMessage( - { id: "alarm.deleted.content" }, + { id: "alarm.rules.deleted.content" }, { alarm: record.alarmName } ), onOk: () => { const hideMessage = message.loading( { - content: i18n.formatMessage({ id: "alarm.deleted.loading" }), + content: i18n.formatMessage({ id: "alarm.rules.deleted.loading" }), key: "alarm", }, 0 @@ -59,7 +59,7 @@ const AlarmTable = () => { doGetAlarms.run(searchQuery); message.success( { - content: i18n.formatMessage({ id: "alarm.deleted" }), + content: i18n.formatMessage({ id: "alarm.rules.deleted" }), key: "alarm", }, 3 @@ -76,12 +76,12 @@ const AlarmTable = () => { const column: ColumnsType = [ { - title: i18n.formatMessage({ id: "alarm.table.alarmName" }), + title: i18n.formatMessage({ id: "alarm.rules.table.alarmName" }), dataIndex: "alarmName", align: "center", }, { - title: i18n.formatMessage({ id: "alarm.inspectionFrequency" }), + title: i18n.formatMessage({ id: "alarm.rules.inspectionFrequency" }), dataIndex: "interval", align: "center", render: (interval: number, record: AlarmType) => { diff --git a/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx index e6619b12b..d68e360f3 100644 --- a/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/InspectionFrequencyItem/index.tsx @@ -81,7 +81,7 @@ const InspectionFrequencyItem = () => { return ( diff --git a/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx index a427db1fa..9f0e710b6 100644 --- a/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx +++ b/ui/src/pages/Alarm/Rules/components/FormAlarmDraw/QueryStatisticsItem/CreatedAndUpdatedModal/index.tsx @@ -173,7 +173,7 @@ const CreatedAndUpdatedModal = ({ if (!onClickPreview.current) { Modal.warning({ content: i18n.formatMessage({ - id: "alarm.form.notPreview.content", + id: "alarm.rules.form.notPreview.content", }), }); return; @@ -204,7 +204,9 @@ const CreatedAndUpdatedModal = ({ return ( { getLogLibraries.run(id); @@ -282,14 +284,14 @@ const CreatedAndUpdatedModal = ({ return ( @@ -134,14 +134,14 @@ const FormAlarmDraw = () => {