From 2ae96b796658f5507326c48e4b25bbbe80b38dfe Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期一, 30 一月 2023 17:03:59 +0800
Subject: [PATCH] 1.优化导航栏

---
 src/views/xtsy/index.vue |   36 +++++++++++++++++++++++++++---------
 1 files changed, 27 insertions(+), 9 deletions(-)

diff --git a/src/views/xtsy/index.vue b/src/views/xtsy/index.vue
index 684729f..d7b2071 100644
--- a/src/views/xtsy/index.vue
+++ b/src/views/xtsy/index.vue
@@ -1,6 +1,6 @@
 <template>
   <!--  <div>-->
-  <div class="body" style="  padding: 30px 10px 0 20px;background-color: #eee;" :style="{height:mainHeight+'px'}">
+  <div class="body" style="  padding: 30px 10px 0 20px;background-color: #eaecef;" :style="{height:mainHeight+'px'}">
     <div style="">
       <div class="title"><i class="el-icon-s-fold" style="margin-right: 5px" />瀹炴椂鏁版嵁</div>
       <div class="top">
@@ -11,12 +11,16 @@
             <div class="top_card_content_flex">
               <div class="content" style="width: 84%">
                 <div class="content_title1">浠婃棩鐧诲綍</div>
-                <div class="content_end1" :style="{color:`rgb(${barTopColor01[0]})`}">1/409</div>
+                <div class="content_end1" :style="{color:`rgb(${barTopColor01[0]})`}">1/
+                  <countTo :start-val="0" :end-val="999" :duration="3000" />
+                </div>
               </div>
               <div id="barTop01" class="barTop" style="width: 100%;" />
               <div class="content" style="width: 84%">
                 <div class="content_title1">鏄ㄦ棩鐧诲綍</div>
-                <div class="content_end1">0/409</div>
+                <div class="content_end1">0/
+                  <countTo :start-val="0" :end-val="999" :duration="3000" />
+                </div>
               </div>
               <div id="barTop02" class="barTop" />
             </div>
@@ -29,12 +33,16 @@
             <div class="top_card_content_flex">
               <div class="content" style="width: 84%">
                 <div class="content_title1">浠婃棩娲昏穬</div>
-                <div class="content_end1" :style="{color:`rgb(${barTopColor02[0]})`}">0/409</div>
+                <div class="content_end1" :style="{color:`rgb(${barTopColor02[0]})`}">0/
+                  <countTo :start-val="0" :end-val="999" :duration="3000" />
+                </div>
               </div>
               <div id="barTop03" class="barTop" />
               <div class="content" style="width: 84%">
                 <div class="content_title1">鏄ㄦ棩娲昏穬</div>
-                <div class="content_end1">0/409</div>
+                <div class="content_end1">0/
+                  <countTo :start-val="0" :end-val="999" :duration="3000" />
+                </div>
               </div>
               <div id="barTop04" class="barTop" />
             </div>
@@ -47,12 +55,16 @@
             <div class="top_card_content_flex">
               <div class="content" style="width: 84%">
                 <div class="content_title1">浠婃棩娲昏穬</div>
-                <div class="content_end1" :style="{color:`rgb(${barTopColor03[0]})`}">0/409</div>
+                <div class="content_end1" :style="{color:`rgb(${barTopColor03[0]})`}">0/
+                  <countTo :start-val="0" :end-val="999" :duration="3000" />
+                </div>
               </div>
               <div id="barTop05" class="barTop" />
               <div class="content" style="width: 84%">
                 <div class="content_title1">鏄ㄦ棩娲昏穬</div>
-                <div class="content_end1">0/409</div>
+                <div class="content_end1">0/
+                  <countTo :start-val="0" :end-val="999" :duration="3000" />
+                </div>
               </div>
               <div id="barTop06" class="barTop" />
             </div>
@@ -65,12 +77,16 @@
             <div class="top_card_content_flex">
               <div class="content" style="width: 84%">
                 <div class="content_title1">浠婃棩娲昏穬</div>
-                <div class="content_end1" :style="{color:`rgb(${barTopColor04[0]})`}">0/409</div>
+                <div class="content_end1" :style="{color:`rgb(${barTopColor04[0]})`}">0/
+                  <countTo :start-val="0" :end-val="999" :duration="3000" />
+                </div>
               </div>
               <div id="barTop07" class="barTop" />
               <div class="content" style="width: 84%">
                 <div class="content_title1">鏄ㄦ棩娲昏穬</div>
-                <div class="content_end1">0/409</div>
+                <div class="content_end1">0/
+                  <countTo :start-val="0" :end-val="999" :duration="3000" />
+                </div>
               </div>
               <div id="barTop08" class="barTop" />
             </div>
@@ -107,9 +123,11 @@
 
 <script>
 import { bar01, barTop, line01, loadEcharts } from '@/utils/myEcharts'
+import countTo from 'vue-count-to'
 
 export default {
   name: 'Index',
+  components: { countTo },
   data() {
     return {
       isIpad: false,

--
Gitblit v1.9.3