optimize the display

Author: det101

web/src/js/module/header/index.scss

@@ -235,4 +235,10 @@
       color: $primary-color;
     }
   }
+
+  .workspace-title {
+    display: inline-flex;
+    width: 100px;
+    overflow: hidden;
+  }
 }

web/src/js/module/header/index.vue

@@ -4,9 +4,10 @@
       <div
         class="layout-header-menu-icon"
         @click="goHome"
-        @mouseleave="mouseleave"
-        @mouseover="mouseover">
-        <div style="margin-top:5px; display:inline-block;">
+      >
+        <div style="margin-top:5px; display:inline-block;"
+          @mouseleave="mouseleave"
+          @mouseover="mouseover">
           <svg t="1572957725118" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1115" width="20" height="20">
             <path d="M896 1024h-213.333333a128 128 0 0 1-128-128v-213.333333a128 128 0 0 1 128-128h213.333333a128 128 0 0 1 128 128v213.333333a128 128 0 0 1-128 128z m-213.333333-384a42.666667 42.666667 0 0 0-42.666667 42.666667v213.333333a42.666667 42.666667 0 0 0 42.666667 42.666667h213.333333a42.666667 42.666667 0 0 0 42.666667-42.666667v-213.333333a42.666667 42.666667 0 0 0-42.666667-42.666667z m-341.333334 384H128a128 128 0 0 1-128-128v-213.333333a128 128 0 0 1 128-128h213.333333a128 128 0 0 1 128 128v213.333333a128 128 0 0 1-128 128z m-213.333333-384a42.666667 42.666667 0 0 0-42.666667 42.666667v213.333333a42.666667 42.666667 0 0 0 42.666667 42.666667h213.333333a42.666667 42.666667 0 0 0 42.666667-42.666667v-213.333333a42.666667 42.666667 0 0 0-42.666667-42.666667z m768-170.666667h-213.333333a128 128 0 0 1-128-128V128a128 128 0 0 1 128-128h213.333333a128 128 0 0 1 128 128v213.333333a128 128 0 0 1-128 128z m-213.333333-384a42.666667 42.666667 0 0 0-42.666667 42.666667v213.333333a42.666667 42.666667 0 0 0 42.666667 42.666667h213.333333a42.666667 42.666667 0 0 0 42.666667-42.666667V128a42.666667 42.666667 0 0 0-42.666667-42.666667z m-341.333334 384H128a128 128 0 0 1-128-128V128a128 128 0 0 1 128-128h213.333333a128 128 0 0 1 128 128v213.333333a128 128 0 0 1-128 128zM128 85.333333a42.666667 42.666667 0 0 0-42.666667 42.666667v213.333333a42.666667 42.666667 0 0 0 42.666667 42.666667h213.333333a42.666667 42.666667 0 0 0 42.666667-42.666667V128a42.666667 42.666667 0 0 0-42.666667-42.666667z" p-id="1116" fill="#00FFFF">
             </path>
@@ -22,7 +23,7 @@
         </div>
       </div>
 
-      <workspaceMenu v-if="$route.path.indexOf('workspace')!==-1" :projectList="workspaces" :currentId="parseInt($route.query.workspaceId, 10)" :changeWorkSpace="changeWorkspace"></workspaceMenu>
+      <workspaceMenu v-if="isShowWorkspaceMenu" :projectList="workspaces" :currentId="parseInt($route.query.workspaceId, 10)" :changeWorkSpace="changeWorkspace"></workspaceMenu>
       <span
         v-if="currentProject.id"
         class="proj-select"
@@ -51,7 +52,7 @@
           </div>
         </DropdownMenu>
       </Dropdown>
-      <ul v-if="$route.path.indexOf('workspace')!==-1" class="menu">
+      <ul v-if="$route.query&&$route.query.workspaceId" class="menu">
         <li class="menu-item" @click="goSpaceHome">首页</li>
         <li class="menu-item" @click="goConsole">控制台</li>
       </ul>
@@ -156,9 +157,16 @@ export default {
     '$route'(newValue) {
       this.projectID = newValue.query.projectID;
       this.getCurrentProject();
+      this.getWorkSpace();
     }
   },
   methods: {
+    isShowWorkspaceMenu(){
+      return (!this.currentProject.id && this.isShowHomeNav());
+    },
+    isShowHomeNav(){
+      return (this.$route.query && this.$route.query.workspaceId|| this.$route.path.indexOf('workspace')!==-1);
+    },
     init() {
       api.fetch('/dss/getBaseInfo', 'get').then((rst) => {
         if (!isEmpty(rst)) {
@@ -170,14 +178,15 @@ export default {
 
           this.$emit('set-init');
         }
-        api.fetch(`/dss/workspaces`, 'get').then(rst=>{
-          if (!isEmpty(rst)) {
-            this.workspaces = rst.workspaces;
-          }
-        })
+        this.getWorkSpace();
       });
-
-      
+    },
+    getWorkSpace(){
+      api.fetch(`/dss/workspaces`, 'get').then(rst=>{
+        if (!isEmpty(rst)) {
+          this.workspaces = rst.workspaces;
+        }
+      })
     },
     goto(name) {
       this.$router.push({
@@ -265,15 +274,13 @@ export default {
       }, 500);
     },
     goSpaceHome(){
-      console.log('workspaceId', this.$route.query.workspaceId)
-      this.$router.push({path: '/home',query: Object.assign({}, this.$route.query)});
+      this.$router.push({path: '/workspace',query: Object.assign({}, this.$route.query)});
     },
     goConsole(){
-      console.log('workspaceId', this.$route.query.workspaceId)
       this.$router.push({path: '/console',query: Object.assign({}, this.$route.query)});
     },
     changeWorkspace(data){
-      this.$router.push({path: '/workspace',query: Object.assign({}, this.$route.query, {workspaceId: data.id})});
+      this.$router.push({query: Object.assign({}, this.$route.query, {workspaceId: data.id})});
     }
   },
 };

web/src/js/module/header/workspaceMenu.vue

@@ -1,5 +1,5 @@
 <template>
-  <span>    
+  <span v-if="currentProject.id">    
     <span
       class="proj-select"
     >
@@ -10,7 +10,7 @@
       placement="bottom-start"
     >
       <div style="font-size:14px">
-        {{ currentProject.name }}
+        <p class="workspace-title">{{ currentProject.name }}</p>
         <Icon type="ios-arrow-down" style="margin-left: 5px"></Icon>
       </div>
       <DropdownMenu slot="list" class="proj-list">

web/src/js/view/newhome/module/workspace/index.vue

@@ -218,7 +218,8 @@ export default {
       this.changePage(this.pageNum);
     },
     gotoWorkspace(workspace) {
-      this.$router.push({ path: '/workspace', query: { workspaceId: workspace.id }});
+      const workspaceId = workspace.workspaceId || workspace.id;
+      this.$router.push({ path: '/workspace', query: { workspaceId: workspaceId}});
     },
     workspaceShowAction(val) {
       this.workspaceShow = val;