diff --git a/src/pages/nav_system_content/SystemContentList.js b/src/pages/nav_system_content/SystemContentList.js index c3f83a3..62596f2 100644 --- a/src/pages/nav_system_content/SystemContentList.js +++ b/src/pages/nav_system_content/SystemContentList.js @@ -3,6 +3,10 @@ import { history, Outlet, useLocation, matchRoutes } from '@umijs/max' import { Menu, Tabs } from 'antd' import './SystemContentList.less' import { formatRoute, getDefaultRoute } from '@/utils/routeUtils' +import styles from './TopNavBar.less' +import { Row, Col, Avatar, Dropdown, Button } from 'antd' +import { userInfo } from '@/utils/globalCommon' +import { HomeOutlined, SettingOutlined, LogoutOutlined } from '@ant-design/icons' const SystemContentList = (props) => { const dynamicRoute = window.dynamicRoute @@ -50,6 +54,27 @@ const SystemContentList = (props) => { history.replace(curKey) } + const handleMenuClick = (e) => { + switch (e.key) { + case 'logout': + loginOut() + break + default: + break + } + } + + const dropDownMenuItems = [ + { + label: <>退出登录, + key: 'logout' + } + ] + + const dropDownMenu = () => ( + + ) + return (
@@ -63,8 +88,34 @@ const SystemContentList = (props) => { />
-
- +
+ {/*
*/} +
+ + {/* + logo + + setRouteActive(value)} /> + */} + + + + + {userInfo?.user_name_cn ? userInfo.user_name_cn : (userInfo?.user_name || '')} + + + + + + +
+ {/*
*/} +
+
+ +
+
+
) diff --git a/src/pages/nav_system_content/SystemContentList.less b/src/pages/nav_system_content/SystemContentList.less index d2ecd56..48556fb 100644 --- a/src/pages/nav_system_content/SystemContentList.less +++ b/src/pages/nav_system_content/SystemContentList.less @@ -1,13 +1,70 @@ .systemContent { display: flex; - height: 100%; - justify-content: space-between; + height: 100vh; + // justify-content: space-between; flex-wrap: nowrap; - padding: 12px; + // padding: 12px; + + .tabBarHeader { + background-color: #fff; + padding: 0; + width: 100%; + // margin-bottom: 10px; + + .tabBarRow { + padding: 0 12px; + justify-content: flex-end; + + .tabBarLeft { + display: flex; + justify-content: space-between; + flex-wrap: nowrap; + align-items: center; + + .leftLogo { + width: 36px; + height: 36px; + margin: 0 12px; + } + + .leftMenu { + width: calc(100% - 52px); + } + } + + .tabBarRight { + text-align: right; + display: flex; + justify-content: flex-end; + flex-wrap: nowrap; + align-items: center; + + .tabBarRightAvaTor { + margin-right: 20px; + } + + .tabBarRightName { + margin-right: 5px; + } + + .tabBarRightBtn { + height: 100%; + } + } + } + } + + .rightContent { + width: calc(100% - 230px); + display: flex; + flex-direction: column; + height: 100vh; + overflow: auto; + } .leftMenu { margin: 0; - width: 200px; + width: 230px; background-color: #ffffff; border-radius: 6px; overflow-y: auto; @@ -19,9 +76,11 @@ } .rightContentMain { - width: calc(100% - 212px); + width: 100%; background-color: #ffffff; - border-radius: 6px; + // border-radius: 6px; overflow-y: auto; + // height: 100%; + overflow: auto; } -} +} \ No newline at end of file diff --git a/src/pages/nav_system_content/TopNavBar.less b/src/pages/nav_system_content/TopNavBar.less new file mode 100644 index 0000000..1794cac --- /dev/null +++ b/src/pages/nav_system_content/TopNavBar.less @@ -0,0 +1,11 @@ +.layoutContainer { + height: 100%; + background-color: #f0f2f5; + + + + .contentMain { + height: calc(100% - 46px); + overflow-y: hidden; + } +} \ No newline at end of file diff --git a/src/pages/topnavbar/TopNavBar.js b/src/pages/topnavbar/TopNavBar.js index 9b0e6ec..71ee4c3 100644 --- a/src/pages/topnavbar/TopNavBar.js +++ b/src/pages/topnavbar/TopNavBar.js @@ -122,7 +122,7 @@ const TopNavBar = (props) => { return (
-
+ {/*
logo @@ -140,11 +140,12 @@ const TopNavBar = (props) => { -
+
*/} -
+ {/*
-
+
*/} +
) } diff --git a/src/pages/topnavbar/TopNavBar.less b/src/pages/topnavbar/TopNavBar.less index cd4277d..73c847d 100644 --- a/src/pages/topnavbar/TopNavBar.less +++ b/src/pages/topnavbar/TopNavBar.less @@ -53,4 +53,4 @@ height: calc(100% - 46px); overflow-y: hidden; } -} +} \ No newline at end of file