From 3f5624a630b62e115808d2478d46512046798d4c Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Mon, 15 Nov 2021 14:57:14 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E4=BB=AA=E8=A1=A8=E7=BC=96=E8=BE=91?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=EF=BC=8C=E8=87=AA=E5=8A=A8=E9=9A=90=E8=97=8F?=
 =?UTF-8?q?=E9=A1=B6=E9=83=A8=E9=A4=90=E5=8D=95=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/layout/index.vue           | 35 ++++++++++++++++++++++---
 frontend/src/views/panel/edit/index.vue | 10 +++----
 frontend/src/views/panel/index.vue      |  5 +++-
 3 files changed, 41 insertions(+), 9 deletions(-)

diff --git a/frontend/src/layout/index.vue b/frontend/src/layout/index.vue
index a553754bca..a2f6c31847 100644
--- a/frontend/src/layout/index.vue
+++ b/frontend/src/layout/index.vue
@@ -1,14 +1,14 @@
 <template>
   <div :class="classObj" class="app-wrapper">
     <licbar />
-    <topbar />
+    <topbar v-if="componentName!=='PanelEdit'" />
 
-    <de-container style="padding-top: 56px;">
+    <de-container :style="mainStyle">
       <de-aside-container v-if="!sidebar.hide" class="le-aside-container">
         <sidebar class="sidebar-container" />
       </de-aside-container>
 
-      <de-main-container class="la-main-container">
+      <de-main-container class="la-main-container" :class="{'full-height':fullHeightFlag}">
         <app-main />
       </de-main-container>
     </de-container>
@@ -29,6 +29,8 @@ import ResizeMixin from './mixin/ResizeHandler'
 import DeMainContainer from '@/components/dataease/DeMainContainer'
 import DeContainer from '@/components/dataease/DeContainer'
 import DeAsideContainer from '@/components/dataease/DeAsideContainer'
+import bus from '@/utils/bus'
+
 export default {
   name: 'Layout',
   components: {
@@ -41,6 +43,11 @@ export default {
     DeAsideContainer
   },
   mixins: [ResizeMixin],
+  data() {
+    return {
+      componentName: 'PanelMain'
+    }
+  },
   computed: {
     sidebar() {
       return this.$store.state.app.sidebar
@@ -54,6 +61,20 @@ export default {
     showSettings() {
       return this.$store.state.settings.showSettings
     },
+    fullHeightFlag() {
+      return this.componentName === 'PanelEdit'
+    },
+    mainStyle() {
+      if (this.fullHeightFlag) {
+        return {
+          'height': '100vh!important'
+        }
+      } else {
+        return {
+          'paddingTop': '56px'
+        }
+      }
+    },
     classObj() {
       return {
         // hideSidebar: !this.sidebar.opened,
@@ -63,6 +84,11 @@ export default {
       }
     }
   },
+  mounted() {
+    bus.$on('PanelSwitchComponent', (c) => {
+      this.componentName = c.name
+    })
+  },
   methods: {
     handleClickOutside() {
       this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
@@ -127,4 +153,7 @@ export default {
         background-color: var(--SiderBG) !important;
       }
   }
+  .full-height {
+    height: 100vh !important;
+  }
 </style>
diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue
index 70beaea1f8..1df913ca2a 100644
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@@ -850,14 +850,14 @@ export default {
 
 <style scoped>
   .ms-aside-container {
-    height: calc(100vh - 91px);
+    height: calc(100vh - 35px);
     max-width: 60px;
     border: none;
     width: 60px;
   }
 
   .ms-main-container {
-    height: calc(100vh - 91px);
+    height: calc(100vh - 35px);
   }
 
   .de-header {
@@ -891,7 +891,7 @@ export default {
 .leftPanel {
   width: 100%;
   max-width: 300px;
-  height: calc(100vh - 91px);
+  height: calc(100vh - 35px);
   position: fixed;
   top: 91px;
   left: 60px;
@@ -918,13 +918,13 @@ export default {
 }
 
 .this_canvas{
-  height: calc(100vh - 91px);
+  height: calc(100vh - 35px);
   overflow-x: hidden;
   overflow-y: auto;
   background-size:100% 100% !important;
 }
 .el-main{
-  height: calc(100vh - 91px);
+  height: calc(100vh - 35px);
   padding: 0!important;
   overflow: auto;
   position: relative;
diff --git a/frontend/src/views/panel/index.vue b/frontend/src/views/panel/index.vue
index 25165d0b8b..818ff6e69d 100644
--- a/frontend/src/views/panel/index.vue
+++ b/frontend/src/views/panel/index.vue
@@ -1,6 +1,6 @@
 <template>
   <de-container v-loading="$store.getters.loadingMap[$store.getters.currentPath]" style="background-color: #f7f8fa">
-    <de-main-container>
+    <de-main-container :class="{'full-height':componentName==='PanelEdit'}">
       <panel-main v-show="componentName==='PanelMain'" ref="panel_main" />
       <chart-edit v-if="componentName==='ChartEdit'" :param="param" />
       <panel-edit v-if="componentName==='PanelEdit'" />
@@ -103,4 +103,7 @@ export default {
     padding: 0;
   }
 
+  .full-height {
+    height: 100vh !important;
+  }
 </style>