合并分支 'dev_project_style' 到 'master'

修改样式

查看合并请求 coscoshipping/fe_service_ebtp_frontend!5
This commit is contained in:
李鑫
2025-06-20 09:02:19 +00:00
11 changed files with 124 additions and 47 deletions

View File

@ -2,7 +2,10 @@ import { defineConfig } from 'umi';
import defaultSettings from './defaultSettings';
// import proxy from './proxy';
import PageRoutes from './router.config'
import theme from './theme';
const { REACT_APP_ENV } = process.env;
export default defineConfig({
hash: true,
antd: {},
@ -25,10 +28,7 @@ export default defineConfig({
// umi routes: https://umijs.org/docs/routing
routes: PageRoutes,
// Theme for antd: https://ant.design/docs/react/customize-theme-cn
theme: {
// ...darkTheme,
'primary-color': defaultSettings.primaryColor,
},
theme,
// @ts-ignore
title: false,
ignoreMomentLocale: true,

View File

@ -6,7 +6,7 @@ type DefaultSettings = ProSettings & {
const proSettings: DefaultSettings = {
navTheme: 'light',
primaryColor: '#b30000',
primaryColor: '#014F8F',
layout: 'side',
contentWidth: 'Fluid',
fixedHeader: false,

24
config/theme.js Normal file
View File

@ -0,0 +1,24 @@
export default {
// 主题色
'primary-color': '#014F8F',
// 按钮圆角
'border-radius-base': '4px',
// layout background
'layout-background': '#F5F7FA',
// 链接色
'link-color': '#014F8F',
// layout-header-background
'layout-header-background': '#ffffff',
// error
'error-color': '#D7000F',
// menu background
'menu-list-bg': '#F2F6FC',
// menu item selected background
'menu-item-selected-bg': '#D9ECFF',
// table header
'table-header-bg': '#F2F6FC',
// table header text color
'table-header-color': '#8F9298',
// table select row background
'table-selected-row-bg': '#F2F6FC',
}

1
src/assets/home.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1750399889911" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1804" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M192 401.493333v464.213334h640V401.493333L512 144.298667 192 401.493333z m-52.010667-38.528l352-282.197333A32.512 32.512 0 0 1 512 74.026667c7.338667 0 13.994667 2.218667 20.010667 6.741333l352 282.197333c7.978667 6.4 11.989333 14.464 11.989333 24.064v509.482667a29.44 29.44 0 0 1-8.96 22.186667 31.786667 31.786667 0 0 1-23.04 8.661333H160a31.786667 31.786667 0 0 1-23.04-8.661333 29.44 29.44 0 0 1-8.96-22.186667V387.072c0-9.685333 4.010667-17.706667 11.989333-24.106667z" fill="#000000" fill-opacity=".65" p-id="1805"></path></svg>

After

Width:  |  Height:  |  Size: 867 B

1
src/assets/shutdown.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1750399948683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3046" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M659.2 96c-19.2-6.4-32 0-38.4 19.2s0 32 19.2 38.4c153.6 57.6 262.4 217.6 262.4 384 0 230.4-185.6 416-416 416C249.6 960 64 774.4 64 544c0-172.8 102.4-326.4 262.4-384 19.2-6.4 25.6-25.6 19.2-38.4-6.4-19.2-25.6-32-44.8-25.6C121.6 166.4 0 345.6 0 544 0 812.8 211.2 1024 480 1024S960 812.8 960 544c0-198.4-121.6-377.6-300.8-448z" fill="#231815" p-id="3047"></path><path d="M480 448c19.2 0 32-12.8 32-32v-384c0-19.2-12.8-32-32-32S448 12.8 448 32v384c0 19.2 12.8 32 32 32z" fill="#231815" p-id="3048"></path></svg>

After

Width:  |  Height:  |  Size: 840 B

1
src/assets/user.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1750316870480" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2449" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667zM288 810.666667c0-123.733333 100.266667-224 224-224S736 686.933333 736 810.666667c-61.866667 46.933333-140.8 74.666667-224 74.666666s-162.133333-27.733333-224-74.666666z m128-384c0-53.333333 42.666667-96 96-96s96 42.666667 96 96-42.666667 96-96 96-96-42.666667-96-96z m377.6 328.533333c-19.2-96-85.333333-174.933333-174.933333-211.2 32-29.866667 51.2-70.4 51.2-117.333333 0-87.466667-72.533333-160-160-160s-160 72.533333-160 160c0 46.933333 19.2 87.466667 51.2 117.333333-89.6 36.266667-155.733333 115.2-174.933334 211.2-55.466667-66.133333-91.733333-149.333333-91.733333-243.2 0-204.8 168.533333-373.333333 373.333333-373.333333S885.333333 307.2 885.333333 512c0 93.866667-34.133333 177.066667-91.733333 243.2z" fill="#666666" p-id="2450"></path></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -3,12 +3,17 @@
top: 0;
left: 0;
.ant-pro-global-header{
background-color: #b30000;
background-color: @layout-header-background;
height: 56px;
color: #fff;
color: @primary-color;
}
}
// 通用页面布局样式
.layout-container {
background-color: @layout-background;
min-height: 100vh;
}
.ant-pro-sider-logo {
background-color: #b30000;
@ -160,11 +165,11 @@
}
.ant-pro-table{
.ant-card-body{
padding: 0px;
}
}
// .ant-pro-table{
// .ant-card-body{
// padding: 0px;
// }
// }
.ant-pro-table-search {
padding: 10px 24px 6px 24px;
@ -308,3 +313,23 @@ input::-webkit-outer-spin-button,
padding: 6px 24px;
border-bottom: 1px solid #ddd;
}
#root {
.ant-table-tbody > tr.ant-table-row:hover > td,
.ant-table-tbody > tr > td.ant-table-cell-row-hover {
background-color: @table-selected-row-bg;
}
}
// 控制左侧菜单背景色
.ant-menu.ant-menu-sub.ant-menu-inline {
background-color: @menu-list-bg;
.ant-menu-item-selected {
background-color: @menu-item-selected-bg;
}
.ant-menu-item-selected a {
color: @primary-color;
font-weight: bold;
}
}

View File

@ -9,27 +9,32 @@ import './index.less';
import { getMenu, getLogout } from './services'
import { getSessionUserData } from "@/utils/session";
import { getToSecondUrl } from '@/pages/LoadingPage/service';
import userIcon from '@/assets/user.svg';
import homeIcon from '@/assets/home.svg';
import shutdownIcon from '@/assets/shutdown.svg';
import { logout } from './services';
import cookie from 'react-cookies';
const GlobalHeaderRight: React.FC<{}> = (props) => {
// let className = styles.right;
let data = getSessionUserData();
const data = getSessionUserData();
const [dataMenu, setDataMenu] = React.useState<any>([]);
const urlRef = useRef(null);
const handelRole = (item: any) => {
sessionStorage.setItem('roleData', JSON.stringify(item));
sessionStorage.setItem('roleAuthority', JSON.stringify([item.roleCode]));
let params = {
const params = {
roleIdList: [item.roleId]
}
history.push('/Dashboard')
window.location.reload()
getMenu(params).then(res => {
if (res?.code == 1) {
setDataMenu(res?.data)
} else {
message.error("数据错误请联系管理员")
}
})
// getMenu(params).then(res => {
// if (res?.code == 1) {
// setDataMenu(res?.data)
// } else {
// message.error("数据错误请联系管理员")
// }
// })
}
//角色退出登录
const toLogout = () => {
@ -40,15 +45,21 @@ const GlobalHeaderRight: React.FC<{}> = (props) => {
title: '请确认是否退出?',
content: false,
onOk() {
getLogout().then((res) => {
logout().then((res) => {
if (res?.success) {
if (data?.userType == "0") {//联通智慧门户
window.close();
} else if (data?.userType == "1") {//合作方
window.close();
} else if (data?.userType == "2") {//专家
window.location.href = "/userformal/login"
}
// if (data?.userType == "0") {//联通智慧门户
// window.close();
// } else if (data?.userType == "1") {//合作方
// window.close();
// } else if (data?.userType == "2") {//专家
// window.location.href = "/userformal/login"
// }
message.success('退出登录成功');
sessionStorage.clear();
cookie.remove('mall3_token');
setTimeout(() => {
history.push('/internal-login');
}, 1000);
}
})
},
@ -62,17 +73,17 @@ const GlobalHeaderRight: React.FC<{}> = (props) => {
const droMenu = (
<Menu style={{ top: "17px" }}>
{data?.authorityList != undefined ?
data?.authorityList?.map((item: any, index: any) => (
<Menu.Item key={index}>
data?.authorityList?.map((item: any) => (
<Menu.Item key={item.roleId}>
<a target="_blank" rel="noopener noreferrer" onClick={() => handelRole(item)}>{item.roleName}</a>
</Menu.Item>
)) : null}
<>
{/* <>
<Menu.Divider />
<Menu.Item key="exit">
<a key="1" onClick={() => toLogout()}>退出登录</a>
</Menu.Item>
</>
</> */}
</Menu>
);
@ -89,21 +100,35 @@ const GlobalHeaderRight: React.FC<{}> = (props) => {
return (
<div className="top-menu">
<div className="left-logo">
<img src={logo} alt="" />
<div className="logo-container" style={{ display: 'flex', alignItems: 'center' }}>
<div className="logo-img">
<img src={logo} alt="" />
</div>
<div className="logo-text" style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start', gap: '0' }}>
<span style={{ lineHeight: '1', fontSize: '24px' }}></span>
<span style={{ lineHeight: '1', fontSize: '14px', fontWeight: 'normal' }}>CHINA COSCO SHIPPING CORPORATION LIMITED</span>
</div>
</div>
</div>
<ul className="right-btns">
<li><ImportOutlined /><a onClick={() => { urlRef.current && window.open(urlRef.current); }}>2.0</a></li>
<li><HomeOutlined /><a onClick={() => history.push('/Dashboard')}></a></li>
<li><CarryOutOutlined />{moment().format("YYYY-MM-DD")}</li>
{data?.organizationName == null ? null : (<li><UserSwitchOutlined />{data?.organizationName}</li>)}
{/* <li><ImportOutlined /><a onClick={() => { urlRef.current && window.open(urlRef.current); }}>交易平台2.0</a></li> */}
<li>
<Avatar size="small" src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" style={{ width: '30px' }} />
<Avatar size="small" src={userIcon} style={{ width: '30px' }} />
<Dropdown overlay={droMenu}>
<a className="antd-dropdown-link" style={{ color: "#fff" }}>
<a className="antd-dropdown-link" style={{ color: "#fff", verticalAlign: 'middle' }}>
{data?.fullName} <DownOutlined />
</a>
</Dropdown>
</li>
<li>
<img src={homeIcon} style={{width: 22, cursor: 'pointer'}} alt="dashboard" onClick={() => history.push('/Dashboard')}/>
</li>
<li>
<img src={shutdownIcon} style={{width: 20, cursor: 'pointer'}} alt="shutdown" onClick={() => toLogout()}/>
</li>
{/* <li><CarryOutOutlined />{moment().format("YYYY-MM-DD")}</li> */}
{/* {data?.organizationName == null ? null : (<li><UserSwitchOutlined />{data?.organizationName}</li>)} */}
</ul>

View File

@ -25,8 +25,8 @@
float: left;
line-height: 56px;
font-size: 14px;
color: #fff;
padding: 0 14px;
color: inherit;
padding: 0 12px;
list-style: none;
span {
@ -35,7 +35,7 @@
}
a {
color: #fff;
color: #131414 !important;
}
}
}

View File

@ -51,7 +51,7 @@ ol {
}
// 兼容IE11
@media screen and(-ms-high-contrast: active), (-ms-high-contrast: none) {
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
body .ant-design-pro > .ant-layout {
min-height: 100vh;
}

View File

@ -14,7 +14,7 @@
border-radius: 5px;
overflow-y:hidden;
.moret{
color:#b30000;
color:@primary-color;
font-size:12px;
cursor: pointer;
}
@ -101,7 +101,7 @@
// background:#FFFFFF;
border-radius: 5px;
.moret{
color:#b30000;
color:@primary-color;
font-size:12px;
cursor: pointer;
}
@ -270,7 +270,7 @@
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
padding: 10px 6px 0;
background: #b30000;
background: @primary-color;
z-index: 100;
color: #fff;
text-align: center;