版本代码

code/web/client/src/index.jsx

@@ -9,4 +9,4 @@ import microApp from '@micro-zoe/micro-app'
 
 microApp.start()
 
-render((<App projectName="飞尚物联" />), document.getElementById('IotAuthApp'));
+render((<App projectName="边缘网关" />), document.getElementById('IotAuthApp'));

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

@@ -4,84 +4,90 @@ import { connect } from "react-redux";
 import { Nav, Avatar, Dropdown } from "@douyinfe/semi-ui";
 
 const Header = (props) => {
-    const { dispatch, history, user, actions, } = props;
+   const { dispatch, history, user, actions, } = props;
 
-    return (
-        <>
-            <Nav
-                mode={"horizontal"}
-                onClick={({ itemKey }) => {
-                    if (itemKey == "logout") {
-                        dispatch(actions.auth.logout());
-                        // if (socket) {
-                        //     socket.disconnect();
-                        // }
-                        history.push(`/signin`);
-                    }
-                }}
-                style={{
-                    height: 60,
-                    minWidth: 520,
-                    background: `url(${__webpack_public_path__}assets/images/background/header.png)`,
-                    backgroundSize: "100% 100%",
-                    color: "white",
-                }}
-                header={{
-                    logo: (
+   return (
+      <>
+         <Nav
+            mode={"horizontal"}
+            onClick={({ itemKey }) => {
+               if (itemKey == "logout") {
+                  dispatch(actions.auth.logout());
+                  // if (socket) {
+                  //     socket.disconnect();
+                  // }
+                  history.push(`/signin`);
+               }
+            }}
+            style={{
+               height: 60,
+               minWidth: 520,
+               background: `url(${__webpack_public_path__}assets/images/background/header.png)`,
+               backgroundSize: "100% 100%",
+               color: "white",
+            }}
+            header={{
+               logo: (
+                  <img
+                     src={`/assets/images/background/logo.png`}
+                     style={{ display: "inline-block", width: 280, height: 52 }}
+                  />
+               ),
+               text: "",
+            }}
+            footer={
+               <Nav.Sub
+                  itemKey={"user"}
+                  dropdownStyle={{
+                     position: 'relative'
+                  }}
+                  text={
+                     <div
+                        style={{
+                           marginLeft: 20,
+                           display: "inline-block",
+                           color: "white",
+                        }}
+                     >
                         <img
-                            src={`/assets/images/background/logo.png`}
-                            style={{ display: "inline-block", width: 280, height: 52 }}
+                           src={`/assets/images/background/notice.png`}
+                           style={{
+                              display: "inline-block",
+                              width: 18,
+                              height: 18,
+                              position: "relative",
+                              top: 6,
+                              left: -10,
+                           }}
                         />
-                    ),
-                    text: "",
-                }}
-                footer={
-                    <Nav.Sub
-                        itemKey={"user"}
-                        dropdownStyle={{
-                            position: 'relative'
-                        }}
-                        text={
-                            <div
-                                style={{
-                                    marginLeft: 20,
-                                    display: "inline-block",
-                                    color: "white",
-                                }}
-                            >
-                                <img
-                                    src={`/assets/images/background/notice.png`}
-                                    style={{
-                                        display: "inline-block",
-                                        width: 18,
-                                        height: 18,
-                                        position: "relative",
-                                        top: 6,
-                                        left: -10,
-                                    }}
-                                />
-
-                                <Avatar size="small" color="light-blue" style={{ margin: 4 }}>
-                                    <img src="/assets/images/avatar/6.png" />
-                                </Avatar>
-                            </div>
-                        }
-                    >
-                        <Nav.Item itemKey={"logout"} text={"退出"} />
-                    </Nav.Sub>
-                }
-            />
-        </>
-    );
+                        <Avatar size="small" color="light-blue" style={{ margin: 4 }}>
+                           <img src="/assets/images/avatar/6.png" />
+                        </Avatar>
+                        <div style={{
+                           display: "inline-block", position: "relative",
+                           top: 4,
+                           left: 4,
+                        }}>
+                           {user && user.userName}
+                        </div>
+                     </div>
+                  }
+               >
+                  <Nav.Item itemKey={"logout"} text={"退出"} />
+               </Nav.Sub>
+            }
+         />
+      </>
+   );
 };
 
 function mapStateToProps (state) {
-    const { global, auth,  } = state;
-    return {
-        actions: global.actions,
-        user: auth.user,
+   const { global, auth, } = state;
+   return {
+      actions: global.actions,
+      user: auth.user,
       //   socket: webSocket.socket,
-    };
+   };
 }
 
 export default connect(mapStateToProps)(Header);

code/web/client/src/layout/components/sider/index.jsx

@@ -14,7 +14,6 @@ const Sider = props => {
    useEffect(() => {
       const { sections, dispatch, user } = props;
       let nextItems = []
-      console.log(sections);
       for (let c of sections) {
          if (typeof c.getNavItem == 'function') {
             let item = c.getNavItem(user, dispatch);
@@ -23,7 +22,6 @@ const Sider = props => {
             }
          }
       }
-      console.log(nextItems);
       setItems(nextItems)
 
       const lastSelectedKeys = localStorage.getItem('fs_iot_auth_selected_sider')

code/web/client/src/sections/edition/actions/index.js

@@ -1,6 +1,19 @@
 'use strict';
 
+import { ApiTable,basicAction } from "$utils";
+
+export function getVersions() {
+   return (dispatch) =>
+     basicAction({
+       type: "get",
+       dispatch: dispatch,
+       actionType: "GET_CAMREA",
+       url: `${ApiTable.getVersions}`,
+       msg: { option: "查询网关版本信息" },
+       reducer: { name: "", params: { noClear: true } },
+     });
+ }
 
 export default {
-      
+   getVersions,
 };

code/web/client/src/sections/edition/containers/administer.jsx

@@ -2,28 +2,182 @@
 import React, { useEffect, useRef } from 'react';
 import { connect } from 'react-redux';
 import { push } from 'react-router-redux';
-import { Form, Button, Toast } from '@douyinfe/semi-ui';
+import { Form, Button, Table, Pagination } from '@douyinfe/semi-ui';
 import { IconLock, IconUser } from '@douyinfe/semi-icons';
 
 const EditionManage = props => {
    const { dispatch, user, error, actions, apiRoot, isRequesting } = props
-
+   const { edition } = actions
 
    useEffect(() => {
 
-
+      dispatch(edition.getVersions()).then(res => {
+         console.log(res);
+      })
 
 
    }, [])
 
+   const columns = [
+      {
+         title: "序列号",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "Major",
+         dataIndex: "Major",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "Minor",
+         dataIndex: "Minor",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "Patch",
+         dataIndex: "naPatchme",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "Build",
+         dataIndex: "Build",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "Type",
+         dataIndex: "Type",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "Desc",
+         dataIndex: "Desc",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "ImageBase",
+         dataIndex: "ImageBase",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "ImageVersion",
+         dataIndex: "ImageVersion",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "CreatedAt",
+         dataIndex: "CreatedAt",
+         render: (_, record, index) => {
+            return index + 1;
+         },
+      }, {
+         title: "操作",
+         dataIndex: "operation",
+         render: (_, record, index) => {
+            return <Button>删除</Button>
+         },
+      },
+   ]
+
    return (
-      <div style={{}}>
-         版本管理
-      </div>
+      <>
+         <div style={{ position: "" }}>
+            <video
+               id="cameraBanner"
+               autoPlay
+               loop
+               muted
+               style={{ width: "100%", objectFit: "cover", height: 171 }}
+               src="/assets/videos/administer_banner.mp4"
+               type="video/mp4"
+            />
+            <div style={{ position: "absolute", top: 12 }}>
+               <div
+                  style={{
+                     fontSize: 22,
+                     paddingTop: 15,
+                     marginLeft: 21,
+                  }}
+               >
+                  版本管理
+               </div>
+               <div
+                  style={{
+                     fontSize: 14,
+                     paddingTop: 18,
+                     marginLeft: 20,
+                  }}
+               >
+                  对网关版本添加、删除的管理页面。
+               </div>
+               <div
+                  style={{
+                     fontSize: 14,
+                     marginTop: 28,
+                     marginLeft: 21,
+                     width: 89,
+                     height: 32,
+                     lineHeight: 32 + "px",
+                     textAlign: "center",
+                     backgroundColor: "#D9EAFF",
+                     color: "#1859C1",
+                     cursor: "pointer",
+                  }}
+                  onClick={() => {
+
+                  }}
+               >
+                  添加版本
+               </div>
+            </div>
+         </div>
+         <div style={{ background: "#FFFFFF", marginTop: 5 }}>
+            <Table
+               columns={columns}
+               dataSource={[]}
+               bordered={false}
+               empty="暂无数据"
+               style={{
+                  padding: "0px 20px",
+               }}
+               pagination={false}
+            />
+            <div
+               style={{
+                  display: "flex",
+                  justifyContent: "flex-end",
+                  padding: "20px 20px",
+               }}
+            >
+               <span style={{ lineHeight: "30px" }}>
+                  共{100}个设备
+               </span>
+               <Pagination
+                  total={100}
+                  showSizeChanger
+                  currentPage={1}
+                  pageSizeOpts={[10, 20, 30, 40]}
+                  onChange={(currentPage, pageSize) => {
+                     // setQuery({ limit: pageSize, page: currentPage - 1 });
+                     // page.current = currentPage - 1
+                  }}
+               />
+            </div>
+         </div>
+
+      </>
    );
 }
 
-function mapStateToProps(state) {
+function mapStateToProps (state) {
    const { auth, global } = state;
    return {
       user: auth.user,

code/web/client/src/utils/webapi.js

@@ -1,14 +1,16 @@
 'use strict';
 
 export const ApiTable = {
-    login: 'v1/login',
-    logout: 'v1/logout',
+   login: 'v1/login',
+   logout: 'v1/logout',
 
-    crossCheck: 'cross_token/check',
+   crossCheck: 'cross_token/check',
+
+   getVersions: 'v1/versions',    //查询网关版本信息
 };
 
 export const RouteTable = {
-    apiRoot: '/api/root',
-    fileUpload: '/_upload/new',
-    cleanUpUploadTrash: '/_upload/cleanup',
+   apiRoot: '/api/root',
+   fileUpload: '/_upload/new',
+   cleanUpUploadTrash: '/_upload/cleanup',
 };