Merge branch 'dev' of https://gitea.anxinyun.cn/gao.zhiyuan/OperationalService into dev

web/client/src/app.jsx

@@ -4,10 +4,12 @@ import React, { useEffect } from 'react';
 import Layout from './layout';
 import Auth from './sections/auth';
 import Example from './sections/example';
+import Analysis from './sections/analysis';
 import Install from './sections/install';
 import Problem from './sections/problem';
 import NoMatch from './sections/noMatch';
 import Console from './sections/console';
+import Data from './sections/data';
 
 const App = props => {
    const { projectName } = props
@@ -32,8 +34,8 @@ const App = props => {
    return (
       <Layout
          title={projectName}
-         sections={[
+         sections={[//Example,
-            Example,Install,Problem,
+            Analysis,Install,Data,Problem,
             Auth, NoMatch,Console
          ]}
       />

web/client/src/layout/components/header/index.jsx

@@ -30,22 +30,10 @@ const Header = (props) => {
                     }}
                     header={{
                         logo: (
-                            <div style={{display:'flex',alignItems: 'center'}}>
-                                <div>
                             <img
-                                        src="/assets/images/background/logo.png"
+                                src="/assets/images/install/long_logo.png"
-                                        style={{ display: "inline-block", width: 24, height: 24 }}
+                                style={{ display: "inline-block", width: 200, height: 40 }}
                             />
-                                </div>
-                                <div>
-                                    <div style={{ fontSize: 18, fontFamily: "YouSheBiaoTiHei", color: '#FFFFFF',letterSpacing: 3 }}>运维管理系统</div>
-                                    <div style={{ fontSize: 8, fontFamily: "YouSheBiaoTiHei", color: '#FFFFFF' }}>RUNNING MANAGEMENT SYSTEM</div>
-                                </div>
-                            </div>
-                            //  <img
-                            //     src="/assets/images/background/logo.png"
-                            //     style={{ display: "inline-block", width: 280, height: 40 }}
-                            //  />
                         ),
                         // text: (
                         //     <div style={{ fontFamily: "YouSheBiaoTiHei", color: '#FFFFFF' }}>运维管理系统</div>

web/client/src/sections/analysis/actions/console.js

@@ -0,0 +1,14 @@
+'use strict';
+
+import { ApiTable ,basicAction} from '$utils'
+
+// export function getMembers (orgId) {
+//     return dispatch => basicAction({
+//         type: 'get',
+//         dispatch: dispatch,
+//         actionType: 'GET_MEMBERS',
+//         url: `${ApiTable.getEnterprisesMembers.replace('{enterpriseId}', orgId)}`,
+//         msg: { error: '获取用户列表失败' },
+//         reducer: { name: 'members' }
+//     });
+// }

web/client/src/sections/analysis/actions/index.js

@@ -0,0 +1,7 @@
+'use strict';
+
+import * as console from './console'
+
+export default {
+    ...console
+}

web/client/src/sections/analysis/containers/index.js

@@ -0,0 +1,6 @@
+'use strict';
+
+import ProblemData from './problemData';
+import OperationData from './operationData';
+import WorkorderData from './workorderData';
+export { ProblemData,OperationData ,WorkorderData};

web/client/src/sections/analysis/containers/operationData.jsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { Spin, Card } from '@douyinfe/semi-ui';
+import '../style.less'
+const { Meta } = Card;
+
+const Console = (props) => {
+    const { dispatch, actions, user, loading, socket } = props
+
+    useEffect(() => {
+        // ACTION 示例
+        //   dispatch(actions.example.getMembers(user.orgId))
+    }, [])
+
+    // websocket 使用测试
+    //    useEffect(() => {
+    //       console.log(socket)
+    //       if (socket) {
+    //          socket.on('TEST', function (msg) {
+    //             console.info(msg);
+    //          });
+    //          return () => {
+    //             socket.off("TEST");
+    //          }
+    //       }
+
+    //    }, [socket])
+
+    return (
+        <>
+            <div>
+                <img src="/assets/images/install/watting.png" alt="" style={{ height: '100%', width: '100%', }} />
+            </div>
+        </>
+    )
+}
+
+function mapStateToProps (state) {
+    const { auth, global, members, webSocket } = state;
+    return {
+        //   loading: members.isRequesting,
+        //   user: auth.user,
+        //   actions: global.actions,
+        //   members: members.data,
+        //   socket: webSocket.socket
+    };
+}
+
+export default connect(mapStateToProps)(Console);

web/client/src/sections/analysis/containers/problemData.jsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { Spin, Card } from '@douyinfe/semi-ui';
+import '../style.less'
+const { Meta } = Card;
+
+const Console = (props) => {
+    const { dispatch, actions, user, loading, socket } = props
+
+    useEffect(() => {
+        // ACTION 示例
+        //   dispatch(actions.example.getMembers(user.orgId))
+    }, [])
+
+    // websocket 使用测试
+    //    useEffect(() => {
+    //       console.log(socket)
+    //       if (socket) {
+    //          socket.on('TEST', function (msg) {
+    //             console.info(msg);
+    //          });
+    //          return () => {
+    //             socket.off("TEST");
+    //          }
+    //       }
+
+    //    }, [socket])
+
+    return (
+        <>
+            <div>
+                <img src="/assets/images/install/watting.png" alt="" style={{ height: '100%', width: '100%', }} />
+            </div>
+        </>
+    )
+}
+
+function mapStateToProps (state) {
+    const { auth, global, members, webSocket } = state;
+    return {
+        //   loading: members.isRequesting,
+        //   user: auth.user,
+        //   actions: global.actions,
+        //   members: members.data,
+        //   socket: webSocket.socket
+    };
+}
+
+export default connect(mapStateToProps)(Console);

web/client/src/sections/analysis/containers/workorderData.jsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { Spin, Card } from '@douyinfe/semi-ui';
+import '../style.less'
+const { Meta } = Card;
+
+const Console = (props) => {
+    const { dispatch, actions, user, loading, socket } = props
+
+    useEffect(() => {
+        // ACTION 示例
+        //   dispatch(actions.example.getMembers(user.orgId))
+    }, [])
+
+    // websocket 使用测试
+    //    useEffect(() => {
+    //       console.log(socket)
+    //       if (socket) {
+    //          socket.on('TEST', function (msg) {
+    //             console.info(msg);
+    //          });
+    //          return () => {
+    //             socket.off("TEST");
+    //          }
+    //       }
+
+    //    }, [socket])
+
+    return (
+        <>
+            <div>
+                <img src="/assets/images/install/watting.png" alt="" style={{ height: '100%', width: '100%', }} />
+            </div>
+        </>
+    )
+}
+
+function mapStateToProps (state) {
+    const { auth, global, members, webSocket } = state;
+    return {
+        //   loading: members.isRequesting,
+        //   user: auth.user,
+        //   actions: global.actions,
+        //   members: members.data,
+        //   socket: webSocket.socket
+    };
+}
+
+export default connect(mapStateToProps)(Console);

web/client/src/sections/analysis/index.js

@@ -0,0 +1,15 @@
+'use strict';
+
+import reducers from './reducers';
+import routes from './routes';
+import actions from './actions';
+import { getNavItem } from './nav-item';
+
+export default {
+    key: 'analysis',
+    name: '分析',
+    reducers: reducers,
+    routes: routes,
+    actions: actions,
+    getNavItem: getNavItem
+};

web/client/src/sections/analysis/nav-item.jsx

@@ -0,0 +1,41 @@
+import React from 'react';
+import { IconCode } from '@douyinfe/semi-icons';
+
+export function getNavItem (user, dispatch) {
+    return (
+        [
+            {
+                itemKey: 'analysis',
+                text: '分析',
+                icon: <IconCode />,
+                items: [
+                    {
+                        itemKey: 'problemAnalysis',
+                        text: '问题分析',
+                        icon: <iconpark-icon style={{ width: 20, height: 20 }} name="jq"></iconpark-icon>,
+                        to: '/analysis/problemAnalysis/problemData',
+                        items: [{
+                            itemKey: 'problemData', to: '/analysis/problemAnalysis/problemData', text: '问题数据'
+                        }]
+                    }, {
+                        itemKey: 'operationAnalysis',
+                        text: '运维分析',
+                        icon: <iconpark-icon style={{ width: 20, height: 20 }} name="ys"></iconpark-icon>,
+                        to: '/analysis/operationAnalysis/operationData',
+                        items: [{
+                            itemKey: 'operationData', to: '/analysis/operationAnalysis/operationData', text: '运维数据'
+                        }]
+                    },{
+                        itemKey: 'workorderAnalysis',
+                        text: '工单分析',
+                        icon: <iconpark-icon style={{ width: 20, height: 20 }} name="ys"></iconpark-icon>,
+                        to: '/analysis/workorderAnalysis/workorderData',
+                        items: [{
+                            itemKey: 'workorderData', to: '/analysis/workorderAnalysis/workorderData', text: '工单数据'
+                        }]
+                    },
+                ]
+            },
+        ]
+    );
+}

web/client/src/sections/analysis/reducers/index.js

@@ -0,0 +1,5 @@
+'use strict';
+
+export default {
+
+}

web/client/src/sections/analysis/routes.js

@@ -0,0 +1,42 @@
+import { ProblemData, OperationData, WorkorderData } from './containers';
+
+export default [{
+    type: 'inner',
+    route: {
+        path: '/analysis',
+        key: 'analysis',
+        breadcrumb: '分析',
+        // 不设置 component 则面包屑禁止跳转
+        childRoutes: [{
+            path: '/problemAnalysis',
+            key: 'problemAnalysis',
+            breadcrumb: '问题分析',
+            childRoutes: [{
+                path: '/problemData',
+                key: 'problemData',
+                component: ProblemData,
+                breadcrumb: '分析数据',
+            }]
+        }, {
+            path: '/operationAnalysis',
+            key: 'operationAnalysis',
+            breadcrumb: '运维分析',
+            childRoutes: [{
+                path: '/operationData',
+                key: 'operationData',
+                component: OperationData,
+                breadcrumb: '运维数据',
+            }]
+        }, {
+            path: '/workorderAnalysis',
+            key: 'workorderAnalysis',
+            breadcrumb: '工单分析',
+            childRoutes: [{
+                path: '/workorderData',
+                key: 'workorderData',
+                component: WorkorderData,
+                breadcrumb: '工单数据',
+            }]
+        }]
+    }
+}];

web/client/src/sections/analysis/style.less

@@ -0,0 +1,7 @@
+#example {
+    box-shadow: 3px 3px 2px black;
+}
+
+#example:hover {
+    color: yellowgreen;
+}

web/client/src/sections/console/containers/console.jsx

@@ -13,23 +13,23 @@ const Console = (props) => {
     }, [])
 
     // websocket 使用测试
-//    useEffect(() => {
+    //    useEffect(() => {
-//       console.log(socket)
+    //       console.log(socket)
-//       if (socket) {
+    //       if (socket) {
-//          socket.on('TEST', function (msg) {
+    //          socket.on('TEST', function (msg) {
-//             console.info(msg);
+    //             console.info(msg);
-//          });
+    //          });
-//          return () => {
+    //          return () => {
-//             socket.off("TEST");
+    //             socket.off("TEST");
-//          }
+    //          }
-//       }
+    //       }
 
-//    }, [socket])
+    //    }, [socket])
 
     return (
         <>
             <div>
-            texttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttext
+                <img src="/assets/images/install/watting.png" alt="" style={{ height: '100%', width: '100%', }} />
             </div>
         </>
     )

web/client/src/sections/data/actions/console.js

@@ -0,0 +1,14 @@
+'use strict';
+
+import { ApiTable ,basicAction} from '$utils'
+
+// export function getMembers (orgId) {
+//     return dispatch => basicAction({
+//         type: 'get',
+//         dispatch: dispatch,
+//         actionType: 'GET_MEMBERS',
+//         url: `${ApiTable.getEnterprisesMembers.replace('{enterpriseId}', orgId)}`,
+//         msg: { error: '获取用户列表失败' },
+//         reducer: { name: 'members' }
+//     });
+// }

web/client/src/sections/data/actions/index.js

@@ -0,0 +1,7 @@
+'use strict';
+
+import * as console from './console'
+
+export default {
+    ...console
+}

web/client/src/sections/data/containers/dataAssociation.jsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { Spin, Card } from '@douyinfe/semi-ui';
+import '../style.less'
+const { Meta } = Card;
+
+const Console = (props) => {
+    const { dispatch, actions, user, loading, socket } = props
+
+    useEffect(() => {
+        // ACTION 示例
+        //   dispatch(actions.example.getMembers(user.orgId))
+    }, [])
+
+    // websocket 使用测试
+    //    useEffect(() => {
+    //       console.log(socket)
+    //       if (socket) {
+    //          socket.on('TEST', function (msg) {
+    //             console.info(msg);
+    //          });
+    //          return () => {
+    //             socket.off("TEST");
+    //          }
+    //       }
+
+    //    }, [socket])
+
+    return (
+        <>
+            <div>
+                <img src="/assets/images/install/watting.png" alt="" style={{ height: '100%', width: '100%', }} />
+            </div>
+        </>
+    )
+}
+
+function mapStateToProps (state) {
+    const { auth, global, members, webSocket } = state;
+    return {
+        //   loading: members.isRequesting,
+        //   user: auth.user,
+        //   actions: global.actions,
+        //   members: members.data,
+        //   socket: webSocket.socket
+    };
+}
+
+export default connect(mapStateToProps)(Console);

web/client/src/sections/data/containers/dataComparison.jsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { Spin, Card } from '@douyinfe/semi-ui';
+import '../style.less'
+const { Meta } = Card;
+
+const Console = (props) => {
+    const { dispatch, actions, user, loading, socket } = props
+
+    useEffect(() => {
+        // ACTION 示例
+        //   dispatch(actions.example.getMembers(user.orgId))
+    }, [])
+
+    // websocket 使用测试
+    //    useEffect(() => {
+    //       console.log(socket)
+    //       if (socket) {
+    //          socket.on('TEST', function (msg) {
+    //             console.info(msg);
+    //          });
+    //          return () => {
+    //             socket.off("TEST");
+    //          }
+    //       }
+
+    //    }, [socket])
+
+    return (
+        <>
+            <div>
+                <img src="/assets/images/install/watting.png" alt="" style={{ height: '100%', width: '100%', }} />
+            </div>
+        </>
+    )
+}
+
+function mapStateToProps (state) {
+    const { auth, global, members, webSocket } = state;
+    return {
+        //   loading: members.isRequesting,
+        //   user: auth.user,
+        //   actions: global.actions,
+        //   members: members.data,
+        //   socket: webSocket.socket
+    };
+}
+
+export default connect(mapStateToProps)(Console);

web/client/src/sections/data/containers/dataQuery.jsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { Spin, Card } from '@douyinfe/semi-ui';
+import '../style.less'
+const { Meta } = Card;
+
+const Console = (props) => {
+    const { dispatch, actions, user, loading, socket } = props
+
+    useEffect(() => {
+        // ACTION 示例
+        //   dispatch(actions.example.getMembers(user.orgId))
+    }, [])
+
+    // websocket 使用测试
+    //    useEffect(() => {
+    //       console.log(socket)
+    //       if (socket) {
+    //          socket.on('TEST', function (msg) {
+    //             console.info(msg);
+    //          });
+    //          return () => {
+    //             socket.off("TEST");
+    //          }
+    //       }
+
+    //    }, [socket])
+
+    return (
+        <>
+            <div>
+                <img src="/assets/images/install/watting.png" alt="" style={{ height: '100%', width: '100%', }} />
+            </div>
+        </>
+    )
+}
+
+function mapStateToProps (state) {
+    const { auth, global, members, webSocket } = state;
+    return {
+        //   loading: members.isRequesting,
+        //   user: auth.user,
+        //   actions: global.actions,
+        //   members: members.data,
+        //   socket: webSocket.socket
+    };
+}
+
+export default connect(mapStateToProps)(Console);

web/client/src/sections/data/containers/index.js

@@ -0,0 +1,6 @@
+'use strict';
+import DataQuery from './dataQuery';
+import DataComparison from './dataComparison';
+import DataAssociation from './dataAssociation';
+import Notebook from './notebook';
+export { DataQuery, DataComparison, DataAssociation,Notebook};

web/client/src/sections/data/containers/notebook.jsx

@@ -0,0 +1,49 @@
+import React, { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { Spin, Card } from '@douyinfe/semi-ui';
+import '../style.less'
+const { Meta } = Card;
+
+const Console = (props) => {
+    const { dispatch, actions, user, loading, socket } = props
+
+    useEffect(() => {
+        // ACTION 示例
+        //   dispatch(actions.example.getMembers(user.orgId))
+    }, [])
+
+    // websocket 使用测试
+    //    useEffect(() => {
+    //       console.log(socket)
+    //       if (socket) {
+    //          socket.on('TEST', function (msg) {
+    //             console.info(msg);
+    //          });
+    //          return () => {
+    //             socket.off("TEST");
+    //          }
+    //       }
+
+    //    }, [socket])
+
+    return (
+        <>
+            <div>
+                <img src="/assets/images/install/watting.png" alt="" style={{ height: '100%', width: '100%', }} />
+            </div>
+        </>
+    )
+}
+
+function mapStateToProps (state) {
+    const { auth, global, members, webSocket } = state;
+    return {
+        //   loading: members.isRequesting,
+        //   user: auth.user,
+        //   actions: global.actions,
+        //   members: members.data,
+        //   socket: webSocket.socket
+    };
+}
+
+export default connect(mapStateToProps)(Console);

web/client/src/sections/data/index.js

@@ -0,0 +1,15 @@
+'use strict';
+
+import reducers from './reducers';
+import routes from './routes';
+import actions from './actions';
+import { getNavItem } from './nav-item';
+
+export default {
+    key: 'data',
+    name: '数据',
+    reducers: reducers,
+    routes: routes,
+    actions: actions,
+    getNavItem: getNavItem
+};

web/client/src/sections/data/nav-item.jsx

@@ -0,0 +1,37 @@
+import React from 'react';
+import { IconCode } from '@douyinfe/semi-icons';
+
+export function getNavItem (user, dispatch) {
+    return (
+        [
+            {
+                itemKey: 'data',
+                text: '数据',
+                icon: <IconCode />,
+                items: [
+                    {
+                        itemKey: 'dataMonitoring',
+                        text: '数据监控',
+                        icon: <iconpark-icon style={{ width: 20, height: 20 }} name="jq"></iconpark-icon>,
+                        to: '/data/dataMonitoring/dataQuery',
+                        items: [{
+                            itemKey: 'dataQuery', to: '/data/dataMonitoring/dataQuery', text: '数据查询'
+                        }]
+                    }, {
+                        itemKey: 'dataAnalysis',
+                        text: '数据分析',
+                        icon: <iconpark-icon style={{ width: 20, height: 20 }} name="ys"></iconpark-icon>,
+                        to: '/data/dataAnalysis/dataComparison',
+                        items: [{
+                            itemKey: 'dataComparison', to: '/data/dataAnalysis/dataComparison', text: '数据对比'
+                        },{
+                            itemKey: 'dataAssociation', to: '/data/dataAnalysis/dataAssociation', text: '数据关联'
+                        },{
+                            itemKey: 'notebook', to: '/data/dataAnalysis/notebook', text: 'notebook'
+                        }]
+                    },
+                ]
+            },
+        ]
+    );
+}

web/client/src/sections/data/reducers/index.js

@@ -0,0 +1,5 @@
+'use strict';
+
+export default {
+
+}

web/client/src/sections/data/routes.js

@@ -0,0 +1,42 @@
+import { DataQuery, DataComparison, DataAssociation,Notebook } from './containers';
+
+export default [{
+    type: 'inner',
+    route: {
+        path: '/data',
+        key: 'data',
+        breadcrumb: '数据',
+        // 不设置 component 则面包屑禁止跳转
+        childRoutes: [{
+            path: '/dataMonitoring',
+            key: 'dataMonitoring',
+            breadcrumb: '数据监控',
+            childRoutes: [{
+                path: '/dataQuery',
+                key: 'dataQuery',
+                component: DataQuery,
+                breadcrumb: '数据查询',
+            }]
+        }, {
+            path: '/dataAnalysis',
+            key: 'dataAnalysis',
+            breadcrumb: '数据分析',
+            childRoutes: [{
+                path: '/dataComparison',
+                key: 'dataComparison',
+                component: DataComparison,
+                breadcrumb: '数据对比',
+            },{
+                path: '/dataAssociation',
+                key: 'dataAssociation',
+                component: DataAssociation,
+                breadcrumb: '数据关联',
+            },{
+                path: '/notebook',
+                key: 'notebook',
+                component: Notebook,
+                breadcrumb: 'notebook',
+            }]
+        }]
+    }
+}];

web/client/src/sections/data/style.less

@@ -0,0 +1,7 @@
+#example {
+    box-shadow: 3px 3px 2px black;
+}
+
+#example:hover {
+    color: yellowgreen;
+}