添加站点切换

package.json

@@ -112,7 +112,7 @@
         "@wisdom-components/basictable": "^1.5.16",
         "@wisdom-components/empty": "^1.4.1",
         "@wisdom-map/amap": "1.1.0-beta.56",
-        "@wisdom-map/arcgismap": "1.4.0-189",
+        "@wisdom-map/arcgismap": "1.4.0-190",
         "@wisdom-map/basemap": "1.1.0-29",
         "@wisdom-map/util": "^1.0.28-0",
         "@wisdom-utils/components": "0.1.321",

src/components/GlobalHeader/SimpleRiightContent.js

-import React, { useRef, useState } from 'react';
+import React, { useRef, useState, useEffect } from 'react';
 
-import { message, Popover } from 'antd';
+import { message, Popover, Select } from 'antd';
 import _ from 'lodash';
 import { connect } from 'react-redux';
-
+import { store } from '@wisdom-utils/utils';
 import Icon from '@ant-design/icons';
 import { AvatarDropdown as Avatar, useIntl } from '@wisdom-utils/components';
 import HeaderSearch from '@wisdom-utils/components/lib/layout/components/HeaderSearch';
@@ -11,6 +11,8 @@ 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 { actionCreators } from '../../containers/App/store';
 import styles from './index.less';
 import NoticeIconView from './NoticeIconView';
@@ -54,10 +56,16 @@ export const getConfig = (widgets, url, key) => {
 };
 const GlobalHeaderRight = props => {
   const [options, setOptions] = useState([]);
+  let [showStationList,setStationList]=useState([])
   const homeRef = useRef(null);
   const favitorRef = useRef(null);
   const history = useHistory();
-  const { theme, layout } = props;
+  const { theme, layout, global } = props;
+  const [stationvalue, setStationValue] = useState('');
+  const roleStationArr = useRef([]);
+  let stationOpen=useRef(false)
+  let slectDom=useRef(null)
+  let [update,setUpdate]=useState(false)
   let className = styles.right;
   const { clear } = useAliveController();
   if (theme === 'dark' && layout === 'top') {
@@ -210,10 +218,116 @@ const GlobalHeaderRight = props => {
       }
     })
   }
-
+  let resetMenu=()=>{
+    if(window.qiankunIsCache){
+      store&&store.set('event:refreshCurrentMenu', {
+        dropCache: true
+      });
+    }
+  }
+  let stationSerach=(value)=>{
+    let showstation = roleStationArr.current.filter((item)=>{
+      return item.name.includes(value)
+    })
+    setStationList(showstation)
+  }
+  let closePan=(name)=>{
+    stationOpen.current=false
+    setUpdate(stationOpen.current)
+    currentStationChange(name)
+  }
+  const currentStationChange = value => {
+    setStationValue(value);
+    const arr = roleStationArr.current.filter(item => item.name == value);
+    window.globalConfig.menuStation = arr.length ? arr[0] : {};
+    localStorage.setItem('globMenuStation', arr.length ? arr[0] : {})
+    setTimeout(()=>{
+      slectDom.current.blur()
+    },200)
+    resetMenu()
+  };
+  useEffect(() => {
+    if (global.userInfo) {
+      roleStationArr.current = global.userInfo.roles.filter(item => item.name.includes('站点_'));
+      if (roleStationArr.current.length) {
+        let stationname=roleStationArr.current[0].name
+        let saveOption=roleStationArr.current[0]
+        if(global.mapsettings&&global.mapsettings.layers){
+          global.mapsettings.layers.forEach((item)=>{
+            if(item.layerType=="PipenetLayer"){
+              let roalarr = item.roleNames.split(",")
+              if(roalarr.length){
+                roalarr.forEach((result)=>{
+                  if(result.includes('站点_')){
+                    stationname=result
+                    roleStationArr.current.forEach((respon)=>{
+                      if(respon.name==result){
+                        saveOption=respon
+                      } 
+                    })
+                  }
+                })
+              }
+            }
+          })
+        }
+        window.globalConfig.menuStation = saveOption;
+        setStationList(roleStationArr.current)
+        localStorage.setItem('globMenuStation', saveOption)
+        setStationValue(stationname);
+      }
+    }
+  }, [global.userInfo]);
   return (
     <div className={className}>
       {renderTopMenu()}
+      {
+        <div className={styles.curentPersonStationWriper}>
+          <span>站点:</span>
+          <div className={styles.currentPersonStationSlect}>
+            <Select 
+              style={{ width: '100%' }} 
+              ref={slectDom}
+              bordered={false}
+              onSearch={stationSerach}
+              onChange={currentStationChange}
+              onFocus={()=>{stationOpen.current=true;setUpdate(stationOpen.current)}}
+              onBlur={()=>{
+                setTimeout(()=>{
+                  stationOpen.current=false
+                  setUpdate(stationOpen.current)
+                },200)
+               
+              }}
+              open={stationOpen.current}
+              value={stationvalue} 
+              showSearch
+              dropdownRender={(menu) => {
+                return  (
+                    <>
+                        <ul className={styles.scalnameSlectMenu}>
+                            {
+                                showStationList.map((item)=>{
+                                    return (
+                                        <li style={{background:item.name==stationvalue?"#1685ff47":""}} onClick={()=>{closePan(item.name)}}>
+                                            <img src={item.name==stationvalue?stationChoose:stationNotChoose}></img>
+                                            <span style={{
+                                              color:item.name==stationvalue?"#1685ff":"#000",
+                                              fontWeight:item.name==stationvalue?"600":"400",
+                                            }}>{item.name}</span>
+                                        </li>
+                                    )
+                                })
+                            }
+                        </ul>
+                    </>
+                )
+            }} 
+            >
+            </Select>
+          </div>
+      </div>
+      }
       <Avatar menu config={props.global} updateCurrentIndex={props.updateCurrentIndex} updateConfig={props.updateConfig} logout={logout} />
     </div>
   );

src/components/GlobalHeader/index.less

@@ -68,6 +68,62 @@
       display: block;
     }
   }
+  .curentPersonStationWriper{
+    width: 217px;
+    height: 30px;
+    // background-color: red;
+    display: flex;
+    margin-left: 10px;
+    align-items: center;
+    >span{
+      width: 50;
+      font-weight: 600;
+      color: white;
+      margin-right: 10px;
+    }
+    .currentPersonStationSlect{
+      flex: 1;
+      width: 167px;
+    }
+    :global{
+      .@{ant-prefix}-select-selector{
+          background: linear-gradient(0deg, #1875DB 0%, #065CB9 100%);
+          padding-left: 30px !important;
+          border-radius: 4px !important;
+          position: relative;
+          &::before{
+            display: block;
+            content: "";
+            position: absolute;
+            width: 30px;
+            height: 30px;
+            top: 0;
+            left: 0;
+            background: url('../../assets/images/commonMenu/zhandian.png') no-repeat;
+            background-position: center;
+            background-size: auto;
+          }
+        input{
+          color: white;
+          text-indent: 20px;
+        }
+      }
+      .@{ant-prefix}-select-selection-item{
+        color: #FEFEFE;
+        max-width: 120px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+      .@{ant-prefix}-select{
+        cursor: pointer;
+      }
+      .@{ant-prefix}-select-arrow{
+        color: white;
+        cursor: pointer;
+      }
+    }
+  }
   //.account {
   //  .avatar {
   //    margin: ~'calc((@{layout-header-height} - 24px) / 2)' 0;
@@ -86,7 +142,28 @@
   //}
 
 }
-
+.scalnameSlectMenu{
+  width: 100%;
+  max-height: 300px;
+  display: flex;
+  flex-direction: column;
+  margin: 0;
+  padding: 0;
+  overflow-y: scroll;
+  >li{
+      display: flex;
+      height: 30px;
+      align-items: center;
+      color: black;
+      cursor: pointer;
+      img{
+          width: 20px;
+          height: 20px;
+          object-fit: none;
+          margin: 0 5px;
+      }
+  }
+}
 .dark {
   .action {
     color: rgba(255, 255, 255, 0.85);