diff --git a/backend/src/main/java/io/dataease/service/chart/ChartViewService.java b/backend/src/main/java/io/dataease/service/chart/ChartViewService.java
index 020157435f..56d2f90035 100644
--- a/backend/src/main/java/io/dataease/service/chart/ChartViewService.java
+++ b/backend/src/main/java/io/dataease/service/chart/ChartViewService.java
@@ -180,6 +180,9 @@ public class ChartViewService {
             }
             data = datasourceProvider.getData(datasourceRequest);
         }
+        if (StringUtils.containsIgnoreCase(view.getType(), "pie") && data.size() > 1000) {
+            data = data.subList(0, 1000);
+        }
 
         // 图表组件可再扩展
         List<String> x = new ArrayList<>();
diff --git a/frontend/src/components/canvas/components/Editor/Preview.vue b/frontend/src/components/canvas/components/Editor/Preview.vue
index d288ccb07d..2428dca442 100644
--- a/frontend/src/components/canvas/components/Editor/Preview.vue
+++ b/frontend/src/components/canvas/components/Editor/Preview.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="canvasInfo" :style="customStyle" class="bg">
+  <div id="canvasInfoTemp" :style="customStyle" class="bg">
     <el-row v-if="componentDataShow.length===0" style="height: 100%;" class="custom-position">
       {{ $t('panel.panelNull') }}
     </el-row>
@@ -101,7 +101,7 @@ export default {
     const _this = this
     const erd = elementResizeDetectorMaker()
     // 监听div变动事件
-    erd.listenTo(document.getElementById('canvasInfo'), element => {
+    erd.listenTo(document.getElementById('canvasInfoTemp'), element => {
       _this.$nextTick(() => {
         _this.restore()
       })
@@ -116,8 +116,8 @@ export default {
     getStyle,
     restore() {
       debugger
-      const canvasHeight = document.getElementById('canvasInfo').offsetHeight
-      const canvasWidth = document.getElementById('canvasInfo').offsetWidth
+      const canvasHeight = document.getElementById('canvasInfoTemp').offsetHeight
+      const canvasWidth = document.getElementById('canvasInfoTemp').offsetWidth
       this.scaleWidth = canvasWidth * 100 / parseInt(this.canvasStyleData.width)// 获取宽度比
       this.scaleHeight = canvasHeight * 100 / parseInt(this.canvasStyleData.height)// 获取高度比
       if (this.showType === 'width') {
diff --git a/frontend/src/layout/components/AppMain.vue b/frontend/src/layout/components/AppMain.vue
index 0111801d9d..68235f7d8f 100644
--- a/frontend/src/layout/components/AppMain.vue
+++ b/frontend/src/layout/components/AppMain.vue
@@ -2,9 +2,7 @@
   <section class="app-main">
     <transition name="fade-transform" mode="out-in">
       <el-main class="ms-main-container">
-        <!-- <keep-alive> -->
         <router-view :key="key" />
-        <!-- </keep-alive> -->
       </el-main>
     </transition>
   </section>
@@ -26,11 +24,11 @@ export default {
 
     .app-main {
         /* topbar 56  */
-        min-height: calc(100vh - 56px);
-        width: 100%;
-        height: 100%;
-        position: relative;
-        overflow: hidden;
+        // min-height: calc(100vh - 56px);
+        // width: 100%;
+        // height: 100%;
+         // position: relative;
+        // overflow: hidden;
     }
 
     .fixed-header + .app-main {
diff --git a/frontend/src/layout/components/Sidebar/index.vue b/frontend/src/layout/components/Sidebar/index.vue
index d937418561..e2cd53868a 100644
--- a/frontend/src/layout/components/Sidebar/index.vue
+++ b/frontend/src/layout/components/Sidebar/index.vue
@@ -1,20 +1,18 @@
 <template>
   <div :class="{'has-logo':showLogo}">
     <logo v-if="showLogo" :collapse="isCollapse" />
-    <el-scrollbar wrap-class="scrollbar-wrapper">
-      <el-menu
-        :default-active="activeMenu"
-        :collapse="isCollapse"
-        :background-color="variables.menuBg"
+    <el-menu
+      :default-active="activeMenu"
+      :collapse="isCollapse"
+      :background-color="variables.menuBg"
 
-        :unique-opened="false"
-        :active-text-color="variables.menuActiveText"
-        :collapse-transition="false"
-        mode="vertical"
-      >
-        <sidebar-item v-for="route in routes" :key="route.path" :item="route" :base-path="route.path" />
-      </el-menu>
-    </el-scrollbar>
+      :unique-opened="false"
+      :active-text-color="variables.menuActiveText"
+      :collapse-transition="false"
+      mode="vertical"
+    >
+      <sidebar-item v-for="route in routes" :key="route.path" :item="route" :base-path="route.path" />
+    </el-menu>
   </div>
 </template>
 
@@ -23,7 +21,6 @@ import { mapGetters } from 'vuex'
 import Logo from './Logo'
 import SidebarItem from './SidebarItem'
 import variables from '@/styles/variables.scss'
-
 export default {
   components: { SidebarItem, Logo },
   computed: {
diff --git a/frontend/src/layout/index.vue b/frontend/src/layout/index.vue
index ce02660731..87884310d7 100644
--- a/frontend/src/layout/index.vue
+++ b/frontend/src/layout/index.vue
@@ -2,35 +2,43 @@
   <div :class="classObj" class="app-wrapper">
     <licbar />
     <topbar />
-    <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
-    <sidebar v-if="!sidebar.hide" class="sidebar-container" />
-    <div :class="{sidebarHide: sidebar.hide}" class="main-container">
-      <div :class="{'fixed-header':fixedHeader}">
-        <!-- <navbar /> -->
-      </div>
+
+    <de-container style="padding-top: 56px;">
+      <de-aside-container v-if="!sidebar.hide">
+        <sidebar class="sidebar-container" />
+      </de-aside-container>
+
+      <de-main-container class="la-main-container">
+        <app-main />
+      </de-main-container>
+    </de-container>
+
+    <!-- <de-main-container>
       <app-main />
-      <right-panel v-if="showSettings">
-        <settings />
-      </right-panel>
-    </div>
+    </de-main-container> -->
+
+    <!-- <div :class="{sidebarHide: sidebar.hide}" class="main-container">
+      <app-main />
+    </div> -->
   </div>
 </template>
 
 <script>
-import RightPanel from '@/components/RightPanel'
-import { Sidebar, Settings, AppMain, Topbar, Licbar } from './components'
-// import { Sidebar, Settings, AppMain, Topbar } from './components'
+import { Sidebar, AppMain, Topbar, Licbar } from './components'
 import ResizeMixin from './mixin/ResizeHandler'
-
+import DeMainContainer from '@/components/dataease/DeMainContainer'
+import DeContainer from '@/components/dataease/DeContainer'
+import DeAsideContainer from '@/components/dataease/DeAsideContainer'
 export default {
   name: 'Layout',
   components: {
-    RightPanel,
     Sidebar,
-    Settings,
     AppMain,
     Topbar,
-    Licbar
+    Licbar,
+    DeMainContainer,
+    DeContainer,
+    DeAsideContainer
   },
   mixins: [ResizeMixin],
   computed: {
@@ -70,8 +78,8 @@ export default {
   .app-wrapper {
     @include clearfix;
     position: relative;
-    // height: 100%;
-    height: $contentHeight;
+    height: 100%;
+    // height: $contentHeight;
     width: 100%;
     &.mobile.openSidebar{
       position: fixed;
@@ -104,4 +112,8 @@ export default {
   .mobile .fixed-header {
     width: 100%;
   }
+
+  .la-main-container {
+      padding: 0px !important;
+  }
 </style>
diff --git a/frontend/src/styles/sidebar.scss b/frontend/src/styles/sidebar.scss
index 73ee3e42b4..b8762fc8ed 100644
--- a/frontend/src/styles/sidebar.scss
+++ b/frontend/src/styles/sidebar.scss
@@ -13,9 +13,9 @@
   }
   .sidebar-container {
     transition: width 0.28s;
-    width: $sideBarWidth !important;
+    // width: $sideBarWidth !important;
     background-color: $menuBg;
-    // height: 100%;
+     // width: 260px;
     height: $contentHeight;
     position: fixed;
     font-size: 0px;
@@ -25,7 +25,9 @@
     left: 0;
     z-index: 999;
     overflow: hidden;
-    border-right: 1px solid rgba(0, 0, 0, 0.12);
+    // min-width: 260px;
+    // max-width: 400px;
+    // border-right: 1px solid rgba(0, 0, 0, 0.12);
 
     // reset element-ui css
     .horizontal-collapse-transition {
diff --git a/frontend/src/views/chart/components/filter/DimensionFilterEditor.vue b/frontend/src/views/chart/components/filter/DimensionFilterEditor.vue
index 050b9e548a..b9c4009f78 100644
--- a/frontend/src/views/chart/components/filter/DimensionFilterEditor.vue
+++ b/frontend/src/views/chart/components/filter/DimensionFilterEditor.vue
@@ -23,7 +23,7 @@
           </el-select>
         </el-col>
         <el-col :span="6">
-          <el-input v-model="f.value" class="value-item" :placeholder="$t('chart.no_limit')" size="mini" clearable />
+          <el-input v-show="!f.term.includes('null')" v-model="f.value" class="value-item" :placeholder="$t('chart.no_limit')" size="mini" clearable />
         </el-col>
         <el-col :span="6">
           <el-button type="text" icon="el-icon-delete" circle style="float: right" @click="removeFilter(index)" />
diff --git a/frontend/src/views/chart/components/filter/QuotaFilterEditor.vue b/frontend/src/views/chart/components/filter/QuotaFilterEditor.vue
index 959652f0b5..21eed17c5e 100644
--- a/frontend/src/views/chart/components/filter/QuotaFilterEditor.vue
+++ b/frontend/src/views/chart/components/filter/QuotaFilterEditor.vue
@@ -23,7 +23,7 @@
           </el-select>
         </el-col>
         <el-col :span="6">
-          <el-input v-model="f.value" class="value-item" :placeholder="$t('chart.no_limit')" size="mini" clearable />
+          <el-input v-show="!f.term.includes('null')" v-model="f.value" class="value-item" :placeholder="$t('chart.no_limit')" size="mini" clearable />
         </el-col>
         <el-col :span="6">
           <el-button type="text" icon="el-icon-delete" circle style="float: right" @click="removeFilter(index)" />
diff --git a/frontend/src/views/chart/components/filter/ResultFilterEditor.vue b/frontend/src/views/chart/components/filter/ResultFilterEditor.vue
index 6ed4867180..8084a27b89 100644
--- a/frontend/src/views/chart/components/filter/ResultFilterEditor.vue
+++ b/frontend/src/views/chart/components/filter/ResultFilterEditor.vue
@@ -37,7 +37,7 @@
           </el-select>
         </el-col>
         <el-col :span="6">
-          <el-input v-model="f.value" class="value-item" :placeholder="$t('chart.no_limit')" size="mini" clearable />
+          <el-input v-show="!f.term.includes('null')" v-model="f.value" class="value-item" :placeholder="$t('chart.no_limit')" size="mini" clearable />
         </el-col>
         <el-col :span="6">
           <el-button type="text" icon="el-icon-delete" circle style="float: right" @click="removeFilter(index)" />
diff --git a/frontend/src/views/chart/view/ChartEdit.vue b/frontend/src/views/chart/view/ChartEdit.vue
index c5eff85948..8a8ac11cb1 100644
--- a/frontend/src/views/chart/view/ChartEdit.vue
+++ b/frontend/src/views/chart/view/ChartEdit.vue
@@ -334,7 +334,7 @@
 </template>
 
 <script>
-import { post, ajaxGetData } from '@/api/chart/chart'
+import { ajaxGetData, post } from '@/api/chart/chart'
 import draggable from 'vuedraggable'
 import DimensionItem from '../components/drag-item/DimensionItem'
 import QuotaItem from '../components/drag-item/QuotaItem'
@@ -342,18 +342,17 @@ import ResultFilterEditor from '../components/filter/ResultFilterEditor'
 import ChartComponent from '../components/ChartComponent'
 import bus from '@/utils/bus'
 import DatasetChartDetail from '../../dataset/common/DatasetChartDetail'
-
 // shape attr,component style
 import {
+  DEFAULT_BACKGROUND_COLOR,
   DEFAULT_COLOR_CASE,
+  DEFAULT_LABEL,
+  DEFAULT_LEGEND_STYLE,
   DEFAULT_SIZE,
   DEFAULT_TITLE_STYLE,
-  DEFAULT_LEGEND_STYLE,
-  DEFAULT_LABEL,
   DEFAULT_TOOLTIP,
   DEFAULT_XAXIS_STYLE,
-  DEFAULT_YAXIS_STYLE,
-  DEFAULT_BACKGROUND_COLOR
+  DEFAULT_YAXIS_STYLE
 } from '../chart/chart'
 import ColorSelector from '../components/shape-attr/ColorSelector'
 import SizeSelector from '../components/shape-attr/SizeSelector'
@@ -646,6 +645,9 @@ export default {
           this.resetView()
           this.httpRequest.status = err.response.data.success
           this.httpRequest.msg = err.response.data.message
+          this.$nextTick(() => {
+            this.getChart(id)
+          })
           return true
         })
       } else {
@@ -666,9 +668,9 @@ export default {
           response.data.data = this.data
           this.chart = response.data
 
-          this.httpRequest.status = true
+          // this.httpRequest.status = true
         }).catch(err => {
-          this.resetView()
+          // this.resetView()
           this.httpRequest.status = err.response.data.success
           this.httpRequest.msg = err.response.data.message
           return true
diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue
index e14df6876c..f6ed8155d5 100644
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@@ -101,7 +101,7 @@
           @mousedown="handleMouseDown"
           @mouseup="deselectCurComponent"
         >
-          <Editor :out-style="outStyle" />
+          <Editor v-if="!previewVisible" :out-style="outStyle" />
         </div>
       </de-main-container>
       <de-aside-container v-if="aidedButtonActive" :class="aidedButtonActive ? 'show' : 'hidden'" class="style-aside">
@@ -135,14 +135,10 @@
       </div>
     </el-dialog>
 
-    <el-dialog
-      v-if="previewVisible"
-      :visible.sync="previewVisible"
-      :fullscreen="true"
-      custom-class="preview-dialog"
-    >
-      <PreviewFullScreen :fullscreen="previewVisible" />
-    </el-dialog>
+    <fullscreen style="height: 100%;background: none" :fullscreen.sync="previewVisible">
+      <Preview v-if="previewVisible" :show-type="canvasStyleData.selfAdaption?'full':'width'" />
+    </fullscreen>
+
   </el-row>
 </template>