优化站点切换样式

src/components/GlobalHeader/SimpleRiightContent.js

@@ -11,8 +11,7 @@ import { useHistory, useAliveController } from '@wisdom-utils/runtime';
 import order from '../../assets/basic/message.png';
 import notice from '../../assets/basic/notice.png';
 import search from '../../assets/basic/search.png';
-import stationChoose from '../../assets/images/commonMenu/station.png';
-import stationNotChoose from '../../assets/images/commonMenu/zhandian.png';
+import SvgComponent from './stationsvg';
 import { actionCreators } from '../../containers/App/store';
 import styles from './index.less';
 import NoticeIconView from './NoticeIconView';
@@ -316,12 +315,21 @@ const GlobalHeaderRight = props => {
                                 {
                                     showStationList.map((item)=>{
                                         return (
-                                            <li style={{background:item.description?item.description==stationvalue?"#1685ff47":"":item.name==stationvalue?"#1685ff47":""}} onClick={()=>{closePan(item.description?item.description:item.name,item.name)}}>
-                                                <img src={item.description?item.description==stationvalue?stationChoose:stationNotChoose:item.name==stationvalue?stationChoose:stationNotChoose}></img>
+                                          <li style={{
+                                            background: item.description ?
+                                              item.description == stationvalue ?
+                                                global.variableTheme.primaryColor+"47" : "" : item.name == stationvalue ? global.variableTheme.primaryColor+"47" : "",
+                                                color:item.description?item.description==stationvalue?global.variableTheme.primaryColor:"#C0CEDC":item.name==stationvalue?global.variableTheme.primaryColor:"#C0CEDC",
+                                          }} onClick={() => { closePan(item.description ? item.description : item.name, item.name) }}>
+                                                  <span style={{margin:"0 5px",width:"10px",height:'14px',display:"flex",alignItems:"center",justifyContent:"center"}}>
+                                                    <SvgComponent></SvgComponent>
+                                                  </span>
+                                                 
+                                                  
                                                 <span
                                                   title={item.description?item.description:item.name}
                                                   style={{
-                                                    color:item.description?item.description==stationvalue?"#1685ff":"#000":item.name==stationvalue?"#1685ff":"#000",
+                                                    color:item.description?item.description==stationvalue?global.variableTheme.primaryColor:"#000":item.name==stationvalue?global.variableTheme.primaryColor:"#000",
                                                     fontWeight:item.description?item.description==stationvalue?"600":"400":item.name==stationvalue?"600":"400",
                                                   }}>{item.description?item.description:item.name}</span>
                                             </li>

src/components/GlobalHeader/index.less

@@ -87,7 +87,7 @@
     }
     :global{
       .@{ant-prefix}-select-selector{
-          background: linear-gradient(0deg, #1875DB 0%, #065CB9 100%);
+          background: linear-gradient(0deg, transparent ,rgba(0,0,0,0.2));
           padding-left: 30px !important;
           border-radius: 4px !important;
           position: relative;
@@ -110,8 +110,8 @@
       }
       .@{ant-prefix}-select-selection-item{
         color: #FEFEFE;
-        // max-width: 120px;
-        width: 100%;
+        background: transparent;
+        width: 120px;
         overflow: hidden;
         white-space: nowrap;
         text-overflow: ellipsis;
@@ -161,7 +161,7 @@
       text-overflow: ellipsis;
       padding: 0 5px;
       &:hover{
-        background-color: rgb(227,240,255);
+        background-color: #EBEBEB;
       }
       cursor: pointer;
       span{

src/components/GlobalHeader/stationsvg.js

+import * as React from 'react';
+const SvgComponent = props => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    xmlSpace="preserve"
+    style={{
+      enableBackground: 'new 0 0 10 14',
+    }}
+    viewBox="0 0 10 14"
+    {...props}
+  >
+    <path
+      fill="currentColor"
+      d="M8.33 9.27C6.25 11.55 5 11.38 5 11.38s-1.58-.18-3.25-2.1C0 7.26 0 5.43 0 4.64 0 2.01 2.33 0 5 0c2.75 0 5 2.01 5 4.64 0 1.05.16 2.71-1.67 4.63zM5 3.5c-.92 0-1.67.79-1.67 1.75S4.08 7 5 7c.92 0 1.67-.79 1.67-1.75C6.66 4.29 5.91 3.5 5 3.5zm0 8.75c1.83 0 2.5.35 2.5.87S6.83 14 5 14s-2.5-.35-2.5-.87c0-.44.67-.88 2.5-.88zm0 0"
+    />
+  </svg>
+);
+export default SvgComponent;