From 9c483e86991e16e21e377b67330787f23295275a Mon Sep 17 00:00:00 2001
From: xianfuxing <xianfuxing@126.com>
Date: Wed, 22 Aug 2018 19:40:16 +0800
Subject: [PATCH] =?UTF-8?q?#=20=E6=9B=B4=E6=96=B0=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/counter/components/screen.vue | 25 ++++++++++++++++++++-----
 1 file changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/views/counter/components/screen.vue b/src/views/counter/components/screen.vue
index c01790c..de20d5f 100644
--- a/src/views/counter/components/screen.vue
+++ b/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>