|
|
|
|
@ -1,33 +1,37 @@
|
|
|
|
|
import IsBatchDelete from '@/components/BatchOperation/isBatchDelete';
|
|
|
|
|
import AlarmLevelBox from '@/components/DictionaryBox/alarmLevel';
|
|
|
|
|
import TableActionCard from '@/components/TableActionCard';
|
|
|
|
|
import IsDelete from '@/components/TableActionCard/isDelete';
|
|
|
|
|
import { alarmLevelStatusEnum } from '@/enums/status';
|
|
|
|
|
import {
|
|
|
|
|
deleteDeviceCategoryDeleteDeviceCategory,
|
|
|
|
|
deleteDeviceCategoryDeleteDeviceCategoryByIds,
|
|
|
|
|
postDeviceCategoryGetDeviceCategoryList,
|
|
|
|
|
} from '@/services/device/DeviceCategory';
|
|
|
|
|
import { PlusOutlined, SettingOutlined } from '@ant-design/icons';
|
|
|
|
|
import { EditOutlined, PlusOutlined, SettingOutlined } from '@ant-design/icons';
|
|
|
|
|
import type { ActionType, ProColumns } from '@ant-design/pro-components';
|
|
|
|
|
import { PageContainer, ProTable } from '@ant-design/pro-components';
|
|
|
|
|
import { Access, FormattedMessage, history, useAccess, useIntl } from '@umijs/max';
|
|
|
|
|
import { Button, message } from 'antd';
|
|
|
|
|
import { Button, Space, message } from 'antd';
|
|
|
|
|
import React, { useRef, useState } from 'react';
|
|
|
|
|
import { proTableCommonOptions, proTablePaginationOptions } from '../../../../config/defaultTable';
|
|
|
|
|
import { ColumnDrawer } from './components/ColumnDrawer';
|
|
|
|
|
import CreateForm from './components/CreateForm';
|
|
|
|
|
import UpdateForm from './components/UpdateForm';
|
|
|
|
|
import AlarmStatusForm from './components/alarmStatusForm';
|
|
|
|
|
const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
/**
|
|
|
|
|
* @en-US Pop-up window of new window
|
|
|
|
|
* @zh-CN 新建窗口的弹窗
|
|
|
|
|
* */
|
|
|
|
|
const [createModalOpen, setCreateModalOpen] = useState<boolean>(false);
|
|
|
|
|
// 告警状态设置
|
|
|
|
|
const [alarmStatusModalOpen, setAlarmStatusModalOpen] = useState<boolean>(true);
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* @en-US The pop-up window of the distribution update window
|
|
|
|
|
* @zh-CN 分布更新窗口的弹窗
|
|
|
|
|
* */
|
|
|
|
|
const [updateModalOpen, setUpdateModalOpen] = useState<boolean>(false);
|
|
|
|
|
const [showDetail, setShowDetail] = useState<boolean>(false);
|
|
|
|
|
/**
|
|
|
|
|
* @en-US International configuration
|
|
|
|
|
* @zh-CN 国际化配置
|
|
|
|
|
@ -40,12 +44,12 @@ const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
const [currentRow, setCurrentRow] = useState<API.DeviceCategory>();
|
|
|
|
|
const [selectedRowsState, setSelectedRows] = useState<API.DeviceCategory[]>([]);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
// TODO
|
|
|
|
|
1. 告警级别设置
|
|
|
|
|
2. 告警列表-告警级别渲染
|
|
|
|
|
3. 项目部署-告警模块
|
|
|
|
|
1. 告警列表-告警级别渲染-操作按钮 2h
|
|
|
|
|
// TODO 讨论
|
|
|
|
|
1. 告警状态设置
|
|
|
|
|
2. 项目部署告警添加
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
const handleUpdateModal = () => {
|
|
|
|
|
@ -64,12 +68,11 @@ const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
setCreateModalOpen(true);
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
const handleColumnDrawer = () => {
|
|
|
|
|
if (showDetail) {
|
|
|
|
|
setShowDetail(false);
|
|
|
|
|
setCurrentRow(undefined);
|
|
|
|
|
const handleAlarmStatusModal = () => {
|
|
|
|
|
if (alarmStatusModalOpen) {
|
|
|
|
|
setAlarmStatusModalOpen(false);
|
|
|
|
|
} else {
|
|
|
|
|
setShowDetail(true);
|
|
|
|
|
setAlarmStatusModalOpen(true);
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
const handleDestroy = async (selectedRow: API.DeviceCategory) => {
|
|
|
|
|
@ -96,23 +99,28 @@ const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
hideInSearch: true,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: (
|
|
|
|
|
<FormattedMessage id="alarm.setting.table.list.category" defaultMessage="$$$" />
|
|
|
|
|
),
|
|
|
|
|
title: <FormattedMessage id="alarm.setting.table.list.category" defaultMessage="$$$" />,
|
|
|
|
|
dataIndex: 'category',
|
|
|
|
|
hideInSearch: true,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: (
|
|
|
|
|
<FormattedMessage id="alarm.setting.table.list.level" defaultMessage="$$$" />
|
|
|
|
|
),
|
|
|
|
|
dataIndex: 'level',
|
|
|
|
|
hideInSearch: true,
|
|
|
|
|
title: <FormattedMessage id="alarm.setting.table.list.level" defaultMessage="$$$" />,
|
|
|
|
|
dataIndex: 'level',
|
|
|
|
|
hideInSearch: true,
|
|
|
|
|
render: (text, record, index) => {
|
|
|
|
|
console.log(text, record, index, 'level_record');
|
|
|
|
|
const currVal = index % 6;
|
|
|
|
|
const currLevel = alarmLevelStatusEnum[currVal];
|
|
|
|
|
return (
|
|
|
|
|
<Space>
|
|
|
|
|
<AlarmLevelBox {...currLevel}></AlarmLevelBox>
|
|
|
|
|
<span style={{ color: currLevel.color }}>{currLevel.defaultLabel}</span>
|
|
|
|
|
</Space>
|
|
|
|
|
);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: (
|
|
|
|
|
<FormattedMessage id="alarm.setting.table.list.createTime" defaultMessage="$$$" />
|
|
|
|
|
),
|
|
|
|
|
title: <FormattedMessage id="alarm.setting.table.list.createTime" defaultMessage="$$$" />,
|
|
|
|
|
dataIndex: 'createTime',
|
|
|
|
|
sorter: true,
|
|
|
|
|
hideInSearch: true,
|
|
|
|
|
@ -130,23 +138,34 @@ const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
{
|
|
|
|
|
key: 'update',
|
|
|
|
|
renderDom: (
|
|
|
|
|
<Button
|
|
|
|
|
// <Button
|
|
|
|
|
// key="update"
|
|
|
|
|
// type="link"
|
|
|
|
|
// size="small"
|
|
|
|
|
// onClick={() => {
|
|
|
|
|
// setUpdateModalOpen(true);
|
|
|
|
|
// setCurrentRow(record);
|
|
|
|
|
// }}
|
|
|
|
|
// >
|
|
|
|
|
// <FormattedMessage id="common.edit" defaultMessage="Update" />
|
|
|
|
|
// </Button>
|
|
|
|
|
<EditOutlined
|
|
|
|
|
key="update"
|
|
|
|
|
type="link"
|
|
|
|
|
size="small"
|
|
|
|
|
style={{
|
|
|
|
|
color: 'rgba(21, 77, 221, 1)',
|
|
|
|
|
}}
|
|
|
|
|
onClick={() => {
|
|
|
|
|
setUpdateModalOpen(true);
|
|
|
|
|
setCurrentRow(record);
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<FormattedMessage id="common.edit" defaultMessage="Update" />
|
|
|
|
|
</Button>
|
|
|
|
|
/>
|
|
|
|
|
),
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
key: 'destroy',
|
|
|
|
|
renderDom: (
|
|
|
|
|
<IsDelete
|
|
|
|
|
buttonType="deleteIcon"
|
|
|
|
|
deleteApi={() => {
|
|
|
|
|
handleDestroy(record).then(() => {});
|
|
|
|
|
}}
|
|
|
|
|
@ -206,14 +225,15 @@ const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
accessible={access.canUpdate(history.location.pathname)}
|
|
|
|
|
key={`${history.location.pathname}-add`}
|
|
|
|
|
>
|
|
|
|
|
<Button
|
|
|
|
|
<Button
|
|
|
|
|
type="primary"
|
|
|
|
|
key="primary"
|
|
|
|
|
key="setting"
|
|
|
|
|
onClick={() => {
|
|
|
|
|
setCreateModalOpen(true);
|
|
|
|
|
setAlarmStatusModalOpen(true);
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<SettingOutlined /> <FormattedMessage id="alarm.setting.table.list.setting" defaultMessage="New" />
|
|
|
|
|
<SettingOutlined />{' '}
|
|
|
|
|
<FormattedMessage id="alarm.setting.table.list.setting" defaultMessage="New" />
|
|
|
|
|
</Button>
|
|
|
|
|
<Button
|
|
|
|
|
type="primary"
|
|
|
|
|
@ -222,7 +242,8 @@ const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
setCreateModalOpen(true);
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<PlusOutlined /> <FormattedMessage id="alarm.setting.table.list.add" defaultMessage="New" />
|
|
|
|
|
<PlusOutlined />{' '}
|
|
|
|
|
<FormattedMessage id="alarm.setting.table.list.add" defaultMessage="New" />
|
|
|
|
|
</Button>
|
|
|
|
|
</Access>,
|
|
|
|
|
]}
|
|
|
|
|
@ -257,7 +278,12 @@ const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
},
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<AlarmStatusForm
|
|
|
|
|
alarmStatusModalOpen={alarmStatusModalOpen}
|
|
|
|
|
values={currentRow || {}}
|
|
|
|
|
handleModal={handleAlarmStatusModal}
|
|
|
|
|
reload={actionRef.current?.reload}
|
|
|
|
|
/>
|
|
|
|
|
<CreateForm
|
|
|
|
|
createModalOpen={createModalOpen}
|
|
|
|
|
values={currentRow || {}}
|
|
|
|
|
@ -270,13 +296,6 @@ const DeviceCategoryList: React.FC = () => {
|
|
|
|
|
handleModal={handleUpdateModal}
|
|
|
|
|
reload={actionRef.current?.reload}
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<ColumnDrawer
|
|
|
|
|
handleDrawer={handleColumnDrawer}
|
|
|
|
|
isShowDetail={showDetail}
|
|
|
|
|
columns={columns}
|
|
|
|
|
currentRow={currentRow}
|
|
|
|
|
/>
|
|
|
|
|
</PageContainer>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
JINGYJ
1 year ago