提交

src/views/report/SilkRoadData/index.vue

@@ -1,8 +1,13 @@
 <template>
   <div class="SilkRoadData">
     <div class="topImg" v-if="width">
-        <van-image :width="width" :height="height" @load="load" :src="isOnlyDay" />
-        <span class="days">{{ times.join(" 到 ") }}</span>
+      <van-image
+        :width="width"
+        :height="height"
+        @load="load"
+        :src="isOnlyDay"
+      />
+      <span class="days">{{ times.join(' 到 ') }}</span>
     </div>
 
     <van-cell-group inset>
@@ -17,9 +22,7 @@
         <div class="label">
           <div class="label-left">
             <van-row>
-              <van-col span="8">
-                实发 / 应发(件)
-              </van-col>
+              <van-col span="8"> 实发 / 应发(件) </van-col>
               <van-col span="8">完成率</van-col>
               <van-col span="8">传播量(次)</van-col>
             </van-row>
@@ -103,11 +106,12 @@ export default {
       this.width = document.body.clientWidth;
       this.height = (this.width / 16) * 9;
       let times = (this.$route.params.time || '').split('+');
-      if(times.length > 1 && times[0] === times[1]) times = [times[0]];
+      if (times.length > 1 && times[0] === times[1]) times = [times[0]];
       this.times = times;
-      this.title = document.title + (this.times.length > 1 ? "累计报表" : "日报表");
+      this.title =
+        document.title + (this.times.length > 1 ? '累计报表' : '日报表');
       document.title = this.title;
-      console.log(window.matchMedia('(prefers-color-scheme: dark)'))
+      console.log(window.matchMedia('(prefers-color-scheme: dark)'));
       if (this.times.length > 1)
         this.isOnlyDay = require('@/assets/image/2023slcw.jpg');
       else this.isOnlyDay = require('@/assets/image/2023slcw-day.jpg');
@@ -146,7 +150,8 @@ export default {
   font-size: 16px;
   overflow-y: auto;
   background-color: #eee;
-  padding-bottom: .5em;
+  box-sizing: border-box;
+  padding-bottom: 0.5em;
 }
 
 .SilkRoadData .mainCell {
@@ -165,20 +170,21 @@ export default {
   color: #969799;
   white-space: nowrap;
 }
-.SilkRoadData .label-left{
-    display: inline-block;
-    width: calc(100% - 64px);
-    vertical-align: middle;
+.SilkRoadData .label-left {
+  display: inline-block;
+  width: calc(100% - 64px);
+  vertical-align: middle;
 }
 
-.SilkRoadData .topImg{
-    position: relative;
+.SilkRoadData .topImg {
+  position: relative;
+  width: 100%;
 }
-.SilkRoadData .days{
-    position: absolute;
-    left: 5%;
-    top: 72%;
-    color: #ffffff;
-    font-size: 14px;
+.SilkRoadData .days {
+  position: absolute;
+  left: 5%;
+  top: 72%;
+  color: #ffffff;
+  font-size: 14px;
 }
 </style>

src/views/report/SilkRoadDetail/index.vue

@@ -137,6 +137,7 @@ export default {
   font-size: 16px;
   overflow-y: auto;
   background-color: #eee;
+  box-sizing: border-box;
   padding-bottom: 0.5em;
 }
 
@@ -163,6 +164,7 @@ export default {
 
 .SilkRoadDetail .topImg {
   position: relative;
+  width: 100%;
 }
 .SilkRoadDetail .days {
   position: absolute;