fix(alarm): alarm Configuration

src/pages/rule-engine/Alarm/Config/index.tsx

@@ -10,7 +10,7 @@ import FLevelInput from '@/components/FLevelInput';
 import { IOConfigItem } from '@/pages/rule-engine/Alarm/Config/typing';
 import Service from '@/pages/rule-engine/Alarm/Config/service';
 
-const service = new Service('alarm/config');
+export const service = new Service('alarm/config');
 const Config = () => {
   const [tab, setTab] = useState<'io' | 'config' | string>('config');
   const SchemaField = createSchemaField({

src/pages/rule-engine/Alarm/Configuration/Save/index.less

@@ -0,0 +1,8 @@
+.form {
+  :global {
+    .ant-radio-button-wrapper {
+      height: 100%;
+      margin-right: 15px;
+    }
+  }
+}

src/pages/rule-engine/Alarm/Configuration/Save/index.tsx

@@ -0,0 +1,200 @@
+import { message, Modal } from 'antd';
+import { useMemo } from 'react';
+import { createForm } from '@formily/core';
+import { createSchemaField } from '@formily/react';
+import { Form, FormGrid, FormItem, Input, Radio, Select } from '@formily/antd';
+import { ISchema } from '@formily/json-schema';
+import { PermissionButton } from '@/components';
+import { PlusOutlined } from '@ant-design/icons';
+import Service from '@/pages/rule-engine/Alarm/Configuration/service';
+import { useAsyncDataSource } from '@/utils/util';
+import styles from './index.less';
+import { service as ConfigService } from '../../Config';
+
+interface Props {
+  visible: boolean;
+  close: () => void;
+}
+
+const alarm1 = require('/public/images/alarm/alarm1.png');
+const alarm2 = require('/public/images/alarm/alarm2.png');
+const alarm3 = require('/public/images/alarm/alarm3.png');
+const alarm4 = require('/public/images/alarm/alarm4.png');
+const alarm5 = require('/public/images/alarm/alarm5.png');
+
+const service = new Service('alarm/config');
+
+const createImageLabel = (image: string, text: string) => {
+  return (
+    <div style={{ textAlign: 'center', marginTop: 10, fontSize: '25px' }}>
+      <img alt="" height="40px" src={image} />
+      {text}
+    </div>
+  );
+};
+
+const Save = (props: Props) => {
+  const { visible, close } = props;
+
+  const LevelMap = {
+    1: alarm1,
+    2: alarm2,
+    3: alarm3,
+    4: alarm4,
+    5: alarm5,
+  };
+  const getLevel = () => {
+    return ConfigService.queryLevel().then((resp) => {
+      if (resp.status === 200) {
+        console.log(resp, 'resp');
+        return resp.result?.levels?.map((item: { level: number; title: string }) => ({
+          label: createImageLabel(LevelMap[item.level], item.title),
+          value: item.level,
+        }));
+      }
+    });
+  };
+  const form = useMemo(
+    () =>
+      createForm({
+        validateFirst: true,
+        effects() {},
+      }),
+    [],
+  );
+
+  const getSupports = () => service.getTargetTypes();
+
+  const SchemaField = createSchemaField({
+    components: {
+      FormItem,
+      Input,
+      Select,
+      FormGrid,
+      Radio,
+    },
+  });
+
+  const handleSave = async () => {
+    const data: ConfigItem = await form.submit();
+    console.log(data, 'dat');
+    const resp: any = await service.update(data);
+    if (resp.status === 200) {
+      message.success('操作成功');
+    }
+  };
+
+  const schema: ISchema = {
+    type: 'object',
+    properties: {
+      layout: {
+        type: 'void',
+        'x-decorator': 'FormGrid',
+        'x-decorator-props': {
+          maxColumns: 2,
+          minColumns: 2,
+          columnGap: 24,
+        },
+        properties: {
+          name: {
+            title: '名称',
+            'x-decorator': 'FormItem',
+            'x-component': 'Input',
+            'x-decorator-props': {
+              gridSpan: 1,
+            },
+            'x-component-props': {
+              placeholder: '请输入名称',
+            },
+          },
+          type: {
+            title: '类型',
+            'x-decorator': 'FormItem',
+            'x-component': 'Select',
+            'x-decorator-props': {
+              gridSpan: 1,
+            },
+            'x-reactions': '{{useAsyncDataSource(getSupports)}}',
+            'x-component-props': {
+              placeholder: '请选择类型',
+            },
+          },
+        },
+      },
+      level: {
+        title: '级别',
+        'x-decorator': 'FormItem',
+        'x-component': 'Radio.Group',
+        'x-component-props': {
+          optionType: 'button',
+          placeholder: '请选择类型',
+        },
+        'x-reactions': '{{useAsyncDataSource(getLevel)}}',
+        'x-decorator-props': {
+          gridSpan: 1,
+        },
+      },
+      sceneId: {
+        title: '关联触发场景',
+        'x-decorator': 'FormItem',
+        'x-component': 'Select',
+        'x-decorator-props': {
+          gridSpan: 1,
+          addonAfter: (
+            <PermissionButton
+              type="link"
+              style={{ padding: 0 }}
+              isPermission={true}
+              onClick={() => {
+                // const tab: any = window.open(`${origin}/#/system/department?save=true`);
+                // tab!.onTabSaveSuccess = (value: any) => {
+                //   form.setFieldState('orgIdList', async (state) => {
+                // state.dataSource = await getOrg().then((resp) =>
+                //   resp.result?.map((item: Record<string, unknown>) => ({
+                //     ...item,
+                //     label: item.name,
+                //     value: item.id,
+                //   })),
+                // );
+                // state.value = [...(state.value || []), value.id];
+                // });
+                // };
+              }}
+            >
+              <PlusOutlined />
+            </PermissionButton>
+          ),
+        },
+        'x-component-props': {
+          placeholder: '请输入名称',
+        },
+      },
+      description: {
+        title: '说明',
+        'x-decorator': 'FormItem',
+        'x-component': 'Input.TextArea',
+        'x-decorator-props': {
+          gridSpan: 1,
+        },
+        'x-component-props': {
+          placeholder: '请输入描述信息',
+        },
+      },
+    },
+  };
+
+  return (
+    <Modal
+      width="40vw"
+      visible={visible}
+      onOk={handleSave}
+      onCancel={() => close()}
+      title="新增告警"
+    >
+      <Form className={styles.form} form={form} layout="vertical">
+        <SchemaField schema={schema} scope={{ useAsyncDataSource, getSupports, getLevel }} />
+      </Form>
+    </Modal>
+  );
+};
+export default Save;

src/pages/rule-engine/Alarm/Configuration/index.tsx

@@ -0,0 +1,117 @@
+import { PageContainer } from '@ant-design/pro-layout';
+import SearchComponent from '@/components/SearchComponent';
+import { ActionType, ProColumns } from '@jetlinks/pro-table';
+import { PermissionButton } from '@/components';
+import { DeleteOutlined, EditOutlined, PlusOutlined } from '@ant-design/icons';
+import { useIntl } from '@@/plugin-locale/localeExports';
+import { useRef, useState } from 'react';
+import { Space } from 'antd';
+import ProTableCard from '@/components/ProTableCard';
+import Save from './Save';
+
+const Configuration = () => {
+  const intl = useIntl();
+
+  const columns: ProColumns<ConfigItem>[] = [
+    {
+      dataIndex: 'name',
+      title: '名称',
+    },
+    {
+      title: '类型',
+      dataIndex: 'targetType',
+    },
+    {
+      title: '告警级别',
+      dataIndex: 'level',
+    },
+    {
+      title: '关联场景联动',
+      dataIndex: 'sceneName',
+    },
+    {
+      title: '状态',
+      dataIndex: 'state',
+    },
+    {
+      title: '说明',
+      dataIndex: 'description',
+    },
+    {
+      title: '操作',
+      valueType: 'option',
+      align: 'center',
+      render: (_, record) => [
+        <PermissionButton
+          isPermission={true}
+          tooltip={{
+            title: intl.formatMessage({
+              id: 'pages.data.option.edit',
+              defaultMessage: '编辑',
+            }),
+          }}
+          onClick={() => {
+            console.log(record);
+          }}
+        >
+          <EditOutlined />
+        </PermissionButton>,
+        <PermissionButton
+          isPermission={true}
+          tooltip={{
+            title: intl.formatMessage({
+              id: 'pages.data.option.remove',
+              defaultMessage: '删除',
+            }),
+          }}
+        >
+          <DeleteOutlined />
+        </PermissionButton>,
+      ],
+    },
+  ];
+
+  const actionRef = useRef<ActionType>();
+
+  const [param, setParam] = useState({});
+
+  const [visible, setVisible] = useState<boolean>(false);
+  return (
+    <PageContainer>
+      <SearchComponent
+        field={columns}
+        onSearch={(data) => {
+          actionRef.current?.reset?.();
+          setParam(data);
+        }}
+      />
+      <ProTableCard<ConfigItem>
+        actionRef={actionRef}
+        rowKey="id"
+        search={false}
+        params={param}
+        columns={columns}
+        headerTitle={
+          <Space>
+            <PermissionButton
+              isPermission={true}
+              onClick={() => {
+                setVisible(true);
+              }}
+              key="button"
+              icon={<PlusOutlined />}
+              type="primary"
+            >
+              {intl.formatMessage({
+                id: 'pages.data.option.add',
+                defaultMessage: '新增',
+              })}
+            </PermissionButton>
+          </Space>
+        }
+      />
+      <Save visible={visible} close={() => setVisible(false)} />
+    </PageContainer>
+  );
+};
+export default Configuration;

src/pages/rule-engine/Alarm/Configuration/service.ts

@@ -0,0 +1,17 @@
+import BaseService from '@/utils/BaseService';
+import { request } from 'umi';
+import SystemConst from '@/utils/const';
+
+class Service extends BaseService<ConfigItem> {
+  public getTargetTypes = () =>
+    request(`/${SystemConst.API_BASE}/alarm/config/target-type/supports`, {
+      method: 'GET',
+    }).then((resp) => {
+      return resp.result.map((item: { id: string; name: string }) => ({
+        label: item.name,
+        value: item.id,
+      }));
+    });
+}
+
+export default Service;

src/pages/rule-engine/Alarm/Configuration/typings.d.ts

@@ -0,0 +1,9 @@
+type ConfigItem = {
+  name: string;
+  targetType: string;
+  level: number;
+  sceneName: string;
+  sceneId: string;
+  state: string;
+  description: string;
+};

src/utils/menu/router.ts

@@ -61,6 +61,7 @@ export enum MENUS_CODE {
   'rule-engine/SQLRule' = 'rule-engine/SQLRule',
   'rule-engine/Scene' = 'rule-engine/Scene',
   'rule-engine/Alarm/Config' = 'rule-engine/Alarm/Config',
+  'rule-engine/Alarm/Configuration' = 'rule-engine/Alarm/Configuration',
   'simulator/Device' = 'simulator/Device',
   'system/DataSource' = 'system/DataSource',
   'system/Department/Assets' = 'system/Department/Assets',