|
|
@@ -0,0 +1,308 @@
|
|
|
+<template>
|
|
|
+ <header class="header">
|
|
|
+ <nav class="navbar">
|
|
|
+ <div class="navbar-container container">
|
|
|
+ <div class="navbar-header">
|
|
|
+ <a href="http://www.ubtob.com" class="item navbar-link">
|
|
|
+ <img :src="loginStyle.logoUrl ? loginStyle.logoUrl : 'https://dfs.ubtob.com/group1/M00/62/0F/CgpkyFp3uZmAHIU6AAANkRVx1Gk236.png'" class="navbar-logo">
|
|
|
+ </a>
|
|
|
+ <a href=""><span class="navbar-slogan">账号中心</span></a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </nav>
|
|
|
+ </header>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ name: 'AccountCenterHeader',
|
|
|
+ data () {
|
|
|
+ return {}
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ loginStyle () {
|
|
|
+ return this.$store.state.login.loginStyle.data.content
|
|
|
+ }
|
|
|
+// user () {
|
|
|
+// return this.$store.state.option.user
|
|
|
+// },
|
|
|
+// enterprise () {
|
|
|
+// let ens = this.user.data.enterprises
|
|
|
+// if (ens && ens.length) {
|
|
|
+// return ens.find(item => item.current) || {enName: '个人账户'}
|
|
|
+// } else {
|
|
|
+// return {enName: '个人账户'}
|
|
|
+// }
|
|
|
+// },
|
|
|
+// sortEnterprises () {
|
|
|
+// let ens = this.user.data.enterprises
|
|
|
+// if (ens && ens.length) {
|
|
|
+// ens.sort(function (a, b) {
|
|
|
+// return b.lastLoginTime - a.lastLoginTime
|
|
|
+// })
|
|
|
+// }
|
|
|
+// return ens
|
|
|
+// },
|
|
|
+// url () {
|
|
|
+// return this.$store.state.option.url
|
|
|
+// }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+// logout () {
|
|
|
+// this.$http.get('/logout/crossBefore').then(response => {
|
|
|
+// if (response.data) {
|
|
|
+// window.location.href = response.data.logoutUrl + '&baseUrl=' + encodeURIComponent(window.location.protocol + '//' + window.location.host + response.data.baseUrl)
|
|
|
+// }
|
|
|
+// })
|
|
|
+// },
|
|
|
+// onLoginClick () {
|
|
|
+// this.$http.get('/login/page', {params: {returnUrl: window.location.href}}).then(response => {
|
|
|
+// if (response.data) {
|
|
|
+// window.location.href = response.data.content + '&baseUrl=' + encodeURIComponent(window.location.protocol + '//' + window.location.host + response.data.baseUrl)
|
|
|
+// }
|
|
|
+// })
|
|
|
+// },
|
|
|
+// onRegisterClick () {
|
|
|
+// this.$http.get('/register/page').then(response => {
|
|
|
+// if (response.data) {
|
|
|
+// window.location.href = response.data.content
|
|
|
+// }
|
|
|
+// })
|
|
|
+// },
|
|
|
+// // 切换当前企业
|
|
|
+// switchEnterprise (en) {
|
|
|
+// this.showEnterpriseToggle = false
|
|
|
+// this.$http.get(`/user/authentication/${en.uu}`).then(() => {
|
|
|
+// this.$store.dispatch('loadUserInfo')
|
|
|
+// window.location.href = '/'
|
|
|
+// })
|
|
|
+// },
|
|
|
+// toVendor: function () {
|
|
|
+// let isSelf = true
|
|
|
+// let tempEnterprise = {}
|
|
|
+// let ens = this.user.data.enterprises
|
|
|
+// if (ens && ens.length) {
|
|
|
+// ens.forEach(function (item) {
|
|
|
+// if (item.current) {
|
|
|
+// isSelf = false
|
|
|
+// tempEnterprise = item
|
|
|
+// }
|
|
|
+// })
|
|
|
+// } else {
|
|
|
+// isSelf = true
|
|
|
+// }
|
|
|
+// if (isSelf) {
|
|
|
+// window.location.href = '/register-saler'
|
|
|
+// } else {
|
|
|
+// if (tempEnterprise.isVendor === 313) {
|
|
|
+// window.location.href = '/vendor#/index'
|
|
|
+// } else {
|
|
|
+// window.location.href = '/register-saler'
|
|
|
+// }
|
|
|
+// }
|
|
|
+// }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ @import '~assets/scss/mixins';
|
|
|
+ @import '~assets/scss/variables';
|
|
|
+
|
|
|
+ $nav-height: 60px;
|
|
|
+ $nav-boxshadow: 2px 2px 5px rgba(0,0,0,.12);
|
|
|
+ $nav-color: #3c3c3c;
|
|
|
+ .header .navbar{
|
|
|
+ min-height: inherit;
|
|
|
+ border-radius: 0;
|
|
|
+ }
|
|
|
+ .header .navbar .navbar-container .navbar-right .dropdown .dropdown-menu li span,.header .navbar .navbar-container .navbar-right .dropdown .dropdown-menu li a{
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ .header .navbar .navbar-container .navbar-right .dropdown .dropdown-menu .menu-item a{
|
|
|
+ width: 100%;
|
|
|
+ display: inline-block;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ height: 25px;
|
|
|
+ }
|
|
|
+ .header .navbar .navbar-container .navbar-right .dropdown .dropdown-menu .menu-item{
|
|
|
+ height: 30px;
|
|
|
+ }
|
|
|
+ .dropdown-menu>li>a{
|
|
|
+ padding: 0;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+ .dropdown-menu>li a:hover{
|
|
|
+ background: none;
|
|
|
+ text-decoration: underline !important;
|
|
|
+ }
|
|
|
+ .header {
|
|
|
+ height: $nav-height;
|
|
|
+
|
|
|
+ .navbar {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ font-size: $font-size-small;
|
|
|
+ background-color: $black-light;
|
|
|
+ box-shadow: $nav-boxshadow;
|
|
|
+ -o-box-shadow: $nav-boxshadow;
|
|
|
+ -moz-box-shadow: $nav-boxshadow;
|
|
|
+ -webkit-box-shadow: $nav-boxshadow;
|
|
|
+
|
|
|
+ .navbar-container {
|
|
|
+
|
|
|
+ .item-wrap {
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+
|
|
|
+ .item {
|
|
|
+ color: $nav-color;
|
|
|
+ display: inline-block;
|
|
|
+ height: $nav-height;
|
|
|
+ line-height: $nav-height;
|
|
|
+ }
|
|
|
+
|
|
|
+ a {
|
|
|
+ position: relative;
|
|
|
+ color: $nav-color;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 16px;
|
|
|
+ > span:before{
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ top: 5px;
|
|
|
+ left: 16px;
|
|
|
+ width: 1px;
|
|
|
+ height: 14px;
|
|
|
+ background: #bfbfbf;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .navbar-header {
|
|
|
+ float: left;
|
|
|
+
|
|
|
+ .navbar-logo {
|
|
|
+ margin-bottom: 2px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .navbar-slogan {
|
|
|
+ margin-left: $sm-pad;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .navbar-right {
|
|
|
+ float: right;
|
|
|
+
|
|
|
+ .item {
|
|
|
+ padding: 0 $pad;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dropdown {
|
|
|
+ .dropdown-toggle {
|
|
|
+ line-height: $nav-height;
|
|
|
+ border-left: 1px solid $black-light;
|
|
|
+ border-right: 1px solid $black-light;
|
|
|
+ height: 35px;
|
|
|
+ a {
|
|
|
+ margin-left: 15px;
|
|
|
+ float: right;
|
|
|
+ &:hover {
|
|
|
+ color: $red !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
+ border-left: 1px solid #999;
|
|
|
+ border-right: 1px solid #999;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ max-width: 190px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ float: right;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .menu-item-first {
|
|
|
+ background: #eee;
|
|
|
+ padding: 0 12px;
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 12px;
|
|
|
+ >span:nth-child(1) {
|
|
|
+ cursor: default;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ input {
|
|
|
+ width: 174px;
|
|
|
+ height: 24px;
|
|
|
+ margin-left: 35px;
|
|
|
+ background: #fff;
|
|
|
+ border: 1px solid #5078cb;
|
|
|
+ padding-left: 4px;
|
|
|
+ }
|
|
|
+ .search-enterprise {
|
|
|
+ display: inline-block;
|
|
|
+ width: 36px;
|
|
|
+ height: 24px;
|
|
|
+ color: #fff;
|
|
|
+ background: #5078cb;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 24px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .dropdown-menu {
|
|
|
+ padding: 0 6px 13px;
|
|
|
+ margin:0;
|
|
|
+ border-radius: 0;
|
|
|
+ right: unset;
|
|
|
+ background: #fff;
|
|
|
+ border: 1px solid #999999;
|
|
|
+ border-top: none;
|
|
|
+ -webkit-box-shadow: none;
|
|
|
+ -moz-box-shadow: none;
|
|
|
+ box-shadow: none;
|
|
|
+
|
|
|
+ ::-webkit-scrollbar {
|
|
|
+ background: #f6f6f6;
|
|
|
+ }
|
|
|
+
|
|
|
+ ul {
|
|
|
+ max-height: 300px;
|
|
|
+ overflow-y: auto;
|
|
|
+ background: #f6f6f6;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-item {
|
|
|
+ padding: 0 12px;
|
|
|
+ a {
|
|
|
+ color: #333;
|
|
|
+ max-width: 300px;
|
|
|
+ line-height: 30px;
|
|
|
+ width: auto;
|
|
|
+ &:hover {
|
|
|
+ color: #5078cb;
|
|
|
+ text-decoration: none!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &:hover {
|
|
|
+ background-color: $white;
|
|
|
+
|
|
|
+ .dropdown-toggle {
|
|
|
+ color: $text;
|
|
|
+ }
|
|
|
+ a {
|
|
|
+ color: $text
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|