新三板，顶部路由样式

hailu

2023-09-26 b9223d6edee660b1a66d6118e3eac94088e76fce

新三板，顶部路由样式

 src/components/main/main.vue

@@ -213,7 +213,7 @@
      })
    }
    window.addEventListener('beforeunload', e => this.clearCookie())
    console.log(this.$store.getters.menuList);
    // console.log(this.$store.getters.menuList);
  },

}

 src/router/index.js

@@ -129,7 +129,7 @@
// 'publicMessage_tool',
router.beforeEach((to, from, next) => {
  store.commit('routeNameChange',JSON.stringify({url:to.name,title:to.meta.title}) )
  console.log(to);
  // console.log(to);
  if (to.name == from.name) {
    to.query = from.query
  }

 src/view/diligenceTools/components/tab7.vue

@@ -24,7 +24,7 @@
        <span class="title">分红融资</span>
      </li>
    </ul>
    <div style="position: relative;">
    <!-- <div style="position: relative;">
      <RadioGroup v-model="kType" type="button" @on-change="changKType">
        <Radio label="分时"></Radio>
        <Radio label="日K"></Radio>
@@ -46,7 +46,7 @@
        }}
        </Radio>
      </RadioGroup>
    </div>
    </div> -->
    <div style="position: relative;">
      <Spin v-show="echartsLoading" fix>
        <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>

 src/view/diligenceTools/xinSanBanInfo.vue

@@ -82,8 +82,8 @@
        <Tabs  value="tab8"  type="card" style="margin-top:8px;">
          <TabPane label="新三板上市信息" name="tab8"></TabPane>
        </Tabs>
        <tab8 v-if="tab == 'tab8'&&fullDetail.IsNew3" :name="selectedName" :clearMyInterval="clearMyInterval" :childrenLoadingReset="childrenLoadingReset"
              :TSCode="fullDetail.New3Code"></tab8>
        <tab8 v-if="tab == 'tab8'&&fullDetail.BondType=='新三板'" :name="selectedName" :clearMyInterval="clearMyInterval" :childrenLoadingReset="childrenLoadingReset"
              :TSCode="fullDetail.BondNum"></tab8>
        <div v-else style="text-align: center;margin: 20px 0;">
          <Icon custom="custom custom-kong" size="40" style="color: darkgray;"></Icon>
          <p style="margin-top: 8px;">暂无数据</p>
@@ -342,7 +342,9 @@
        searchType: 1
      }
      return axios.request({
        url: '/QiChaCha/GetFullDetail',
        // url: '/QiChaCha/GetFullDetail',
        url: '/QiChaCha/GetBaseinfoV3',
        
        data,
        method: 'post'
      })

 src/view/login/loginHeader.vue

@@ -4,20 +4,21 @@
            <div><img src="../../assets/images/homeLogin.png"
                    style="width: 168px;height: 38px;margin-left: 32px;margin-top: -5px;" @click="goLoginPage" alt=""></div>
            <div style="margin-left: 27px;border-bottom: 1px solid #fff;display: flex;width: calc(100% - 168px);">
                <ul class="topUl">
                    <li v-for="(item, index) in token ? menuList1 : menuList2"  :class="{ active: activeIndex == index }"
                        @click="changeMenu(item, index)">
                <ul id="topUl">
                    <li v-for="(item, index) in token ? menuList1 : menuList2" :class="{ active: activeIndex == index }"
                        class="topli" @click="changeMenu(item, index)">
                        <Dropdown v-if="item.children.length > 0" transfer class="routeInfo">
                            <div style="display: flex;" :class="{ activeRoute: routeIndex == index }">
                                <img :src="item.icon" alt="">
                                <div @click="chooseRoute(item)" class="routeTitle">{{ item.title }}</div>
                            </div>
                            <template #list>
                            <template #list class="temRoute">
                                <DropdownMenu>
                                    <DropdownItem v-for="(children, childrenIndex) in item.children">
                                        <div class="dropList" @click="chooseRoute(children, childrenIndex)">{{
                                            children.title
                                        }}</div>
                                    <DropdownItem v-for="(children, childrenIndex) in item.children" class="dropList">
                                        <div style="width: 100%;padding: 0 auto;"
                                            @click="chooseRoute(children, childrenIndex)">{{
                                                children.title
                                            }}</div>
                                    </DropdownItem>
                                </DropdownMenu>
                            </template>
@@ -31,7 +32,7 @@
                        <!-- <div v-if="item.show" class="shu"></div> -->
                    </li>
                </ul>
                <div v-if="token" style="position: absolute;right: 0;top:10px">
                <div v-if="token" :style="JSON.parse(this.$store.state.user.routeName).url=='login'?{'position': 'absolute','right': 0,'top':'25px','lineHeight':'32px'}:{'position': 'absolute','right': 0,'top':'10px'}">
                    <user :user-name="userName" :user-avator="userAvator" :message-unread-count="messageUnreadCount"></user>
                </div>
                <div v-else style="display: flex;margin-left: 80px;cursor: pointer;position: absolute;right: 0;top: 25px;">
@@ -382,115 +383,110 @@
                ]
            },],
            // activeRouteIndex: 0,
            routes: [
                { index: 0, route: ['login'] },
                {
                    index: 1, route: [
                        'newsFlashEx_tool',
                        'piaoDetail',
                        'bankMarket',
                        'rentMarket',
                        'receivablesMarket',
                        'trustMarket',
                        'AssetManagementFinancing',
                        'PledgeMovableProperty',
                        'MovablePropertyRegistration',
                    ]
                },
                {
                    index: 2, route: [
                        'zoneAnalyse',
                        'zhengxinCompenys',
                        'zonedynamics',
                        'zongheEvaluate',
                    ]
                },
                {
                    index: 3, route: [
                        'publicMessage_tool',
                        'financeCollateralPledge',
                        'shangShiInfos',
                        'xinSanBanInfos',
                    ]
                },
                {
                    index: 4, route: [
                        'enterpriseRelationshipMining',
                        'homeEx',
                        'rentExchangeCompany',
                        'rentExchangeCompanyZF',
            routes1: [

                    ]
                },
                {
                    index: 5, route: [
                        'fundMonitoring',
                        'controlList',
                        'bankPunishNewEvent',

                    ]
                },
            ]
                'newsFlashEx_tool',
                'piaoDetail',
                'bankMarket',
                'rentMarket',
                'receivablesMarket',
                'trustMarket',
                'AssetManagementFinancing',
                'PledgeMovableProperty',
                'MovablePropertyRegistration',

                'zoneAnalyse',
                'zhengxinCompenys',
                'zonedynamics',
                'zongheEvaluate',

                'publicMessage_tool',
                'financeCollateralPledge',
                'shangShiInfos',
                'xinSanBanInfos',
                'basicAttributes_tool',

                'enterpriseRelationshipMining',
                'homeEx',
                'rentExchangeCompany',
                'rentExchangeCompanyZF',


                'fundMonitoring',
                'controlList',
                'bankPunishNewEvent',

            ],
            routes2: [


                'newsFlashEx_tool',
                'piaoDetail',
                'bankMarket',
                'rentMarket',
                'receivablesMarket',
                'trustMarket',
                'AssetManagementFinancing',
                'PledgeMovableProperty',
                'MovablePropertyRegistration',

                'zoneAnalyse',
                'zhengxinCompenys',
                'zonedynamics',
                'zongheEvaluate',

                'publicMessage_tool',
                'financeCollateralPledge',
                'shangShiInfos',
                'xinSanBanInfos',
                'basicAttributes_tool',

                'fundMonitoring',
                'controlList',
                'bankPunishNewEvent',

            ],

        }
    },
    mounted() {

        // if (this.$store.state.user.token) {
        //     let urlInfo = JSON.parse(this.$store.state.user.routeName)
        //     // console.log($('.dropList').parent());
            
        //     // .eq(index).addClass('routeBack').siblings().removeClass('routeBack')
        //     // console.log(urlInfo);
        //     for (let i = 0; i < this.menuList1.length; i++) {
        //         for (let k = 0; k < this.menuList1[i].children.length; k++) {
        //            if(this.menuList1[i].children[k].title==urlInfo.title){

        //             console.log(i,k,$('.routeInfo.ivu-dropdown').eq(i-1).childNodes);  
        //             console.log(i,k,$('.routeInfo .ivu-dropdown').eq(i-1));  
        //             $('.routeInfo .ivu-dropdown').eq(i-1).find('.ivu-dropdown-item').eq(k).addClass('routeBack').siblings().removeClass('routeBack');
                    
        //            }

        //         }
                
               
        //     }
        // } else {
        //     // this.$store.commit('openloginModal', true)
        // }


        if (this.$store.state.user.token) {
            let urlInfo = JSON.parse(this.$store.state.user.routeName)
            for (let i = 0; i < this.routes1.length; i++) {
                if (this.routes1[i] === urlInfo.url || this.routes1[i] === (urlInfo.url + 's')) {
                    console.log(i,this.routes1[i],urlInfo.url);
                    $('.dropList').eq(i).addClass('routeBack').siblings().removeClass('routeBack')
                }
            }
        } else {
            let urlInfo = JSON.parse(this.$store.state.user.routeName)
            for (let i = 0; i < this.routes2.length; i++) {
                if (this.routes2[i] == urlInfo.url || this.routes2[i] == (urlInfo.url + 's')) {
                    $('.dropList').eq(i).addClass('routeBack').siblings().removeClass('routeBack')
                }
            }  
        }
    },
    methods: {
        chooseRoute(e, index) {
            // if (!index) {
            //     index = 0
            // }

            // console.log(e,index);
            localStorage.setItem('powerAccess', e.url)

            if (e.disabled == true) {
                if (this.$store.state.user.token) {
                    this.$router.push(e.url)
                    this.$router.push(e.url).catch(err => {  })
                } else {
                    this.$store.commit('openloginModal', true)
                }
            } else {
                this.$router.push(e.url)
                this.$router.push(e.url).catch(err => {  })
            }
            // console.log($('.dropList').parent().eq(index));
            // $('.dropList').parent().eq(index).addClass('routeBack').siblings().removeClass('routeBack')
            // console.log($('.dropList').parent().eq(index));
        },
        changeMenu(item, index) {
            this.activeIndex = index
            if (item.url) {
                // console.log(localStorage.getItem('powerAccess'));
                localStorage.setItem('powerAccess', item.url)
                // console.log(localStorage.getItem('powerAccess'));
                this.$router.push(item.url)
                this.$router.push(item.url).catch(err => {  })
            }

        },
@@ -498,10 +494,7 @@
            this.$router.push('login')
        },
        accountRegister() {
            // this.$router.push('/register')
            this.$router.push('register').catch(err => { console.log(err); }

            )
            this.$router.push('register').catch(err => {  })

        },
        openLoginModal() {
@@ -546,7 +539,7 @@

<style lang="less" scoped>
.routeBack {
    background-color: #0050BA;
    background-color: #2D8CF0;
    color: #fff;
}

@@ -557,12 +550,14 @@
    border-bottom: 4px solid #FFB13D;
}


.activeRoute {
    opacity: 0.8;

    .routeTitle {
        font-size: 17px;
        font-weight: 600;
        color: #FFB13D;   
    }
}