From a7453eea26785a3100b35b9c10000dc202671221 Mon Sep 17 00:00:00 2001 From: YM <479443481@qq.com> Date: 星期三, 12 六月 2024 18:42:58 +0800 Subject: [PATCH] 1 --- src/components/headNav/headNav.vue | 55 ++++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 42 insertions(+), 13 deletions(-) diff --git a/src/components/headNav/headNav.vue b/src/components/headNav/headNav.vue index 27a7c40..503337d 100644 --- a/src/components/headNav/headNav.vue +++ b/src/components/headNav/headNav.vue @@ -33,6 +33,7 @@ width: 2.33rem; margin-right: 0.3rem; justify-content: flex-end; + position: relative; " > <input @@ -43,6 +44,8 @@ flex: 1; background-color: #fff; font-size: 0.13rem; + padding-right: 30px; + box-sizing: border-box; " @blur="InputBlur" @confirm="toggleSearch" @@ -50,7 +53,32 @@ v-model="searchInput" placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" /> + <span + class="cleanupBtn" + v-if="searchInput" + @click="searchInput = ''" + style=" + position: absolute; + top: 50%; + margin-top: -10px; + right: 42px; + color: #fff; + z-index: 2; + display: inline-block; + width: 20px; + height: 20px; + text-align: center; + line-height: 20px; + background-color: #a5a5a5; + font-weight: bold; + border-radius: 50%; + font-size: 12px; + cursor: pointer; + " + >鉁�</span + > <view + title="鎼滅储" class="search-logo" @click="toggleSearch" :style="{ @@ -66,6 +94,7 @@ <el-dropdown trigger="click" @command="handleCommand"> <!-- <view @click="iconClick(2)" class="s2 ss1 "></view> --> <img + title="涓汉涓績" class="cursor" @click="changePassword(1)" src="@/static/image/profile.svg" @@ -77,6 +106,7 @@ </el-dropdown-menu> </el-dropdown> <img + title="甯姪" class="cursor" @click="changePassword(2)" src="@/static/image/quote.svg" @@ -97,7 +127,7 @@ > <!-- 鑳屾櫙 --> <img class="leftListBgImage" src="@/static/image/leftListBg.png" alt="" /> - <view style="position: relative; z-index: 999"> + <view style="position: relative; z-index: 999"> <view class="flex flex-center LeftLogo"> <!-- <img src="@/static/image/logo.png" ></img> --> <view class="img"></view> @@ -114,7 +144,7 @@ <el-menu-item index="1"> <span slot="title">涓尰浜虹墿鏁版嵁搴�</span> </el-menu-item> - <el-menu-item index="2"> + <el-menu-item index="2" class="oActive"> <span slot="title">涓栧尰鍖诲鏁版嵁搴�</span> </el-menu-item> <el-menu-item index="3"> @@ -315,23 +345,22 @@ } } -@media screen and (min-width: 2560px) and (max-width: 3840px) { - ::v-deep .el-menu .is-active { - background-color: #244a7b !important; - border-radius: 0.5rem; - } +::v-deep .el-menu .is-active { + background-color: #244a7b !important; + border-radius: 0.5rem; +} +::v-deep .el-menu .is-active.oActive { + background-color: #e27917 !important; +} + +@media screen and (min-width: 2560px) and (max-width: 3840px) { .LeftLogo .img { background-image: url(@/static/image/logo4.png); } } @media screen and (min-width: 1366px) and (max-width: 1920px) { - ::v-deep .el-menu .is-active { - background-color: #244a7b !important; - border-radius: 0.5rem; - } - .LeftLogo .img { background-image: url(@/static/image/logo.png); } @@ -345,7 +374,7 @@ /* 绮樻�у畾浣� */ position: sticky; top: 0; - z-index: 9; + z-index: 99999999; } .NavTop { -- Gitblit v1.9.1