diff --git a/src/assets/iconfont/iconfont.css b/src/assets/iconfont/iconfont.css index ef30ad7..c39e67c 100644 --- a/src/assets/iconfont/iconfont.css +++ b/src/assets/iconfont/iconfont.css @@ -1,8 +1,8 @@ @font-face { font-family: "iconfont"; /* Project id 3943555 */ - src: url('iconfont.woff2?t=1679275935231') format('woff2'), - url('iconfont.woff?t=1679275935231') format('woff'), - url('iconfont.ttf?t=1679275935231') format('truetype'); + src: url('iconfont.woff2?t=1679564530649') format('woff2'), + url('iconfont.woff?t=1679564530649') format('woff'), + url('iconfont.ttf?t=1679564530649') format('truetype'); } .iconfont { @@ -13,6 +13,18 @@ -moz-osx-font-smoothing: grayscale; } +.icon-icon-tips:before { + content: "\e74a"; +} + +.icon-icon-fold:before { + content: "\e749"; +} + +.icon-icon-12:before { + content: "\e748"; +} + .icon-waterprint:before { content: "\e747"; } diff --git a/src/assets/iconfont/iconfont.ttf b/src/assets/iconfont/iconfont.ttf index d3e0d7d..cade380 100644 Binary files a/src/assets/iconfont/iconfont.ttf and b/src/assets/iconfont/iconfont.ttf differ diff --git a/src/assets/iconfont/iconfont.woff b/src/assets/iconfont/iconfont.woff index aab9bdf..e59d19d 100644 Binary files a/src/assets/iconfont/iconfont.woff and b/src/assets/iconfont/iconfont.woff differ diff --git a/src/assets/iconfont/iconfont.woff2 b/src/assets/iconfont/iconfont.woff2 index 699058c..d2c4aff 100644 Binary files a/src/assets/iconfont/iconfont.woff2 and b/src/assets/iconfont/iconfont.woff2 differ diff --git a/src/compenents/header/index.module.scss b/src/compenents/header/index.module.scss new file mode 100644 index 0000000..295b10f --- /dev/null +++ b/src/compenents/header/index.module.scss @@ -0,0 +1,27 @@ +.app-header { + width: 100%; + position: sticky; + top: 0; + left: 0; + right: 0; + height: 60px; + background: #ffffff; + box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.04); + .main-header { + width: 1200px; + height: 60px; + line-height: 60px; + display: flex; + align-items: center; + justify-content: space-between; + margin: 0 auto; + .App-logo { + width: auto; + height: 40px; + img { + width: auto; + height: 40px; + } + } + } +} diff --git a/src/compenents/header/index.tsx b/src/compenents/header/index.tsx new file mode 100644 index 0000000..1314375 --- /dev/null +++ b/src/compenents/header/index.tsx @@ -0,0 +1,79 @@ +import React from "react"; +import styles from "./index.module.scss"; +import { Button, Dropdown, MenuProps } from "antd"; +import { useDispatch, useSelector } from "react-redux"; +import { Link, useNavigate } from "react-router-dom"; +import { logoutAction } from "../../store/user/loginUserSlice"; + +export const Header: React.FC = () => { + const dispatch = useDispatch(); + const navigate = useNavigate(); + const user = useSelector((state: any) => state.loginUser.value.user); + const config = useSelector((state: any) => state.systemConfig.value); + + const onClick: MenuProps["onClick"] = ({ key }) => { + if (key === "login_out") { + dispatch(logoutAction()); + navigate("/login"); + } else if (key === "change_password") { + navigate("/change-password"); + } + }; + + const items: MenuProps["items"] = [ + { + label: "个人中心", + key: "user_center", + icon: ( + + ), + }, + { + label: "修改密码", + key: "change_password", + icon: ( + + ), + }, + { + label: "退出登录", + key: "login_out", + icon: ( + + ), + }, + ]; + + return ( +
+
+
+ + + +
+
+ + +
+ {user.name && ( + + )} + {user.name} +
+ + +
+
+
+ ); +}; diff --git a/src/compenents/index.ts b/src/compenents/index.ts index 877f643..1105655 100644 --- a/src/compenents/index.ts +++ b/src/compenents/index.ts @@ -1,2 +1,3 @@ export * from "./footer"; -export * from "./no-header"; \ No newline at end of file +export * from "./no-header"; +export * from "./header"; \ No newline at end of file diff --git a/src/index.scss b/src/index.scss index 38e2d6b..0c12be5 100644 --- a/src/index.scss +++ b/src/index.scss @@ -30,7 +30,7 @@ a:hover { body { margin: 0; display: flex; - place-items: center; + // place-items: center; min-width: 320px; min-height: 100vh; } @@ -252,3 +252,14 @@ button:focus-visible { } } } + +.c-admin { + font-size: 14px; + font-weight: 400; + color: rgba(0, 0, 0, 0.88); + line-height: 24px; + cursor: pointer; + &:hover { + opacity: 0.8; + } +} diff --git a/src/pages/init/index.module.scss b/src/pages/init/index.module.scss new file mode 100644 index 0000000..d2ace23 --- /dev/null +++ b/src/pages/init/index.module.scss @@ -0,0 +1,3 @@ +.cont-top{ + width: 100%; +} \ No newline at end of file diff --git a/src/pages/init/index.tsx b/src/pages/init/index.tsx index 3733b77..91ab458 100644 --- a/src/pages/init/index.tsx +++ b/src/pages/init/index.tsx @@ -1,6 +1,8 @@ import { useDispatch } from "react-redux"; import { Outlet } from "react-router-dom"; +import styles from "./index.module.scss"; import { saveConfigAction } from "../../store/system/systemConfigSlice"; +import { Header } from "../../compenents"; interface Props { config: Map; @@ -12,7 +14,10 @@ export const InitPage = (props: Props) => { return ( <> - +
+
+ +
); }; diff --git a/src/store/user/loginUserSlice.ts b/src/store/user/loginUserSlice.ts index effcebc..29f10f4 100644 --- a/src/store/user/loginUserSlice.ts +++ b/src/store/user/loginUserSlice.ts @@ -19,7 +19,6 @@ const loginUserSlice = createSlice({ }, reducers: { loginAction(stage, e) { - console.log(e); stage.value.user = e.payload.user; stage.value.departments = e.payload.departments; stage.value.isLogin = true;