refactor: 修改顶部菜单更紧凑

frontend/src/business/App.vue

@@ -15,8 +15,8 @@
         <!-- float right -->
         <ms-user ref="headerUser"/>
         <ms-language-switch :color="color"/>
-        <ms-task-center :color="color"/>
         <ms-header-org-ws :color="color"/>
+        <ms-task-center :color="color"/>
       </el-col>
     </el-row>
 

frontend/src/business/components/common/head/HeaderOrgWs.vue

@@ -8,12 +8,12 @@
            text-color="#fff">
     <el-menu-item index="1" v-show="false">Placeholder</el-menu-item>
     <el-submenu index="1" popper-class="org-ws-submenu"
+                :popper-append-to-body="true"
                 v-permission="['PROJECT_TRACK_CASE:READ','PROJECT_TRACK_PLAN:READ','PROJECT_TRACK_REVIEW:READ',
                 'PROJECT_API_DEFINITION:READ','PROJECT_API_SCENARIO:READ','PROJECT_API_REPORT:READ',
                 'PROJECT_PERFORMANCE_TEST:READ','PROJECT_PERFORMANCE_REPORT:READ', 'ORGANIZATION_USER:READ',
                 'WORKSPACE_USER:READ']">
       <template v-slot:title>
-        <font-awesome-icon class="icon global" :icon="['fas', 'tag']"/>
         <div class="org-ws-name" :title="currentOrganizationName + '-' + currentWorkspaceName">
           <div>{{ currentWorkspaceName || currentOrganizationName }}</div>
         </div>
@@ -25,7 +25,9 @@
                 class="search-input"
                 size="small"/>
       <div class="org-ws-menu">
-        <el-submenu :index="1+'-'+index" v-for="(item, index) in organizationList" :key="index">
+        <el-submenu :index="1+'-'+index" v-for="(item, index) in organizationList"
+                    :popper-append-to-body="true"
+                    :key="index">
           <template v-slot:title>
             <div @click="changeOrg(item)">
               {{ item.name }}
@@ -260,4 +262,8 @@ export default {
   text-overflow: ellipsis;
 }
 
+/deep/ .el-submenu__title {
+  padding-left: 5px;
+}
+
 </style>

frontend/src/business/components/common/head/LanguageSwitch.vue

@@ -6,7 +6,6 @@
            active-text-color="#fff">
     <el-submenu index="1">
       <template slot="title">
-        <font-awesome-icon class="icon global" :icon="['fas', 'globe']"/>
         <span>{{ language }}</span>
       </template>
       <el-menu-item v-for="(value, key) in languageMap" :key="key" @click="changeLanguage(key)">
@@ -103,4 +102,8 @@ export default {
 .global {
   color: #fff;
 }
+
+/deep/ .el-submenu__title {
+  padding-left: 5px;
+}
 </style>

frontend/src/business/components/task/TaskCenter.vue

@@ -6,8 +6,11 @@
              text-color="#fff"
              active-text-color="#fff">
       <el-menu-item onselectstart="return false">
-        <el-tooltip :content="$t('commons.task_center')" effect="light">
-          <span @click="showTaskCenter"> <font-awesome-icon class="icon global focusing" :icon="['fas', 'flag']"/></span>
+        <el-tooltip effect="light">
+          <template v-slot:content>
+            <span>{{ $t('commons.task_center') }}</span>
+          </template>
+          <font-awesome-icon @click="showTaskCenter" class="icon global focusing" :icon="['fas', 'tasks']"/>
         </el-tooltip>
       </el-menu-item>
     </el-menu>
@@ -260,4 +263,9 @@ export default {
   cursor: pointer;
   border-color: #783887;
 }
+
+/deep/ .el-menu-item {
+  padding-left: 0;
+  padding-right: 0;
+}
 </style>