Commit 8baa4ed2 authored by 皮倩雯's avatar 皮倩雯

m修改宿主管理界面样式

parent 9a4cc033
Pipeline #42309 skipped with stages
/* eslint-disable react/jsx-no-undef */
import React, { useEffect, useState } from 'react';
import {
Card,
Form,
Input,
Button,
Select,
message,
Divider,
Row,
Col,
Spin,
} from 'antd';
import { Card, Form, Input, Button, Select, message, Divider, Row, Col, Spin } from 'antd';
import { CloseCircleFilled } from '@ant-design/icons';
import styles from './IotConfig.less';
import Internet from '../../../../assets/images/icons/物联.svg';
......@@ -93,19 +82,6 @@ const IotConfig = () => {
console.log(obj);
form.setFieldsValue(obj);
setCurrentIotConfig(val => ({ ...val, ...obj }));
setLoading(true);
PingIOTPlatform({
ip: obj.IotAddress,
}).then(res => {
setLoading(false);
if (res.code === 0) {
setShow1('block');
setShow2('none');
} else {
setShow1('none');
setShow2('block');
}
});
}
});
};
......@@ -149,14 +125,11 @@ const IotConfig = () => {
return (
<div className={styles.iot_container}>
<Card
title={`物联平台${
currentIotVersion.data ? `[${currentIotVersion.data}]` : ''
}`}
// title={`物联平台${currentIotVersion.data ? `[${currentIotVersion.data}]` : ''}`}
style={{ width: '100%', height: 'calc(100vh - 130px)' }}
>
<Spin spinning={loading} tip="loading">
<Form
{...layout}
form={form}
name="basic"
initialValues={{ remember: true }}
......@@ -168,119 +141,95 @@ const IotConfig = () => {
marginTop: '10px',
display: 'flex',
alignItems: 'center',
marginLeft: '15px',
}}
>
<img src={Internet} style={{ height: '16px' }} alt="" />
<span style={{ marginLeft: '10px', fontWeight: 'bold' }}>
物联平台
</span>
<span style={{ marginLeft: '10px', fontWeight: 'bold' }}>物联平台</span>
</div>
<Divider />
<Row>
<Col span={18}>
<Form.Item
label="服务地址(平台)"
name="IotAddress"
rules={[
{
required: true,
pattern: new RegExp(
/^(([1-9]?\d|1\d{2}|2[0-4]\d|25[0-5])\.){3}([1-9]?\d|1\d{2}|2[0-4]\d|25[0-5])$/,
'g',
),
message: '请输入正确的IP例如:192.168.12.231',
},
]}
>
<Input style={{ width: '95%' }} />
</Form.Item>
</Col>
<Col span={3}>
<Button type="primary" onClick={() => PingIot1()}>
连接
</Button>
</Col>
<Col span={3}>
<Form.Item
style={{ marginLeft: '20px' }}
label="服务地址(平台)"
name="IotAddress"
rules={[
{
required: true,
pattern: new RegExp(
/^(([1-9]?\d|1\d{2}|2[0-4]\d|25[0-5])\.){3}([1-9]?\d|1\d{2}|2[0-4]\d|25[0-5])$/,
'g',
),
message: '请输入正确的IP例如:192.168.12.231',
},
]}
>
<div style={{ display: 'flex', justifyContent: 'flex-start' }}>
<Input style={{ width: '300px', marginLeft: '15px' }} />
<span style={{ display: show1 }}>
<img
src={Yes}
style={{
height: '32px',
marginRight: '20px',
marginTop: '5px',
height: '24px',
marginTop: '10px',
marginLeft: '26px',
}}
alt=""
/>
<span style={{ verticalAlign: 'text-bottom' }}>已连接</span>
</span>
<span style={{ display: show2 }}>
<CloseCircleFilled
style={{
fontSize: '32px',
marginRight: '20px',
marginTop: '5px',
fontSize: '24px',
marginTop: '10px',
marginLeft: '26px',
}}
/>
<span style={{ verticalAlign: 'text-bottom' }}>未连接</span>
</span>
</Col>
<div
style={{
marginTop: '40px',
display: 'flex',
alignItems: 'center',
marginLeft: '15px',
}}
>
<img src={EMQ} style={{ height: '16px' }} alt="" />
<span style={{ marginLeft: '10px', fontWeight: 'bold' }}>
EMQ
</span>
</div>
<Divider />
<Col span={18}>
<Form.Item
label="服务地址(EMQ)"
name="TcpAddress"
rules={[
{
required: true,
pattern: new RegExp(/^.*:.*$/),
message: '请输入正确的IP:端口',
},
]}
>
<Input style={{ width: '95%' }} />
</Form.Item>
</Col>
<Col span={6} />
<Col span={18}>
<Form.Item
name="SSLSafe"
label="SSL(EMQ)"
rules={[{ required: true, message: '请选择是否!' }]}
>
<Select placeholder="请选择是否!" style={{ width: '95%' }}>
<Option value="1"></Option>
<Option value="0"></Option>
</Select>
</Form.Item>
</Col>
<Col span={6} />
<Col span={24}>
<Form.Item {...tailLayout}>
<Button
type="primary"
htmlType="submit"
disabled={currentIotConfig.TcpAddress.length > 0 ? 0 : 1}
>
保存
</Button>
</Form.Item>
</Col>
</Row>
</Form.Item>
<Button type="primary" onClick={() => PingIot1()} style={{ marginLeft: '152px' }}>
连接
</Button>
<div
style={{
marginTop: '40px',
display: 'flex',
alignItems: 'center',
}}
>
<img src={EMQ} style={{ height: '16px' }} alt="" />
<span style={{ marginLeft: '10px', fontWeight: 'bold' }}>EMQ</span>
</div>
<Divider />
<Form.Item
style={{ marginLeft: '20px' }}
label="服务地址(EMQ)"
name="TcpAddress"
rules={[
{
required: true,
pattern: new RegExp(/^.*:.*$/),
message: '请输入正确的IP:端口',
},
]}
>
<Input style={{ width: '300px', marginLeft: '13px' }} />
</Form.Item>
<Form.Item
style={{ marginLeft: '20px' }}
name="SSLSafe"
label="SSL(EMQ)"
rules={[{ required: true, message: '请选择是否!' }]}
>
<Select placeholder="请选择是否!" style={{ width: '300px', marginLeft: '48px' }}>
<Option value="1"></Option>
<Option value="0"></Option>
</Select>
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit" style={{ marginLeft: '152px' }}>
保存
</Button>
</Form.Item>
</Form>
</Spin>
</Card>
......
......@@ -44,42 +44,27 @@ const GateConfig = () => {
<div className={styles.gateWay_container}>
<Card style={{ width: '100%', height: 'calc(100vh - 130px)' }}>
<Spin spinning={loading} tip="loading">
<div
style={{ display: 'flex', alignItems: 'center', marginTop: '40px' }}
>
<div style={{ display: 'flex', alignItems: 'center', marginTop: '10px' }}>
<img src={configuration} style={{ height: '16px' }} alt="" />
<span style={{ marginLeft: '10px', fontWeight: 'bold' }}>
网关配置
</span>
<span style={{ marginLeft: '10px', fontWeight: 'bold' }}>网关配置</span>
</div>
<Divider />
<div className={styles.operate_container}>
<Row
gutter={[20, 25]}
style={{ display: 'flex', alignItems: 'center' }}
<div
style={{
marginLeft: '35px',
}}
>
<Col span={2}>
<div
style={{
display: 'flex',
justifyContent: 'flex-end',
marginRight: '-10px',
}}
>
网关开启
</div>
</Col>
<Col span={22}>
{console.log(currentConfig)}
<Switch
checkedChildren="开启"
unCheckedChildren="关闭"
checked={currentConfig}
onChange={OperateNginx}
style={{ marginLeft: '30px' }}
/>
</Col>
</Row>
网关开启
<Switch
checkedChildren="开启"
unCheckedChildren="关闭"
checked={currentConfig}
onChange={OperateNginx}
style={{ marginLeft: '35px' }}
/>
</div>
{console.log(currentConfig)}
</div>
</Spin>
</Card>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment