# 更新样式

src/views/counter/components/screen.vue

@@ -23,7 +23,9 @@
         </tbody>
       </table>
     </div>
-    <div class="device-status"></div>
+    <div class="device-status">
+      
+    </div>
   </div>
 </template>
 
@@ -40,11 +42,11 @@ export default {
   },
   computed: {
     lastTime() {
-      return this.lastItem.calc_time.split('')
+      return this.lastItem.calc_time.substr(0, 16).split('')
     },
     lastCount() {
       const count = this.lastItem.mosq_count
-      const qty = 'Qty.' + ' '.repeat(13 - count.length) + '00' + count
+      const qty = 'Qty.' + ' '.repeat(10 - count.length) + '00' + count
       return qty.split('')
     }
   },
@@ -56,15 +58,16 @@ export default {
 
 <style lang="scss">
   .screen-wrapper {
+    background: #eee;
     overflow: auto;
     .device-base {
       display: flex;
       justify-content: center;
-      min-width: 650px;
+      min-width: 600px;
       ul {
         padding: 0;
         li {
-          font-size: 1.1rem;
+          font-size: .85rem;
           list-style-type: none;
           display: inline-block;
         }
@@ -77,6 +80,8 @@ export default {
       display: flex;
       justify-content: center;
       table {
+        font-size: 1.2rem;
+        font-family: 'Courier New', Courier, monospace;
         border: 1px solid #666;
         border-collapse: collapse;
         text-align: center;
@@ -91,5 +96,15 @@ export default {
         }
       }
     }
+    @media only screen and (max-width: 768px) {
+      .device-screen {
+        table {
+          margin: 1rem 0 1rem 0;
+          td {
+            font-size: 1rem;     
+          }
+        }
+      }
+    }
   }
 </style>