样式优化整合

2025-07-04 10:03:42 +08:00
parent e98ca8d9eb
commit 736f004b6b
194 changed files with 634 additions and 534 deletions
--- a/src/components/BiddingRoom/components/InstantMessage.js
+++ b/src/components/BiddingRoom/components/InstantMessage.js
@ -467,7 +467,7 @@ const InstantMessage = (props) => {
          top: '50%',
          right: '0',
          width: '24px',
-          backgroundColor: '#b30000',
+          backgroundColor: '#014F8F',
          color: '#fff',
          textAlign: 'center',
          padding: '10px 0',
--- a/src/components/BiddingRoom/index.js
+++ b/src/components/BiddingRoom/index.js
@ -1,4 +1,4 @@
-import { Divider, Button, Form, Card, Tabs, Table, Tooltip, Input, Select, Row, Col, message, Modal, Avatar, Tag, } from 'antd';
+import { Divider, Button, Form, Card, Tabs, Table, Tooltip, Input, Select, Row, Col, message, Modal, Avatar, Tag } from 'antd';
 import { Link, history } from 'umi';
 import './index.less';
 import styles from './index.less';
@ -8,7 +8,8 @@ import React, { useState, useEffect, useReducer } from 'react';
 import { getSessionUserData, getRoomId, getRoomStatus, getProMethod, getSessionRoleData, getIPassDecode, getDefId, getProId, getOfflineStatusById } from '@/utils/session';
 import { getURLInformation } from '@/utils/CommonUtils';
 import { getLeader, isShowResult, isShowCount, getErrorStatus, getRiskStatus, isShowRiskModal, saveConfirm, isLeaderConfirm } from './service';
-import logo from '@/images/opening/logo.svg'
+import logo from '@/assets/logo.svg';
+import userIcon from '@/assets/user.svg';
 import InstantMessage from './components/InstantMessage'
 import { DownOutlined, UserOutlined, UserSwitchOutlined, CarryOutOutlined, HomeOutlined } from '@ant-design/icons';
 import moment from 'moment'
@ -19,6 +20,8 @@ import {
 import { getRoomDataById } from '@/services/common';
 import RiskModal from '../RiskModal';

+const theme = JSON.parse(PROJECT_THEME);
+
 const BiddingRoom = (props) => {
  //获取采购方式
  const MethodDict = getProMethod();
@ -410,9 +413,9 @@ const BiddingRoom = (props) => {
        <ul className={styles.rightBtns}>
          <li><CarryOutOutlined />{moment().format("YYYY-MM-DD")}</li>
          {data?.organizationName == null ? null : (<li><UserSwitchOutlined />{data.organizationName}</li>)}
-          <li>
-            <Avatar size="small" src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" style={{ width: '30px' }} />
-            <a className="antd-dropdown-link" style={{ color: "#fff", marginRight: "36px" }}>
+          <li style={{ display: 'flex', alignItems: 'center' }}>
+            <Avatar size="small" src={userIcon} style={{ width: '30px' }} />
+            <a className="antd-dropdown-link" style={{ marginRight: "36px" }}>
              {data.fullName}
            </a>
          </li>
@ -427,8 +430,8 @@ const BiddingRoom = (props) => {
                key={item.id}
                style={{
                  width: '100000px',
-                  color: selectedPath == item.path || (item.path === '/EvaRoom/Eva/' && selectedPath.includes('/EvaRoom/Eva/')) ? "#FFFFFF" : "#b30000",
-                  background: selectedPath == item.path || (item.path === '/EvaRoom/Eva/' && selectedPath.includes('/EvaRoom/Eva/')) ? "#b30000" : "#FFFFFF"
+                  color: selectedPath == item.path || (item.path === '/EvaRoom/Eva/' && selectedPath.includes('/EvaRoom/Eva/')) ? "#FFFFFF" : theme['primary-color'],
+                  background: selectedPath == item.path || (item.path === '/EvaRoom/Eva/' && selectedPath.includes('/EvaRoom/Eva/')) ? theme['primary-color'] : "#FFFFFF"
                }}
                onClick={() => { onclick(item.path, item.id) }}
              >
--- a/src/components/BiddingRoom/index.less
+++ b/src/components/BiddingRoom/index.less
@ -14,7 +14,7 @@
        // width:100%;
        height:50px;
        background: #fafafa;
-        color:#b30000;
+        color:@primary-color;
        //border-radius: 3px;
        box-sizing: border-box;
        .tab{
@ -22,7 +22,7 @@
            box-sizing: border-box;
            cursor: pointer;
            background: #ffffff;
-            color:#b30000;
+            color:@primary-color;
            height:50px;
            // float:left;
            width: max-content;
@ -36,7 +36,7 @@
            margin-left: -1px;
            &:hover{
                transition:background 0.3s;
-                background: #b30000 !important;
+                background: @primary-color !important;
                color:#FFFFFF !important;
            }
        }
@ -47,8 +47,8 @@
 }

 .header {
-    background-color:  #b30000;
-    color: white;
+    background-color:  #ffffff;
+    color: @primary-color;
    font-size: 20px;
    height: 56px;
    display: flex;
@ -72,9 +72,6 @@
            padding-right: 6px;
            font-size: 16px;
          }
-          a {
-            color: #fff;
-          }
        }
      }
  }
--- a/src/components/ElecBidEvaluation/BidEvalAppointment.tsx
+++ b/src/components/ElecBidEvaluation/BidEvalAppointment.tsx
@ -7,6 +7,7 @@ import moment from 'moment';
 import { dateTimeFormatter } from '@/utils/DateUtils';
 import { getProId } from '@/utils/session';
 import { isEmpty } from '@/utils/CommonUtils';
+import tableProps from '@/utils/tableProps';

 interface BidEvalAppointmentProps {
    modalVisible: boolean;
@ -270,11 +271,7 @@ const BidEvalAppointment: React.FC<BidEvalAppointmentProps> = (props) => {
                        labelWidth: 'auto',
                    }}
                    options={false}
-                    pagination={{
-                        size: "small",
-                        defaultPageSize: 10,
-                        showSizeChanger: true,
-                    }}
+                    {...tableProps}
                    rowSelection={{
                        type: "radio",
                        selectedRowKeys,
--- a/src/components/GlobalHeader/RightContent.tsx
+++ b/src/components/GlobalHeader/RightContent.tsx
@ -4,20 +4,24 @@ import React, { useEffect, useRef } from 'react';
 import moment from 'moment'
 import { connect, history } from 'umi';
 import { ConnectState } from '@/models/connect';
-import logo from '../../assets/logo.svg';
+import logo from '@/assets/logo.svg';
 import './index.less';
 import { getMenu, getLogout } from './services'
-import { getSessionUserData } from "@/utils/session";
+import { getSessionUserData, getSessionRoleData } 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';
+import divider from '@/assets/divider.png';
+
+const theme = JSON.parse(PROJECT_THEME);

 const GlobalHeaderRight: React.FC<{}> = (props) => {
  // let className = styles.right;
  const data = getSessionUserData();
+  const roleData = getSessionRoleData();
  const [dataMenu, setDataMenu] = React.useState<any>([]);
  const urlRef = useRef(null);
  const handelRole = (item: any) => {
@ -98,15 +102,22 @@ const GlobalHeaderRight: React.FC<{}> = (props) => {
  }, [])

  return (
-    <div className="top-menu">
+    <div className="top-menu" style={{ height: 56 }}>
      <div className="left-logo">
        <div className="logo-container" style={{ display: 'flex', alignItems: 'center' }}>
        <div className="logo-img">
-          <img src={logo} alt="" />
+          <img src={logo} alt="" style={{ width: '66.89px', height: '42.49px' }}/>
        </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 className="logo-text" style={{ display: 'flex', flexDirection: 'column', gap: '0' }}>
+            <span style={{ fontSize: '24px', lineHeight: '24px', fontWeight: 700, letterSpacing: '2.5px' }}>中远海运集团采购信息系统</span>
+            <span style={{ lineHeight: 'normal', fontSize: '12px', fontWeight: 400 }}>COSCO SHIPPING Group Procurement Information System</span>
+          </div>
+          <div style={{ margin: '0 9px' }}>
+            <img src={divider} alt="" style={{ width: '1px', height: '100%', margin: 0 }}/>
+          </div>
+          <div className="logo-text" style={{ display: 'flex', flexDirection: 'column', gap: '0' }}>
+            <span style={{ fontSize: '24px', lineHeight: '24px', fontWeight: 700, letterSpacing: '2.5px' }}>{roleData?.roleName}</span>
+            <span style={{ lineHeight: 'normal', fontSize: '12px', fontWeight: 400 }}>{roleData?.roleCode}</span>
          </div>
        </div>
      </div>
@ -115,16 +126,16 @@ const GlobalHeaderRight: React.FC<{}> = (props) => {
        <li>
          <Avatar size="small" src={userIcon} style={{ width: '30px' }} />
          <Dropdown overlay={droMenu}>
-            <a className="antd-dropdown-link" style={{ color: "#fff", verticalAlign: 'middle' }}>
+            <a className="antd-dropdown-link" style={{ color: theme['text-color'], verticalAlign: '-2px' }}>
              {data?.fullName} <DownOutlined />
            </a>
          </Dropdown>
        </li>
        <li>
-          <img src={homeIcon} style={{width: 22, cursor: 'pointer'}} alt="dashboard" onClick={() => history.push('/Dashboard')}/>
+          <img src={homeIcon} style={{width: 13, cursor: 'pointer'}} alt="dashboard" onClick={() => history.push('/Dashboard')}/>
        </li>
-        <li>
-          <img src={shutdownIcon} style={{width: 20, cursor: 'pointer'}} alt="shutdown" onClick={() => toLogout()}/>
+        <li style={{ paddingRight: 16 }}>
+          <img src={shutdownIcon} style={{width: 14, cursor: 'pointer' }} alt="shutdown" onClick={() => toLogout()}/>
        </li>
        {/* <li><CarryOutOutlined />{moment().format("YYYY-MM-DD")}</li> */}
        {/* {data?.organizationName == null ? null : (<li><UserSwitchOutlined />{data?.organizationName}</li>)} */}
--- a/src/components/GlobalHeader/index.less
+++ b/src/components/GlobalHeader/index.less
@ -5,16 +5,16 @@
    position: absolute;
    float: left;
    left: 0;
-    top: 4px;
+    top: 16px;
    font-size: 16px;
    font-weight: 600;

    img {
      height: 30px;
-      margin-left: 20px;
-      margin-right: 10px;
+      margin-left: 32px;
+      margin-right: 12px;
      position: relative;
-      top: -2px;
+      top: -3px;
    }
  }

@ -26,7 +26,7 @@
      line-height: 56px;
      font-size: 14px;
      color: inherit;
-      padding: 0 12px;
+      padding: 0 10px;
      list-style: none;

      span {
@ -34,9 +34,6 @@
        font-size: 16px;
      }

-      a {
-        color: #131414 !important;
-      }
    }
  }
 }