cxw-010203

src/views/Index/dynamicNumber/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-09 14:25:05
- * @LastEditTime: 2021-12-02 15:53:52
+ * @LastEditTime: 2021-12-29 15:09:10
  * @LastEditors: Please set LastEditors
  * @Description: 大数据统计gif
  * @FilePath: /data-show/src/views/Index/dynamicNumber/index.vue
@@ -51,6 +51,11 @@
                 <countTo :startVal='form.total-100 >= 0 ? form.total-100 : 0' :endVal='form.total' :duration='3000'></countTo>
             </span>
         </div>
+        <div class="dn-footer">
+            <div class="df-d"><span class="s1">历史入库数据总量</span><span class="s2"><countTo :startVal='form.count_all-100 >= 0 ? form.count_all-100 : 0' :endVal='form.count_all' :duration='3000'></countTo></span></div>
+            <div class="df-d"><span class="s1">一年累计入库数据总量</span><span class="s2"><countTo :startVal='form.count_year-100 >= 0 ? form.count_year-100 : 0' :endVal='form.count_year' :duration='3000'></countTo></span></div>
+            <div class="df-d"><span class="s1">半年累计入库数据总量</span><span class="s2"><countTo :startVal='form.count_6month-100 >= 0 ? form.count_6month-100 : 0' :endVal='form.count_6month' :duration='3000'></countTo></span></div>
+        </div>
     </div>
 </template>
 
@@ -74,6 +79,9 @@ export default {
                 short: 0,
                 forum: 0,
                 wecat: 0,
+                count_all: 0,
+                count_6month: 0,
+                count_year: 0
             },
             begin: true,
             intval: null,
@@ -82,13 +90,13 @@ export default {
     created() {
         this.load = true;
         this.getData(1).then(() => {
-             this.load = false;
+            this.load = false;
             this.startDyfun(6000);
         });
     },
     beforeDestroy() {
-        if(this.intval) {
+        if (this.intval) {
-            clearTimeout(this.intval)
+            clearTimeout(this.intval);
             this.intval = null;
         }
     },
@@ -97,31 +105,36 @@ export default {
         getData(n) {
             return new Promise((resolve, reject) => {
                 let obj = Object.assign({}, this.getCommTime, { iStatus: n });
-                getHomeCount0528(obj).then((res) => {
+                getHomeCount0528(obj)
-                    let data = res.data;
+                    .then((res) => {
-                    this.form.total = data.count;
+                        let data = res.data;
-                    let sourcetypeCount = data.sourcetypeCount;
+                        this.form.total = data.count;
-                    if (Array.isArray(sourcetypeCount)) {
+                        this.form.count_year = data.count_year;
-                        sourcetypeCount.forEach((ele) => {
+                        this.form.count_6month = data.count_6month;
-                            if (ele.key == "新闻") {
+                        this.form.count_all = data.count_all;
-                                this.form.news = ele.value;
+                        let sourcetypeCount = data.sourcetypeCount;
-                            } else if (ele.key == "APP") {
+                        if (Array.isArray(sourcetypeCount)) {
-                                this.form.app = ele.value;
+                            sourcetypeCount.forEach((ele) => {
-                            } else if (ele.key == "论坛") {
+                                if (ele.key == "新闻") {
-                                this.form.forum = ele.value;
+                                    this.form.news = ele.value;
-                            } else if (ele.key == "微信") {
+                                } else if (ele.key == "APP") {
-                                this.form.wecat = ele.value;
+                                    this.form.app = ele.value;
-                            } else if (ele.key == "微博") {
+                                } else if (ele.key == "论坛") {
-                                this.form.weipo = ele.value;
+                                    this.form.forum = ele.value;
-                            } else {
+                                } else if (ele.key == "微信") {
-                                this.form.other = ele.value;
+                                    this.form.wecat = ele.value;
-                            }
+                                } else if (ele.key == "微博") {
-                        });
+                                    this.form.weipo = ele.value;
-                    }
+                                } else {
-                    resolve(res)
+                                    this.form.other = ele.value;
-                }).catch(() => {
+                                }
-                    reject(false)
+                            });
-                });
+                        }
+                        resolve(res);
+                    })
+                    .catch(() => {
+                        reject(false);
+                    });
             });
         },
         // // 点击中间的全网数据显示
@@ -145,8 +158,8 @@ export default {
             }, time);
         },
         handlerClick(n) {
-             this.$emit("allData", n);
+            this.$emit("allData", n);
-        }
+        },
     },
 };
 </script>
@@ -266,4 +279,45 @@ export default {
     top: 72% !important;
     left: 29% !important;
 }
+.dn-footer {
+    position: absolute;
+    width: 100%;
+    height: 40px;
+    left: 0px;
+    bottom: 0px;
+    border: 1px solid;
+    background: linear-gradient(
+        90deg,
+        rgba(1, 79, 184, 0) 0%,
+        #002455 51%,
+        rgba(1, 79, 184, 0) 100%
+    );
+    border-image: linear-gradient(
+            90deg,
+            rgba(26, 145, 255, 0),
+            rgba(60, 161, 255, 1),
+            rgba(26, 145, 255, 0)
+        )
+        1 1;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0px 13px;
+    .df-d {
+        span {
+            display: inline-block;
+        }
+        .s1 {
+            font-size: 16px;
+            color: #b1b9c0;
+            font-weight: 500;
+        }
+        .s2 {
+            font-size: 15px;
+            font-family: Bebas;
+            color: #63aecc;
+            margin-left: 16px;
+        }
+    }
+}
 </style>