fect: 离线告警规则接口联调
JINGYJ
1 year ago
parent
66bf130b49
commit
61aceb63c5
@ -0,0 +1,58 @@
|
|||||||
|
import React, { useState } from 'react';
|
||||||
|
import { Button, Tag, message } from 'antd';
|
||||||
|
import { RedoOutlined } from '@ant-design/icons';
|
||||||
|
import { postTestDevice } from '@/services/alarm/Interfaces'
|
||||||
|
import moment from 'moment';
|
||||||
|
import { useIntl } from '@umijs/max';
|
||||||
|
|
||||||
|
|
||||||
|
interface ImageSinglePopoverProps {
|
||||||
|
values: any;
|
||||||
|
reload: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
const CaptureButton: React.FC<ImageSinglePopoverProps> = (props) => {
|
||||||
|
const intl = useIntl();
|
||||||
|
const [loading, setLoading] = useState<boolean>(false);
|
||||||
|
const connection = () => {
|
||||||
|
setLoading(true);
|
||||||
|
postTestDevice({
|
||||||
|
device_ip: props.values.device_ip,
|
||||||
|
id: props.values.id,
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
if(res.success) {
|
||||||
|
message.success(res.msg);
|
||||||
|
}
|
||||||
|
props.reload();
|
||||||
|
setLoading(false);
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' }));
|
||||||
|
setLoading(false);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Tag bordered={false} color={props.values.test_result === 1? "success": ""} style={{
|
||||||
|
// fontSize:14,
|
||||||
|
color: props.values.test_result === 1? '#52C41A': "#999"
|
||||||
|
}}>
|
||||||
|
{props.values.test_result === 1 ? '在线' : '离线'}
|
||||||
|
</Tag>
|
||||||
|
<span>{moment(props.values.test_time).format('YYYY-MM-DD hh:mm:ss')}</span>
|
||||||
|
<Button
|
||||||
|
type="link"
|
||||||
|
icon={<RedoOutlined />}
|
||||||
|
loading={loading}
|
||||||
|
onClick={() => {
|
||||||
|
connection()
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CaptureButton;
|
||||||
@ -0,0 +1,80 @@
|
|||||||
|
import { postInterfaces, postTestDevice } from '@/services/alarm/Interfaces';
|
||||||
|
import { ModalForm, ProForm, ProFormFieldSet, ProFormSelect, ProFormSwitch, ProFormText, ProFormTextArea } from '@ant-design/pro-components';
|
||||||
|
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||||
|
import { Image, Form, message } from 'antd';
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
import {
|
||||||
|
proFormSmallItemStyleProps,
|
||||||
|
proFormSmallModelWidth,
|
||||||
|
} from '../../../../../config/defaultForm';
|
||||||
|
import moment from 'moment';
|
||||||
|
import styles from './CaptureForm.less'
|
||||||
|
export type FormValueType = {
|
||||||
|
target?: string;
|
||||||
|
template?: string;
|
||||||
|
type?: string;
|
||||||
|
time?: string;
|
||||||
|
frequency?: string;
|
||||||
|
} & Partial<API.UpdateInterfacesParams>;
|
||||||
|
|
||||||
|
export type UpdateFormProps = {
|
||||||
|
captureModalOpen: boolean;
|
||||||
|
handleModal: () => void;
|
||||||
|
values: Partial<API.UpdateInterfacesParams>;
|
||||||
|
reload: any;
|
||||||
|
};
|
||||||
|
const CaptureForm: React.FC<UpdateFormProps> = (props) => {
|
||||||
|
const intl = useIntl();
|
||||||
|
const [form] = Form.useForm<API.UpdateInterfacesParams>();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ModalForm<any>
|
||||||
|
width={proFormSmallModelWidth}
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.capture',
|
||||||
|
defaultMessage: `最近拍摄`,
|
||||||
|
})}
|
||||||
|
open={props.captureModalOpen}
|
||||||
|
form={form}
|
||||||
|
autoFocusFirstInput
|
||||||
|
modalProps={{
|
||||||
|
destroyOnClose: true,
|
||||||
|
onCancel: () => {
|
||||||
|
props.handleModal()
|
||||||
|
},
|
||||||
|
// okText: intl.formatMessage({ id: 'common.okText', defaultMessage: '确认' }),
|
||||||
|
// cancelText: intl.formatMessage({ id: 'common.cancelText', defaultMessage: '取消' }),
|
||||||
|
}}
|
||||||
|
submitTimeout={2000}
|
||||||
|
submitter={false}
|
||||||
|
onFinish={async (values) => {
|
||||||
|
console.log(values);
|
||||||
|
values.id = props.values.id
|
||||||
|
postInterfaces(values)
|
||||||
|
.then(() => {
|
||||||
|
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' }));
|
||||||
|
props.reload();
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' }));
|
||||||
|
});
|
||||||
|
|
||||||
|
props.handleModal();
|
||||||
|
return true;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div className={styles.captureImgBox}>
|
||||||
|
<div className={styles.captureImgDescribe}>来源: <span>{props.values.device_name}</span></div>
|
||||||
|
<div className={styles.captureImgDescribe}>触发时间: <span>{moment(props.values.appear_time).format('YYYY-MM-DD hh:mm:ss')}</span></div>
|
||||||
|
<div className={styles.captureImgContent}>
|
||||||
|
<Image
|
||||||
|
width={100}
|
||||||
|
preview={false}
|
||||||
|
src={props.values.picture_path}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ModalForm>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
export default CaptureForm;
|
||||||
@ -0,0 +1,675 @@
|
|||||||
|
/**
|
||||||
|
* 接口管理新建弹框
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
import { postInterfaces, postTestDevice } from '@/services/alarm/Interfaces';
|
||||||
|
import {
|
||||||
|
ModalForm,
|
||||||
|
ProForm,
|
||||||
|
ProFormSelect,
|
||||||
|
ProFormText,
|
||||||
|
ProFormTextArea,
|
||||||
|
} from '@ant-design/pro-components';
|
||||||
|
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||||
|
import { Form, message } from 'antd';
|
||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
|
import {
|
||||||
|
proFormSmallItemStyleProps,
|
||||||
|
proFormSmallModelWidth,
|
||||||
|
} from '../../../../../config/defaultForm';
|
||||||
|
export type FormValueType = {
|
||||||
|
target?: string;
|
||||||
|
template?: string;
|
||||||
|
type?: string;
|
||||||
|
time?: string;
|
||||||
|
frequency?: string;
|
||||||
|
} & Partial<API.UpdateInterfacesParams>;
|
||||||
|
|
||||||
|
export type CreateFormProps = {
|
||||||
|
createModalOpen: boolean;
|
||||||
|
handleModal: () => void;
|
||||||
|
values: Partial<API.UpdateInterfacesParams>;
|
||||||
|
reload: any;
|
||||||
|
};
|
||||||
|
const CreateForm: React.FC<CreateFormProps> = (props) => {
|
||||||
|
const intl = useIntl();
|
||||||
|
const [form] = Form.useForm<API.UpdateInterfacesParams>();
|
||||||
|
const [loading, setLoading] = useState<boolean>(false);
|
||||||
|
const [fileType, setFileType] = useState<string>('1');
|
||||||
|
const [fileMethod, setFileMethod] = useState<string>('pull');
|
||||||
|
const [methodName, setMethodName] = useState<string>('0');
|
||||||
|
const connection = async () => {
|
||||||
|
setLoading(true);
|
||||||
|
console.log(form.getFieldsValue());
|
||||||
|
postTestDevice({
|
||||||
|
device_ip: form.getFieldsValue().device_ip,
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
// message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' }));
|
||||||
|
// props.reload();
|
||||||
|
console.log(res);
|
||||||
|
if (res.success) {
|
||||||
|
message.success(res.msg);
|
||||||
|
}
|
||||||
|
setLoading(false);
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' }));
|
||||||
|
});
|
||||||
|
// setTimeout(() => {
|
||||||
|
// setLoading(false);
|
||||||
|
// }, 6000);
|
||||||
|
};
|
||||||
|
const handleChangeFileType = (value: string) => {
|
||||||
|
setFileMethod(value);
|
||||||
|
};
|
||||||
|
const handleChangeFile = (value: string) => {
|
||||||
|
setMethodName(value);
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (fileMethod === 'upload' && methodName === '2') {
|
||||||
|
setFileType(() => {
|
||||||
|
return '3';
|
||||||
|
});
|
||||||
|
} else if (fileMethod === 'pull' && methodName === '1') {
|
||||||
|
setFileType(() => {
|
||||||
|
return '2';
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
setFileType(() => {
|
||||||
|
return '1';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, [methodName, fileMethod]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ModalForm<API.UpdateInterfacesParams>
|
||||||
|
width={proFormSmallModelWidth}
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.addVideoSource',
|
||||||
|
defaultMessage: '新建视频源',
|
||||||
|
})}
|
||||||
|
open={props.createModalOpen}
|
||||||
|
form={form}
|
||||||
|
autoFocusFirstInput
|
||||||
|
modalProps={{
|
||||||
|
destroyOnClose: true,
|
||||||
|
onCancel: () => {
|
||||||
|
setLoading(false);
|
||||||
|
setFileMethod('pull');
|
||||||
|
setMethodName('0');
|
||||||
|
props.handleModal();
|
||||||
|
},
|
||||||
|
okText: intl.formatMessage({ id: 'common.okText', defaultMessage: '确认' }),
|
||||||
|
cancelText: intl.formatMessage({ id: 'common.cancelText', defaultMessage: '取消' }),
|
||||||
|
}}
|
||||||
|
submitTimeout={2000}
|
||||||
|
onFinish={async (values) => {
|
||||||
|
console.log(values);
|
||||||
|
postInterfaces(values)
|
||||||
|
.then(() => {
|
||||||
|
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' }));
|
||||||
|
props.reload();
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' }));
|
||||||
|
});
|
||||||
|
props.handleModal();
|
||||||
|
return true;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_name"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.name"
|
||||||
|
defaultMessage="接口名称"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.name',
|
||||||
|
defaultMessage: '接口名称',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.name"
|
||||||
|
defaultMessage="接口名称为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<div style={{ width: proFormSmallItemStyleProps.width }}>
|
||||||
|
<div style={{ marginBottom: 8 }}>获取方式</div>
|
||||||
|
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
|
<ProFormSelect
|
||||||
|
width={250}
|
||||||
|
options={[
|
||||||
|
{
|
||||||
|
value: 'pull',
|
||||||
|
label: '文件拉取',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'upload',
|
||||||
|
label: '文件上传',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
onChange={handleChangeFileType}
|
||||||
|
initialValue={fileMethod}
|
||||||
|
name="fileType"
|
||||||
|
// label="获取方式"
|
||||||
|
/>
|
||||||
|
<ProFormSelect
|
||||||
|
width={250}
|
||||||
|
options={[
|
||||||
|
{
|
||||||
|
value: '0',
|
||||||
|
label: 'FTP',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '1',
|
||||||
|
label: '文件系统',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '2',
|
||||||
|
label: 'FTP上传',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
initialValue={methodName}
|
||||||
|
onChange={handleChangeFile}
|
||||||
|
name="file"
|
||||||
|
// label="获取方式"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* <ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width - 96}
|
||||||
|
name="device_ip"
|
||||||
|
label={
|
||||||
|
<FormattedMessage id="device.interface_manage.table.list.ip" defaultMessage="IP地址" />
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.ip',
|
||||||
|
defaultMessage: 'IP地址',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.ip"
|
||||||
|
defaultMessage="IP地址为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
addonAfter={
|
||||||
|
<Button
|
||||||
|
style={{ width:86,height:32,border:'1px solid #081FA8',borderRadius:4,fontSize: 14,color:'#081FA8' }}
|
||||||
|
loading={loading}
|
||||||
|
onClick={() => connection()}>
|
||||||
|
{ loading ? '' : '连接测试'}
|
||||||
|
</Button>
|
||||||
|
}
|
||||||
|
/> */}
|
||||||
|
{fileType === '1' && (
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.ip"
|
||||||
|
defaultMessage="IP地址"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.ip',
|
||||||
|
defaultMessage: '接口地址',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.ip"
|
||||||
|
defaultMessage="接口地址为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.port"
|
||||||
|
defaultMessage="端口"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.port',
|
||||||
|
defaultMessage: '端口',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.port"
|
||||||
|
defaultMessage="端口为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.loginName"
|
||||||
|
defaultMessage="登录名"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.loginName',
|
||||||
|
defaultMessage: '登录名',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.loginName"
|
||||||
|
defaultMessage="登录名为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.password"
|
||||||
|
defaultMessage="密码"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.password',
|
||||||
|
defaultMessage: '密码',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.password"
|
||||||
|
defaultMessage="密码为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.fileDirectory"
|
||||||
|
defaultMessage="文件目录"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.fileDirectory',
|
||||||
|
defaultMessage: '文件目录',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.fileDirectory"
|
||||||
|
defaultMessage="文件目录为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
)}
|
||||||
|
{fileType === '2' && (
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.requestAddress"
|
||||||
|
defaultMessage="请求地址"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.requestAddress',
|
||||||
|
defaultMessage: '请求地址',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.requestAddress"
|
||||||
|
defaultMessage="请求地址为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.requestKey"
|
||||||
|
defaultMessage="请求Key"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.requestKey',
|
||||||
|
defaultMessage: '请求Key',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.requestKey"
|
||||||
|
defaultMessage="请求Key为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.secretKey"
|
||||||
|
defaultMessage="秘钥"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.secretKey',
|
||||||
|
defaultMessage: '秘钥',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.secretKey"
|
||||||
|
defaultMessage="秘钥为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.bucket"
|
||||||
|
defaultMessage="Bucket"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.bucket',
|
||||||
|
defaultMessage: 'Bucket',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.bucket"
|
||||||
|
defaultMessage="Bucket为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
)}
|
||||||
|
{fileType === '3' && (
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.Code"
|
||||||
|
defaultMessage="Code"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.Code',
|
||||||
|
defaultMessage: 'Code',
|
||||||
|
})}`}
|
||||||
|
disabled
|
||||||
|
required={true}
|
||||||
|
initialValue={'123'}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.Code"
|
||||||
|
defaultMessage="Code为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.port"
|
||||||
|
defaultMessage="端口"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
disabled
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.port',
|
||||||
|
defaultMessage: '端口',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.port"
|
||||||
|
defaultMessage="端口为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.loginName"
|
||||||
|
defaultMessage="登录名"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
disabled
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.loginName',
|
||||||
|
defaultMessage: '登录名',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.loginName"
|
||||||
|
defaultMessage="登录名为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.password"
|
||||||
|
defaultMessage="密码"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
disabled
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.password',
|
||||||
|
defaultMessage: '密码',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.password"
|
||||||
|
defaultMessage="密码为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.fileDirectory"
|
||||||
|
defaultMessage="文件目录"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
disabled
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.fileDirectory',
|
||||||
|
defaultMessage: '文件目录',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.fileDirectory"
|
||||||
|
defaultMessage="文件目录为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
)}
|
||||||
|
<ProFormTextArea
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="note"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.remark"
|
||||||
|
defaultMessage="备注"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.remark',
|
||||||
|
defaultMessage: '备注',
|
||||||
|
})}`}
|
||||||
|
required={false}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
</ModalForm>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
export default CreateForm;
|
||||||
@ -0,0 +1,674 @@
|
|||||||
|
/*
|
||||||
|
* @Author: zhoux zhouxia@supervision.ltd
|
||||||
|
* @Date: 2023-11-01 13:56:33
|
||||||
|
* @LastEditors: zhoux zhouxia@supervision.ltd
|
||||||
|
* @LastEditTime: 2023-12-26 15:01:08
|
||||||
|
* @FilePath: \general-ai-platform-web\src\pages\Device\DeviceCategoryList\components\UpdateForm.tsx
|
||||||
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||||
|
*/
|
||||||
|
import { putDeviceCategoryUpdateDeviceCategory } from '@/services/device/DeviceCategory';
|
||||||
|
import { postDeviceGroupGetDeviceGroupFkSelect } from '@/services/device/DeviceGroup';
|
||||||
|
import { postInterfaces, postTestDevice } from '@/services/alarm/Interfaces';
|
||||||
|
import { ModalForm, ProForm, ProFormFieldSet, ProFormSelect, ProFormSwitch, ProFormText, ProFormTextArea } from '@ant-design/pro-components';
|
||||||
|
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||||
|
import { Button, Form, message } from 'antd';
|
||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
|
import {
|
||||||
|
proFormSmallItemStyleProps,
|
||||||
|
proFormSmallModelWidth,
|
||||||
|
} from '../../../../../config/defaultForm';
|
||||||
|
export type FormValueType = {
|
||||||
|
target?: string;
|
||||||
|
template?: string;
|
||||||
|
type?: string;
|
||||||
|
time?: string;
|
||||||
|
frequency?: string;
|
||||||
|
} & Partial<API.UpdateInterfacesParams>;
|
||||||
|
|
||||||
|
export type UpdateFormProps = {
|
||||||
|
updateModalOpen: boolean;
|
||||||
|
handleModal: () => void;
|
||||||
|
values: Partial<API.UpdateInterfacesParams>;
|
||||||
|
reload: any;
|
||||||
|
};
|
||||||
|
const UpdateForm: React.FC<UpdateFormProps> = (props) => {
|
||||||
|
const intl = useIntl();
|
||||||
|
const [form] = Form.useForm<API.UpdateInterfacesParams>();
|
||||||
|
const [loading, setLoading] = useState<boolean>(false);
|
||||||
|
const [fileType, setFileType] = useState<string>('1');
|
||||||
|
const [fileMethod, setFileMethod] = useState<string>('pull');
|
||||||
|
const [methodName, setMethodName] = useState<string>('0');
|
||||||
|
const connection = () => {
|
||||||
|
setLoading(true);
|
||||||
|
console.log(props.values);
|
||||||
|
postTestDevice({
|
||||||
|
device_ip: form.getFieldsValue().device_ip,
|
||||||
|
id: props.values.id,
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
// message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' }));
|
||||||
|
// props.reload();
|
||||||
|
console.log(res);
|
||||||
|
if(res.success) {
|
||||||
|
message.success(res.msg);
|
||||||
|
}
|
||||||
|
setLoading(false);
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' }));
|
||||||
|
setLoading(false);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleChangeFileType = (value: string) => {
|
||||||
|
setFileMethod(value);
|
||||||
|
};
|
||||||
|
const handleChangeFile = (value: string) => {
|
||||||
|
setMethodName(value);
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (fileMethod === 'upload' && methodName === '2') {
|
||||||
|
setFileType(() => {
|
||||||
|
return '3';
|
||||||
|
});
|
||||||
|
} else if (fileMethod === 'pull' && methodName === '1') {
|
||||||
|
setFileType(() => {
|
||||||
|
return '2';
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
setFileType(() => {
|
||||||
|
return '1';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, [methodName, fileMethod]);
|
||||||
|
return (
|
||||||
|
<ModalForm<any>
|
||||||
|
width={proFormSmallModelWidth}
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.updatVideoSource',
|
||||||
|
defaultMessage: `编辑${props.values.device_name}`,
|
||||||
|
})}
|
||||||
|
open={props.updateModalOpen}
|
||||||
|
form={form}
|
||||||
|
autoFocusFirstInput
|
||||||
|
modalProps={{
|
||||||
|
destroyOnClose: true,
|
||||||
|
onCancel: () => {
|
||||||
|
setLoading(false)
|
||||||
|
props.handleModal()
|
||||||
|
},
|
||||||
|
okText: intl.formatMessage({ id: 'common.okText', defaultMessage: '确认' }),
|
||||||
|
cancelText: intl.formatMessage({ id: 'common.cancelText', defaultMessage: '取消' }),
|
||||||
|
}}
|
||||||
|
submitTimeout={2000}
|
||||||
|
onFinish={async (values) => {
|
||||||
|
console.log(values);
|
||||||
|
values.id = props.values.id
|
||||||
|
postInterfaces(values)
|
||||||
|
.then(() => {
|
||||||
|
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' }));
|
||||||
|
props.reload();
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' }));
|
||||||
|
});
|
||||||
|
|
||||||
|
props.handleModal();
|
||||||
|
return true;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_name"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.name"
|
||||||
|
defaultMessage="接口名称"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.name',
|
||||||
|
defaultMessage: '接口名称',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.name"
|
||||||
|
defaultMessage="接口名称为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<div style={{ width: proFormSmallItemStyleProps.width }}>
|
||||||
|
<div style={{ marginBottom: 8 }}>获取方式</div>
|
||||||
|
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
|
<ProFormSelect
|
||||||
|
width={250}
|
||||||
|
options={[
|
||||||
|
{
|
||||||
|
value: 'pull',
|
||||||
|
label: '文件拉取',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'upload',
|
||||||
|
label: '文件上传',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
onChange={handleChangeFileType}
|
||||||
|
initialValue={fileMethod}
|
||||||
|
name="fileType"
|
||||||
|
// label="获取方式"
|
||||||
|
/>
|
||||||
|
<ProFormSelect
|
||||||
|
width={250}
|
||||||
|
options={[
|
||||||
|
{
|
||||||
|
value: '0',
|
||||||
|
label: 'FTP',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '1',
|
||||||
|
label: '文件系统',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '2',
|
||||||
|
label: 'FTP上传',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
initialValue={methodName}
|
||||||
|
onChange={handleChangeFile}
|
||||||
|
name="file"
|
||||||
|
// label="获取方式"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* <ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width - 96}
|
||||||
|
name="device_ip"
|
||||||
|
label={
|
||||||
|
<FormattedMessage id="device.interface_manage.table.list.ip" defaultMessage="IP地址" />
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.ip',
|
||||||
|
defaultMessage: 'IP地址',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.ip"
|
||||||
|
defaultMessage="IP地址为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
addonAfter={
|
||||||
|
<Button
|
||||||
|
style={{ width:86,height:32,border:'1px solid #081FA8',borderRadius:4,fontSize: 14,color:'#081FA8' }}
|
||||||
|
loading={loading}
|
||||||
|
onClick={() => connection()}>
|
||||||
|
{ loading ? '' : '连接测试'}
|
||||||
|
</Button>
|
||||||
|
}
|
||||||
|
/> */}
|
||||||
|
{fileType === '1' && (
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.ip"
|
||||||
|
defaultMessage="IP地址"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.ip',
|
||||||
|
defaultMessage: '接口地址',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.ip"
|
||||||
|
defaultMessage="接口地址为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.port"
|
||||||
|
defaultMessage="端口"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.port',
|
||||||
|
defaultMessage: '端口',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.port"
|
||||||
|
defaultMessage="端口为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.loginName"
|
||||||
|
defaultMessage="登录名"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.loginName',
|
||||||
|
defaultMessage: '登录名',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.loginName"
|
||||||
|
defaultMessage="登录名为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.password"
|
||||||
|
defaultMessage="密码"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.password',
|
||||||
|
defaultMessage: '密码',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.password"
|
||||||
|
defaultMessage="密码为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.fileDirectory"
|
||||||
|
defaultMessage="文件目录"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.fileDirectory',
|
||||||
|
defaultMessage: '文件目录',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.fileDirectory"
|
||||||
|
defaultMessage="文件目录为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
)}
|
||||||
|
{fileType === '2' && (
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.requestAddress"
|
||||||
|
defaultMessage="请求地址"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.requestAddress',
|
||||||
|
defaultMessage: '请求地址',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.requestAddress"
|
||||||
|
defaultMessage="请求地址为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.requestKey"
|
||||||
|
defaultMessage="请求Key"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.requestKey',
|
||||||
|
defaultMessage: '请求Key',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.requestKey"
|
||||||
|
defaultMessage="请求Key为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.secretKey"
|
||||||
|
defaultMessage="秘钥"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.secretKey',
|
||||||
|
defaultMessage: '秘钥',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.secretKey"
|
||||||
|
defaultMessage="秘钥为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.bucket"
|
||||||
|
defaultMessage="Bucket"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.bucket',
|
||||||
|
defaultMessage: 'Bucket',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.bucket"
|
||||||
|
defaultMessage="Bucket为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
)}
|
||||||
|
{fileType === '3' && (
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.Code"
|
||||||
|
defaultMessage="Code"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.Code',
|
||||||
|
defaultMessage: 'Code',
|
||||||
|
})}`}
|
||||||
|
disabled
|
||||||
|
required={true}
|
||||||
|
initialValue={'123'}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.Code"
|
||||||
|
defaultMessage="Code为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.port"
|
||||||
|
defaultMessage="端口"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
disabled
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.port',
|
||||||
|
defaultMessage: '端口',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.port"
|
||||||
|
defaultMessage="端口为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.loginName"
|
||||||
|
defaultMessage="登录名"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
disabled
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.loginName',
|
||||||
|
defaultMessage: '登录名',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.loginName"
|
||||||
|
defaultMessage="登录名为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.password"
|
||||||
|
defaultMessage="密码"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
disabled
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.password',
|
||||||
|
defaultMessage: '密码',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.password"
|
||||||
|
defaultMessage="密码为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormText
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="device_api"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.fileDirectory"
|
||||||
|
defaultMessage="文件目录"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
disabled
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.fileDirectory',
|
||||||
|
defaultMessage: '文件目录',
|
||||||
|
})}`}
|
||||||
|
required={true}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: (
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.rule.required.fileDirectory"
|
||||||
|
defaultMessage="文件目录为必填项"
|
||||||
|
/>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
)}
|
||||||
|
<ProFormTextArea
|
||||||
|
width={proFormSmallItemStyleProps.width}
|
||||||
|
name="note"
|
||||||
|
label={
|
||||||
|
<FormattedMessage
|
||||||
|
id="device.interface_manage.table.list.remark"
|
||||||
|
defaultMessage="备注"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
placeholder={`${intl.formatMessage({
|
||||||
|
id: 'common.please_input',
|
||||||
|
defaultMessage: '请输入',
|
||||||
|
})}${intl.formatMessage({
|
||||||
|
id: 'device.interface_manage.table.list.remark',
|
||||||
|
defaultMessage: '备注',
|
||||||
|
})}`}
|
||||||
|
required={false}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
</ModalForm>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
export default UpdateForm;
|
||||||
@ -0,0 +1,327 @@
|
|||||||
|
import AlarmLevelBox from '@/components/DictionaryBox/alarmLevel';
|
||||||
|
import TableActionCard from '@/components/TableActionCard';
|
||||||
|
import IsDelete from '@/components/TableActionCard/isDelete';
|
||||||
|
import { alarmLevelStatusEnum } from '@/enums/status';
|
||||||
|
import {
|
||||||
|
deleteDeviceCategoryDeleteDeviceCategory,
|
||||||
|
postDeviceCategoryGetDeviceCategoryList,
|
||||||
|
} from '@/services/device/DeviceCategory';
|
||||||
|
import { getInterfaces, postInterfaces, postTestDevice } from '@/services/alarm/Interfaces'
|
||||||
|
import type { ActionType, ProColumns } from '@ant-design/pro-components';
|
||||||
|
import { PageContainer, ProTable } from '@ant-design/pro-components';
|
||||||
|
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||||
|
import { Button, Space, Tag, message } from 'antd';
|
||||||
|
import React, { useRef, useState } from 'react';
|
||||||
|
import { proTablePaginationOptions } from '../../../../config/defaultTable';
|
||||||
|
import { proIconForTableActionStyle } from '../../../../config/defaultIcon';
|
||||||
|
import { EditOutlined, InstagramOutlined, RedoOutlined } from '@ant-design/icons';
|
||||||
|
import CreateForm from './components/CreateForm';
|
||||||
|
import UpdateForm from './components/UpdateForm';
|
||||||
|
import CaptureForm from './components/CaptureForm';
|
||||||
|
import CaptureButton from './components/CaptureButton';
|
||||||
|
import moment from 'moment';
|
||||||
|
const RealTimeInterfaceManageList: React.FC = () => {
|
||||||
|
/**
|
||||||
|
* @en-US International configuration
|
||||||
|
* @zh-CN 国际化配置
|
||||||
|
* */
|
||||||
|
const intl = useIntl();
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
// 动态设置每页数量
|
||||||
|
const [currentPageSize, setCurrentPageSize] = useState<number>(10);
|
||||||
|
|
||||||
|
const handleDestroy = async (selectedRow: API.UpdateInterfacesParams) => {
|
||||||
|
postInterfaces({ id: selectedRow.id, device_status: '3' } )
|
||||||
|
.then(() => {
|
||||||
|
message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' }));
|
||||||
|
actionRef.current?.reload();
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' }));
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const [currentRow, setCurrentRow] = useState<API.UpdateInterfacesParams>();
|
||||||
|
/**
|
||||||
|
* @en-US Pop-up window of new window
|
||||||
|
* @zh-CN 新建窗口的弹窗
|
||||||
|
* */
|
||||||
|
const [createModalOpen, setCreateModalOpen] = useState<boolean>(false);
|
||||||
|
const handleCreateModal = () => {
|
||||||
|
if (createModalOpen) {
|
||||||
|
setCreateModalOpen(false);
|
||||||
|
setCurrentRow(undefined);
|
||||||
|
} else {
|
||||||
|
setCreateModalOpen(true);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 编辑弹框
|
||||||
|
const [updateModalOpen, setUpdateModalOpen] = useState<boolean>(false);
|
||||||
|
|
||||||
|
const handleUpdateModal = () => {
|
||||||
|
if (updateModalOpen) {
|
||||||
|
setUpdateModalOpen(false);
|
||||||
|
setCurrentRow(undefined);
|
||||||
|
} else {
|
||||||
|
setUpdateModalOpen(true);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 最近拍摄
|
||||||
|
const [captureModalOpen, setCaptureModalOpen] = useState<boolean>(false);
|
||||||
|
|
||||||
|
const handleCaptureModal = () => {
|
||||||
|
console.log(captureModalOpen);
|
||||||
|
if (captureModalOpen) {
|
||||||
|
setCaptureModalOpen(false);
|
||||||
|
setCurrentRow(undefined);
|
||||||
|
} else {
|
||||||
|
setCaptureModalOpen(true);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 测试连接
|
||||||
|
const [loading, setLoading] = useState<boolean>(false);
|
||||||
|
const connection = (value: any) => {
|
||||||
|
setLoading(true);
|
||||||
|
postTestDevice({
|
||||||
|
device_ip: value.device_ip,
|
||||||
|
id: value.id,
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
if(res.success) {
|
||||||
|
message.success(res.msg);
|
||||||
|
}
|
||||||
|
setLoading(false);
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' }));
|
||||||
|
setLoading(false);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
const columns: ProColumns<API.UpdateInterfacesParams>[] = [
|
||||||
|
{
|
||||||
|
title: <FormattedMessage id="device.interface_manage.table.list.videoName" defaultMessage="接口名称" />,
|
||||||
|
dataIndex: 'device_name',
|
||||||
|
hideInSearch: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <FormattedMessage id="device.interface_manage.table.list.obtainMode" defaultMessage="获取方式" />,
|
||||||
|
dataIndex: 'device_ip',
|
||||||
|
hideInSearch: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <FormattedMessage id="device.interface_manage.table.list.obtainStatus" defaultMessage="设备状态" />,
|
||||||
|
dataIndex: 'test_result',
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (dom,entity) => {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Tag bordered={false} color={dom === 1? "success": ""} style={{
|
||||||
|
// fontSize:14,
|
||||||
|
color: dom === 1? '#52C41A': "#999"
|
||||||
|
}}>
|
||||||
|
{dom === 1 ? '获取成功' : '获取失败'}
|
||||||
|
</Tag>
|
||||||
|
<span>{moment(entity.appear_time).format('YYYY-MM-DD hh:mm:ss')}</span>
|
||||||
|
{/* <Button
|
||||||
|
type="link"
|
||||||
|
icon={<RedoOutlined />}
|
||||||
|
loading={loading}
|
||||||
|
onClick={() => {
|
||||||
|
connection(entity)
|
||||||
|
}}
|
||||||
|
/> */}
|
||||||
|
</div>
|
||||||
|
// <CaptureButton
|
||||||
|
// values={entity || {}}
|
||||||
|
// reload={actionRef.current?.reload}
|
||||||
|
// />
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// title: <FormattedMessage id="device.interface_manage.table.list.address" defaultMessage="接口地址" />,
|
||||||
|
// dataIndex: 'device_api',
|
||||||
|
// hideInSearch: true,
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// title: <FormattedMessage id="device.interface_manage.table.list.testTime" defaultMessage="状态查询时间" />,
|
||||||
|
// dataIndex: 'test_time',
|
||||||
|
// sorter: true,
|
||||||
|
// hideInSearch: true,
|
||||||
|
// valueType: 'dateTime',
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
title: <FormattedMessage id="device.interface_manage.table.list.createTime" defaultMessage="创建时间" />,
|
||||||
|
dataIndex: 'create_time',
|
||||||
|
sorter: true,
|
||||||
|
hideInSearch: true,
|
||||||
|
valueType: 'dateTime',
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
title: <FormattedMessage id="pages.searchTable.titleOption" defaultMessage="操作" />,
|
||||||
|
dataIndex: 'option',
|
||||||
|
valueType: 'option',
|
||||||
|
width: '260px',
|
||||||
|
fixed: 'right',
|
||||||
|
render: (_, record) => [
|
||||||
|
<TableActionCard
|
||||||
|
key="TableActionCardRef"
|
||||||
|
renderActions={[
|
||||||
|
// {
|
||||||
|
// key: 'capture',
|
||||||
|
// renderDom: (
|
||||||
|
// <Button
|
||||||
|
// key="capture"
|
||||||
|
// type="link"
|
||||||
|
// size="small"
|
||||||
|
// style={{
|
||||||
|
// color:"#081FA8",
|
||||||
|
// }}
|
||||||
|
// icon={<InstagramOutlined style={{
|
||||||
|
// marginRight: 3
|
||||||
|
// }} />}
|
||||||
|
// onClick={() => {
|
||||||
|
// console.log('11');
|
||||||
|
// setCaptureModalOpen(true);
|
||||||
|
// setCurrentRow(record);
|
||||||
|
// }}
|
||||||
|
// >
|
||||||
|
// {/* 最近拍摄 */}
|
||||||
|
// <FormattedMessage id="device.interface_manage.table.list.capture" defaultMessage="最近拍摄" />
|
||||||
|
// </Button>
|
||||||
|
// ),
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
key: 'update',
|
||||||
|
renderDom: (
|
||||||
|
<Button
|
||||||
|
key="update"
|
||||||
|
type="link"
|
||||||
|
size="small"
|
||||||
|
style={{
|
||||||
|
color:"#081FA8",
|
||||||
|
}}
|
||||||
|
icon={<EditOutlined style={{
|
||||||
|
marginRight: 3
|
||||||
|
}} />}
|
||||||
|
onClick={() => {
|
||||||
|
setUpdateModalOpen(true);
|
||||||
|
setCurrentRow(record);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<FormattedMessage id="common.edit" defaultMessage="编辑" />
|
||||||
|
</Button>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'destroy',
|
||||||
|
renderDom: (
|
||||||
|
<IsDelete
|
||||||
|
deleteApi={() => {
|
||||||
|
handleDestroy(record).then(() => {});
|
||||||
|
}}
|
||||||
|
></IsDelete>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
></TableActionCard>,
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
return (
|
||||||
|
<PageContainer
|
||||||
|
title={false}
|
||||||
|
content={
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'space-between'
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
fontWeight: 600,
|
||||||
|
fontSize: 20,
|
||||||
|
color: '#333'
|
||||||
|
}}>离线设备管理</div>
|
||||||
|
<Button type="primary"
|
||||||
|
onClick={() => {
|
||||||
|
setCreateModalOpen(true);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<FormattedMessage id="device.interface_manage.table.list.addVideoSource" defaultMessage="新建视频源" />
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<ProTable<API.DeviceCategory>
|
||||||
|
cardProps={{
|
||||||
|
bodyStyle: {
|
||||||
|
padding: 20
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
options={{ fullScreen: false, setting: false, density: false, reload: false }}
|
||||||
|
actionRef={actionRef}
|
||||||
|
rowKey="key"
|
||||||
|
search={false}
|
||||||
|
showSorterTooltip={false}
|
||||||
|
pagination={{
|
||||||
|
...proTablePaginationOptions,
|
||||||
|
pageSize: currentPageSize,
|
||||||
|
onChange: (page, pageSize) => setCurrentPageSize(pageSize),
|
||||||
|
}}
|
||||||
|
columnsState={{
|
||||||
|
persistenceKey: 'device_category_list',
|
||||||
|
persistenceType: 'localStorage',
|
||||||
|
}}
|
||||||
|
request={async (params = {}, sort) => {
|
||||||
|
const { current, ...rest } = params;
|
||||||
|
const reqParams = {
|
||||||
|
page: current,
|
||||||
|
desc: false,
|
||||||
|
orderKey: '',
|
||||||
|
...rest,
|
||||||
|
};
|
||||||
|
if (sort && Object.keys(sort).length) {
|
||||||
|
reqParams.orderKey = Object.keys(sort)[0];
|
||||||
|
let sort_select = sort[reqParams.orderKey];
|
||||||
|
reqParams.desc = sort_select === 'descend';
|
||||||
|
}
|
||||||
|
// let resp = await postDeviceCategoryGetDeviceCategoryList({ ...reqParams });
|
||||||
|
let resp = await getInterfaces({ ...reqParams });
|
||||||
|
return {
|
||||||
|
data: resp.data.results.map((v: API.DeviceCategory) => {
|
||||||
|
return { ...v, key: v.id };
|
||||||
|
}),
|
||||||
|
success: resp.success,
|
||||||
|
total: resp.data.count,
|
||||||
|
current: resp.data.page,
|
||||||
|
pageSize: resp.data.pageSize,
|
||||||
|
};
|
||||||
|
}}
|
||||||
|
columns={columns}
|
||||||
|
/>
|
||||||
|
<CreateForm
|
||||||
|
createModalOpen={createModalOpen}
|
||||||
|
values={currentRow || {}}
|
||||||
|
handleModal={handleCreateModal}
|
||||||
|
reload={actionRef.current?.reload}
|
||||||
|
/>
|
||||||
|
<UpdateForm
|
||||||
|
updateModalOpen={updateModalOpen}
|
||||||
|
values={currentRow || {}}
|
||||||
|
handleModal={handleUpdateModal}
|
||||||
|
reload={actionRef.current?.reload}
|
||||||
|
/>
|
||||||
|
<CaptureForm
|
||||||
|
captureModalOpen={captureModalOpen}
|
||||||
|
values={currentRow || {}}
|
||||||
|
handleModal={handleCaptureModal}
|
||||||
|
reload={actionRef.current?.reload}
|
||||||
|
/>
|
||||||
|
</PageContainer>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default RealTimeInterfaceManageList;
|
||||||
Loading…
Reference in New Issue