@ -1,16 +1,14 @@
< template >
< div class = "top-nav" >
< div id = "topContainer" class = "container" : class = "{ 'ncmatch-layout': homePath === '/ncmatchHome/index' }" >
< div id = "topContainer" class = "container" : class = "{ 'ncmatch-layout': homePath === '/ncmatchHome/index' }" >
<!-- 当homePath不等于 / ncmatchHome / index时显示logo和导航 -- >
< div class = "logo" v-if = "homePath !== '/ncmatchHome/index'" >
< img v-if = "JSON.stringify(logoInfoNew)!=='{}'" @click ="$router.push(homePath)"
style = "cursor:pointer;margin-right: 71px" class = "logoImg"
: src = " logoInfoNew.home.logoImg || '' "
alt = "" >
< img v-if = "JSON.stringify(logoInfoNew) !== '{}'" @click ="$router.push(homePath)"
style = "cursor:pointer;margin-right: 71px" class = "logoImg" : src = "logoInfoNew.home.logoImg || ''" alt = "" >
< nav class = "main-nav" v-if = "!isNcmatchHome" >
< ul >
< li : class = "{ active: $route.path.includes('/index') }" >
< ul >
< li : class = "{ active: $route.path.includes('/index') }" >
< a @click ="$router.push(homePath)" > 首页 < / a >
< / li >
< li @mouseleave ="sildeOut" @mouseenter ="sildeIn(product_service)" > < a > 产品与服务 < / a > < / li >
@ -22,8 +20,7 @@
<!-- > 促销活动 < / a > < / li > -- >
<!-- < li @mouseleave ="sildeOut" @mouseenter ="sildeIn(storageData())" > < a href = "#" > 解决方案 < / a > < / li > -- >
< li : class = "{ active: $route.path.includes('/about') }" @mouseleave ="sildeOut"
@ click = "$router.push('/homePage/about')" > < a
> 关于我们 < / a > < / li >
@ click = "$router.push('/homePage/about')" > < a > 关于我们 < / a > < / li >
< / ul >
@ -34,9 +31,7 @@
< div class = "logo" v-else >
<!-- 登录状态 : 用户头像在最左侧 -- >
< el-dropdown v-if = "loginState" @visible-change ="handleShow"
class = "avatar-container left-menu-item hover-effect nick-name-style"
style = "margin-right: 0"
trigger = "click" >
class = "avatar-container left-menu-item hover-effect nick-name-style" style = "margin-right: 0" trigger = "click" >
< div class = "avatar-wrapper" >
< i
style = "font-size: 18px; color: #262626;font-weight: 400;cursor: pointer;display: flex;justify-content: flex-start;align-items: center" >
@ -46,48 +41,37 @@
< / i >
< / div >
< el-dropdown-menu slot = "dropdown" style = "width: 230px;font-size: 16px;" divided >
< div
style = "display: flex;flex-direction: column;padding:15px 15px;background-color: #f0f2f5" >
< div style = "display: flex;flex-direction: column;padding:15px 15px;background-color: #f0f2f5" >
< span style = "font-weight: bold;font-size: 20px;margin-bottom: 5px;color: #333333" > { { nick _name } } < / span >
< span
style = "font-size: 12px;color:#666;display: flex;justify-content:flex-start;align-items: center" > ID : < span
ref = "contentToCopy" >
{ {
userId
} }
< span style = "font-size: 12px;color:#666;display: flex;justify-content:flex-start;align-items: center" > ID :
< span ref = "contentToCopy" >
{ {
userId
} }
< / span >
< svg
@ click = "copyBtn"
class = "copy-btn"
viewBox = "0 0 1024 1024"
xmlns = "http://www.w3.org/2000/svg"
width = "12"
height = "12"
style = "fill: #1019ab;"
>
< path
d = "M394.666667 106.666667h448a74.666667 74.666667 0 0 1 74.666666 74.666666v448a74.666667 74.666667 0 0 1-74.666666 74.666667H394.666667a74.666667 74.666667 0 0 1-74.666667-74.666667V181.333333a74.666667 74.666667 0 0 1 74.666667-74.666666z m0 64a10.666667 10.666667 0 0 0-10.666667 10.666666v448a10.666667 10.666667 0 0 0 10.666667 10.666667h448a10.666667 10.666667 0 0 0 10.666666-10.666667V181.333333a10.666667 10.666667 0 0 0-10.666666-10.666666H394.666667z m245.333333 597.333333a32 32 0 0 1 64 0v74.666667a74.666667 74.666667 0 0 1-74.666667 74.666666H181.333333a74.666667 74.666667 0 0 1-74.666666-74.666666V394.666667a74.666667 74.666667 0 0 1 74.666666-74.666667h74.666667a32 32 0 0 1 0 64h-74.666667a10.666667 10.666667 0 0 0-10.666666 10.666667v448a10.666667 10.666667 0 0 0 10.666666 10.666666h448a10.666667 10.666667 0 0 0 10.666667-10.666666v-74.666667z"
p - id = "1521" > < / path >
< / svg >
< / span >
< / span >
< svg @click ="copyBtn" class = "copy-btn" viewBox = "0 0 1024 1024" xmlns = "http://www.w3.org/2000/svg"
width = "12" height = "12" style = "fill: #1019ab;" >
< path
d = "M394.666667 106.666667h448a74.666667 74.666667 0 0 1 74.666666 74.666666v448a74.666667 74.666667 0 0 1-74.666666 74.666667H394.666667a74.666667 74.666667 0 0 1-74.666667-74.666667V181.333333a74.666667 74.666667 0 0 1 74.666667-74.666666z m0 64a10.666667 10.666667 0 0 0-10.666667 10.666666v448a10.666667 10.666667 0 0 0 10.666667 10.666667h448a10.666667 10.666667 0 0 0 10.666666-10.666667V181.333333a10.666667 10.666667 0 0 0-10.666666-10.666666H394.666667z m245.333333 597.333333a32 32 0 0 1 64 0v74.666667a74.666667 74.666667 0 0 1-74.666667 74.666666H181.333333a74.666667 74.666667 0 0 1-74.666666-74.666666V394.666667a74.666667 74.666667 0 0 1 74.666666-74.666667h74.666667a32 32 0 0 1 0 64h-74.666667a10.666667 10.666667 0 0 0-10.666666 10.666667v448a10.666667 10.666667 0 0 0 10.666666 10.666666h448a10.666667 10.666667 0 0 0 10.666667-10.666666v-74.666667z"
p - id = "1521" > < / path >
< / svg >
< / span >
< / div >
< el-divider style = "margin: 0!important;" > < / el-divider >
< div
v - if = "role.includes('客户')"
< div v -if = " role.includes ( ' 客户 ' ) "
style = "padding: 0 18px; width: 100%;height: 60px;display: flex;justify-content: space-between;align-items: center" >
< span style = "color:#666;display: block;font-size: 14px;"
class = "moneyNow" > < span style = "display: block;margin-bottom: 5px" >余额 < / span > { {
mybalance ? mybalance : initMybalance ( )
} } ¥ < / span >
< span style = "color:#666;display: block;font-size: 14px;" class = "moneyNow" > < span
style = "display: block;margin-bottom: 5px" > 余额 < / span > { {
mybalance ? mybalance : initMybalance ( )
} } ¥ < / span >
< el-button v-if = "!isShowKbossCharge" type="primary" @click="$router.push('/kbossCharge')" plain
style = "padding: 8px; " >
style = "padding: 8px; " >
充值
< / el-button >
< / div >
< el-dropdown-item v -if = " role.includes ( ' 客户 ' ) "
@ click . native = "$router.push('/customer/customerInformation')" >
< el-dropdown-item v-if = "role.includes('客户')" @click.native="$router.push('/customer/customerInformation')" >
< span style = "display: block" > 个人中心 < / span >
< / el-dropdown-item >
< el-dropdown-item @click.native ="logout" >
@ -97,7 +81,8 @@
< / el-dropdown >
<!-- 公司名称在中间 -- >
< div class = "company-name" @click ="$router.push(homePath)" style = "cursor:pointer;font-size: 24px;font-weight: bold;color: #222F60;margin: 0 auto;" >
< div class = "company-name" @click ="$router.push(homePath)"
style = "cursor:pointer;font-size: 24px;font-weight: bold;color: #222F60;margin: 0 auto;" >
{ { ( logoInfoNew . home && logoInfoNew . home . orgName ) || '' } }
< / div >
< / div >
@ -106,23 +91,17 @@
< div class = "user-area" >
< a @click ="goB" v-if = "loginState" class="login-btn" > 控制台 < / a >
< a @ click = " $ router.push ( {
path : '/login' ,
query : {
fromPath : 'homePage'
}
} ) "
v - if = "!loginState"
class = "login-btn" > 登录 < / a >
< a @click ="$router.push('/registrationPage')"
v - if = "!loginState"
class = "register-btn" > 立即注册 < / a >
path : '/login' ,
query : {
fromPath : 'homePage'
}
} ) " v-if=" ! loginState " class=" login - btn " > 登录 < / a >
< a @click ="$router.push('/registrationPage')" v-if = "!loginState" class="register-btn" > 立即注册 < / a >
<!-- < span style = "text-decoration: underline; text-decoration-color: #1b5bff" v-if = "!showRegisterButton" > {{ - - >
<!-- username -- >
<!-- } } < / span > -- >
< el-dropdown v-if = "loginState && homePath !== '/ncmatchHome/index'" @visible-change ="handleShow"
class = "avatar-container right-menu-item hover-effect nick-name-style"
style = "margin-right: 0"
trigger = "click" >
class = "avatar-container right-menu-item hover-effect nick-name-style" style = "margin-right: 0" trigger = "click" >
< div class = "avatar-wrapper" >
<!-- < img : src = "avatar + '?imageView2/1/w/80/h/80'" class = "user-avatar" / > -- >
< i
@ -136,48 +115,37 @@
<!-- < div class = "block" > < el-avatar shape = "square" size = small :src = "squareUrl" > < / el-avatar > < / div > -- >
< / div >
< el-dropdown-menu slot = "dropdown" style = "width: 230px;font-size: 16px;" divided >
< div
style = "display: flex;flex-direction: column;padding:15px 15px;background-color: #f0f2f5" >
< div style = "display: flex;flex-direction: column;padding:15px 15px;background-color: #f0f2f5" >
< span style = "font-weight: bold;font-size: 20px;margin-bottom: 5px;color: #333333" > { { nick _name } } < / span >
< span
style = "font-size: 12px;color:#666;display: flex;justify-content:flex-start;align-items: center" > ID : < span
ref = "contentToCopy" >
{ {
userId
} }
< span style = "font-size: 12px;color:#666;display: flex;justify-content:flex-start;align-items: center" > ID :
< span ref = "contentToCopy" >
{ {
userId
} }
< / span >
< svg
@ click = "copyBtn"
class = "copy-btn"
viewBox = "0 0 1024 1024"
xmlns = "http://www.w3.org/2000/svg"
width = "12"
height = "12"
style = "fill: #1019ab;"
>
< path
d = "M394.666667 106.666667h448a74.666667 74.666667 0 0 1 74.666666 74.666666v448a74.666667 74.666667 0 0 1-74.666666 74.666667H394.666667a74.666667 74.666667 0 0 1-74.666667-74.666667V181.333333a74.666667 74.666667 0 0 1 74.666667-74.666666z m0 64a10.666667 10.666667 0 0 0-10.666667 10.666666v448a10.666667 10.666667 0 0 0 10.666667 10.666667h448a10.666667 10.666667 0 0 0 10.666666-10.666667V181.333333a10.666667 10.666667 0 0 0-10.666666-10.666666H394.666667z m245.333333 597.333333a32 32 0 0 1 64 0v74.666667a74.666667 74.666667 0 0 1-74.666667 74.666666H181.333333a74.666667 74.666667 0 0 1-74.666666-74.666666V394.666667a74.666667 74.666667 0 0 1 74.666666-74.666667h74.666667a32 32 0 0 1 0 64h-74.666667a10.666667 10.666667 0 0 0-10.666666 10.666667v448a10.666667 10.666667 0 0 0 10.666666 10.666666h448a10.666667 10.666667 0 0 0 10.666667-10.666666v-74.666667z"
p - id = "1521" > < / path >
< / svg >
< / span >
< / span >
< svg @click ="copyBtn" class = "copy-btn" viewBox = "0 0 1024 1024" xmlns = "http://www.w3.org/2000/svg"
width = "12" height = "12" style = "fill: #1019ab;" >
< path
d = "M394.666667 106.666667h448a74.666667 74.666667 0 0 1 74.666666 74.666666v448a74.666667 74.666667 0 0 1-74.666666 74.666667H394.666667a74.666667 74.666667 0 0 1-74.666667-74.666667V181.333333a74.666667 74.666667 0 0 1 74.666667-74.666666z m0 64a10.666667 10.666667 0 0 0-10.666667 10.666666v448a10.666667 10.666667 0 0 0 10.666667 10.666667h448a10.666667 10.666667 0 0 0 10.666666-10.666667V181.333333a10.666667 10.666667 0 0 0-10.666666-10.666666H394.666667z m245.333333 597.333333a32 32 0 0 1 64 0v74.666667a74.666667 74.666667 0 0 1-74.666667 74.666666H181.333333a74.666667 74.666667 0 0 1-74.666666-74.666666V394.666667a74.666667 74.666667 0 0 1 74.666666-74.666667h74.666667a32 32 0 0 1 0 64h-74.666667a10.666667 10.666667 0 0 0-10.666666 10.666667v448a10.666667 10.666667 0 0 0 10.666666 10.666666h448a10.666667 10.666667 0 0 0 10.666667-10.666666v-74.666667z"
p - id = "1521" > < / path >
< / svg >
< / span >
< / div >
< el-divider style = "margin: 0!important;" > < / el-divider >
< div
v - if = "role.includes('客户')"
< div v -if = " role.includes ( ' 客户 ' ) "
style = "padding: 0 18px; width: 100%;height: 60px;display: flex;justify-content: space-between;align-items: center" >
< span style = "color:#666;display: block;font-size: 14px;"
class = "moneyNow" > < span style = "display: block;margin-bottom: 5px" >余额 < / span > { {
mybalance ? mybalance : initMybalance ( )
} } ¥ < / span >
< span style = "color:#666;display: block;font-size: 14px;" class = "moneyNow" > < span
style = "display: block;margin-bottom: 5px" > 余额 < / span > { {
mybalance ? mybalance : initMybalance ( )
} } ¥ < / span >
< el-button v-if = "!isShowKbossCharge" type="primary" @click="$router.push('/kbossCharge')" plain
style = "padding: 8px; " >
style = "padding: 8px; " >
充值
< / el-button >
< / div >
< el-dropdown-item v -if = " role.includes ( ' 客户 ' ) "
@ click . native = "$router.push('/customer/customerInformation')" >
< el-dropdown-item v-if = "role.includes('客户')" @click.native="$router.push('/customer/customerInformation')" >
< span style = "display: block" > 个人中心 < / span >
< / el-dropdown-item >
<!-- channelManagementShow = true -- >
@ -213,19 +181,17 @@
< div class = "inPanel" >
< div class = "panelLeft" >
< ul class = "outUl" >
< li style = "cursor: default" class = "outLi"
v - for = "item in showPanelData"
: key = "item.firTitle" >
< li style = "cursor: default" class = "outLi" v-for = "item in showPanelData" :key="item.firTitle" >
<!-- @ mouseenter = "sildeItemIn(item)" -- >
< span style = "cursor: default!important;" :class = "['tilte', 'activeFir']">
{ {
< span style = "cursor: default!important;" : class = "['tilte', 'activeFir']" >
{ {
item . firTitle
} }
< / span >
< / span >
< ul class = "inUl" >
< li class = "inLi" v-for = "i in item.secMenu" :key="i.id" >
< span style = "position: relative" @mouseenter ="sildeSecMenu(i)"
: class = "['twoMenuStyle', secId===i.id?'activeSec':'']"> { { i . secTitle } } < / span >
< span style = "position: relative" @mouseenter ="sildeSecMenu(i)"
: class = "['twoMenuStyle', secId === i.id ? 'activeSec' : '']"> { { i . secTitle } } < / span >
< / li >
< / ul >
< / li >
@ -233,28 +199,24 @@
< / div >
< span class = "ge" > < / span >
< div
v - if = "secMenuData[0].thrMenu[0].thrTitle !=null&&secMenuData[0].secTitle!==secMenuData[0].thrMenu[0].thrTitle"
v - if = "secMenuData[0].thrMenu[0].thrTitle != null && secMenuData[0].secTitle !== secMenuData[0].thrMenu[0].thrTitle"
class = "panelLeft" >
< ul >
< li style = "font-size: 14px!important;" @mouseenter ="sildeThrMenu(thr)" v -for = " ( thr , index ) in threeData "
: key = "index" >
< li style = "font-size: 14px!important;" @mouseenter ="sildeThrMenu(thr)" v -for = " ( thr , index ) in threeData "
: key = "index" >
{ { thr . thrTitle } }
< / li >
< / ul >
< / div >
< span
v - if = "secMenuData[0].thrMenu[0].thrTitle !=null&&secMenuData[0].secTitle!==secMenuData[0].thrMenu[0].thrTitle"
v - if = "secMenuData[0].thrMenu[0].thrTitle != null && secMenuData[0].secTitle !== secMenuData[0].thrMenu[0].thrTitle"
class = "ge" > < / span >
< div class = "panelRight" >
<!-- < span class = "subTitle" > { { showPanelRightData [ 0 ] . thrTitle } } < / span > -- >
< ul class = "leastMenu inBox" >
< li class = "clickItem"
style = "font-size: 14px!important;margin: 8px 0;cursor: pointer"
v - for = "itemR in showPanelRightData[0].value"
: key = "itemR.id"
@ click = "clickGo(itemR)"
>
< li class = "clickItem" style = "font-size: 14px!important;margin: 8px 0;cursor: pointer"
v - for = "itemR in showPanelRightData[0].value" : key = "itemR.id" @ click = "clickGo(itemR)" >
{ { itemR . name } } < span v-if = "itemR.discount" class="zhe" > {{ itemR.discount }} 折 < / span >
@ -269,11 +231,11 @@
< script >
import Vue from 'vue'
import { computingData , networkData , storageData , testData } from "@/views/homePage/components/topBox/testData" ;
import { reqNavList , reqNewHomeFestival , reqNewHomeSync } from "@/api/newHome" ;
import { mapGetters , mapState } from "vuex" ;
import { getLogoAPI , getUserInfoAPI } from "@/api/login" ;
import { reqApplyChannel } from "@/api/customer/channel" ;
import { computingData , networkData , storageData , testData } from "@/views/homePage/components/topBox/testData" ;
import { reqNavList , reqNewHomeFestival , reqNewHomeSync } from "@/api/newHome" ;
import { mapGetters , mapState } from "vuex" ;
import { getLogoAPI , getUserInfoAPI } from "@/api/login" ;
import { reqApplyChannel } from "@/api/customer/channel" ;
import store from "@/store" ;
import { getHomePath } from '@/views/setting/tools'
export default Vue . extend ( {
@ -485,7 +447,7 @@ export default Vue.extend({
this . passwordDialog = true ;
} ,
channelFirstBtn ( ) {
reqApplyChannel ( { user _id : this . userId } ) . then ( res => {
reqApplyChannel ( { user _id : this . userId } ) . then ( res => {
if ( res . code == "100" || res . code == "210" ) {
this . $message . success ( res . msg )
} else if ( res . code == "300" ) {
@ -509,7 +471,7 @@ export default Vue.extend({
} ,
async getUserInfo ( ) { / / 获 取 个 人 信 息
getUserInfoAPI ( { id : this . userId } ) . then ( ( res ) => {
getUserInfoAPI ( { id : this . userId } ) . then ( ( res ) => {
if ( res . status ) {
/ / t h i s . n i c k _ n a m e = r e s . d a t a [ 0 ] . n i c k _ n a m e ;
this . userInfoList = res . data ;
@ -655,7 +617,7 @@ export default Vue.extend({
}
} ,
initData ( ) {
reqNavList ( { url _link : window . location . href } ) . then ( res => {
reqNavList ( { url _link : window . location . href } ) . then ( res => {
console . log ( "res" , res . data . product _service )
if ( res . status ) {
this . product _service = this . buildData ( res . data . product _service )
@ -771,7 +733,8 @@ export default Vue.extend({
font - size : 18 px ! important ;
}
font - weight : 500 ; /* 使用数字值代替bold更精确 */
font - weight : 500 ;
/* 使用数字值代替bold更精确 */
color : # 222 F60 ! important ;
position : relative ;
height : 84 px ;
@ -802,6 +765,7 @@ export default Vue.extend({
. main - nav {
z - index : 10000 ;
ul {
display : flex ;
list - style : none ;