|
|
|
|
@ -192,543 +192,510 @@ |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import {getCurrentLanguage} from '@/common/i18n'; |
|
|
|
|
import {getExchangeRateCookie, setExchangeRateCookie} from '@/utils/auth'; |
|
|
|
|
import {logOut} from '@/api/user'; |
|
|
|
|
import Cookie from '@/common/cookie'; |
|
|
|
|
import {FILE_URL} from '@/api/app'; |
|
|
|
|
import {signIn} from '@/api/yyyf'; |
|
|
|
|
|
|
|
|
|
const Menu = { |
|
|
|
|
icon: [{t: 'nav.menu_name', link: '/'}], |
|
|
|
|
left: [ |
|
|
|
|
{t: 'nav.menu_home', link: '/'}, |
|
|
|
|
{t: 'nav.menu_markets', link: '/price'}, |
|
|
|
|
{t: 'nav.menu_exchange', link: '/trade'}, |
|
|
|
|
{t: 'nav.menu_OTC', link: '/exchange'}, |
|
|
|
|
{t: 'footer.white', link: '/white'}, |
|
|
|
|
], |
|
|
|
|
right: [ |
|
|
|
|
{t: 'nav.menu_fall', link: '/announce'}, |
|
|
|
|
{t: 'nav.menu_orders', link: '/entrust'}, |
|
|
|
|
{t: 'nav.menu_dingdan', link: '/order'}, |
|
|
|
|
{t: 'nav.menu_funds', link: '/balances'}, |
|
|
|
|
], |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
name: 'nav-header', |
|
|
|
|
props: { |
|
|
|
|
border: { |
|
|
|
|
type: Boolean, |
|
|
|
|
default: true, |
|
|
|
|
}, |
|
|
|
|
borderStyle: { |
|
|
|
|
type: String, |
|
|
|
|
default: 'default', |
|
|
|
|
validator: val => ['default', 'full'].indexOf(val) > -1, |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
menuIcon: Menu.icon, |
|
|
|
|
menuLeft: Menu.left, |
|
|
|
|
menuRight: Menu.right, |
|
|
|
|
lang: { |
|
|
|
|
current: {lang: 'zh-CN', name: '简体中文'}, |
|
|
|
|
list: [ |
|
|
|
|
// {lang: 'zh-HK', name: '繁體中文'}, |
|
|
|
|
{lang: 'zh-CN', name: this.$t('nav.menu_china')}, |
|
|
|
|
{lang: 'en', name: 'English'}, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
exRate: { |
|
|
|
|
current: {id: 'USD', name: 'nav.menu_USD'}, |
|
|
|
|
list: [ |
|
|
|
|
{id: 'HKD', name: 'nav.menu_HK'}, |
|
|
|
|
{id: 'USD', name: 'nav.menu_USD'}, |
|
|
|
|
{id: 'CNY', name: 'nav.menu_CNY'}, |
|
|
|
|
// {id: 'EUR', name: 'nav.menu_EUR'}, |
|
|
|
|
], |
|
|
|
|
import {getCurrentLanguage} from '@/common/i18n'; |
|
|
|
|
import {getExchangeRateCookie, setExchangeRateCookie} from '@/utils/auth'; |
|
|
|
|
import {logOut} from '@/api/user'; |
|
|
|
|
import Cookie from '@/common/cookie'; |
|
|
|
|
import {FILE_URL} from '@/api/app'; |
|
|
|
|
|
|
|
|
|
const Menu = { |
|
|
|
|
icon: [{t: 'nav.menu_name', link: '/'}], |
|
|
|
|
left: [ |
|
|
|
|
{t: 'nav.menu_home', link: '/'}, |
|
|
|
|
{t: 'nav.menu_markets', link: '/price'}, |
|
|
|
|
{t: 'nav.menu_exchange', link: '/trade'}, |
|
|
|
|
{t: 'nav.menu_OTC', link: '/exchange'}, |
|
|
|
|
{t: 'footer.white', link: '/white'}, |
|
|
|
|
], |
|
|
|
|
right: [ |
|
|
|
|
{t: 'nav.menu_fall', link: '/announce'}, |
|
|
|
|
{t: 'nav.menu_orders', link: '/entrust'}, |
|
|
|
|
{t: 'nav.menu_dingdan', link: '/order'}, |
|
|
|
|
{t: 'nav.menu_funds', link: '/balances'}, |
|
|
|
|
], |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
name: 'nav-header', |
|
|
|
|
props: { |
|
|
|
|
border: { |
|
|
|
|
type: Boolean, |
|
|
|
|
default: true, |
|
|
|
|
}, |
|
|
|
|
personal: { |
|
|
|
|
current: {id: 'profile', name: this.$t('personal.leftNav.profile')}, |
|
|
|
|
list: [ |
|
|
|
|
{id: 'profile', name: this.$t('personal.leftNav.profile')}, |
|
|
|
|
{id: 'security', name: this.$t('personal.leftNav.security')}, |
|
|
|
|
{id: 'manner', name: this.$t('personal.leftNav.manner')}, |
|
|
|
|
{id: 'prove', name: this.$t('personal.leftNav.prove')}, |
|
|
|
|
{id: 'out', name: this.$t('nav.menu_logOut')}, |
|
|
|
|
], |
|
|
|
|
borderStyle: { |
|
|
|
|
type: String, |
|
|
|
|
default: 'default', |
|
|
|
|
validator: val => ['default', 'full'].indexOf(val) > -1, |
|
|
|
|
}, |
|
|
|
|
userData: '', |
|
|
|
|
headerImg: '', |
|
|
|
|
perUrl: 'personal', |
|
|
|
|
file: '', |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
computed: { |
|
|
|
|
rightNavWidth: function() { |
|
|
|
|
if (this.userData != '' && this.userData != undefined) { |
|
|
|
|
return '42%'; |
|
|
|
|
} else { |
|
|
|
|
return '18%'; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
created() { |
|
|
|
|
let params = this.parseUrl(); |
|
|
|
|
//判断是否来自以渔有方 |
|
|
|
|
if ( |
|
|
|
|
!$.isEmptyObject(params) && |
|
|
|
|
params.userId != undefined && |
|
|
|
|
params.reqType != undefined |
|
|
|
|
) { |
|
|
|
|
this.loginFromYyyf(params); |
|
|
|
|
} |
|
|
|
|
this.file = FILE_URL; |
|
|
|
|
this.perUrl = window.location.pathname.split('/')[1]; |
|
|
|
|
// console.log(this.perUrl); |
|
|
|
|
|
|
|
|
|
// this.userData = Cookie.get('userData'); |
|
|
|
|
this.userData = localStorage.getItem('userData'); |
|
|
|
|
|
|
|
|
|
if (this.userData != '' && this.userData != undefined) { |
|
|
|
|
this.userData = JSON.parse(localStorage.getItem('userData')); |
|
|
|
|
// console.log(this.userData); |
|
|
|
|
if (this.userData.avatar != null) { |
|
|
|
|
this.headerImg = this.file + this.userData.avatar; |
|
|
|
|
} else { |
|
|
|
|
this.headerImg = this.userData.avatar; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
// console.log(this.headerImg); |
|
|
|
|
|
|
|
|
|
const currentLang = getCurrentLanguage(); |
|
|
|
|
for (let item of this.lang.list) { |
|
|
|
|
if (item.lang === currentLang) { |
|
|
|
|
this.lang.current = item; |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
const currentrate = getExchangeRateCookie(); |
|
|
|
|
for (let item of this.exRate.list) { |
|
|
|
|
if (item.id === currentrate) { |
|
|
|
|
this.exRate.current = item; |
|
|
|
|
// setExchangeRateCookie(currentrate); |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
methods: { |
|
|
|
|
parseUrl: function() { |
|
|
|
|
let params = {}; //定义数组 |
|
|
|
|
let url = decodeURIComponent(location.href); |
|
|
|
|
let paramsIndex = url.indexOf('?'); |
|
|
|
|
if (paramsIndex != -1) { |
|
|
|
|
paramsIndex = paramsIndex + 1; |
|
|
|
|
let paramsStr = url.substring(paramsIndex); |
|
|
|
|
let paramsAttr = paramsStr.split('&'); |
|
|
|
|
for (let x in paramsAttr) { |
|
|
|
|
let y = paramsAttr[x].split('='); |
|
|
|
|
if (y[0] == undefined || y[0] == '') { |
|
|
|
|
continue; |
|
|
|
|
} |
|
|
|
|
if (y[1] != undefined) { |
|
|
|
|
let value = ''; |
|
|
|
|
let len = y.length; |
|
|
|
|
for (let j = 1; j < len; j++) { |
|
|
|
|
value += |
|
|
|
|
y[j] == '' && |
|
|
|
|
paramsAttr[x].charAt(value.length + y[0].length + 1) != '' |
|
|
|
|
? '=' |
|
|
|
|
: y[j]; |
|
|
|
|
} |
|
|
|
|
params[y[0]] = value; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
return params; |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
menuIcon: Menu.icon, |
|
|
|
|
menuLeft: Menu.left, |
|
|
|
|
menuRight: Menu.right, |
|
|
|
|
lang: { |
|
|
|
|
current: {lang: 'zh-CN', name: '简体中文'}, |
|
|
|
|
list: [ |
|
|
|
|
// {lang: 'zh-HK', name: '繁體中文'}, |
|
|
|
|
{lang: 'zh-CN', name: this.$t('nav.menu_china')}, |
|
|
|
|
{lang: 'en', name: 'English'}, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
exRate: { |
|
|
|
|
current: {id: 'USD', name: 'nav.menu_USD'}, |
|
|
|
|
list: [ |
|
|
|
|
{id: 'HKD', name: 'nav.menu_HK'}, |
|
|
|
|
{id: 'USD', name: 'nav.menu_USD'}, |
|
|
|
|
{id: 'CNY', name: 'nav.menu_CNY'}, |
|
|
|
|
// {id: 'EUR', name: 'nav.menu_EUR'}, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
personal: { |
|
|
|
|
current: {id: 'profile', name: this.$t('personal.leftNav.profile')}, |
|
|
|
|
list: [ |
|
|
|
|
{id: 'profile', name: this.$t('personal.leftNav.profile')}, |
|
|
|
|
{id: 'security', name: this.$t('personal.leftNav.security')}, |
|
|
|
|
{id: 'manner', name: this.$t('personal.leftNav.manner')}, |
|
|
|
|
{id: 'prove', name: this.$t('personal.leftNav.prove')}, |
|
|
|
|
{id: 'out', name: this.$t('nav.menu_logOut')}, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
userData: '', |
|
|
|
|
headerImg: '', |
|
|
|
|
perUrl: 'personal', |
|
|
|
|
file: '', |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
loginFromYyyf: function(params) { |
|
|
|
|
signIn(params).then(res => { |
|
|
|
|
// console.log(res); |
|
|
|
|
if (res.data.code === 200) { |
|
|
|
|
debugger; |
|
|
|
|
this.loading = false; |
|
|
|
|
//保存登录的token到cookie |
|
|
|
|
// Cookie.set('token', res.data.data.token); |
|
|
|
|
localStorage.setItem('yyyfToken', res.data.data.yyyfUserToken); |
|
|
|
|
|
|
|
|
|
//保存登录的用户信息到cookie |
|
|
|
|
// Cookie.set('userData', res.data.data); |
|
|
|
|
//localStorage.setItem('userData', JSON.stringify(res.data.data)); |
|
|
|
|
location.href = '/'; |
|
|
|
|
|
|
|
|
|
computed: { |
|
|
|
|
rightNavWidth: function() { |
|
|
|
|
if (this.userData != '' && this.userData != undefined) { |
|
|
|
|
return '42%'; |
|
|
|
|
} else { |
|
|
|
|
this.loading = false; |
|
|
|
|
this.$message.warning(res.data.msg); |
|
|
|
|
return '18%'; |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
switchLang(command) { |
|
|
|
|
if (!command) { |
|
|
|
|
return; |
|
|
|
|
|
|
|
|
|
created() { |
|
|
|
|
let yyyfToken=localStorage.getItem('yyyfToken'); |
|
|
|
|
if(yyyfToken == '' || yyyfToken == undefined){ |
|
|
|
|
this.$alert('未从以渔有方登录，点击确定关闭浏览器', '提示', { |
|
|
|
|
type: 'error', |
|
|
|
|
showClose: false, |
|
|
|
|
confirmButtonText: '确定', |
|
|
|
|
confirmButtonClass: 'btn-self-style', |
|
|
|
|
callback: action => { |
|
|
|
|
this.closeWindow() |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
let u = new URL(location.href); |
|
|
|
|
u.searchParams.set('lang', command); |
|
|
|
|
location.href = u.href; |
|
|
|
|
}, |
|
|
|
|
switchRate(command) { |
|
|
|
|
if (!command) { |
|
|
|
|
return; |
|
|
|
|
this.file = FILE_URL; |
|
|
|
|
this.perUrl = window.location.pathname.split('/')[1]; |
|
|
|
|
// console.log(this.perUrl); |
|
|
|
|
|
|
|
|
|
// this.userData = Cookie.get('userData'); |
|
|
|
|
this.userData = localStorage.getItem('userData'); |
|
|
|
|
|
|
|
|
|
if (this.userData != '' && this.userData != undefined) { |
|
|
|
|
this.userData = JSON.parse(localStorage.getItem('userData')); |
|
|
|
|
// console.log(this.userData); |
|
|
|
|
if (this.userData.avatar != null) { |
|
|
|
|
this.headerImg = this.file + this.userData.avatar; |
|
|
|
|
} else { |
|
|
|
|
this.headerImg = this.userData.avatar; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
// let currentrate = getExchangeRateCookie(); |
|
|
|
|
// console.log('1111'+ currentrate); |
|
|
|
|
// for (let item of this.exRate.list) { |
|
|
|
|
// if (item.id === currentrate) { |
|
|
|
|
// setExchangeRateCookie(command); |
|
|
|
|
// this.exRate.current = item; |
|
|
|
|
// break; |
|
|
|
|
// } |
|
|
|
|
// }; |
|
|
|
|
setExchangeRateCookie(command); |
|
|
|
|
window.location.reload(); |
|
|
|
|
// console.log('1111'+ setExchangeRateCookie(command)); |
|
|
|
|
}, |
|
|
|
|
switchPage(command) { |
|
|
|
|
if (!command) { |
|
|
|
|
return; |
|
|
|
|
// console.log(this.headerImg); |
|
|
|
|
|
|
|
|
|
const currentLang = getCurrentLanguage(); |
|
|
|
|
for (let item of this.lang.list) { |
|
|
|
|
if (item.lang === currentLang) { |
|
|
|
|
this.lang.current = item; |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
if (command === 'out') { |
|
|
|
|
this.exit(); |
|
|
|
|
} else { |
|
|
|
|
location.href = '/personal?perUrl=' + this.perUrl + '#/' + command; |
|
|
|
|
const currentrate = getExchangeRateCookie(); |
|
|
|
|
for (let item of this.exRate.list) { |
|
|
|
|
if (item.id === currentrate) { |
|
|
|
|
this.exRate.current = item; |
|
|
|
|
// setExchangeRateCookie(currentrate); |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
exit() { |
|
|
|
|
logOut().then(res => { |
|
|
|
|
if (res.data.code === 200 || res.data.code === 202) { |
|
|
|
|
// Cookie.set('userData', ''); |
|
|
|
|
localStorage.setItem('userData', ''); |
|
|
|
|
localStorage.removeItem('userpass'); |
|
|
|
|
localStorage.removeItem('userdate'); |
|
|
|
|
localStorage.removeItem('nowPassNOValue'); |
|
|
|
|
window.location.href = '/'; |
|
|
|
|
|
|
|
|
|
// let pathName = window.location.pathname.split('/')[1]; |
|
|
|
|
// console.log(pathName); |
|
|
|
|
//判断是否从个人中心页面退出登录 |
|
|
|
|
// if (pathName === 'personal') { |
|
|
|
|
// window.location.href = '/login'; |
|
|
|
|
// } else { |
|
|
|
|
// window.location.href = this.perUrl; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
methods: { |
|
|
|
|
closeWindow: function () { |
|
|
|
|
if (navigator.userAgent.indexOf("Firefox") != -1 || navigator.userAgent.indexOf("Chrome") != -1) { |
|
|
|
|
window.location.href = "about:blank"; |
|
|
|
|
window.close(); |
|
|
|
|
} else { |
|
|
|
|
this.$message.warning(res.data.msg); |
|
|
|
|
window.opener = null; |
|
|
|
|
window.open("", "_self"); |
|
|
|
|
window.close(); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
switchLang(command) { |
|
|
|
|
if (!command) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
let u = new URL(location.href); |
|
|
|
|
u.searchParams.set('lang', command); |
|
|
|
|
location.href = u.href; |
|
|
|
|
}, |
|
|
|
|
switchRate(command) { |
|
|
|
|
if (!command) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
// let currentrate = getExchangeRateCookie(); |
|
|
|
|
// console.log('1111'+ currentrate); |
|
|
|
|
// for (let item of this.exRate.list) { |
|
|
|
|
// if (item.id === currentrate) { |
|
|
|
|
// setExchangeRateCookie(command); |
|
|
|
|
// this.exRate.current = item; |
|
|
|
|
// break; |
|
|
|
|
// } |
|
|
|
|
// }; |
|
|
|
|
setExchangeRateCookie(command); |
|
|
|
|
window.location.reload(); |
|
|
|
|
// console.log('1111'+ setExchangeRateCookie(command)); |
|
|
|
|
}, |
|
|
|
|
switchPage(command) { |
|
|
|
|
if (!command) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
if (command === 'out') { |
|
|
|
|
this.exit(); |
|
|
|
|
} else { |
|
|
|
|
location.href = '/personal?perUrl=' + this.perUrl + '#/' + command; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
exit() { |
|
|
|
|
logOut().then(res => { |
|
|
|
|
if (res.data.code === 200 || res.data.code === 202) { |
|
|
|
|
// Cookie.set('userData', ''); |
|
|
|
|
localStorage.setItem('userData', ''); |
|
|
|
|
localStorage.removeItem('userpass'); |
|
|
|
|
localStorage.removeItem('userdate'); |
|
|
|
|
localStorage.removeItem('nowPassNOValue'); |
|
|
|
|
window.location.href = '/'; |
|
|
|
|
|
|
|
|
|
// let pathName = window.location.pathname.split('/')[1]; |
|
|
|
|
// console.log(pathName); |
|
|
|
|
//判断是否从个人中心页面退出登录 |
|
|
|
|
// if (pathName === 'personal') { |
|
|
|
|
// window.location.href = '/login'; |
|
|
|
|
// } else { |
|
|
|
|
// window.location.href = this.perUrl; |
|
|
|
|
// } |
|
|
|
|
} else { |
|
|
|
|
this.$message.warning(res.data.msg); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style lang="scss"> |
|
|
|
|
@import '../../common/style/base'; |
|
|
|
|
// .main-nav{ |
|
|
|
|
// padding: 0 20px; |
|
|
|
|
// } |
|
|
|
|
.nav-header { |
|
|
|
|
max-width: 100%; |
|
|
|
|
min-width: 1180px; |
|
|
|
|
height: 65px; |
|
|
|
|
line-height: 65px; |
|
|
|
|
background-color: #23252b; |
|
|
|
|
display: flex; |
|
|
|
|
flex-wrap: nowrap; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
// padding: 0 $cec-header-padding; |
|
|
|
|
|
|
|
|
|
$local-menu-text-color: #6880a0; |
|
|
|
|
|
|
|
|
|
.logoBox { |
|
|
|
|
@import '../../common/style/base'; |
|
|
|
|
// .main-nav{ |
|
|
|
|
// padding: 0 20px; |
|
|
|
|
// } |
|
|
|
|
.nav-header { |
|
|
|
|
max-width: 100%; |
|
|
|
|
min-width: 1180px; |
|
|
|
|
height: 65px; |
|
|
|
|
line-height: 65px; |
|
|
|
|
background-color: #23252b; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
// margin-left: 12.6%; |
|
|
|
|
margin-right: 7.9%; |
|
|
|
|
img { |
|
|
|
|
width: 45px; |
|
|
|
|
height: 45px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
flex-wrap: nowrap; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
// padding: 0 $cec-header-padding; |
|
|
|
|
|
|
|
|
|
h2 { |
|
|
|
|
margin: 0; |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
$local-menu-text-color: #6880a0; |
|
|
|
|
|
|
|
|
|
.mainTitle { |
|
|
|
|
color: #fff; |
|
|
|
|
font-size: 28px; |
|
|
|
|
font-weight: normal; |
|
|
|
|
margin-left: 9px; |
|
|
|
|
} |
|
|
|
|
.logoBox { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
// margin-left: 12.6%; |
|
|
|
|
margin-right: 7.9%; |
|
|
|
|
img { |
|
|
|
|
width: 45px; |
|
|
|
|
height: 45px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.leftNav { |
|
|
|
|
width: 45%; |
|
|
|
|
display: flex; |
|
|
|
|
margin-left: 2%; |
|
|
|
|
.nav-menu { |
|
|
|
|
width: 60%; |
|
|
|
|
h2 { |
|
|
|
|
margin: 0; |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
.menu-item { |
|
|
|
|
margin-right: 3%; |
|
|
|
|
|
|
|
|
|
.mainTitle { |
|
|
|
|
color: #fff; |
|
|
|
|
font-size: 28px; |
|
|
|
|
font-weight: normal; |
|
|
|
|
margin-left: 9px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.rightNav { |
|
|
|
|
width: 10%; |
|
|
|
|
margin-right: 2%; |
|
|
|
|
// width: 350px; |
|
|
|
|
// display: flex; |
|
|
|
|
// flex-direction: row-reverse; |
|
|
|
|
.nav-menu { |
|
|
|
|
.leftNav { |
|
|
|
|
width: 45%; |
|
|
|
|
display: flex; |
|
|
|
|
margin-left: 2%; |
|
|
|
|
.nav-menu { |
|
|
|
|
width: 60%; |
|
|
|
|
} |
|
|
|
|
.menu-item { |
|
|
|
|
margin-right: 3%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.rightNav { |
|
|
|
|
width: 10%; |
|
|
|
|
margin-right: 2%; |
|
|
|
|
// width: 350px; |
|
|
|
|
// display: flex; |
|
|
|
|
// display: flex; |
|
|
|
|
// flex-direction: row-reverse; |
|
|
|
|
.nav-menu { |
|
|
|
|
// width: 350px; |
|
|
|
|
// display: flex; |
|
|
|
|
// flex-direction: row-reverse; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.nav-menu { |
|
|
|
|
display: flex; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
height: 100%; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
|
|
.menu-item { |
|
|
|
|
.nav-menu { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
height: 100%; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
|
|
font-size: 14px; |
|
|
|
|
color: $local-menu-text-color; |
|
|
|
|
.menu-item { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
&.no-padding { |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: $local-menu-text-color; |
|
|
|
|
|
|
|
|
|
> a { |
|
|
|
|
// color: $local-menu-text-color; |
|
|
|
|
color: #545663; |
|
|
|
|
&.is-active { |
|
|
|
|
color: white; |
|
|
|
|
&.no-padding { |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
> a { |
|
|
|
|
// color: $local-menu-text-color; |
|
|
|
|
color: #545663; |
|
|
|
|
&.is-active { |
|
|
|
|
color: white; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
span { |
|
|
|
|
color: #545663; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
span { |
|
|
|
|
color: #545663; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* 对 直接子代 a ，和 .menu-item-inner 进行定位布局 */ |
|
|
|
|
.menu-item > a, |
|
|
|
|
.menu-item-inner { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
/* 对 直接子代 a ，和 .menu-item-inner 进行定位布局 */ |
|
|
|
|
.menu-item > a, |
|
|
|
|
.menu-item-inner { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
box-sizing: border-box; |
|
|
|
|
// padding: 0 10px; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
// padding: 0 10px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.nav-menuRight { |
|
|
|
|
display: flex; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
height: 100%; |
|
|
|
|
// justify-content: space-between; |
|
|
|
|
.menu-item { |
|
|
|
|
.nav-menuRight { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: $local-menu-text-color; |
|
|
|
|
&.no-padding { |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
height: 100%; |
|
|
|
|
// justify-content: space-between; |
|
|
|
|
.menu-item { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: $local-menu-text-color; |
|
|
|
|
&.no-padding { |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
> a { |
|
|
|
|
// color: $local-menu-text-color; |
|
|
|
|
color: #545663; |
|
|
|
|
&.is-active { |
|
|
|
|
color: white; |
|
|
|
|
> a { |
|
|
|
|
// color: $local-menu-text-color; |
|
|
|
|
color: #545663; |
|
|
|
|
&.is-active { |
|
|
|
|
color: white; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
span { |
|
|
|
|
color: #545663; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
span { |
|
|
|
|
color: #545663; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* 对 直接子代 a ，和 .menu-item-inner 进行定位布局 */ |
|
|
|
|
.menu-item > a, |
|
|
|
|
.menu-item-inner { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
/* 对 直接子代 a ，和 .menu-item-inner 进行定位布局 */ |
|
|
|
|
.menu-item > a, |
|
|
|
|
.menu-item-inner { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
box-sizing: border-box; |
|
|
|
|
// padding: 0 10px; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
// padding: 0 10px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.navColor { |
|
|
|
|
color: #e8494a !important; |
|
|
|
|
position: relative; |
|
|
|
|
&::after { |
|
|
|
|
content: ''; |
|
|
|
|
width: 100%; |
|
|
|
|
height: 3px; |
|
|
|
|
background-color: #e8494a; |
|
|
|
|
position: absolute; |
|
|
|
|
bottom: 1%; |
|
|
|
|
left: 0; |
|
|
|
|
.navColor { |
|
|
|
|
color: #e8494a !important; |
|
|
|
|
position: relative; |
|
|
|
|
&::after { |
|
|
|
|
content: ''; |
|
|
|
|
width: 100%; |
|
|
|
|
height: 3px; |
|
|
|
|
background-color: #e8494a; |
|
|
|
|
position: absolute; |
|
|
|
|
bottom: 1%; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.nav-menu { |
|
|
|
|
/* logo area */ |
|
|
|
|
.nav-logo-area { |
|
|
|
|
padding: 0; |
|
|
|
|
.logo_text { |
|
|
|
|
font-size: 26px; |
|
|
|
|
color: #ffffff; |
|
|
|
|
.nav-menu { |
|
|
|
|
/* logo area */ |
|
|
|
|
.nav-logo-area { |
|
|
|
|
padding: 0; |
|
|
|
|
.logo_text { |
|
|
|
|
font-size: 26px; |
|
|
|
|
color: #ffffff; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@at-root { |
|
|
|
|
&_bordered { |
|
|
|
|
border-bottom: 1px solid #1f3e5a; |
|
|
|
|
@at-root { |
|
|
|
|
&_bordered { |
|
|
|
|
border-bottom: 1px solid #1f3e5a; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* 导航栏 下拉菜单 */ |
|
|
|
|
.nav-dropdown { |
|
|
|
|
&.el-dropdown { |
|
|
|
|
justify-content: center; |
|
|
|
|
} |
|
|
|
|
/* 导航栏 下拉菜单 */ |
|
|
|
|
.nav-dropdown { |
|
|
|
|
&.el-dropdown { |
|
|
|
|
justify-content: center; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.dropdown-link { |
|
|
|
|
cursor: pointer; |
|
|
|
|
color: $local-menu-text-color; |
|
|
|
|
} |
|
|
|
|
.dropdown-link { |
|
|
|
|
cursor: pointer; |
|
|
|
|
color: $local-menu-text-color; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.el-dropdown-menu { |
|
|
|
|
background-color: #fff; |
|
|
|
|
border: none; |
|
|
|
|
border-radius: 4px; |
|
|
|
|
margin: 0; |
|
|
|
|
padding: 0; |
|
|
|
|
top: 55px !important; |
|
|
|
|
.el-dropdown-menu { |
|
|
|
|
background-color: #fff; |
|
|
|
|
border: none; |
|
|
|
|
border-radius: 4px; |
|
|
|
|
margin: 0; |
|
|
|
|
padding: 0; |
|
|
|
|
top: 55px !important; |
|
|
|
|
|
|
|
|
|
&__item { |
|
|
|
|
height: 42px; |
|
|
|
|
line-height: 42px; |
|
|
|
|
&__item { |
|
|
|
|
height: 42px; |
|
|
|
|
line-height: 42px; |
|
|
|
|
|
|
|
|
|
&:not(.is-disabled):hover { |
|
|
|
|
background-color: #d3dae2; |
|
|
|
|
&:not(.is-disabled):hover { |
|
|
|
|
background-color: #d3dae2; |
|
|
|
|
} |
|
|
|
|
.is-active { |
|
|
|
|
color: #666 !important; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.is-active { |
|
|
|
|
color: #666 !important; |
|
|
|
|
.dropdown-menu-item-inner { |
|
|
|
|
color: #666; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.dropdown-menu-item-inner { |
|
|
|
|
color: #666; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.exRateDropdown { |
|
|
|
|
left: -100% !important; |
|
|
|
|
} |
|
|
|
|
.exRateDropdown { |
|
|
|
|
left: -100% !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.langDropdown { |
|
|
|
|
left: -50% !important; |
|
|
|
|
} |
|
|
|
|
.userDropdown { |
|
|
|
|
left: -5% !important; |
|
|
|
|
width: 110px; |
|
|
|
|
.el-dropdown-menu__item { |
|
|
|
|
padding: 0; |
|
|
|
|
.langDropdown { |
|
|
|
|
left: -50% !important; |
|
|
|
|
} |
|
|
|
|
.dropdown-menu-item-inner { |
|
|
|
|
text-align: center; |
|
|
|
|
.userDropdown { |
|
|
|
|
left: -5% !important; |
|
|
|
|
width: 110px; |
|
|
|
|
.el-dropdown-menu__item { |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
.dropdown-menu-item-inner { |
|
|
|
|
text-align: center; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.logOut { |
|
|
|
|
border-top: 1px solid rgba(237, 238, 243, 1); |
|
|
|
|
height: 50px !important; |
|
|
|
|
line-height: 50px !important; |
|
|
|
|
} |
|
|
|
|
.logOut { |
|
|
|
|
border-top: 1px solid rgba(237, 238, 243, 1); |
|
|
|
|
height: 50px !important; |
|
|
|
|
line-height: 50px !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.nav-dropdown-i18n { |
|
|
|
|
height: 100%; |
|
|
|
|
.nav-dropdown-i18n { |
|
|
|
|
height: 100%; |
|
|
|
|
|
|
|
|
|
.dropdown-menu-item-inner { |
|
|
|
|
width: 135 - 2 * 20px; // 20px 为 el-dropdown-item padding |
|
|
|
|
color: $local-menu-text-color; |
|
|
|
|
padding-left: 25px; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
position: relative; |
|
|
|
|
.dropdown-menu-item-inner { |
|
|
|
|
width: 135 - 2 * 20px; // 20px 为 el-dropdown-item padding |
|
|
|
|
color: $local-menu-text-color; |
|
|
|
|
padding-left: 25px; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
|
|
&.is-active { |
|
|
|
|
color: white; |
|
|
|
|
&.is-active { |
|
|
|
|
color: white; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.menu-item-icon { |
|
|
|
|
position: absolute; |
|
|
|
|
left: 0; |
|
|
|
|
line-height: 42px; |
|
|
|
|
font-size: 1.2em; |
|
|
|
|
font-weight: bold; |
|
|
|
|
color: $cec-color-text-regular; |
|
|
|
|
.menu-item-icon { |
|
|
|
|
position: absolute; |
|
|
|
|
left: 0; |
|
|
|
|
line-height: 42px; |
|
|
|
|
font-size: 1.2em; |
|
|
|
|
font-weight: bold; |
|
|
|
|
color: $cec-color-text-regular; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.registered { |
|
|
|
|
width: 70px; |
|
|
|
|
height: 28px; |
|
|
|
|
background-color: #e8494a; |
|
|
|
|
border-radius: 14px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
padding: 0; |
|
|
|
|
border-color: #3e5173; |
|
|
|
|
transition: all 0.2s linear; |
|
|
|
|
cursor: pointer; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
span { |
|
|
|
|
color: #fff !important; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
background-color: #fff; |
|
|
|
|
.registered { |
|
|
|
|
width: 70px; |
|
|
|
|
height: 28px; |
|
|
|
|
background-color: #e8494a; |
|
|
|
|
border-radius: 14px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
padding: 0; |
|
|
|
|
border-color: #3e5173; |
|
|
|
|
transition: all 0.2s linear; |
|
|
|
|
cursor: pointer; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
span { |
|
|
|
|
color: #e8494a !important; |
|
|
|
|
color: #fff !important; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
background-color: #fff; |
|
|
|
|
span { |
|
|
|
|
color: #e8494a !important; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
// .userAvatar { |
|
|
|
|
// width: 40px; |
|
|
|
|
// height: 40px; |
|
|
|
|
// border-radius: 40px; |
|
|
|
|
// overflow: hidden; |
|
|
|
|
// display: flex; |
|
|
|
|
// align-items: center; |
|
|
|
|
// justify-content: center; |
|
|
|
|
// background-color: #fff; |
|
|
|
|
// img { |
|
|
|
|
// width: 100%; |
|
|
|
|
// } |
|
|
|
|
// } |
|
|
|
|
} |
|
|
|
|
.btn-self-style { |
|
|
|
|
background: #f56c6c !important; |
|
|
|
|
color: #fff !important; |
|
|
|
|
} |
|
|
|
|
// .userAvatar { |
|
|
|
|
// width: 40px; |
|
|
|
|
// height: 40px; |
|
|
|
|
// border-radius: 40px; |
|
|
|
|
// overflow: hidden; |
|
|
|
|
// display: flex; |
|
|
|
|
// align-items: center; |
|
|
|
|
// justify-content: center; |
|
|
|
|
// background-color: #fff; |
|
|
|
|
// img { |
|
|
|
|
// width: 100%; |
|
|
|
|
// } |
|
|
|
|
// } |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
unclekh
5 years ago