样式修改

components/default/Header.vue

@@ -10,30 +10,35 @@
         </div>
         <div class="navbar-right">
           <template v-if="user.logged">
-            <div class="item-wrap dropdown" @mouseenter="showEnterpriseToggle = true" @mouseleave="showEnterpriseToggle = false">
+            <div class="item-wrap dropdown">
               <div class="item dropdown-toggle">
                 欢迎您，{{ user.data.userName }}&nbsp;|&nbsp;
                 <a @click="logout()">[退出]</a>
                 <span>{{enterprise.enName}}</span>
               </div>
-              <ul class="dropdown-menu" v-if="showEnterpriseToggle">
-                <li class="menu-item-first">
-                  <!--<span class="member-text" :title="enterprise.enName"><i class="fa fa-map-marker"></i>&nbsp;{{ enterprise.uu?enterprise.enName: user.data.userName + '（个人账户）' }}</span>-->
-                  <!--<a class="pull-right" @click="toggleEnterprises()" v-if="user.data.enterprises && user.data.enterprises.length > 0">-->
-                    <!--{{ showEnterprises ? '取消' : '切换' }}-->
-                  <!--</a>-->
+              <div class="dropdown-menu">
+                <div class="menu-item-first">
                   <span>您可切换至以下账户：</span>
-                  <!--<input type="text" placeholder="请输入公司名称" v-model="keyword"><span class="search-enterprise" @click="searchEnterprise()">搜索</span>-->
-                </li>
-                <li class="menu-item"
-                    v-for="en in sortEnterprises"
-                    v-if="en.uu!=enterprise.uu">
-                  <a @click="switchEnterprise(en)" :title="en.enName">{{ en.enName }}</a>
-                </li>
-                <li class="menu-item"  v-if="enterprise.uu">
-                  <a @click="switchEnterprise({uu: 0})"><span v-text="user.data.userName"></span>（个人账户）</a>
-                </li>
-              </ul>
+                </div>
+                <ul>
+                 <!-- <li class="menu-item-first">
+                    <span class="member-text" :title="enterprise.enName"><i class="fa fa-map-marker"></i>&nbsp;{{ enterprise.uu?enterprise.enName: user.data.userName + '（个人账户）' }}</span>
+                    <a class="pull-right" @click="toggleEnterprises()" v-if="user.data.enterprises && user.data.enterprises.length > 0">
+                    {{ showEnterprises ? '取消' : '切换' }}
+                    </a>
+                    <span>您可切换至以下账户：</span>
+                    <input type="text" placeholder="请输入公司名称" v-model="keyword"><span class="search-enterprise" @click="searchEnterprise()">搜索</span>
+                  </li>-->
+                  <li class="menu-item"
+                      v-for="en in sortEnterprises"
+                      v-if="en.uu!=enterprise.uu">
+                    <a @click="switchEnterprise(en)" :title="en.enName">{{ en.enName }}</a>
+                  </li>
+                  <li class="menu-item"  v-if="enterprise.uu">
+                    <a @click="switchEnterprise({uu: 0})"><span v-text="user.data.userName"></span>（个人账户）</a>
+                  </li>
+                </ul>
+              </div>
             </div>
             <nuxt-link class="item" :to="'/'">商城首页</nuxt-link>
             <!--<nuxt-link class="item" to="/user">买家中心</nuxt-link>
@@ -292,13 +297,38 @@
                 float: right;
               }
             }
+            .menu-item-first {
+              background: #eee;
+              padding: 0 12px;
+              line-height: 30px;
+              font-size: 12px;
+              >span:nth-child(1) {
+                cursor: default;
+              }
+              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;
-              max-height: 330px;
-              overflow-y: auto;
               right: unset;
               background: #fff;
               border: 1px solid #999999;
@@ -307,40 +337,21 @@
               -moz-box-shadow: none;
               box-shadow: none;
 
-              .menu-item-first {
-                background: #eee;
-                padding: 0 12px;
-                line-height: 30px;
-                max-width: 300px;
-                >span:nth-child(1) {
-                  cursor: default;
-                }
-                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;
-                }
+              ::-webkit-scrollbar {
+                background: #f6f6f6;
+              }
+
+              ul {
+                max-height: 300px;
+                overflow-y: auto;
+                background: #f6f6f6;
               }
 
               .menu-item {
                 padding: 0 12px;
-                max-width: 300px;
-                background: #f6f6f6;
                 a {
                   color: #333;
+                  max-width: 300px;
                   line-height: 30px;
                   &:hover {
                     color: #5078cb;