update layout

src/views/MainPanel.vue

@@ -13,9 +13,9 @@
     <RectContainer class="leftMiddle">
       <ChartContainer />
     </RectContainer>
-    <RectContainer class="leftBottom">
+    <!-- <RectContainer class="leftBottom">
       <ChartContainer />
-    </RectContainer>
+    </RectContainer> -->
 
     <RectContainer class="bottom-1">
       <TablesContainer />
@@ -32,7 +32,7 @@
     <RectContainer class="bottom-5">
       <ChartContainer />
     </RectContainer>
-    <RectContainer class="bottom-6">
+    <!-- <RectContainer class="bottom-6">
       <TablesContainer />
     </RectContainer>
     <RectContainer class="bottom-7">
@@ -40,17 +40,17 @@
     </RectContainer>
     <RectContainer class="bottom-8">
       <ChartContainer />
-    </RectContainer>
+    </RectContainer> -->
 
     <RectContainer class="rightTop">
       <ChartContainer />
     </RectContainer>
-    <RectContainer class="rightMiddle">
+    <!-- <RectContainer class="rightMiddle">
       <TablesContainer />
     </RectContainer>
     <RectContainer class="rightBottom">
       <ChartContainer />
-    </RectContainer>
+    </RectContainer> -->
 
     <MainArea style="grid-area: main" />
   </div>
@@ -77,18 +77,24 @@ export default {
 <style scoped lang="scss">
 .main-panel {
   //   background: #cccc;
-  padding: 0 0 24px;
+  padding: 70px 0 24px;
   position: relative;
   //   top: -28px; // 往上部偏移一点
   display: grid;
   gap: 32px;
   place-content: end center;
-  grid-auto-columns: 624px;
-  grid-auto-rows: 304px;
+  // grid-auto-columns: 624px;
+  // grid-auto-rows: 304px;
+  // grid-template-areas:
+  //   "leftTop    main      main      main        main       main       main      main        main        rightTop    "
+  //   "leftMiddle main      main      main        main       main       main      main        main        rightMiddle "
+  //   "leftBottom BottomOne BottomTwo BottomThree BottomFour BottomFive BottomSix BottomSeven BottomEight rightBottom ";
+  grid-auto-columns: 1282px;
+  grid-template-rows: 1fr 2fr 314px;
   grid-template-areas:
-    "leftTop    main      main      main        main       main       main      main        main        rightTop    "
-    "leftMiddle main      main      main        main       main       main      main        main        rightMiddle "
-    "leftBottom BottomOne BottomTwo BottomThree BottomFour BottomFive BottomSix BottomSeven BottomEight rightBottom ";
+    "leftTop    main      main      main        rightTop    "
+    "leftMiddle main      main      main        rightTop    "
+    "BottomOne BottomTwo BottomThree BottomFour BottomFive ";
 }
 
 .main-area {