From 2a4525b4f754e4f1b520d2f6d21d7399dff8385b Mon Sep 17 00:00:00 2001 From: JINGYJ <1458671527@qq.com> Date: Tue, 2 Apr 2024 17:27:53 +0800 Subject: [PATCH] =?UTF-8?q?fect:=20=E7=A6=BB=E7=BA=BF=E8=AE=BE=E5=A4=87?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E8=81=94=E8=B0=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/Alarm/AlarmList/index.tsx | 2 +- .../components/CreateForm.tsx | 178 +++++++------ .../components/UpdateForm.tsx | 244 ++++++++++-------- .../Setting/RealTimeInterfaceManage/index.tsx | 19 +- src/pages/VideoAnalysis/index.tsx | 2 +- src/services/alarm/Interfaces.ts | 38 +++ src/services/alarm/typings.d.ts | 14 +- 7 files changed, 301 insertions(+), 196 deletions(-) diff --git a/src/pages/Alarm/AlarmList/index.tsx b/src/pages/Alarm/AlarmList/index.tsx index 9ae1f74..01f1af8 100644 --- a/src/pages/Alarm/AlarmList/index.tsx +++ b/src/pages/Alarm/AlarmList/index.tsx @@ -259,7 +259,7 @@ const AlarmList: React.FC = () => { } useEffect(() => { getTabs(); - initList(); + // initList(); }, []); useEffect(() => { // 模拟异步请求数据 diff --git a/src/pages/Setting/RealTimeInterfaceManage/components/CreateForm.tsx b/src/pages/Setting/RealTimeInterfaceManage/components/CreateForm.tsx index 2ba603d..3dd1765 100644 --- a/src/pages/Setting/RealTimeInterfaceManage/components/CreateForm.tsx +++ b/src/pages/Setting/RealTimeInterfaceManage/components/CreateForm.tsx @@ -2,7 +2,7 @@ * 接口管理新建弹框 * */ -import { postInterfaces, postTestDevice } from '@/services/alarm/Interfaces'; +import { postInterfacesUpload,getInterfacesUpload } from '@/services/alarm/Interfaces'; import { ModalForm, ProForm, @@ -36,43 +36,49 @@ const CreateForm: React.FC = (props) => { const [form] = Form.useForm(); const [loading, setLoading] = useState(false); const [fileType, setFileType] = useState('1'); - const [fileMethod, setFileMethod] = useState('pull'); - const [methodName, setMethodName] = useState('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) => { + const [fileMethod, setFileMethod] = useState(2); + const [methodName, setMethodName] = useState('1'); + const handleChangeFileType = async (value: number) => { setFileMethod(value); + // 根据选择的获取方式更新第二个下拉框的值 + if (value === 2) { + setMethodName('1'); // 设置为初始值 '0'，只展示FTP选项 + form.setFieldsValue({ + operate_mode: '1', // 设置第二个下拉框的值 + device_ip: '', + device_port: '', + device_username: '', + device_password: '', + source_directory: '', + }); + } else if (value === 1) { + setMethodName('2'); // 设置为 '2'，只展示FTP上传选项 + form.setFieldsValue({ + operate_mode: '2', // 设置第二个下拉框的值 + }); + await getInterfacesUpload({ 'templet': true }) + .then( (resp)=> { + const{ data } = resp + form.setFieldsValue({ + device_ip: data.device_ip, + device_port: data.device_port, + device_username: data.device_username, + device_password: data.device_password, + destination_directory: data.destination_directory, + }); + }) + } }; const handleChangeFile = (value: string) => { setMethodName(value); }; useEffect(() => { - if (fileMethod === 'upload' && methodName === '2') { + if (fileMethod === 1 && methodName === '2') { setFileType(() => { return '3'; }); - } else if (fileMethod === 'pull' && methodName === '1') { + } else if (fileMethod === 2 && methodName === '3') { setFileType(() => { return '2'; }); @@ -97,8 +103,8 @@ const CreateForm: React.FC = (props) => { destroyOnClose: true, onCancel: () => { setLoading(false); - setFileMethod('pull'); - setMethodName('0'); + setFileMethod(2); + setMethodName('1'); props.handleModal(); }, okText: intl.formatMessage({ id: 'common.okText', defaultMessage: '确认' }), @@ -107,7 +113,7 @@ const CreateForm: React.FC = (props) => { submitTimeout={2000} onFinish={async (values) => { console.log(values); - postInterfaces(values) + postInterfacesUpload(values) .then(() => { message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' })); props.reload(); @@ -115,6 +121,8 @@ const CreateForm: React.FC = (props) => { .catch(() => { message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '失败' })); }); + setFileMethod(2); + setMethodName('1'); props.handleModal(); return true; }} @@ -156,38 +164,55 @@ const CreateForm: React.FC = (props) => { width={250} options={[ { - value: 'pull', + value: 2, label: '文件拉取', }, { - value: 'upload', + value: 1, label: '文件上传', }, ]} onChange={handleChangeFileType} initialValue={fileMethod} - name="fileType" + name="upload_or_download" // label="获取方式" /> + {/* */} (fileMethod === 2 ? option.value !== '2' : option.value === '2'))} initialValue={methodName} onChange={handleChangeFile} - name="file" + name="operate_mode" // label="获取方式" /> @@ -229,8 +254,8 @@ const CreateForm: React.FC = (props) => { {fileType === '1' && ( = (props) => { ]} /> = (props) => { ]} /> = (props) => { ]} /> = (props) => { /> = (props) => { = (props) => { /> = (props) => { /> = (props) => { /> = (props) => { {fileType === '3' && ( } placeholder={`${intl.formatMessage({ id: 'common.please_input', defaultMessage: '请输入', })}${intl.formatMessage({ - id: 'device.interface_manage.table.list.Code', - defaultMessage: 'Code', + id: 'device.interface_manage.table.list.ip', + defaultMessage: 'ip', })}`} disabled required={true} - initialValue={'123'} rules={[ { required: true, message: ( ), }, ]} /> = (props) => { ]} /> = (props) => { ]} /> = (props) => { /> = (props) => { const [form] = Form.useForm(); const [loading, setLoading] = useState(false); const [fileType, setFileType] = useState('1'); - const [fileMethod, setFileMethod] = useState('pull'); - const [methodName, setMethodName] = useState('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 [fileMethod, setFileMethod] = useState(props.values.upload_or_download); + const [methodName, setMethodName] = useState(props.values.operate_mode); - const handleChangeFileType = (value: string) => { + const handleChangeFileType = async (value: number) => { setFileMethod(value); + // 根据选择的获取方式更新第二个下拉框的值 + if (value === 2) { + setMethodName(1); // 设置为初始值 '0'，只展示FTP选项 + form.setFieldsValue({ + operate_mode: 1, // 设置第二个下拉框的值 + device_ip: props.values.device_ip, + device_port: props.values.device_port, + device_username: props.values.device_username, + device_password: props.values.device_password, + source_directory: props.values.source_directory, + }); + } else if (value === 1) { + setMethodName(2); // 设置为 '2'，只展示FTP上传选项 + form.setFieldsValue({ + operate_mode: 2, // 设置第二个下拉框的值 + }); + await getInterfacesUpload({ 'templet': true }) + .then( (resp)=> { + const{ data } = resp + form.setFieldsValue({ + device_ip: data.device_ip, + device_port: data.device_port, + device_username: data.device_username, + device_password: data.device_password, + destination_directory: data.destination_directory, + }); + }) + } }; - const handleChangeFile = (value: string) => { + const handleChangeFile = (value: number) => { setMethodName(value); }; useEffect(() => { - if (fileMethod === 'upload' && methodName === '2') { + if (fileMethod === 1 && methodName === 2) { setFileType(() => { return '3'; }); - } else if (fileMethod === 'pull' && methodName === '1') { + } else if (fileMethod === 2 && methodName === 3) { setFileType(() => { return '2'; }); @@ -82,6 +89,23 @@ const UpdateForm: React.FC = (props) => { }); } }, [methodName, fileMethod]); + useEffect(() => { + setFileMethod(props.values.upload_or_download); + setMethodName(props.values.operate_mode); + if (fileMethod === 1 && methodName === 2) { + setFileType(() => { + return '3'; + }); + } else if (fileMethod === 2 && methodName === 3) { + setFileType(() => { + return '2'; + }); + } else { + setFileType(() => { + return '1'; + }); + } + }, [props.updateModalOpen]); return ( width={proFormSmallModelWidth} @@ -105,7 +129,7 @@ const UpdateForm: React.FC = (props) => { onFinish={async (values) => { console.log(values); values.id = props.values.id - postInterfaces(values) + postInterfacesUpload(values) .then(() => { message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' })); props.reload(); @@ -135,6 +159,7 @@ const UpdateForm: React.FC = (props) => { id: 'device.interface_manage.table.list.name', defaultMessage: '接口名称', })}`} + initialValue={props.values.device_name} required={true} rules={[ { @@ -155,81 +180,64 @@ const UpdateForm: React.FC = (props) => { width={250} options={[ { - value: 'pull', + value: 2, label: '文件拉取', }, { - value: 'upload', + value: 1, label: '文件上传', }, ]} onChange={handleChangeFileType} - initialValue={fileMethod} - name="fileType" + initialValue={props.values.upload_or_download} + name="upload_or_download" // label="获取方式" /> + {/* */} (fileMethod === 2 ? option.value !== 2 : option.value === 2))} + initialValue={props.values.operate_mode} onChange={handleChangeFile} - name="file" + name="operate_mode" // label="获取方式" /> - {/* - } - 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: ( - - ), - }, - ]} - addonAfter={ - - } - /> */} {fileType === '1' && ( = (props) => { defaultMessage: '接口地址', })}`} required={true} + initialValue={props.values.device_ip} rules={[ { required: true, @@ -257,8 +266,8 @@ const UpdateForm: React.FC = (props) => { ]} /> = (props) => { id: 'device.interface_manage.table.list.port', defaultMessage: '端口', })}`} + initialValue={props.values.device_port} required={true} rules={[ { @@ -286,8 +296,8 @@ const UpdateForm: React.FC = (props) => { ]} /> = (props) => { id: 'device.interface_manage.table.list.loginName', defaultMessage: '登录名', })}`} + initialValue={props.values.device_username} required={true} rules={[ { @@ -315,8 +326,8 @@ const UpdateForm: React.FC = (props) => { ]} /> = (props) => { id: 'device.interface_manage.table.list.password', defaultMessage: '密码', })}`} + initialValue={props.values.device_password} required={true} rules={[ { @@ -345,7 +357,7 @@ const UpdateForm: React.FC = (props) => { /> = (props) => { id: 'device.interface_manage.table.list.fileDirectory', defaultMessage: '文件目录', })}`} + initialValue={props.values.source_directory} required={true} rules={[ { @@ -378,7 +391,7 @@ const UpdateForm: React.FC = (props) => { = (props) => { id: 'device.interface_manage.table.list.requestAddress', defaultMessage: '请求地址', })}`} + initialValue={props.values.device_ip} required={true} rules={[ { @@ -407,7 +421,7 @@ const UpdateForm: React.FC = (props) => { /> = (props) => { id: 'device.interface_manage.table.list.requestKey', defaultMessage: '请求Key', })}`} + initialValue={props.values.access_key_id} required={true} rules={[ { @@ -436,7 +451,7 @@ const UpdateForm: React.FC = (props) => { /> = (props) => { id: 'device.interface_manage.table.list.secretKey', defaultMessage: '秘钥', })}`} + initialValue={props.values.access_key_secret} required={true} rules={[ { @@ -465,7 +481,7 @@ const UpdateForm: React.FC = (props) => { /> = (props) => { id: 'device.interface_manage.table.list.bucket', defaultMessage: 'Bucket', })}`} + initialValue={props.values.bucket} required={true} rules={[ { @@ -497,39 +514,39 @@ const UpdateForm: React.FC = (props) => { {fileType === '3' && ( } placeholder={`${intl.formatMessage({ id: 'common.please_input', defaultMessage: '请输入', })}${intl.formatMessage({ - id: 'device.interface_manage.table.list.Code', - defaultMessage: 'Code', + id: 'device.interface_manage.table.list.ip', + defaultMessage: 'ip', })}`} disabled + initialValue={props.values.device_ip} required={true} - initialValue={'123'} rules={[ { required: true, message: ( ), }, ]} /> = (props) => { id: 'device.interface_manage.table.list.port', defaultMessage: '端口', })}`} + initialValue={props.values.device_port} required={true} rules={[ { @@ -558,8 +576,8 @@ const UpdateForm: React.FC = (props) => { ]} /> = (props) => { id: 'device.interface_manage.table.list.loginName', defaultMessage: '登录名', })}`} + initialValue={props.values.device_username} required={true} rules={[ { @@ -588,8 +607,8 @@ const UpdateForm: React.FC = (props) => { ]} /> = (props) => { id: 'device.interface_manage.table.list.password', defaultMessage: '密码', })}`} + initialValue={props.values.device_password} required={true} rules={[ { @@ -619,7 +639,7 @@ const UpdateForm: React.FC = (props) => { /> = (props) => { id: 'device.interface_manage.table.list.fileDirectory', defaultMessage: '文件目录', })}`} + initialValue={props.values.destination_directory} required={true} rules={[ { @@ -665,6 +686,7 @@ const UpdateForm: React.FC = (props) => { id: 'device.interface_manage.table.list.remark', defaultMessage: '备注', })}`} + initialValue={props.values.note} required={false} /> diff --git a/src/pages/Setting/RealTimeInterfaceManage/index.tsx b/src/pages/Setting/RealTimeInterfaceManage/index.tsx index 425b855..58321d6 100644 --- a/src/pages/Setting/RealTimeInterfaceManage/index.tsx +++ b/src/pages/Setting/RealTimeInterfaceManage/index.tsx @@ -6,7 +6,7 @@ import { deleteDeviceCategoryDeleteDeviceCategory, postDeviceCategoryGetDeviceCategoryList, } from '@/services/device/DeviceCategory'; -import { getInterfaces, postInterfaces, postTestDevice } from '@/services/alarm/Interfaces' +import { getInterfacesUpload, postInterfacesUpload, 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'; @@ -31,7 +31,7 @@ const RealTimeInterfaceManageList: React.FC = () => { const [currentPageSize, setCurrentPageSize] = useState(10); const handleDestroy = async (selectedRow: API.UpdateInterfacesParams) => { - postInterfaces({ id: selectedRow.id, device_status: '3' } ) + postInterfacesUpload({ id: selectedRow.id, device_status: '3' } ) .then(() => { message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '成功' })); actionRef.current?.reload(); @@ -108,8 +108,17 @@ const RealTimeInterfaceManageList: React.FC = () => { }, { title: , - dataIndex: 'device_ip', + dataIndex: 'operate_mode', hideInSearch: true, + render: (dom) => { + return ( +
+ {dom === 1 && 'FTP'} + {dom === 2 && 'FTP上传'} + {dom === 3 && '文件系统'} +
+ ); + }, }, { title: , @@ -124,7 +133,7 @@ const RealTimeInterfaceManageList: React.FC = () => { }}> {dom === 1 ? '获取成功' : '获取失败'} - {moment(entity.appear_time).format('YYYY-MM-DD hh:mm:ss')} + {moment(entity.create_time).format('YYYY-MM-DD hh:mm:ss')} {/*