add:站点管理支持树状结构

.env

@@ -5,7 +5,7 @@ PROXY=/Cityinterface:http://192.168.10.150:8777;/Publish:http://192.168.10.150:8
 # PROXY2 = test : http://localhost:8006/
 
 # 本地应用启动的host域名
-HOST = localhost
+HOST = 0.0.0.0
 
 # 本地应用启动的端口
 PORT = 3001
\ No newline at end of file

src/pages/platformCenter/hostmanager/IotConfig/IotConfig.jsx

 import React, { useEffect, useState } from 'react'
-import { Card, Form, Input, Button, Select } from 'antd'
+import { Card, Form, Input, Button, Select, message } from 'antd'
 import styles from './IotConfig.less'
-
+import { GetIOTPlatformVersion, GetTCPConfigInfo, PingIOTPlatform,SaveTcpAddress } from '../../../../services/platform/hostmanager'
 const layout = {
     labelCol: { span: 8 },
     wrapperCol: { span: 16 },
@@ -14,66 +14,131 @@ const tailLayout = {
 
 const IotConfig = () => {
 
+
+    const [currentIotVersion, setCurrentIotVersion] = useState({ data: "" });
+    const [currentIotConfig, setCurrentIotConfig] = useState({
+        TcpAddress: "",
+        SSLSafe: "",
+        IotAddress: ""
+    });
+
+    const [form] = Form.useForm();
     const onFinish = (values) => {
-        console.log('Success:', values);
+        if(values.IotAddress != null &&values.IotAddress.length > 0){
+            PingIot({ip:values.IotAddress,values:values})
+        }else{
+            SaveIotConfig({
+                tcpAddress:values.TcpAddress,
+                iotAddress:values.IotAddress,
+                sslSafe:values.SSLSafe
+            })
+        }
     };
 
     const onFinishFailed = (errorInfo) => {
         console.log('Failed:', errorInfo);
     };
 
+    useEffect(() => {
+        GetCurentIotVerison()
+        GetIotConfig()
+        
+    }, [])
+
+    const GetCurentIotVerison = () => {
+        GetIOTPlatformVersion().then(
+            res => {
+                if (res.data) {
+                    setCurrentIotVersion(res)
+                }
+            }
+        )
+    }
+    const GetIotConfig = () => {
+        GetTCPConfigInfo().then(
+            res => {
+                if (res.data) {
+                    let obj = {};
+                    Object.keys(currentIotConfig).forEach(k => {
+                        obj[k] = res.data[k];
+                    });
+                    console.log(obj)
+                    form.setFieldsValue(obj);
+                    setCurrentIotConfig(val => ({ ...val, ...obj }));
+
+                }
+            }
+        )
+    }
+    const PingIot = (ip,values) => {
+        PingIOTPlatform({
+            ip:ip
+        }).then(
+            res =>{
+                if(res.code === 0){
+                    SaveIotConfig({
+                        tcpAddress:values.TcpAddress,
+                        iotAddress:values.IotAddress,
+                        sslSafe:values.SSLSafe
+                    })
+                }else{
+                    message.info("物联平台服务器连接异常!");
+                }
+            }
+        )
+    }
+    const SaveIotConfig = (config) =>{
+        SaveTcpAddress(config).then(
+            res =>{
+                if(res.code === 0){
+                    message.info('配置保存成功');
+                }
+            }
+        )
+    }
+
+
     return (
         <div className={styles.iot_container}>
-            <Card title="物联平台(V2.1.0302)" style={{ width: 350 }}>
+            <Card title={`物联平台[${currentIotVersion.data}]`} style={{ width: 430 }}>
 
                 <Form
                     {...layout}
+                    form={form}
                     name="basic"
                     initialValues={{ remember: true }}
                     onFinish={onFinish}
                     onFinishFailed={onFinishFailed}
                 >
                     <Form.Item
-                        label="服务器地址"
-                        name="username"
-                        rules={[{ required: true, message: '请输入服务器地址!' }]}
+                        label="服务器地址(平台)"
+                        name="IotAddress"
+                        rules={[{ required: false, message: '请输入服务器地址!' }]}
+
                     >
                         <Input />
                     </Form.Item>
-                    <Form.Item {...tailLayout}>
-                        <Button type="primary" htmlType="submit">
-                            保存连接
-                        </Button>
-                    </Form.Item>
-                </Form>
-            </Card>
-            <Card title="EMQ服务器" style={{ width: 350, marginLeft: 15 }}>
 
-                <Form
-                    {...layout}
-                    name="basic"
-                    initialValues={{ remember: true }}
-                    onFinish={onFinish}
-                    onFinishFailed={onFinishFailed}
-                >
                     <Form.Item
-                        name="select"
-                        label="SSL"
-                        hasFeedback
-                        rules={[{ required: true, message: 'Please select your country!' }]}
-                        initialValue="否"
+                        label="服务器地址(EMQ)"
+                        name="TcpAddress"
+                        rules={[{ required: true, message: '请输入服务器地址!' }]}
+
+
                     >
-                        <Select placeholder="Please select a country">
-                            <Option value="是">是</Option>
-                            <Option value="否">否</Option>
-                        </Select>
+                        <Input />
                     </Form.Item>
                     <Form.Item
-                        label="服务器地址"
-                        name="username"
-                        rules={[{ required: true, message: '请输入服务器地址!' }]}
+                        name="SSLSafe"
+                        label="SSL(EMQ)"
+                        hasFeedback
+                        rules={[{ required: true, message: '请选择是否!' }]}
+
                     >
-                        <Input />
+                        <Select placeholder="请选择是否!">
+                            <Option value="0">是</Option>
+                            <Option value="1">否</Option>
+                        </Select>
                     </Form.Item>
                     <Form.Item {...tailLayout}>
                         <Button type="primary" htmlType="submit">

src/pages/userCenter/siteManage/AddChildModal.jsx

+import React, { useState } from 'react';
+import { Form, Input, notification } from 'antd';
+import SiteModal from '@/components/Modal/SiteModa';
+import { addStation, addChildSiteNode } from '@/services/userCenter/siteManage/api';
+const { Item } = Form;
+const AddChildModal = props => {
+    const [form] = Form.useForm();
+    const [formLayout, setFormLayout] = useState('horizontal');
+    const [loading, setLoading] = useState(false);
+    const { confirmModal } = props;
+    const onSubmit = () => {
+        form
+            .validateFields()
+            .then(res => {
+                console.log(res, 'res');
+                setLoading(true);
+                addChildSiteNode({
+                    pid: props.pid,
+                    nodeName: res.stationName,
+                    description: res.description,
+                })
+                    .then(res => {
+                        setLoading(false);
+                        if (res.code === 0) {
+                            form.resetFields();
+                            notification.success({
+                                message: '通知',
+                                duration: 3,
+                                description: '新增成功',
+                            });
+                            confirmModal();
+                        } else {
+                            notification.error({
+                                message: '提示',
+                                duration: 3,
+                                description: res.message,
+                            });
+                        }
+                    })
+                    .catch(err => {
+                        setLoading(false);
+                        notification.error({
+                            message: '提示',
+                            duration: 3,
+                            description: err,
+                        });
+                    });
+            })
+            .catch(err => {
+                console.error(err);
+            });
+    };
+
+    const onFinish = value => { };
+    return (
+        <SiteModal
+            {...props}
+            title="新增子站点"
+            bodyStyle={{ width: '100%', minHeight: '100px' }}
+            style={{ top: 200, borderRadius: '20px' }}
+            width="600px"
+            destroyOnClose
+            cancelText="取消"
+            okText="确认"
+            onOk={() => onSubmit()}
+            confirmLoading={loading}
+        >
+            <Form
+                form={form}
+                layout={formLayout}
+                onFinish={onFinish}
+                labelCol={{ span: 4 }}
+            >
+                <Item
+                    label="站点名称"
+                    name="stationName"
+                    rules={[
+                        {
+                            required: true,
+                            message: '请输入站点名称',
+                        },
+                    ]}
+                >
+                    <Input placeholder="请输入站点名称" />
+                </Item>
+                {/* <Item label="站点类别">all</Item> */}
+                <Item label="站点描述" name="description">
+                    <Input placeholder="请输入站点描述" />
+                </Item>
+            </Form>
+        </SiteModal>
+    );
+};
+
+export default AddChildModal;

src/pages/userCenter/siteManage/EditModal.jsx

@@ -18,7 +18,7 @@ const EditModal = props => {
         editStation({
           stationName: res.stationName,
           description: res.description,
-          stationID: stationObj.stationID,
+          stationID: stationObj,
           _version: 9999,
           _dc: new Date().getTime(),
         })

src/pages/userCenter/siteManageV2/siteManage.less

+:global {
+  ::-webkit-scrollbar {
+    height: 6px; //x轴滚动条粗细
+    width: 6px; //y轴滚动条粗细
+    border-bottom: 2px solid white;
+  }
+
+  //滚动条里面的小方块，能上下左右移动（取决于是垂直滚动条还是水平滚动条）
+  ::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
+    background: rgba(74, 74, 75, 0.3);
+    margin-bottom: 10px;
+  }
+
+  //滚动条的轨道（里面装有thumb）滚动槽
+  ::-webkit-scrollbar-track {
+    box-shadow: 0;
+    border-radius: 0;
+    background: white; //滚动槽背景色
+    border-radius: 10px; //滚动条边框半径设置
+  }
+
+  .ant-tree-node-content-wrapper {
+    width: 100%;
+    overflow: hidden !important;
+
+    .ant-tree-title {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      display: block;
+    }
+  }
+
+  .ant-pagination-prev,
+  .ant-pagination-next {
+    line-height: 8px !important;
+  }
+
+  .ant-input-search-button {
+    line-height: 1;
+  }
+
+  .ant-dropdown-menu-item>.anticon:first-child {
+    vertical-align: 0.15em !important;
+  }
+
+  .ant-table-tbody {
+    .ant-table-row:hover>td {
+      background: #aed8fa !important;
+    }
+  }
+
+  .ant-modal-close-icon {
+    vertical-align: 0.3em;
+  }
+
+  .ant-notification-close-icon {
+    vertical-align: 0.2em;
+  }
+
+  .ant-tree-switcher-icon svg {
+    font-size: 14px;
+  }
+}
+
+.redText {
+  color: red;
+  cursor: pointer;
+}
+
+.ant-layout {
+  overflow: auto;
+
+  .ant-layout-content {
+    margin: 12px !important;
+  }
+}
+
+.siteTitle {
+  font-size: 16px;
+  margin: 0 0 6px 0;
+  user-select: none;
+  padding: 3px;
+  border-bottom: 1px solid #ccc;
+}
+
+.siteManageContainer {
+  .ant-tree-treenode {
+    width: 100% !important;
+
+    .ant-tree-node-content-wrapper {
+      display: inline-block;
+      width: 100%;
+    }
+
+    .iconWraper1 {
+      float: right;
+
+      span {
+        display: none;
+      }
+    }
+  }
+
+  .ant-tree-treenode:hover {
+    .iconWraper1>span {
+      margin-left: 12px;
+      font-size: 18px;
+      display: inline-block;
+    }
+  }
+
+  .contentContainer {
+    display: flex;
+    width: 100%;
+    position: relative;
+
+    .orgContainer {
+      height: calc(100vh - 74px);
+      width: 280px;
+      left: 0;
+      top: 0;
+      overflow-x: hidden;
+      margin-right: 10px;
+      position: relative;
+      transition-property: width, left;
+      transition-duration: 0.5s;
+      white-space: nowrap;
+
+      .ant-tree {
+        padding-top: 6px;
+
+        .ant-tree-switcher {
+          line-height: 1;
+          margin-right: 0px !important;
+          color: #1890FF;
+
+          .ant-tree-switcher-line-icon {
+            margin-left: 5px;
+          }
+        }
+      }
+
+      .switcher {
+        display: block;
+        position: absolute;
+        font-size: 18px;
+        color: #1890FF !important;
+        top: 45%;
+        right: 2px;
+        transform: translate(0%, -50%);
+        z-index: 1;
+      }
+    }
+
+    .orgContainerHide {
+      // transform: translateX(-230px);
+      left: 0px;
+      top: 0;
+      width: 26px;
+    }
+
+    .userContainer {
+      height: calc(100vh - 74px) !important;
+      z-index: 999;
+      min-width: 800px;
+      background: white;
+      width: 100%;
+      position: relative;
+      transition: width 0.5s;
+
+      .title {
+        margin: 16px 0 10px 16px;
+        display: inline-block;
+        width: 270px;
+        cursor: pointer;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .ant-table-pagination {
+        padding-right: 12px;
+        background: white;
+        margin: 1px 0;
+        padding: 8px;
+        padding-right: 20px;
+      }
+
+      .ant-btn {
+        margin: 0px 10px;
+
+        .ant-btn-primary {
+          background: #50aefc;
+        }
+      }
+
+      .ant-input-search-button {
+        margin-left: 0px !important;
+      }
+
+      .ant-table-thead tr th {
+        font-weight: 600;
+        color: rgba(0, 0, 0, 0.85);
+      }
+
+      .ant-table-cell {
+        text-align: center;
+        overflow: hidden;
+        // text-overflow:ellipsis;
+        white-space: nowrap;
+      }
+
+      .ant-table-body {
+        height: calc(100vh - 210px);
+        border-right: white;
+        overflow: auto !important;
+      }
+
+      .clickRowStyle {
+        background: #cfe7fd;
+      }
+
+      .ant-pagination {
+        z-index: 999;
+        border-top: 1px solid #f0eded;
+      }
+    }
+  }
+}
+
+
+//机构编辑面板
+.boxR {
+  width: 100%;
+  position: relative;
+  transition: width 2s;
+}
+
+.cardBoxR {
+  min-height: calc(100vh - 210px);
+  max-height: calc(100vh - 210px);
+  min-width: 600px;
+  overflow-y: scroll;
+}
+
+
+.siteCheckbox .ant-collapse-content > .ant-collapse-content-box{
+    padding: 16px 16px 0;
+  }
+  .siteList{
+    width:199px;
+    // margin:0 0 15px 0;
+    padding:0 0  15px 0;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+  .sitePanel{
+    margin: 0 0 10px 0;
+  }
+  .sitePanelHead{
+    background-color: #f5f5f5;
+    padding:8px 10px;
+    cursor: pointer;
+    display: flex;
+    flex-direction: row;
+  }
+  .sitePanelHead p{
+    margin: 0;
+  }
+  .sitePanelCon{
+    border:1px solid #f5f5f5;
+    padding:20px;
+    padding-bottom: 0;
+    border-top:0;
+    max-height: 200px;
+    overflow: auto;
+  }
+  .sitePanel .ant-checkbox-wrapper + .ant-checkbox-wrapper{
+    margin:0
+  }
+  .siteIcon{
+    color:#ccc;
+    margin:4px 10px 0 0;
+  }
+  .siteAll{
+    margin:0 0 10px 0;
+  }
+  .siteColor{
+    color:#f00
+  }
+  .siteCommit{
+     margin: 10px 0;
+  }
+  .siteSelectList{
+    border:1px solid #f5f5f5;
+    height: 200px;
+    overflow: auto;
+    margin-bottom: 50px;
+    .siteSelectUl{
+      margin: 0;
+      padding: 15px;
+      display: flex;
+      flex-direction: row;
+      flex-wrap: wrap;
+      li{
+        width:200px;
+        height: 35px;
+        line-height: 35px;
+        background: rgba(24, 144, 255,0.16) url('../../../assets/images/icons/close.png') no-repeat 175px;
+        background-size: 20px;
+        margin: 0 10px 10px 0;
+        cursor: pointer;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        padding: 0 20px 0 10px;
+      }
+    }
+  }
+  .siteline{
+    border-top: 1px solid #eee;
+    padding-top: 15px;
+    margin-top: 20px;
+  }
+  .siteBtn{
+    width:98%;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-end;
+  }
+
+.ant-modal-root {
+  .ant-tree-switcher {
+    line-height: 1;
+    color: #1890FF;
+    margin-right: 0px !important;
+  }
+
+  .ant-checkbox-group .ant-checkbox-group-item {
+    margin-right: 0px !important;
+    min-width: 270px !important;
+  }
+
+  .ant-tree-list-holder {
+    overflow: auto;
+    height: 40vh;
+  }
+
+  .ant-tabs-content-holder {
+    overflow: auto;
+    height: 50vh;
+  }
+}

src/routes/config.js

@@ -22,6 +22,7 @@ import CurrentSolution from '@/pages/database/CurrentSolution';
 import UserManage from '../pages/userCenter/userManage/UserManage';
 import RoleManage from '@/pages/userCenter/roleManage/RoleManage';
 import SiteManage from '../pages/userCenter/siteManage/SiteManage';
+import SiteManageV2 from '../pages/userCenter/siteManageV2/SiteManage';
 import Dictionary from '../pages/dataCenter/dictionary';
 import ServiceLog from '../pages/log/serviceLog';
 import LoginLog from '../pages/log/loginLog';
@@ -120,7 +121,7 @@ export default {
             {
               path: '/userCenter/SiteManage',
               name: '站点管理',
-              component: SiteManage,
+              component: SiteManageV2,
             },
           ],
         },

src/services/platform/hostmanager.jsx

 import { get, post, PUBLISH_SERVICE, CITY_SERVICE } from '@/services/index';
 
 
-export const S_GetDataBaseConfig = param =>
-    get(`${CITY_SERVICE}/OMS.svc/S_GetDataBaseConfig`, param);
+// export const S_GetDataBaseConfig = param =>
+//     get(`${CITY_SERVICE}/OMS.svc/S_GetDataBaseConfig`, param);
+
+// export const GetTCPConfigInfo = param =>
+//     get(`${CITY_SERVICE}/MessagePlatform.svc/MessageManage/GetTCPConfigInfo`, param);
 
-export const GetTCPConfigInfo = param =>
-    get(`${CITY_SERVICE}/MessagePlatform.svc/MessageManage/GetTCPConfigInfo`, param);
 export const GetDataBaseConfig = param =>
     get(`${PUBLISH_SERVICE}/DBManager/GetDataBaseConfig`, param);
 export const GetBasicInfo = param =>
-    get(`${PUBLISH_SERVICE}/Message/GetBasicInfo`, param);
+    get(`${PUBLISH_SERVICE}/HostManager/GetBasicInfo`, param);
+export const GetIOTPlatformVersion = param =>
+    get(`${PUBLISH_SERVICE}/HostManager/GetIOTPlatformVersion`, param);
+export const GetTCPConfigInfo = param =>
+    get(`${PUBLISH_SERVICE}/HostManager/GetTCPConfigInfo`, param);
+export const PingIOTPlatform = param =>
+    get(`${PUBLISH_SERVICE}/HostManager/PingIOTPlatform`, param);
+export const SaveTcpAddress = param =>
+    get(`${PUBLISH_SERVICE}/HostManager/SaveTcpAddress`, param);
+

src/services/userCenter/siteManage/api.js

@@ -42,3 +42,14 @@ export const getStationUserList = params =>
 // 获取站点管理一二级列表+分页
 export const groupUserPagingList = params =>
   post(`${PUBLISH_SERVICE}/UserCenter/GroupUserPagingList`, params);
+// 添加子站点
+export const addChildSiteNode = params =>
+  get(`${PUBLISH_SERVICE}/UserCenter/AddChildSiteNode`, params);
+// 获取树状站点列表
+export const getSiteTree = params =>
+  get(`${PUBLISH_SERVICE}/UserCenter/GetSiteTree`, params);
+  //获取当前站点关联的用户
+export const getStationUsers = params =>
+  get(`${PUBLISH_SERVICE}/UserCenter/GetStationUsers`, params);
+
+