feat: update frequency select

src/components/MetricsFilterPanel/FrequencySelect.tsx

@@ -0,0 +1,36 @@
+import React from 'react';
+import { Select } from 'antd';
+
+import { IntervalFrequencyItem, INTERVAL_FREQUENCY_LIST } from '@/utils/service';
+import Icon from '@/components/Icon';
+
+import styles from './index.module.less';
+
+interface Props {
+  value?: number;
+  onChange?: (value: number) => void;
+  handleRefresh?: () => void;
+  timeOptions?: IntervalFrequencyItem[];
+}
+
+function FrequencySelect(props: Props) {
+  const { value, onChange, handleRefresh, timeOptions } = props;
+  return (
+    <div className={styles.frequency}>
+      <div onClick={handleRefresh} className={styles.freshIcon}><Icon className={styles.freshIconItem} icon="#iconrefresh" /></div>
+      <Select
+        className={styles.frequencySelect}
+        onChange={onChange}
+        value={value}
+      >
+        {
+          (timeOptions || INTERVAL_FREQUENCY_LIST).map(item => (
+            <Select.Option key={item.value} value={item.value}>{item.type}</Select.Option>
+          ))
+        }
+      </Select>
+    </div>
+  )
+}
+
+export default FrequencySelect;

src/components/MetricsFilterPanel/index.tsx

@@ -2,34 +2,12 @@ import React, { forwardRef, useEffect, useImperativeHandle, useMemo } from 'reac
 import { Form, FormInstance, Select, TreeSelect } from 'antd';
 import intl from 'react-intl-universal';
 
-import { INTERVAL_FREQUENCY_LIST } from '@/utils/service';
-import TimeSelect from '../TimeSelect';
-
-import styles from './index.module.less';
+import TimeSelect from '@/components/TimeSelect';
 import { TIME_OPTION_TYPE } from '@/utils/dashboard';
-import Icon from '../Icon';
 import { isCloudVersion } from '@/utils';
+import FrequencySelect from './FrequencySelect';
 
-
-export function FrequencySelect(props: { value?, onChange?, handleRefresh?}) {
-  const { value, onChange, handleRefresh } = props;
-  return (
-    <div className={styles.frequency}>
-      <div onClick={handleRefresh} className={styles.freshIcon}><Icon className={styles.freshIconItem} icon="#iconrefresh" /></div>
-      <Select
-        className={styles.frequencySelect}
-        onChange={onChange}
-        value={value}
-      >
-        {
-          INTERVAL_FREQUENCY_LIST.map(item => (
-            <Select.Option key={item.value} value={item.value}>{item.type}</Select.Option>
-          ))
-        }
-      </Select>
-    </div>
-  )
-}
+import styles from './index.module.less';
 
 interface IProps {
   instanceList: string[];

src/utils/interface.ts

@@ -138,4 +138,4 @@ export interface IPanelConfig {
   [ServiceName.MetadListener]: IServicePanelConfig[];
   [ServiceName.StoragedListener]: IServicePanelConfig[];
   [ServiceName.Drainer]: IServicePanelConfig[];
-}
+}

src/utils/service.ts

@@ -7,6 +7,7 @@ export const SERVICE_DEFAULT_RANGE = 6 * 60 * 60 * 1000;
 
 export enum INTERVAL_FREQUENCY_TYPE {
   OFF = 'Off',
+  S2 = '2s',
   S5 = '5s',
   S10 = '10s',
   S15 = '15s',
@@ -17,7 +18,12 @@ export enum INTERVAL_FREQUENCY_TYPE {
   M30 = '30m',
 }
 
-export const INTERVAL_FREQUENCY_LIST = [
+export interface IntervalFrequencyItem {
+  type: INTERVAL_FREQUENCY_TYPE;
+  value: number;
+}
+
+export const INTERVAL_FREQUENCY_LIST: IntervalFrequencyItem[] = [
   {
     type: INTERVAL_FREQUENCY_TYPE.OFF,
     value: 0,