src/app.tsx

@@ -32,7 +32,7 @@ export const layout: RunTimeLayoutConfig = (initialState) => {
   return {
     navTheme: 'light',
     layout: 'mix',
-    title: '金科环境数字化管理平台',
+    title: '',
     token: {
       header: {
         colorBgHeader: '#292f33',

src/components/UserDropdown/index.less

@@ -1,17 +1,42 @@
 /* 自定义样式 */
 .action {
-  color: #1890ff;
+  background-image: url(@/assets/UserDropdown/userBg.png);
+  background-size: contain;
+  background-repeat: no-repeat;
+  width: 128px;
+  height: 36px;
   cursor: pointer;
   display: inline-block;
-  margin-left: 16px;
-
-  &:hover {
-    color: #1890ff;
-  }
+  margin-right: 48px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+}
+.userIcon {
+  background-image: url(@/assets/UserDropdown/userIcon.png);
+  background-size: contain;
+  background-repeat: no-repeat;
+  width: 14px;
+  height: 16px;
+  margin-left: 10px;
+  margin-right: 15px;
+}
+.arrow {
+  background-image: url(@/assets/UserDropdown/arrow.png);
+  background-size: contain;
+  background-repeat: no-repeat;
+  width: 6px;
+  height: 3px;
 }
-
 .name {
-  margin-left: 8px;
-  margin-right: 30px;
-  color: #fff;
-}
+  // margin-left: 8px;
+  // margin-right: 30px;
+  font-size: 15px;
+  font-weight: 350;
+  color: #e8f7fc;
+  line-height: 17px;
+  letter-spacing: 1px;
+  width: 66px;
+  text-align: right;
+  margin-left: 10px;
+}

src/components/UserDropdown/index.tsx

@@ -15,12 +15,12 @@ const items: MenuProps['items'] = [
 ];
 
 export default function UserDropdown(props: any) {
-  const { initialState: { user }  } = useModel('@@initialState');
+  const { initialState: { user } } = useModel('@@initialState');
   return (
     <Dropdown placement="top" menu={{ items }}>
       <a className={styles.action} onClick={(e) => e.preventDefault()}>
-        <Avatar icon={<UserOutlined />} />
         <span className={styles.name}>{user?.CName}</span>
+        <div className={styles.userIcon}></div>
       </a>
     </Dropdown>
   );

src/global.less

@@ -95,9 +95,29 @@ input[type='reset'] {
 }
 #pg-photo-container {
   width: 100% !important;
-    height: unset !important;
+  height: unset !important;
 }
-#pg-photo-container > img{
+#pg-photo-container > img {
   width: 100% !important;
   height: unset !important;
-}
+}
+.ant-pro-global-header {
+  background: transparent;
+  background-image: url(@/assets/header.png);
+  background-size: cover;
+  background-repeat: no-repeat;
+  margin-inline: 0;
+  height: 79px;
+}
+.ant-pro-layout .ant-layout-header.ant-pro-layout-header {
+  background-color: transparent;
+  height: 79px;
+}
+.ant-layout .ant-layout-header {
+  height: 79px;
+  line-height: 79px;
+}
+.ant-pro-global-header-logo-mix {
+  margin-left: 62px;
+}
+