首页自适应屏调整

src/views/HomePage.vue

@@ -1,32 +1,34 @@
 <template>
   <div class="home container">
     <div class="part1">
-      <div class="super-title " style="margin-top:240px ;">青浦区“一张图”区级节点</div>
-      <div class="title-sub ">以二三维一体化引擎为核心，构建政务时空数据治理与应用服务生态，赋能城市精细化治理</div>
-      <div class="part1-1">
-        <div class="part1-1-1">
-          <div class="number-container">
-            <span class="text">调用总数</span>
-            <span v-for="(num, index) in totalCall" :key="index">
-              <span v-if="num.indexOf(',') > -1">
-                <span class="separator">,</span>
-              </span>
-              <span v-else>
-                <span class="number-item">{{ num }}</span>
+      <div>
+        <div class="super-title">青浦区“一张图”区级节点</div>
+        <div class="title-sub ">以二三维一体化引擎为核心，构建政务时空数据治理与应用服务生态，赋能城市精细化治理</div>
+        <div class="part1-1">
+          <div class="part1-1-1">
+            <div class="number-container">
+              <span class="text">调用总数</span>
+              <span v-for="(num, index) in totalCall" :key="index">
+                <span v-if="num.indexOf(',') > -1">
+                  <span class="separator">,</span>
+                </span>
+                <span v-else>
+                  <span class="number-item">{{ num }}</span>
+                </span>
               </span>
-            </span>
-            <span class="text">次</span>
+              <span class="text">次</span>
+            </div>
           </div>
-        </div>
-        <div class="part1-1-2">
-          <div class="call-count-container">
-            <div class="line"></div>
-            <div>
-              <span class="text1">昨日调用量</span>
-              <span class="count">{{ lastDayCall }}</span>
-              <span class="text2">次</span>
+          <div class="part1-1-2">
+            <div class="call-count-container">
+              <div class="line"></div>
+              <div>
+                <span class="text1">昨日调用量</span>
+                <span class="count">{{ lastDayCall }}</span>
+                <span class="text2">次</span>
+              </div>
+              <div class="line"></div>
             </div>
-            <div class="line"></div>
           </div>
         </div>
       </div>
@@ -444,7 +446,7 @@
       </div>
     </div>
   </div>
-  <div class="darkblue-background col" style="height: 1400px;">
+  <div class="darkblue-background col" style="height: auto;">
     <div class="super-title grey">
       <div>全链路运行监督</div>
       <div>据驱动优化决策</div>
@@ -1288,7 +1290,7 @@ export default {
 }
 
 .container {
-  width: 1920px;
+  width: 100%;
   margin: 0 auto;
 }
 
@@ -1298,9 +1300,13 @@ export default {
   .part1 {
     width: 100%;
     height: calc(100vh - 120px);
-    background: url(~@/assets/images/common/home-bg1.png) no-repeat center;
+    background: url(~@/assets/images/common/home-bg1.png);
+    background-size: 100% auto;
     position: relative;
     overflow: hidden;
+    display: grid;
+    justify-content: center;
+    align-items: center;
 
     .part1-1 {
       width: 100%;

src/views/skmh/index.vue

@@ -198,7 +198,7 @@
       <el-dialog
         v-model="centerDialogVisible"
         title="预览"
-        width="800"
+        width="80%"
         center
         :before-close="closeDialog"
       >