p6molspfw
/
xgd_system
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

对接完gql模块接口

Browse Source
master_basic
鲁誉程 11 months ago
parent 9da2202f8a
commit 20f7e338d0
3 changed files with 224 additions and 90 deletions
Show Stats Download Patch File Download Diff File

57
src/pages/GLQ/WebGLQ/ManageConfig/index.tsx
Unescape View File

@ -1,17 +1,48 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import { Form, Input, Select } from 'antd';
import { Form, Input, Select, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { useEffect } from 'react';
import { remoteFileConfiSendData, remoteFileConfigClean } from '@/services/gql';
// 网络GLQ配置 --> 远程文件配置--> 管理配置
export default function Page() {
const [form] = Form.useForm();
useEffect(() => {
form.setFieldsValue({
deviceLocation: '前端机平台',
deviceType: '类型1',
hotStandby: 'no',
deviceId: '',
})
}, [])
const onFinish = (values: any) => {
console.log('表单提交:', values);
remoteFileConfiSendData({
jsonStr: JSON.stringify(values),
type: 4
}).then((res) => {
if (res?.result == "success") {
message.success('文件提交成功');
form.resetFields();
} else {
message.error(res?.errorMsg);
}
})
};
const clearInfo = () => {
remoteFileConfigClean({type: 4}).then(res => {
if (res?.result == "success") {
message.success('清除信息成功');
}else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={`${styles.params_warp}`}>
@ -24,7 +55,7 @@ export default function Page() {
onFinish={onFinish}
>
<Form.Item
name="a3"
name="deviceLocation"
label="设备位置"
rules={[
{ required: true, message: '请选择设备位置' },
@ -34,13 +65,13 @@ export default function Page() {
style={{ width: 560 }}
onChange={(e) => { }}
options={[
{ label: '前端机平台', value: 1 },
{ label: '后端机平台', value: 2 }
{ label: '前端机平台', value: '前端机平台' },
{ label: '后端机平台', value: '后端机平台' }
]}
/>
</Form.Item>
<Form.Item
name="a2"
name="deviceType"
label="设备类型"
rules={[
{ required: true, message: '请选择设备类型' },
@ -50,13 +81,13 @@ export default function Page() {
style={{ width: 560 }}
onChange={(e) => { }}
options={[
{ label: '前端机平台', value: 1 },
{ label: '后端机平台', value: 2 }
{ label: '类型1', value: '类型1' },
{ label: '类型2', value: '类型2' }
]}
/>
</Form.Item>
<Form.Item
name="a1"
name="hotStandby"
label="存在热备"
rules={[
{ required: true, message: '请选择存在热备' },
@ -66,13 +97,13 @@ export default function Page() {
style={{ width: 560 }}
onChange={(e) => { }}
options={[
{ label: 'no', value: 1 },
{ label: 'yes', value: 2 }
{ label: 'no', value: 'no' },
{ label: 'yes', value: 'yes' }
]}
/>
</Form.Item>
<Form.Item
name="a5"
name="deviceId"
label="设备标识"
rules={[
{ required: true, message: '请输入设备标识' },
@ -83,7 +114,7 @@ export default function Page() {
</Form>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'文件提交'} onClick={() => form.submit()} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => form.resetFields()} />
<ButtonComp type={'cancel'} text={'清空信息'} onClick={() => clearInfo()} />
</div>
</div>
</ContentWarp>

52
src/pages/GLQ/WebGLQ/SecurityPolicy/index.tsx
Unescape View File

@ -5,7 +5,7 @@ import ButtonComp from '@/components/ButtonComp';
import { useEffect, useState } from 'react';
import { rowClassName } from '@/utils';
import { getTextSecretInfo } from '@/services/gql';
import { getTextSecretInfo, remoteFileConfiSendData } from '@/services/gql';
import { validateIPAddress } from '@/utils/validate';
// 网络GLQ配置 --> 远程文件配置--> 安全策略
@ -17,9 +17,26 @@ export default function Page() {
form.setFieldsValue({ip: '114.114.114.114'})
}, [])
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 100,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '单位名称', dataIndex: '单位名称', key: '单位名称', align: 'center' },
{ title: '设备名称', dataIndex: '设备名称', key: '设备名称', align: 'center' },
{ title: '设备IP', dataIndex: '设备ip', key: '设备ip', align: 'center' },
{ title: '电话号码', dataIndex: '电话号码', key: '电话号码', align: 'center' },
{ title: '设备属性', dataIndex: '设备属性', key: '设备属性', align: 'center' },
{ title: '设备型号', dataIndex: '设备型号', key: '设备型号', align: 'center' },
]
const onFinish = (values: any) => {
getTextSecretInfo(values).then(res => {
if (res?.result == "success") {
setTableData(res?.data[0].jsonStr)
message.success('获取成功');
} else {
message.error(res?.errorMsg);
@ -27,20 +44,23 @@ export default function Page() {
})
};
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 100,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '单位名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '设备名称', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '设备IP', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '电话号码', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '设备属性', dataIndex: 'name', key: 'name', align: 'center' },
{ title: '设备型号', dataIndex: 'name', key: 'name', align: 'center' },
]
const sending = () => {
if (tableData.length == 0) {
message.info('请获取普密信息后再发送数据');
return
}
remoteFileConfiSendData({
jsonStr: JSON.stringify(tableData),
type: 3
}).then( (res) => {
if (res?.result == "success") {
message.success('发送数据成功');
}else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={styles.params_warp}>
@ -72,7 +92,7 @@ export default function Page() {
<div className='mt20'>尚未连接普密对外服务器！</div>
<div className={styles.btn_warp}>
<ButtonComp text={'发送数据'} onClick={() => { }} />
<ButtonComp text={'发送数据'} onClick={() => sending()} />
</div>
</div>
</ContentWarp>

205
src/pages/GLQ/WebGLQ/VpnPolicy/index.tsx
Unescape View File

@ -1,18 +1,85 @@
import ContentWarp from '@/components/ContentWarp';
import styles from '../../index.less';
import styles1 from './index.less';
import { Form, Input, Select } from 'antd';
import { Form, Input, Select, Table, message } from 'antd';
import ButtonComp from '@/components/ButtonComp';
import { useEffect, useState } from 'react';
import { rowClassName } from '@/utils';
import { validateIPAddress } from '@/utils/validate';
import { remoteFileConfiSendData, remoteFileConfigClean } from '@/services/gql';
// 网络GLQ配置 --> 远程文件配置--> VPN策略
export default function Page() {
const [form] = Form.useForm();
const [tableData, setTableData] = useState<any>([]);
const [activeList, setActiveList] = useState<any>([]);
useEffect(() => {
form.setFieldsValue({
unitName: '',
deviceName: '',
deviceIp: '',
deviceId: '',
messageComm: 1,
pingComm: 1,
})
}, [])
const columns: any = [
{
title: '序号', key: 'index', align: 'center', width: 100,
render: (a: any, b: any, c: any) => {
return <span>{c + 1}</span>;
},
},
{ title: '单位名称', dataIndex: 'unitName', key: 'unitName', align: 'center' },
{ title: '设备名称', dataIndex: 'deviceName', key: 'deviceName', align: 'center' },
{ title: '设备IP', dataIndex: 'deviceIp', key: 'deviceIp', align: 'center' },
{ title: '设备ID', dataIndex: 'deviceId', key: 'deviceId', align: 'center' },
{ title: '报文通信策略', dataIndex: 'messageComm', key: 'messageComm', align: 'center' },
{ title: 'PING通信策略', dataIndex: 'pingComm', key: 'pingComm', align: 'center' },
]
const onFinish = (values: any) => {
console.log('表单提交:', values);
values.rowKey = Math.floor(Math.random() * 10000);
setTableData([...tableData, values])
};
const sending = () => {
if (tableData.length == 0) {
message.info('请添加数据');
return
}else if (activeList.length == 0) {
message.info('请勾选需要发送的数据');
return
}
let serviceList = activeList.map(({ unitName, deviceName, deviceIp, deviceId, messageComm, pingComm }: any) => {
return { unitName, deviceName, deviceIp, deviceId, messageComm, pingComm }
})
remoteFileConfiSendData({
jsonStr: JSON.stringify({ serviceList: serviceList }),
type: 5
}).then((res) => {
if (res?.result == "success") {
message.success('发送数据成功');
form.resetFields();
} else {
message.error(res?.errorMsg);
}
})
}
const clearInfo = () => {
remoteFileConfigClean({ type: 5 }).then(res => {
if (res?.result == "success") {
message.success('清除信息成功');
} else {
message.error(res?.errorMsg);
}
})
}
return (
<div className={`${styles.params_warp} ${styles1.params_warp1}`}>
@ -25,84 +92,100 @@ export default function Page() {
onFinish={onFinish}
>
<Form.Item
name="a3"
name="unitName"
label="单位名称"
rules={[
{ required: true, message: '请输入单位名称' },
]}
>
<Input style={{ width: '560px' }} />
<Input style={{ width: '630px' }} />
</Form.Item>
<Form.Item
name="a2"
name="deviceName"
label="设备名称"
rules={[
{ required: true, message: '请输入设备名称' },
]}
>
<Input style={{ width: '560px' }} />
</Form.Item>
<Form.Item
name="a1"
label="设备IP"
rules={[
{ required: true, message: '请输入设备IP' },
]}
>
<Input style={{ width: '560px' }} />
</Form.Item>
<Form.Item
name="a5"
label="设备ID"
rules={[
{ required: true, message: '请输入设备ID' },
]}
>
<Input style={{ width: '560px' }} />
<Input style={{ width: '630px' }} />
</Form.Item>
<Form.Item
name="a53"
label="报文通信策略"
rules={[
{ required: true, message: '请选择报文通信策略' },
]}
>
<Select
style={{ width: 560 }}
onChange={(e) => { }}
options={[
{ label: '加密通信', value: 1 },
{ label: '数据明传', value: 2 },
{ label: '通信阻断', value: 3 }
<div style={{ display: 'flex' }}>
<Form.Item
name="deviceIp"
label="设备IP"
rules={[
{ required: true, message: '请输入设备IP' },
{ validator: validateIPAddress }
]}
/>
</Form.Item>
<Form.Item
name="a21"
label="PING通信策略"
rules={[
{ required: true, message: '请选择PING通信策略' },
]}
>
<Select
style={{ width: 560 }}
onChange={(e) => { }}
options={[
{ label: '允许互PING', value: 1 },
{ label: '阻断互PING', value: 2 }
>
<Input style={{ width: '250px', marginRight: 20 }} />
</Form.Item>
<Form.Item
name="deviceId"
label="设备ID"
rules={[
{ required: true, message: '请输入设备ID' },
]}
/>
</Form.Item>
>
<Input style={{ width: '250px' }} />
</Form.Item>
</div>
<div style={{ display: 'flex' }}>
<Form.Item
name="messageComm"
label="报文通信策略"
rules={[
{ required: true, message: '请选择报文通信策略' },
]}
>
<Select
style={{ width: 250, marginRight: 20 }}
onChange={(e) => { }}
options={[
{ label: '加密通信', value: 1 },
{ label: '数据明传', value: 2 },
{ label: '通信阻断', value: 3 }
]}
/>
</Form.Item>
<Form.Item
name="pingComm"
label="PING通信策略"
rules={[
{ required: true, message: '请选择PING通信策略' },
]}
>
<Select
style={{ width: 250, marginRight: 20 }}
onChange={(e) => { }}
options={[
{ label: '允许互PING', value: 1 },
{ label: '阻断互PING', value: 2 }
]}
/>
</Form.Item>
<ButtonComp text={'提交'} onClick={() => form.submit()} />
</div>
</Form>
<div className='flex_aiC'>
<div className='mr20'>按住“Ctrl”或“Shift”对信息进行多选。</div>
<ButtonComp text={'提交'} onClick={() => form.submit()} />
</div>
<Table
scroll={tableData.length > 0 ? { y: 41 * 5 } : {}}
pagination={false}
bordered
columns={columns}
dataSource={tableData}
rowKey={(record: any) => record?.rowKey}
rowClassName={rowClassName}
rowSelection={{
onChange: (selectedRowKeys: any, selectedRows: any) => {
setActiveList(selectedRows)
}
}}
/>
<div className={styles.btn_warp}>
<ButtonComp style={{ marginRight: 20 }} text={'发送数据'} onClick={() => { }} />
<ButtonComp type={'cancel'} text={'信息清空'} onClick={() => form.resetFields()} />
<ButtonComp style={{ marginRight: 20 }} text={'发送数据'} onClick={() => sending()} />
<ButtonComp type={'cancel'} text={'信息清空'} onClick={() => clearInfo()} />
</div>
</div>
</ContentWarp>

Write Preview
Loading…
Cancel
Save