From 585fb0bbd4a7bc7f8f333ecba7c5fecd2ee5cbc2 Mon Sep 17 00:00:00 2001 From: qushaowei <qushaowei@163.com> Date: 星期四, 28 三月 2024 09:46:44 +0800 Subject: [PATCH] Merge branch 'master' of http://117.34.109.166:18448/r/vue_mdc_430 into develop --- src/components/page/GlobalHeader.vue | 49 +++++++++++++++++++++++++++---------------------- 1 files changed, 27 insertions(+), 22 deletions(-) diff --git a/src/components/page/GlobalHeader.vue b/src/components/page/GlobalHeader.vue index e9b6418..c1a9b71 100644 --- a/src/components/page/GlobalHeader.vue +++ b/src/components/page/GlobalHeader.vue @@ -25,7 +25,7 @@ <div v-else :class="['top-nav-header-index', theme]"> <div class="header-index-wide"> <div class="header-index-left" :style="topMenuStyle.headerIndexLeft"> - <logo class="top-nav-header" :show-title="device !== 'mobile'" :style="topMenuStyle.topNavHeader"/> + <logo class="top-nav-header" :show-title="showTitle" :style="topMenuStyle.topNavHeader"/> <div class="top-nav-text"> <div style="width:100%;height: 50%;line-height:35px">瀵嗙骇锛氬唴閮�</div> <div style="width:100%;height: 50%;line-height:25px">璀﹀憡锛氭湰绯荤粺绂佹瀛樺偍銆佸鐞嗐�佷紶杈撴秹瀵嗕俊鎭�</div> @@ -101,7 +101,8 @@ headerIndexRight: {}, topSmenuStyle: {} }, - chatStatus: '' + chatStatus: '', + showTitle: true } }, watch: { @@ -125,6 +126,8 @@ if (this.mode === 'topmenu') { this.buildTopMenuStyle() } + window.addEventListener('resize', this.handleResize) + this.topMenuStyle.topNavHeader = { 'min-width': '165px', width: '165px' } //update-end--author:sunjianlei---date:20190508------for: 椤堕儴瀵艰埅鏍忚繃闀挎椂鏄剧ず鏇村鎸夐挳----- }, methods: { @@ -154,8 +157,8 @@ this.topMenuStyle.headerIndexLeft = {} } else { let rightWidth = '360px' - this.topMenuStyle.topNavHeader = { 'min-width': '165px' } - this.topMenuStyle.topSmenuStyle = { 'width': 'calc(100% - 165px)' } + this.topMenuStyle.topNavHeader = { 'min-width': '50px', width: '50px' } + this.topMenuStyle.topSmenuStyle = { 'width': 'calc(100% - 350px)' } this.topMenuStyle.headerIndexRight = { 'min-width': rightWidth } this.topMenuStyle.headerIndexLeft = { 'width': `calc(100% - ${rightWidth})` } } @@ -166,9 +169,23 @@ // update-begin-author:sunjianlei date:20210508 for: 淇鍔ㄦ�佸姛鑳芥祴璇曡彍鍗曘�佸甫鍙傛暟鑿滃崟鏍囬閿欒銆佸睍寮�閿欒鐨勯棶棰� handleUpdateMenuTitle(value) { this.$emit('updateMenuTitle', value) - } + }, // update-end-author:sunjianlei date:20210508 for: 淇鍔ㄦ�佸姛鑳芥祴璇曡彍鍗曘�佸甫鍙傛暟鑿滃崟鏍囬閿欒銆佸睍寮�閿欒鐨勯棶棰� + handleResize() { + console.log('瑙﹀彂灏哄鏀瑰彉', window.innerWidth) + if (window.innerWidth > 1680) { + this.showTitle = true + this.topMenuStyle.topNavHeader = { 'min-width': '165px' } + this.topMenuStyle.topSmenuStyle = { 'width': 'calc(100% - 165px)' } + } else if (window.innerWidth <= 1680 && window.innerWidth > 1280) { + this.showTitle = false + this.topMenuStyle.topNavHeader = { 'min-width': '50px', width: '50px' } + this.topMenuStyle.topSmenuStyle = { 'width': 'calc(100% - 250px)' } + } else if (window.innerWidth <= 1280 && window.innerWidth > 960) { + this.topMenuStyle.topSmenuStyle = { 'width': 'calc(100% - 350px)' } + } + } } } </script> @@ -234,43 +251,31 @@ @media screen and (min-width: 1920px) { .top-nav-text { - width: 400px; + min-width: 400px; } } @media screen and (min-width: 1680px) and (max-width: 1920px) { .top-nav-text { - width: 400px; + min-width: 300px; } } @media screen and (min-width: 1400px) and (max-width: 1680px) { .top-nav-text { - width: 500px; - } - - .top-nav-header { - display: none; + min-width: 300px; } } @media screen and (min-width: 1280px) and (max-width: 1400px) { .top-nav-text { - width: 600px; - } - - .top-nav-header { - display: none; + min-width: 450px; } } @media screen and (max-width: 1280px) { .top-nav-text { - width: 600px; - } - - .top-nav-header { - display: none; + min-width: 300px; } } </style> \ No newline at end of file -- Gitblit v1.9.3