From 2dc6c0414c0766d1300b647e4c2d4e5bf852f1a3 Mon Sep 17 00:00:00 2001
From: liuqimichale <123456lq>
Date: Fri, 15 Mar 2019 20:07:00 +0800
Subject: [PATCH] 设备信息

---
 src/components/VEquipment.vue | 35 +++++++++++++++--------------------
 src/style/reset.css           | 18 ++++++++++++++++++
 2 files changed, 33 insertions(+), 20 deletions(-)

diff --git a/src/components/VEquipment.vue b/src/components/VEquipment.vue
index c8c8c9c..189ce10 100644
--- a/src/components/VEquipment.vue
+++ b/src/components/VEquipment.vue
@@ -1,21 +1,21 @@
 <template>
     <div class="theme-wrap">
         <card-title> <span>设备监控消息</span></card-title>
-        <!--<div>{{equipment.PDA}}/{{equipment.PDATotal}}</div>-->
+
         <ul class="theme-body" style="padding: 10px 20px 20px 0;">
             <li class="equipment-section">
                 <div class="normal-status front">
-                    <div class="text-blue">{{equipment.pdaper}}%</div>
+                    <p class="text-blue">{{equipment.pdaper}}%</p>
                     <p>PDA在线率</p>
                 </div>
                 <div class="rotate-status back">
-                    <div class="text-blue">{{equipment.PDA}}/{{equipment.PDATotal}}</div>
+                    <p class="text-blue">{{equipment.PDA}}/{{equipment.PDATotal}}</p>
                     <p>PDA/PDA在线</p>
                 </div>
             </li>
-            <li class="equipment-section">
+            <li class="equipment-section" >
                 <div class="normal-status front">
-                    <div class="text-blue">{{equipment.berthper}}%</div>
+                    <p class="text-blue">{{equipment.berthper}}%</p>
                     <p>地磁在线率</p>
                 </div>
                 <div class="rotate-status back">
@@ -23,19 +23,19 @@
                     <p>地磁/地磁</p>
                 </div>
             </li>
-            <li class="equipment-section">
+            <li class="equipment-section" >
                 <div class="normal-status front">
-                    <div class="text-orange">23.4%</div>
+                    <p class="text-orange">{{equipment.daozhaper}}%</p>
                     <p>道闸在线率</p>
                 </div>
                 <div class="rotate-status back">
-                    <div class="text-orange">{{equipment.daozha}}/{{equipment.daozhaTotal}}</div>
+                    <p class="text-orange">{{equipment.daozha}}/{{equipment.daozhaTotal}}</p>
                     <p>道闸/道闸在线</p>
                 </div>
             </li>
-            <li class="equipment-section">
+            <li class="equipment-section" >
                 <div class="normal-status front">
-                    <p class="text-orange">23.4%</p>
+                    <p class="text-orange">{{equipment.ydpper}}%</p>
                     <p>诱导屏在线率</p>
                 </div>
                 <div class="rotate-status back">
@@ -101,7 +101,7 @@ export default {
         transform-style:preserve-3d;
         /*transition:1s;*/
         animation:myfirst  6s  linear  infinite;
-        >div{
+        div{
             width: 95%;
             height: 95%;
             position: absolute;
@@ -110,21 +110,16 @@ export default {
             padding: 15px 0 10px 0;
             text-align: center;
 
-            p,div{
+            p{
                 height: 50%;
                 display: flex;
                 align-items: center;
                 justify-content: center;
             }
-            .text-blue{
-                @include fontStyle(24px);
-                background-image: $fontBlue;
-            }
-            .text-orange{
-                @include fontStyle(24px);
-                background-image: $fontOrange;
-            }
+
+
         }
+
         .normal-status{
 
         }
diff --git a/src/style/reset.css b/src/style/reset.css
index b89956f..84df17e 100644
--- a/src/style/reset.css
+++ b/src/style/reset.css
@@ -216,4 +216,22 @@ table {
     text-overflow: ellipsis;
 }
 
+.text-blue{
+/*//@include fontStyle(24px);*/
+/*//background-image: $fontBlue;*/
+    font-size: 24px;
+    font-weight:bold;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(rgba(0,202,254, 1)), to(rgba(39,114,244, 1)));
+
+}
+.text-orange{
+    font-size: 24px;
+    font-weight:bold;
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(rgba(255,186,0, 1)), to(rgba(255,129,0, 1)));
+}
+
 
--
libgit2 0.21.4