From c4b9d8c8bc26f05ecc184eb0c36fa2390f820b5d Mon Sep 17 00:00:00 2001
From: "lily.zhang" <daylily.zhang@akuhome.com>
Date: Thu, 21 Oct 2021 13:44:45 +0800
Subject: [PATCH] cxw-010203

---
 src/api/comm/index.js                         |  29 ++
 src/api/home/index.js                         |  88 +++++
 src/components/index.js                       |   2 +-
 src/components/v-loading/index.css            | 347 ++++++++++++++++++
 src/components/v-loading/index.js             |  71 ++++
 src/components/v-pagination/index.vue         |  84 ++++-
 src/lycomponents/iHeader/index.vue            |  58 +--
 src/main.js                                   |   2 +-
 src/mixins/index.js                           |   6 +-
 src/request/index.js                          |   5 +-
 src/store/actions.js                          |   5 +-
 src/store/getters.js                          |   5 +-
 src/store/mutations.js                        |   8 +-
 src/store/state.js                            |  10 +-
 src/utils/gol/bubbleWord.js                   | 130 +++++++
 src/views/Index/dynamicNumber/index.vue       |  61 ++-
 src/views/Index/hotDiscussionGraph/index.vue  |  87 +++--
 src/views/Index/hotDiscussionGraph/opt.js     | 215 -----------
 .../Index/keyCommunicationPositions/index.vue |  81 ++--
 src/views/Index/realTimeEvent/index.vue       |  86 +++--
 src/views/Index/salesRank/index.vue           | 100 ++---
 src/views/Index/tailInsight/index.vue         |  46 ++-
 src/views/Index/tailInsight/opt.js            |  18 +-
 23 files changed, 1132 insertions(+), 412 deletions(-)
 create mode 100644 src/api/comm/index.js
 create mode 100644 src/api/home/index.js
 create mode 100644 src/components/v-loading/index.css
 create mode 100644 src/components/v-loading/index.js
 create mode 100644 src/utils/gol/bubbleWord.js
 delete mode 100644 src/views/Index/hotDiscussionGraph/opt.js

diff --git a/src/api/comm/index.js b/src/api/comm/index.js
new file mode 100644
index 0000000..3b10fa3
--- /dev/null
+++ b/src/api/comm/index.js
@@ -0,0 +1,29 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-20 16:36:08
+ * @LastEditTime: 2021-10-20 16:55:28
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/api/comm/index.js
+ */
+import httpService from "@/request"
+
+// 获取顶部选择项
+export function getOneTime(params) {
+    let obj =  Object.assign({action: 'getTime', sType: 0}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
+
+// 获取顶部选择项
+export function getTwoTime(params) {
+    let obj =  Object.assign({action: 'getTime',sType: 1}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
diff --git a/src/api/home/index.js b/src/api/home/index.js
new file mode 100644
index 0000000..bb7a2fe
--- /dev/null
+++ b/src/api/home/index.js
@@ -0,0 +1,88 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-20 16:17:39
+ * @LastEditTime: 2021-10-21 12:04:50
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/api/home/index.js
+ */
+import httpService from "@/request"
+
+// 首页_实时事件
+export function getEventsListH(params) {
+    let obj =  Object.assign({action: 'getEventsListH',sQuDao: '新车上市', sType: 'Home', iTimeType: 0}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
+
+// 首页_传播重点阵地
+export function getWebsiteHome0528(params) {
+    let obj =  Object.assign({action: 'getWebsiteHome0528',sType: 'Home'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
+
+// 首页_全网传播数量
+export function getHomeCount0528(params) {
+    let obj =  Object.assign({action: 'getHomeCount0528',sType: 'Home'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
+
+// 首页_热销排行
+export function getCheZhuBrandCount0528(params) {
+    let obj =  Object.assign({action: 'getCheZhuBrandCount0528',sType: 'Home'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
+
+// 首页_热门词云
+export function getHotWordHome(params) {
+    let obj =  Object.assign({action: 'getHotWordHome',sType: 'Home'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
+
+// 首页_正面词云
+export function getPositive0528(params) {
+    let obj =  Object.assign({action: 'getPositive0528',sType: 'Home'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
+
+// 首页_负面词云
+export function getNegative0528(params) {
+    let obj =  Object.assign({action: 'getNegative0528',sType: 'Home'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
+// 首页_尾翼洞察
+export function getWeiYiCountHome0528(params) {
+    let obj =  Object.assign({action: 'getWeiYiCountHome0528',sType: 'Home'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'get',
+        params: obj
+    })
+}
\ No newline at end of file
diff --git a/src/components/index.js b/src/components/index.js
index 5de88e0..08c9540 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-12 10:28:00
- * @LastEditTime: 2021-10-14 13:20:45
+ * @LastEditTime: 2021-10-21 13:21:05
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/components/index.js
diff --git a/src/components/v-loading/index.css b/src/components/v-loading/index.css
new file mode 100644
index 0000000..6862204
--- /dev/null
+++ b/src/components/v-loading/index.css
@@ -0,0 +1,347 @@
+.zh-load-mark {
+    position: fixed;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 9999;
+}
+.zh-load-box {
+    position: fixed;
+    z-index: 3;
+    width: 7.6em;
+    min-height: 7.6em;
+    top: 180px;
+    left: 50%;
+    margin-left: -3.8em;
+    background: rgba(0, 0, 0, 0.7);
+    text-align: center;
+    border-radius: 5px;
+    color: #FFFFFF;
+}
+.zh-load-content {
+    margin-top: 64%;
+    font-size: 14px;
+}
+.zh-loading {
+    position: absolute;
+    width: 0px;
+    left: 50%;
+    top: 38%;
+}
+.loading_leaf {
+    position: absolute;
+    top: -1px;
+    opacity: 0.25;
+}
+.loading_leaf:before {
+    content: " ";
+    position: absolute;
+    width: 9.14px;
+    height: 3.08px;
+    background: #d1d1d5;
+    box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 1px;
+    border-radius: 1px;
+    -webkit-transform-origin: left 50% 0px;
+    transform-origin: left 50% 0px;
+}
+.loading_leaf_0 {
+    -webkit-animation: opacity-0 1.25s linear infinite;
+    animation: opacity-0 1.25s linear infinite;
+}
+.loading_leaf_0:before {
+    -webkit-transform: rotate(0deg) translate(7.92px, 0px);
+    transform: rotate(0deg) translate(7.92px, 0px);
+}
+.loading_leaf_1 {
+    -webkit-animation: opacity-1 1.25s linear infinite;
+    animation: opacity-1 1.25s linear infinite;
+}
+.loading_leaf_1:before {
+    -webkit-transform: rotate(30deg) translate(7.92px, 0px);
+    transform: rotate(30deg) translate(7.92px, 0px);
+}
+.loading_leaf_2 {
+    -webkit-animation: opacity-2 1.25s linear infinite;
+    animation: opacity-2 1.25s linear infinite;
+}
+.loading_leaf_2:before {
+    -webkit-transform: rotate(60deg) translate(7.92px, 0px);
+    transform: rotate(60deg) translate(7.92px, 0px);
+}
+.loading_leaf_3 {
+    -webkit-animation: opacity-3 1.25s linear infinite;
+    animation: opacity-3 1.25s linear infinite;
+}
+.loading_leaf_3:before {
+    -webkit-transform: rotate(90deg) translate(7.92px, 0px);
+    transform: rotate(90deg) translate(7.92px, 0px);
+}
+.loading_leaf_4 {
+    -webkit-animation: opacity-4 1.25s linear infinite;
+    animation: opacity-4 1.25s linear infinite;
+}
+.loading_leaf_4:before {
+    -webkit-transform: rotate(120deg) translate(7.92px, 0px);
+    transform: rotate(120deg) translate(7.92px, 0px);
+}
+.loading_leaf_5 {
+    -webkit-animation: opacity-5 1.25s linear infinite;
+    animation: opacity-5 1.25s linear infinite;
+}
+.loading_leaf_5:before {
+    -webkit-transform: rotate(150deg) translate(7.92px, 0px);
+    transform: rotate(150deg) translate(7.92px, 0px);
+}
+.loading_leaf_6 {
+    -webkit-animation: opacity-6 1.25s linear infinite;
+    animation: opacity-6 1.25s linear infinite;
+}
+.loading_leaf_6:before {
+    -webkit-transform: rotate(180deg) translate(7.92px, 0px);
+    transform: rotate(180deg) translate(7.92px, 0px);
+}
+.loading_leaf_7 {
+    -webkit-animation: opacity-7 1.25s linear infinite;
+    animation: opacity-7 1.25s linear infinite;
+}
+.loading_leaf_7:before {
+    -webkit-transform: rotate(210deg) translate(7.92px, 0px);
+    transform: rotate(210deg) translate(7.92px, 0px);
+}
+.loading_leaf_8 {
+    -webkit-animation: opacity-8 1.25s linear infinite;
+    animation: opacity-8 1.25s linear infinite;
+}
+.loading_leaf_8:before {
+    -webkit-transform: rotate(240deg) translate(7.92px, 0px);
+    transform: rotate(240deg) translate(7.92px, 0px);
+}
+.loading_leaf_9 {
+    -webkit-animation: opacity-9 1.25s linear infinite;
+    animation: opacity-9 1.25s linear infinite;
+}
+.loading_leaf_9:before {
+    -webkit-transform: rotate(270deg) translate(7.92px, 0px);
+    transform: rotate(270deg) translate(7.92px, 0px);
+}
+.loading_leaf_10 {
+    -webkit-animation: opacity-10 1.25s linear infinite;
+    animation: opacity-10 1.25s linear infinite;
+}
+.loading_leaf_10:before {
+    -webkit-transform: rotate(300deg) translate(7.92px, 0px);
+    transform: rotate(300deg) translate(7.92px, 0px);
+}
+.loading_leaf_11 {
+    -webkit-animation: opacity-11 1.25s linear infinite;
+    animation: opacity-11 1.25s linear infinite;
+}
+.loading_leaf_11:before {
+    -webkit-transform: rotate(330deg) translate(7.92px, 0px);
+    transform: rotate(330deg) translate(7.92px, 0px);
+}
+@-webkit-keyframes opacity-0 {
+    0% {
+        opacity: 0.25;
+    }
+    0.01% {
+        opacity: 0.25;
+    }
+    0.02% {
+        opacity: 1;
+    }
+    60.01% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.25;
+    }
+}
+@-webkit-keyframes opacity-1 {
+    0% {
+        opacity: 0.25;
+    }
+    8.34333% {
+        opacity: 0.25;
+    }
+    8.35333% {
+        opacity: 1;
+    }
+    68.3433% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.25;
+    }
+}
+@-webkit-keyframes opacity-2 {
+    0% {
+        opacity: 0.25;
+    }
+    16.6767% {
+        opacity: 0.25;
+    }
+    16.6867% {
+        opacity: 1;
+    }
+    76.6767% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.25;
+    }
+}
+@-webkit-keyframes opacity-3 {
+    0% {
+        opacity: 0.25;
+    }
+    25.01% {
+        opacity: 0.25;
+    }
+    25.02% {
+        opacity: 1;
+    }
+    85.01% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.25;
+    }
+}
+@-webkit-keyframes opacity-4 {
+    0% {
+        opacity: 0.25;
+    }
+    33.3433% {
+        opacity: 0.25;
+    }
+    33.3533% {
+        opacity: 1;
+    }
+    93.3433% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.25;
+    }
+}
+@-webkit-keyframes opacity-5 {
+    0% {
+        opacity: 0.270958333333333;
+    }
+    41.6767% {
+        opacity: 0.25;
+    }
+    41.6867% {
+        opacity: 1;
+    }
+    1.67667% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.270958333333333;
+    }
+}
+@-webkit-keyframes opacity-6 {
+    0% {
+        opacity: 0.375125;
+    }
+    50.01% {
+        opacity: 0.25;
+    }
+    50.02% {
+        opacity: 1;
+    }
+    10.01% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.375125;
+    }
+}
+@-webkit-keyframes opacity-7 {
+    0% {
+        opacity: 0.479291666666667;
+    }
+    58.3433% {
+        opacity: 0.25;
+    }
+    58.3533% {
+        opacity: 1;
+    }
+    18.3433% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.479291666666667;
+    }
+}
+@-webkit-keyframes opacity-8 {
+    0% {
+        opacity: 0.583458333333333;
+    }
+    66.6767% {
+        opacity: 0.25;
+    }
+    66.6867% {
+        opacity: 1;
+    }
+    26.6767% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.583458333333333;
+    }
+}
+@-webkit-keyframes opacity-9 {
+    0% {
+        opacity: 0.687625;
+    }
+    75.01% {
+        opacity: 0.25;
+    }
+    75.02% {
+        opacity: 1;
+    }
+    35.01% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.687625;
+    }
+}
+@-webkit-keyframes opacity-10 {
+    0% {
+        opacity: 0.791791666666667;
+    }
+    83.3433% {
+        opacity: 0.25;
+    }
+    83.3533% {
+        opacity: 1;
+    }
+    43.3433% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.791791666666667;
+    }
+}
+@-webkit-keyframes opacity-11 {
+    0% {
+        opacity: 0.895958333333333;
+    }
+    91.6767% {
+        opacity: 0.25;
+    }
+    91.6867% {
+        opacity: 1;
+    }
+    51.6767% {
+        opacity: 0.25;
+    }
+    100% {
+        opacity: 0.895958333333333;
+    }
+}
\ No newline at end of file
diff --git a/src/components/v-loading/index.js b/src/components/v-loading/index.js
new file mode 100644
index 0000000..cee68d6
--- /dev/null
+++ b/src/components/v-loading/index.js
@@ -0,0 +1,71 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-21 13:16:41
+ * @LastEditTime: 2021-10-21 13:16:43
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/components/v-loading/index.js
+ */
+ /*
+    自定义 loading 组件
+    调用
+    this.$loading('正在加载中...');
+    this.$loading.close();
+*/ 
+let _LOADING = {
+    show: false,     // Boolean loading显示状态
+    component: null  // Object loading组件
+ };    
+export default {
+install(Vue) {
+    /*
+        text: String
+        type: String
+    */
+    Vue.prototype.$loading = function(text='正在加载中...', type) {
+        if (type == 'close') {
+            _LOADING.component.show = _LOADING.show = false;
+        } else {
+            if (_LOADING.show) {
+                return;
+            }
+            let LoadingCompoent = Vue.extend({
+                data: function() {
+                    return {
+                        show: _LOADING.show
+                    }
+                },
+                template: `<div v-show="show" class="zh-load-mark">
+                                <div class="zh-load-box">
+                                    <div class="zh-loading">
+                                        <div class="loading_leaf loading_leaf_0"></div>
+                                        <div class="loading_leaf loading_leaf_1"></div>
+                                        <div class="loading_leaf loading_leaf_2"></div>
+                                        <div class="loading_leaf loading_leaf_3"></div>
+                                        <div class="loading_leaf loading_leaf_4"></div>
+                                        <div class="loading_leaf loading_leaf_5"></div>
+                                        <div class="loading_leaf loading_leaf_6"></div>
+                                        <div class="loading_leaf loading_leaf_7"></div>
+                                        <div class="loading_leaf loading_leaf_8"></div>
+                                        <div class="loading_leaf loading_leaf_9"></div>
+                                        <div class="loading_leaf loading_leaf_10"></div>
+                                        <div class="loading_leaf loading_leaf_11"></div>
+                                    </div>
+                                    <div class="zh-load-content">${text}</div>
+                                </div>
+                            </div>`
+            });
+            _LOADING.component = new LoadingCompoent();
+            let element = _LOADING.component.$mount().$el;
+            document.body.appendChild(element);
+            _LOADING.component.show = _LOADING.show = true;
+        }
+    };
+    // 打开/关闭
+    ['open', 'close'].forEach(function(type) {
+        Vue.prototype.$loading[type] = function(text) {
+            return Vue.prototype.$loading(text, type);
+        }
+    });
+}
+}
\ No newline at end of file
diff --git a/src/components/v-pagination/index.vue b/src/components/v-pagination/index.vue
index 5820ac7..7b1dfec 100644
--- a/src/components/v-pagination/index.vue
+++ b/src/components/v-pagination/index.vue
@@ -1,23 +1,92 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-09 16:08:39
- * @LastEditTime: 2021-10-09 16:44:16
+ * @LastEditTime: 2021-10-21 12:47:48
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/components/v-pagination/index.vue
 -->
 <template>
-    <div class="v-p-outter">
-        <span class="iconfont icon-shang1 s1"></span>
-        <span class="s2">1/3</span>
-        <span class="iconfont icon-xia1 s3"></span>
+    <div class="v-p-outter" v-if="pages">
+        <span class="iconfont icon-shang1 s1" @click="handlerPre"></span>
+        <span class="s2">{{page}}/{{pages}}</span>
+        <span class="iconfont icon-xia1 s3" @click="handlerNext"></span>
     </div>
 </template>
 
 <script>
 export default {
-    name: "v-pagination"
-}
+    name: "v-pagination",
+    props: {
+        data: {
+            type: Array,
+            default: () => [],
+        },
+        sizes: {
+            type: Number,
+            default: 5,
+        },
+    },
+    computed: {
+        pageObj() {
+            return {
+                data: this.data,
+                sizes: this.sizes,
+            };
+        },
+    },
+    watch: {
+        pageObj: {
+            handler() {
+                this.comitPages();
+            },
+            immediate: true,
+        },
+    },
+    data() {
+        return {
+            page: 1,
+            pages: 1,
+            cdata: [],
+        };
+    },
+    created() {
+        this.comitPages();
+    },
+    methods: {
+        // 初始化数据
+        comitPages() {
+            this.pages = Math.floor(this.data.length / this.sizes);
+            if (this.pages) {
+                this.doDatas();
+            }
+        },
+        // 数组截取
+        doDatas() {
+            this.cdata = this.data.slice(
+                (this.page - 1) * this.sizes,
+                this.page * this.sizes
+            );
+            this.$emit("change", this.cdata);
+        },
+        // 上一页
+        handlerPre() {
+            if (this.page <= 1) {
+                return;
+            }
+            this.page--;
+            this.doDatas();
+        },
+        // 下一页
+        handlerNext() {
+            if (this.page >= this.pages) {
+                return;
+            }
+            this.page++;
+            this.doDatas();
+        },
+    },
+};
 </script>
 
 <style lang="less" scoped>
@@ -50,5 +119,4 @@ export default {
         }
     }
 }
-
 </style>
diff --git a/src/lycomponents/iHeader/index.vue b/src/lycomponents/iHeader/index.vue
index d966e93..f44484a 100644
--- a/src/lycomponents/iHeader/index.vue
+++ b/src/lycomponents/iHeader/index.vue
@@ -24,12 +24,12 @@
             </a-dropdown>
             <span class="iH-left-s1">菜单</span>
 
-            <a-select :default-value="1" :size="$vuiSize" style="width: 120px; margin-left: 40px; margin-right: 8px" v-model="selVal" @change="handleChange">
+            <a-select :default-value="1" :size="$vuiSize" style="width: 120px; margin-left: 40px; margin-right: 8px" v-model="sTimeType" @change="handleChange">
                 <a-select-option :style="{ color: '#fff' }" v-for="item in selDatas" :value="item.key" :key="item.key">
-                    {{ item.label }}
+                    {{ item.value }}
                 </a-select-option>
             </a-select>
-            <a-range-picker :size="$vuiSize" valueFormat="YYYY-MM-DD" v-if="selVal === 4">
+            <a-range-picker :size="$vuiSize" valueFormat="YYYY-MM-DD" v-if="sTimeType === selVal" @change="handlerChangeTime">
                 <a-icon slot="suffixIcon" type="calendar" />
             </a-range-picker>
         </div>
@@ -60,35 +60,25 @@
 </template>
 
 <script>
+import {getTwoTime} from "@/api/comm"
 export default {
     name: "iHeader",
     data() {
         return {
-            selVal: 1,
+            sTimeType: 1,
+            selVal: '',
             clock: "",
             sClock: "",
             week: "",
             intDt: null,
             selDatas: [
-                {
-                    key: 1,
-                    label: "24小时",
-                },
-                {
-                    key: 2,
-                    label: "最近7天",
-                },
-                {
-                    key: 3,
-                    label: "最近30天",
-                },
-                {
-                    key: 4,
-                    label: "自定义",
-                },
+               
             ],
         };
     },
+    created() {
+        this.getTime(this.getCommTime)
+    },
     mounted() {
         this.intDt = self.setInterval(() => {
             this.getDatetime();
@@ -101,7 +91,11 @@ export default {
     },
     methods: {
         handleChange(val) {
-            console.log(val);
+           this.setCommTime({sTimeType: val});
+           if(this.sTimeType != this.selVal) {
+               this.setCommTime({sStartTime: "",sEndTime: ""});
+               console.log(this.getCommTime)
+           }
         },
         // 获取当前日期时间
         getDatetime() {
@@ -144,10 +138,28 @@ export default {
         handlerMyself() {
             this.$router.push("/myself");
         },
-        // 
+        // 菜单
         handlerType(obj) {
-          console.log(obj.key)
           this.$router.push({path: `/${obj.key}`})
+        },
+        // 获取时间的选项
+        getTime(commTime) {
+            let obj = {sType: commTime.sType}
+            getTwoTime(obj).then(res => {
+                this.selDatas = res.data;
+                this.sTimeType = this.selDatas[0].key;
+                this.selVal = this.selDatas[this.selDatas.length - 1].key;
+                this.setCommTime({sTimeType: this.sTimeType})
+            })
+        },
+        // 自定时间的时候
+        handlerChangeTime(val) {
+            let obj = {
+                sStartTime: val[0],
+                sEndTime: val[1]
+            }
+            this.setCommTime(obj);
+            console.log(this.getCommTime)
         }
     },
 };
diff --git a/src/main.js b/src/main.js
index 4685525..4d1a186 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-08 08:41:57
- * @LastEditTime: 2021-10-16 09:50:21
+ * @LastEditTime: 2021-10-21 13:24:18
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/main.js
diff --git a/src/mixins/index.js b/src/mixins/index.js
index 7cb7224..8baf8b1 100644
--- a/src/mixins/index.js
+++ b/src/mixins/index.js
@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-12 13:56:13
- * @LastEditTime: 2021-10-20 16:00:57
+ * @LastEditTime: 2021-10-20 16:54:05
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/mixins/index.js
@@ -12,10 +12,10 @@ export default {
     install(Vue) {
         Vue.mixin({
             computed: {
-                ...mapGetters(['getZoom','getToken', 'getUser', 'getAccount'])
+                ...mapGetters(['getZoom','getToken', 'getUser', 'getAccount', 'getCommTime'])
             },
             methods: {
-                ...mapActions(["setZoom", 'setToken', 'setUser', 'setAccount'])
+                ...mapActions(["setZoom", 'setToken', 'setUser', 'setAccount', 'setCommTime'])
             }
         })
     }
diff --git a/src/request/index.js b/src/request/index.js
index 984dde0..ca7aac7 100644
--- a/src/request/index.js
+++ b/src/request/index.js
@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-13 09:28:02
- * @LastEditTime: 2021-10-20 15:19:35
+ * @LastEditTime: 2021-10-20 19:00:46
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/request/index.js
@@ -12,7 +12,7 @@ import router from "@/permission"
 function filterRequestData(obj) {
     let o = {};
     for(let key in obj) {
-        let b1 = obj[key] == 0;
+        let b1 = obj[key] === 0;
         let b2 = obj[key] === false;
         if(obj[key] || b1 || b2) {
             o[key] = obj[key]
@@ -32,6 +32,7 @@ httpService.interceptors.request.use(config => {
     // if(localStorage.getItem('token')){//判断浏览器中的cookie中是否存在项目的token
     //     config.headers.token = localStorage.getItem('token')
     // }
+    
     const rqData = filterRequestData(config.data);
     const rqParams = filterRequestData(config.params);
     // post 'Content-Type' === 'application/x-www-form-urlencoded'
diff --git a/src/store/actions.js b/src/store/actions.js
index 6bbb165..e309314 100644
--- a/src/store/actions.js
+++ b/src/store/actions.js
@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-12 13:36:49
- * @LastEditTime: 2021-10-20 15:57:58
+ * @LastEditTime: 2021-10-20 16:50:37
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/store/actions.js
@@ -18,6 +18,9 @@ const actions = {
     },
     setAccount: ({commit}, log) => {
         commit('setAccount', log)
+    },
+    setCommTime: ({commit}, log) => {
+        commit('setCommTime', log)
     }
 }
 export default actions
diff --git a/src/store/getters.js b/src/store/getters.js
index 9216c3e..60cabcf 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-12 13:37:06
- * @LastEditTime: 2021-10-20 15:59:37
+ * @LastEditTime: 2021-10-20 16:52:59
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/store/getters.js
@@ -18,6 +18,9 @@ const getters = {
     },
     getAccount(state) {
         return state.account
+    },
+    getCommTime(state) {
+        return state.commTime
     }
 }
 export default getters
diff --git a/src/store/mutations.js b/src/store/mutations.js
index a5e9e79..a24c37c 100644
--- a/src/store/mutations.js
+++ b/src/store/mutations.js
@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-12 13:37:35
- * @LastEditTime: 2021-10-20 16:11:54
+ * @LastEditTime: 2021-10-20 16:59:00
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/store/mutations.js
@@ -23,6 +23,12 @@ const mutations = {
         state.account = log;
         let str = JSON.stringify(log);
         localStorage.setItem('account', str);
+    },
+    setCommTime: (state, log) => {
+        let obj = Object.assign(state.commTime, log)
+        state.commTime = obj;
+        let str = JSON.stringify(obj);
+        sessionStorage.setItem('commTime', str);
     }
 }
 
diff --git a/src/store/state.js b/src/store/state.js
index 279a33c..9115723 100644
--- a/src/store/state.js
+++ b/src/store/state.js
@@ -1,15 +1,21 @@
 /*
  * @Author: your name
  * @Date: 2021-10-12 13:37:50
- * @LastEditTime: 2021-10-20 16:11:46
+ * @LastEditTime: 2021-10-20 17:23:01
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/store/state.js
  */
+let commTime = {
+    sStartTime: "",
+    sEndTime: "",
+    sTimeType: 20
+}
 const state = {
     $zoom: 1,
     token: sessionStorage.getItem('token') || "",
     user: JSON.parse(sessionStorage.getItem('user')) || {},
-    account: JSON.parse(localStorage.getItem('account')) || {}
+    account: JSON.parse(localStorage.getItem('account')) || {},
+    commTime: JSON.parse(sessionStorage.getItem('commTime')) || commTime
 }
 export default state;
diff --git a/src/utils/gol/bubbleWord.js b/src/utils/gol/bubbleWord.js
new file mode 100644
index 0000000..e2f2d5b
--- /dev/null
+++ b/src/utils/gol/bubbleWord.js
@@ -0,0 +1,130 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-21 11:36:36
+ * @LastEditTime: 2021-10-21 11:43:38
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/utils/gol/bubbleWord.js
+ */
+ // 将后台数据转成数组
+function doWordCloud(data) {
+    let arr1 = [];
+    for (let key in data) {
+        let obj = { name: key, value: data[key] };
+        arr1.push(obj);
+    }
+    return arr1;
+}
+// 创建词云的对象
+function bubbleChart(data = [], format = []) {
+    let [maxValue, temp] = [0, []];
+    data.forEach((item) => {
+        temp.push(item[format[1]]);
+    });
+    maxValue = Math.max.apply(null, temp);
+    // 气泡颜色数组
+    let color = [
+        "#FFB600",
+        "#886CFF",
+        "#0084FF",
+        "#4CB690",
+        "#58B458",
+        "#6C6C6C",
+        "#F56161",
+        "#FC754C",
+        "#5F5EEC",
+    ];
+    // 气泡颜色备份
+    let bakeColor = [...color];
+    // 气泡数据
+    let bubbleData = [];
+    // 气泡基础大小
+    let basicSize = 70;
+    // 节点之间的斥力因子,值越大,气泡间距越大
+    let repulsion = 380;
+    // 根据气泡数量配置基础大小和斥力因子（以实际情况进行适当调整，使气泡合理分布）
+    if (data.length >= 5 && data.length < 10) {
+        basicSize = 50;
+        repulsion = 230;
+    }
+    if (data.length >= 10 && data.length < 20) {
+        basicSize = 40;
+        repulsion = 150;
+    } else if (data.length >= 20) {
+        basicSize = 50;
+        repulsion = 65;
+    }
+    // 填充气泡数据数组bubbleData
+    for (let item of data) {
+        // 确保气泡数据条数少于或等于气泡颜色数组大小时，气泡颜色不重复
+        if (!bakeColor.length) bakeColor = [...color];
+        let colorSet = new Set(bakeColor);
+        let curIndex = Math.round(Math.random() * (colorSet.size - 1));
+        let curColor = bakeColor[curIndex];
+        colorSet.delete(curColor);
+        bakeColor = [...colorSet];
+        // 气泡大小设置
+        let size = (item[format[1]] * basicSize * 2) / maxValue;
+        if (size < basicSize) size = basicSize;
+
+        bubbleData.push({
+            name: item[format[0]],
+            value: item[format[1]],
+            symbolSize: size,
+            draggable: true,
+            itemStyle: {
+                normal: {
+                    color: curColor,
+                    opacity: 0.8,
+                    shadowBlur: 10,
+                    shadowOffsetX: 0,
+                    shadowOffsetY: 0,
+                    shadowColor: "rgba(0,0,0,0.3)",
+                },
+            },
+        });
+    }
+    return {
+        bubbleData,
+        repulsion,
+    };
+}
+
+// 创建词云图
+export default function createWordCloud(obj) {
+    let words = doWordCloud(obj);
+    let bubble = bubbleChart(words, ['name', 'value']);
+    return {
+        animationEasingUpdate: 'bounceIn',
+        tooltip: { 
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function(param) {
+                let data = param.data;
+                return `<span>${data.name}</span><br><span>${data.value}</span>`
+            }
+        },
+        series: [{
+            type: 'graph',
+            layout: 'force',
+            label: {
+                show:true,
+                color:"#FFF",
+                fontSize:12,
+               
+            },
+            force: {
+                repulsion: bubble.repulsion,
+                edgeLength: 10
+            },
+            // 是否开启鼠标缩放和平移漫游
+            roam: true,
+            data: bubble.bubbleData
+        }]
+    }
+}
\ No newline at end of file
diff --git a/src/views/Index/dynamicNumber/index.vue b/src/views/Index/dynamicNumber/index.vue
index c299804..c2d1b7c 100644
--- a/src/views/Index/dynamicNumber/index.vue
+++ b/src/views/Index/dynamicNumber/index.vue
@@ -1,7 +1,7 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-09 14:25:05
- * @LastEditTime: 2021-10-11 18:11:01
+ * @LastEditTime: 2021-10-20 18:16:19
  * @LastEditors: Please set LastEditors
  * @Description: 大数据统计gif
  * @FilePath: /data-show/src/views/Index/dynamicNumber/index.vue
@@ -11,43 +11,43 @@
         <div class="d1">
             <span class="s1">APP</span>
             <span class="s2">
-                 <countTo :startVal='0' :endVal='1320897' :duration='3000'></countTo>
+                 <countTo :startVal='0' :endVal='form.app' :duration='3000'></countTo>
             </span>
         </div>
         <div class="d1" :style="{top: '340px', left: '0px'}">
             <span class="s1">其他</span>
             <span class="s2">
-                <countTo :startVal='0' :endVal='822588' :duration='3000'></countTo>
+                <countTo :startVal='0' :endVal='form.other' :duration='3000'></countTo>
             </span>
         </div>
         <div class="d1" :style="{top: '91px', left: '426px'}">
             <span class="s1">微信</span>
             <span class="s2">
-                <countTo :startVal='0' :endVal='658345' :duration='3000'></countTo>
+                <countTo :startVal='0' :endVal='form.wecat' :duration='3000'></countTo>
             </span>
         </div>
         <div class="d2" :style="{top: '240px', left: '656px'}">
             <span class="s1">
-                <countTo :startVal='0' :endVal='567894' :duration='3000'></countTo>
+                <countTo :startVal='0' :endVal='form.forum' :duration='3000'></countTo>
             </span>
             <span class="s2">论坛</span> 
         </div>
         <div class="d2" :style="{top: '340px', left: '656px'}">
             <span class="s1">
-                <countTo :startVal='0' :endVal='567894' :duration='3000'></countTo>
+                <countTo :startVal='0' :endVal='form.weipo' :duration='3000'></countTo>
             </span>
             <span class="s2">微博</span> 
         </div>
         <div class="d2" :style="{top: '490px', left: '246px'}">
             <span class="s1">
-                 <countTo :startVal='0' :endVal='567894' :duration='3000'></countTo>
+                 <countTo :startVal='0' :endVal='form.news' :duration='3000'></countTo>
             </span>
             <span class="s2">新闻</span> 
         </div>
         <div class="d3">
             <span class="s1">系统入库 数据总量</span>
             <span class="s2">
-                <countTo :startVal='0' :endVal='274073195' :duration='3000'></countTo>
+                <countTo :startVal='0' :endVal='form.total' :duration='3000'></countTo>
             </span>
         </div>
     </div>
@@ -55,10 +55,55 @@
 
 <script>
 import countTo from 'vue-count-to';
+import {getHomeCount0528} from "@/api/home"
 export default {
     name: "dynamic-number",
     components: {
         countTo
+    },
+    data() {
+        return {
+            form: {
+                total: 0,
+                app: 0,
+                news: 0,
+                weipo: 0,
+                other: 0,
+                short: 0,
+                forum: 0,
+                wecat: 0
+            }
+        }
+    },
+    created() {
+        this.getData()
+    },
+    methods: {
+        getData() {
+            getHomeCount0528(this.getCommTime).then(res => {
+                let data = res.data;
+                this.form.total = data.count;
+                let sourcetypeCount = data.sourcetypeCount;
+                if(Array.isArray(sourcetypeCount)) {
+                    sourcetypeCount.forEach(ele => {
+                        if(ele.key == '新闻') {
+                            this.form.news = ele.value;
+                        } else if(ele.key == 'APP') {
+                            this.form.app = ele.value;
+                        } else if(ele.key == '论坛') {
+                            this.form.forum = ele.value;
+                        } else if (ele.key == '微信') {
+                            this.form.wecat = ele.value;
+                        } else if(ele.key == '微博') {
+                            this.form.weipo = ele.value;
+                        } else {
+                            this.form.other = ele.value;
+                        }
+                    })
+                }
+               
+            })
+        }
     }
 }
 </script>
diff --git a/src/views/Index/hotDiscussionGraph/index.vue b/src/views/Index/hotDiscussionGraph/index.vue
index 759b990..dc5f436 100644
--- a/src/views/Index/hotDiscussionGraph/index.vue
+++ b/src/views/Index/hotDiscussionGraph/index.vue
@@ -1,45 +1,80 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-09 13:25:49
- * @LastEditTime: 2021-10-12 10:42:58
+ * @LastEditTime: 2021-10-21 11:45:00
  * @LastEditors: Please set LastEditors
  * @Description: 热议图谱
  * @FilePath: /data-show/src/views/Index/hotDiscussionGraph/index.vue
 -->
 <template>
-  <div class="hdg-ouuter">
-      <v-label-div title="热议图谱">
-            <v-tab-group :btns="['热门', '正面', '负面']"></v-tab-group>
-      </v-label-div>
-      <div class="hdg-bd">
-          <v-echarts :opt="opt"></v-echarts>
-      </div>
-  </div>
+    <div class="hdg-ouuter">
+        <v-label-div title="热议图谱">
+            <v-tab-group :btns="['热门', '正面', '负面']" @change="handlerChange"></v-tab-group>
+        </v-label-div>
+        <div class="hdg-bd">
+            <v-echarts :opt="opt"></v-echarts>
+        </div>
+    </div>
 </template>
 
 <script>
-import createOpt from "./opt"
+import createWordCloud from "@/utils/gol/bubbleWord";
+import { getHotWordHome, getPositive0528, getNegative0528 } from "@/api/home";
 export default {
-  name: "hot-discussion-graph",
-  data() {
-      return {
-          opt: createOpt()
-      }
-  }
+    name: "hot-discussion-graph",
+    data() {
+        return {
+            opt: {},
+            type: 0,
+        };
+    },
+    created() {
+        this.getData();
+    },
+    methods: {
+        handlerChange(n) {
+            this.type = n;
+            this.getData();
+        },
+        // 获取后台数据
+        getData() {
+            switch (this.type) {
+                case 0:
+                    getHotWordHome(this.getCommTime).then((res) => {
+                        let data = res.data;
+                        this.opt = createWordCloud(data);
+                    });
+                    break;
+                case 1:
+                    getPositive0528(this.getCommTime).then((res) => {
+                        let data = res.data;
+                        this.opt = createWordCloud(data);
+                    });
+                    break;
+                case 2:
+                    getNegative0528(this.getCommTime).then((res) => {
+                        let data = res.data;
+                        this.opt = createWordCloud(data);
+                    });
+                    break;
+                default:
+                    break;
+            }
+        },
+    },
 };
 </script>
 
 <style lang="less" scoped>
 .hdg-ouuter {
-  width: 460px;
-  height: 312px;
-  border: 2px solid #0f2a4d;
-  margin-top: 16px;
-  margin-left: 16px;
-  .hdg-bd {
-    width: 100%;
-    height: calc(100% - 48px); 
-  }
+    width: 460px;
+    height: 312px;
+    border: 2px solid #0f2a4d;
+    margin-top: 16px;
+    margin-left: 16px;
+    .hdg-bd {
+        width: 100%;
+        height: calc(100% - 48px);
+    }
 }
-
 </style>
\ No newline at end of file
diff --git a/src/views/Index/hotDiscussionGraph/opt.js b/src/views/Index/hotDiscussionGraph/opt.js
deleted file mode 100644
index 3b3bd71..0000000
--- a/src/views/Index/hotDiscussionGraph/opt.js
+++ /dev/null
@@ -1,215 +0,0 @@
-/*
- * @Author: your name
- * @Date: 2021-10-09 13:35:13
- * @LastEditTime: 2021-10-09 16:03:40
- * @LastEditors: Please set LastEditors
- * @Description: In User Settings Edit
- * @FilePath: /data-show/src/views/Index/hotDiscussionGraph/opt.js
- */
-// import * as echarts from "echarts";
-const dataBJ = [
-    [1, 55, 9, 56, 0.46, 18, 6, '良'],
-    [2, 25, 11, 21, 0.65, 34, 9, '优'],
-    [3, 56, 7, 63, 0.3, 14, 5, '良'],
-    [4, 33, 7, 29, 0.33, 16, 6, '优'],
-    [5, 42, 24, 44, 0.76, 40, 16, '优'],
-    [6, 82, 58, 90, 1.77, 68, 33, '良'],
-    [7, 74, 49, 77, 1.46, 48, 27, '良'],
-    [8, 78, 55, 80, 1.29, 59, 29, '良'],
-    [9, 267, 216, 280, 4.8, 108, 64, '重度污染'],
-    // [10, 185, 127, 216, 2.52, 61, 27, '中度污染'],
-    // [11, 39, 19, 38, 0.57, 31, 15, '优'],
-    // [12, 41, 11, 40, 0.43, 21, 7, '优'],
-    // [13, 64, 38, 74, 1.04, 46, 22, '良'],
-    // [14, 108, 79, 120, 1.7, 75, 41, '轻度污染'],
-    // [15, 108, 63, 116, 1.48, 44, 26, '轻度污染'],
-    // [16, 33, 6, 29, 0.34, 13, 5, '优'],
-    // [17, 94, 66, 110, 1.54, 62, 31, '良'],
-    // [18, 186, 142, 192, 3.88, 93, 79, '中度污染'],
-    // [19, 57, 31, 54, 0.96, 32, 14, '良'],
-    // [20, 22, 8, 17, 0.48, 23, 10, '优'],
-    // [21, 39, 15, 36, 0.61, 29, 13, '优'],
-    // [22, 94, 69, 114, 2.08, 73, 39, '良'],
-    // [23, 99, 73, 110, 2.43, 76, 48, '良'],
-    // [24, 31, 12, 30, 0.5, 32, 16, '优'],
-    // [25, 42, 27, 43, 1, 53, 22, '优'],
-    // [26, 154, 117, 157, 3.05, 92, 58, '中度污染'],
-    // [27, 234, 185, 230, 4.09, 123, 69, '重度污染'],
-    // [28, 160, 120, 186, 2.77, 91, 50, '中度污染'],
-    // [29, 134, 96, 165, 2.76, 83, 41, '轻度污染'],
-    // [30, 52, 24, 60, 1.03, 50, 21, '良'],
-    // [31, 46, 5, 49, 0.28, 10, 6, '优']
-  ];
-  const dataGZ = [
-    [1, 26, 37, 27, 1.163, 27, 13, '优'],
-    [2, 85, 62, 71, 1.195, 60, 8, '良'],
-    [3, 78, 38, 74, 1.363, 37, 7, '良'],
-    [4, 21, 21, 36, 0.634, 40, 9, '优'],
-    [5, 41, 42, 46, 0.915, 81, 13, '优'],
-    // [6, 56, 52, 69, 1.067, 92, 16, '良'],
-    // [7, 64, 30, 28, 0.924, 51, 2, '良'],
-    // [8, 55, 48, 74, 1.236, 75, 26, '良'],
-    // [9, 76, 85, 113, 1.237, 114, 27, '良'],
-    // [10, 91, 81, 104, 1.041, 56, 40, '良'],
-    // [11, 84, 39, 60, 0.964, 25, 11, '良'],
-    // [12, 64, 51, 101, 0.862, 58, 23, '良'],
-    // [13, 70, 69, 120, 1.198, 65, 36, '良'],
-    // [14, 77, 105, 178, 2.549, 64, 16, '良'],
-    // [15, 109, 68, 87, 0.996, 74, 29, '轻度污染'],
-    // [16, 73, 68, 97, 0.905, 51, 34, '良'],
-    // [17, 54, 27, 47, 0.592, 53, 12, '良'],
-    // [18, 51, 61, 97, 0.811, 65, 19, '良'],
-    // [19, 91, 71, 121, 1.374, 43, 18, '良'],
-    // [20, 73, 102, 182, 2.787, 44, 19, '良'],
-    // [21, 73, 50, 76, 0.717, 31, 20, '良'],
-    // [22, 84, 94, 140, 2.238, 68, 18, '良'],
-    // [23, 93, 77, 104, 1.165, 53, 7, '良'],
-    // [24, 99, 130, 227, 3.97, 55, 15, '良'],
-    // [25, 146, 84, 139, 1.094, 40, 17, '轻度污染'],
-    // [26, 113, 108, 137, 1.481, 48, 15, '轻度污染'],
-    // [27, 81, 48, 62, 1.619, 26, 3, '良'],
-    // [28, 56, 48, 68, 1.336, 37, 9, '良'],
-    // [29, 82, 92, 174, 3.29, 0, 13, '良'],
-    // [30, 106, 116, 188, 3.628, 101, 16, '轻度污染'],
-    // [31, 118, 50, 0, 1.383, 76, 11, '轻度污染']
-  ];
-  const dataSH = [
-    [1, 91, 45, 125, 0.82, 34, 23, '良'],
-    [2, 65, 27, 78, 0.86, 45, 29, '良'],
-    [3, 83, 60, 84, 1.09, 73, 27, '良'],
-    [4, 109, 81, 121, 1.28, 68, 51, '轻度污染'],
-    [5, 106, 77, 114, 1.07, 55, 51, '轻度污染'],
-    // [6, 109, 81, 121, 1.28, 68, 51, '轻度污染'],
-    // [7, 106, 77, 114, 1.07, 55, 51, '轻度污染'],
-    // [8, 89, 65, 78, 0.86, 51, 26, '良'],
-    // [9, 53, 33, 47, 0.64, 50, 17, '良'],
-    // [10, 80, 55, 80, 1.01, 75, 24, '良'],
-    // [11, 117, 81, 124, 1.03, 45, 24, '轻度污染'],
-    // [12, 99, 71, 142, 1.1, 62, 42, '良'],
-    // [13, 95, 69, 130, 1.28, 74, 50, '良'],
-    // [14, 116, 87, 131, 1.47, 84, 40, '轻度污染'],
-    // [15, 108, 80, 121, 1.3, 85, 37, '轻度污染'],
-    // [16, 134, 83, 167, 1.16, 57, 43, '轻度污染'],
-    // [17, 79, 43, 107, 1.05, 59, 37, '良'],
-    // [18, 71, 46, 89, 0.86, 64, 25, '良'],
-    // [19, 97, 71, 113, 1.17, 88, 31, '良'],
-    // [20, 84, 57, 91, 0.85, 55, 31, '良'],
-    // [21, 87, 63, 101, 0.9, 56, 41, '良'],
-    // [22, 104, 77, 119, 1.09, 73, 48, '轻度污染'],
-    // [23, 87, 62, 100, 1, 72, 28, '良'],
-    // [24, 168, 128, 172, 1.49, 97, 56, '中度污染'],
-    // [25, 65, 45, 51, 0.74, 39, 17, '良'],
-    // [26, 39, 24, 38, 0.61, 47, 17, '优'],
-    // [27, 39, 24, 39, 0.59, 50, 19, '优'],
-    // [28, 93, 68, 96, 1.05, 79, 29, '良'],
-    // [29, 188, 143, 197, 1.66, 99, 51, '中度污染'],
-    // [30, 174, 131, 174, 1.55, 108, 50, '中度污染'],
-    // [31, 187, 143, 201, 1.39, 89, 53, '中度污染']
-  ];
-//   const schema = [
-//     { name: 'date', index: 0, text: '日' },
-//     { name: 'AQIindex', index: 1, text: 'AQI指数' },
-//     { name: 'PM25', index: 2, text: 'PM2.5' },
-//     { name: 'PM10', index: 3, text: 'PM10' },
-//     { name: 'CO', index: 4, text: '一氧化碳（CO）' },
-//     { name: 'NO2', index: 5, text: '二氧化氮（NO2）' },
-//     { name: 'SO2', index: 6, text: '二氧化硫（SO2）' }
-//   ];
-  const itemStyle = {
-    opacity: 0.8,
-    shadowBlur: 10,
-    shadowOffsetX: 0,
-    shadowOffsetY: 0,
-    shadowColor: 'rgba(0,0,0,0.3)'
-  };
-export default function createOpt() {
-    return {
-        grid: {
-            top: "16px",
-            left: "16px",
-            right: "16px",
-            bottom: "16px",
-            containLabel: true,
-        },
-        tooltip: { 
-            backgroundColor: "#08182F",
-            color: "#fff",
-            borderColor: "#3373CC",
-            textStyle: {
-                color: "#fff", //设置文字颜色
-            },
-            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
-            formatter: function(param) {
-                let value = param.value;
-                return `<span>${value[value.length - 1]}</span><br><span>${value[0]}</span>`
-            }
-        },
-        xAxis: {
-            show: false,
-            type: 'value',
-            splitLine: {
-                lineStyle: {
-                    type: 'dashed'
-                }
-            }
-        },
-        yAxis: {
-            show: false,
-            type: 'value',
-            splitLine: {
-                lineStyle: {
-                    type: 'dashed'
-                }
-            },
-            scale: true
-        },
-        series: [{
-            name: '北京',
-            data: dataBJ,
-            type: 'scatter',
-            symbolSize: function (data) {
-                return data[2]
-            },
-            label: {
-                show: true,
-                color: "#FFF",
-                formatter: function (param) {
-                    return param.data[param.data.length - 1];
-                },
-            },
-            itemStyle: itemStyle
-        }, {
-            name: '上海',
-            data: dataSH,
-            type: 'scatter',
-            symbolSize: function (data) {
-                return data[2]
-            },
-            label: {
-                show: true,
-                color: "#FFF",
-                formatter: function (param) {
-                    return param.data[param.data.length - 1];
-                },
-            },
-            itemStyle: itemStyle
-        },
-        {
-            name: '广州',
-            data: dataGZ,
-            type: 'scatter',
-            symbolSize: function (data) {
-                return data[2]
-            },
-            label: {
-                show: true,
-                color: "#FFF", 
-                formatter: function (param) {
-                    return param.data[param.data.length - 1];
-                },
-            },
-            itemStyle: itemStyle
-        }
-        ]
-    }
-}
diff --git a/src/views/Index/keyCommunicationPositions/index.vue b/src/views/Index/keyCommunicationPositions/index.vue
index 5972d04..b673eee 100644
--- a/src/views/Index/keyCommunicationPositions/index.vue
+++ b/src/views/Index/keyCommunicationPositions/index.vue
@@ -1,49 +1,76 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-08 16:37:30
- * @LastEditTime: 2021-10-12 10:43:12
+ * @LastEditTime: 2021-10-20 17:55:49
  * @LastEditors: Please set LastEditors
  * @Description: 传播重点阵地
  * @FilePath: /data-show/src/views/Index/key-communication-positions/index.vue
 -->
 <template>
-  <div class="kcp-outter">
-    <v-label-div title="传播重点阵地"></v-label-div>
-    <div class="kcp-inner">
-      <div class="d1">
-        <v-ranking :num="1" label="懂车帝" val="594614" :lineShow="false"></v-ranking>
-        <v-ranking :num="2" label="今日头条" val="594614"></v-ranking>
-        <v-ranking :num="3" label="汽车之家" val="594614"></v-ranking>
-        <v-ranking :num="4" label="抖音" val="594614"></v-ranking>
-         <v-ranking :num="5" label="新浪微博" val="594614"></v-ranking>
-      </div>
-      <div class="d1" style="margin-left: 14px">
-          <v-ranking :num="6" label="懂车帝" val="594614" :lineShow="false"></v-ranking>
-        <v-ranking :num="7" label="今日头条" val="594614"></v-ranking>
-        <v-ranking :num="8" label="汽车之家" val="594614"></v-ranking>
-        <v-ranking :num="9" label="抖音" val="594614"></v-ranking>
-         <v-ranking :num="10" label="新浪微博" val="594614"></v-ranking>
-      </div>
+    <div class="kcp-outter">
+        <v-label-div title="传播重点阵地"></v-label-div>
+        <div class="kcp-inner">
+            <div class="d1">
+                <v-ranking  v-for="(item,index) in d1" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="item.label" :val="item.val"></v-ranking>
+            </div>
+            <div class="d1" style="margin-left: 14px">
+                <v-ranking  v-for="(item,index) in d2" :key="index" :lineShow="index === 0 ? false : true" :num="index + 1" :label="item.label" :val="item.val"></v-ranking>
+            </div>
+        </div>
     </div>
-  </div>
 </template>
 
 <script>
+import { getWebsiteHome0528 } from "@/api/home";
 export default {
-  name: "key-communication-positions",
+    name: "key-communication-positions",
+    data() {
+        return {
+            d1: [],
+            d2: [],
+        };
+    },
+    created() {
+        this.getData();
+    },
+    methods: {
+      // 将数组分成几份
+        group(array, subGroupLength) {
+            let index = 0;
+            let newArray = [];
+            while (index < array.length) {
+                newArray.push(array.slice(index, (index += subGroupLength)));
+            }
+            return newArray;
+        },
+        // 获取数据
+        getData() {
+            getWebsiteHome0528(this.getCommTime).then((res) => {
+                let data = res.data;
+                let vals = [];
+                for (let key in data) {
+                    let obj = { label: key, val: data[key] };
+                    vals.push(obj);
+                }
+                let groupedArray = this.group(vals, 5);
+                this.d1 = groupedArray[0];
+                this.d2 = groupedArray[1];
+            });
+        },
+    },
 };
 </script>
 
 <style lang="less" scoped>
 .kcp-outter {
-  width: 460px;
-  height: 316px;
-  border: 2px solid #0f2a4d;
-  margin-top: 16px;
+    width: 460px;
+    height: 316px;
+    border: 2px solid #0f2a4d;
+    margin-top: 16px;
 }
 .kcp-inner {
-  display: flex;
-  justify-content: flex-start;
-  padding: 0 16px;
+    display: flex;
+    justify-content: flex-start;
+    padding: 0 16px;
 }
 </style>
diff --git a/src/views/Index/realTimeEvent/index.vue b/src/views/Index/realTimeEvent/index.vue
index b8e6174..2a4e115 100644
--- a/src/views/Index/realTimeEvent/index.vue
+++ b/src/views/Index/realTimeEvent/index.vue
@@ -1,60 +1,68 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-08 15:56:35
- * @LastEditTime: 2021-10-12 10:43:24
+ * @LastEditTime: 2021-10-20 17:30:28
  * @LastEditors: Please set LastEditors
  * @Description: 实时事件
  * @FilePath: /data-show/src/views/Index/realTimeEvent/index.vue
 -->
 
 <template>
-  <div class="rte-outter">
-    <v-label-div title="实时事件"></v-label-div>
-    <div class="rte-tb">
-      <dv-scroll-board
-        :config="config"
-        :style="{ width: '100%', height: '230px' }"
-      />
+    <div class="rte-outter">
+        <v-label-div title="实时事件"></v-label-div>
+        <div class="rte-tb">
+            <dv-scroll-board :config="config" :style="{ width: '100%', height: '230px' }" />
+        </div>
     </div>
-  </div>
 </template>
 
 <script>
+import { getEventsListH } from "@/api/home";
 export default {
-  name: "real-time-event",
-  data() {
-    return {
-      config: {
-        headerBGC: "#0F2A4D",
-        oddRowBGC: "rgba(69, 149, 244, 0);",
-        evenRowBGC: "#0F2A4D;",
-        columnWidth: [260],
-        header: ["事件标题", "影响力", "关联品牌"],
-        data: [
-          ["2021广州车展，现场更多你没…", "40.90", "五菱宏光"],
-          ["丰田威兰达高性能版配置曝光...", "39.90", "本田"],
-          ["广州车展，15分钟抢空的限定…", "38.20", "丰田"],
-          ["2021广州车展，现场更多你没…", "37.50", "长安"],
-          ["全新本田思域发布动力提升内…", "36.50", "哈弗"],
-          ["全新本田思域发布动力提升内…", "36.50", "哈弗"],
-          ["全新本田思域发布动力提升内…", "36.50", "哈弗"],
-          ["全新本田思域发布动力提升内…", "36.50", "哈弗"],
-          ["全新本田思域发布动力提升内…", "36.50", "哈弗"],
-          ["全新本田思域发布动力提升内…", "36.50", "哈弗"],
-        ],
-      },
-    };
-  },
+    name: "real-time-event",
+    data() {
+        return {
+            config: {},
+        };
+    },
+    created() {
+        this.getData();
+    },
+    methods: {
+        getData() {
+            getEventsListH(this.getCommTime).then((res) => {
+                let arr = [];
+                if (Array.isArray(res.data)) {
+                    res.data.forEach((ele) => {
+                        let a = [
+                            ele.events_title,
+                            ele.events_influence,
+                            ele.events_brand,
+                        ];
+                        arr.push(a);
+                    });
+                    this.config = {
+                        headerBGC: "#0F2A4D",
+                        oddRowBGC: "rgba(69, 149, 244, 0);",
+                        evenRowBGC: "#0F2A4D;",
+                        columnWidth: [260],
+                        header: ["事件标题", "影响力", "关联品牌"],
+                        data: arr,
+                    };
+                }
+            });
+        },
+    },
 };
 </script>
 
 <style lang="less" scoped>
 .rte-outter {
-  width: 460px;
-  height: 312px;
-  border: 2px solid #0f2a4d;
-  .rte-tb {
-      padding: 16px;
-  }
+    width: 460px;
+    height: 312px;
+    border: 2px solid #0f2a4d;
+    .rte-tb {
+        padding: 16px;
+    }
 }
 </style>
diff --git a/src/views/Index/salesRank/index.vue b/src/views/Index/salesRank/index.vue
index 0ef7b68..e94f23b 100644
--- a/src/views/Index/salesRank/index.vue
+++ b/src/views/Index/salesRank/index.vue
@@ -1,65 +1,83 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-08 18:58:00
- * @LastEditTime: 2021-10-12 10:43:37
+ * @LastEditTime: 2021-10-20 18:52:14
  * @LastEditors: Please set LastEditors
  * @Description: 热销排行
  * @FilePath: /data-show/src/views/Index/salesRank/index.vue
 -->
 <template>
-  <div class="sr-outter">
-    <v-label-div title="热销排行">
-      <div>
-        <v-tab-group :btns="['品牌', '车型']"></v-tab-group>
-        <a-select
-          default-value="lucy"
-          style="width: 80px;margin-left: 16px"
-          @change="handleChange"
-        >
-          <a-select-option value="jack"> Jack </a-select-option>
-          <a-select-option value="lucy"> Lucy </a-select-option>
-          <a-select-option value="disabled" disabled>
-            Disabled
-          </a-select-option>
-          <a-select-option value="Yiminghe"> yiminghe </a-select-option>
-        </a-select>
-      </div>
-    </v-label-div>
-     <div class="sr-bd">
-         <v-echarts :opt="opt"></v-echarts>
-         <v-pagination :style="{position: 'absolute', right: '2px', bottom: '11px'}"></v-pagination>
-     </div>
-  </div>
+    <div class="sr-outter">
+        <v-label-div title="热销排行">
+            <div>
+                <v-tab-group :btns="['品牌', '车型']" @change="handlerTabChange"></v-tab-group>
+                <a-select v-model="form.sTimeType" style="width: 80px;margin-left: 16px">
+                    <a-select-option v-for="item in selArr" :key="item.key" :value="item.key"> {{item.value}} </a-select-option>
+                </a-select>
+            </div>
+        </v-label-div>
+        <div class="sr-bd">
+            <v-echarts :opt="opt"></v-echarts>
+            <v-pagination :style="{position: 'absolute', right: '2px', bottom: '11px'}"></v-pagination>
+        </div>
+    </div>
 </template>
 
 <script>
-import createOpt from "./opt"
+import createOpt from "./opt";
+import {getOneTime} from "@/api/comm"
+import {getCheZhuBrandCount0528} from "@/api/home"
 export default {
-  name: "sales-rank",
-  data() {
-      return {
-          opt: createOpt(["奥迪", "宝马", "奔驰", "吉利", "江淮"],[120, 200, 150, 80, 70])
-      }
-  },
-  methods: {
-      handleChange(val) {
-          console.log(val)
-      }
-  }
+    name: "sales-rank",
+    data() {
+        return {
+            form: {
+                sQueryType: 1,
+                sTimeType: 34,
+                sType: 'Home'
+            },
+            selArr: [],
+            opt: createOpt(
+                ["奥迪", "宝马", "奔驰", "吉利", "江淮"],
+                [120, 200, 150, 80, 70]
+            ),
+        };
+    },
+    created() {
+      this.getSelect();
+      this.getData()
+    },
+    methods: {
+        handlerTabChange(n) {
+          this.form.sQueryType = n === 0 ? 1 : 2
+        },
+        // 获取选择时间的数据
+        getSelect() {
+          getOneTime().then(res => {
+            this.selArr = res.data
+          })
+        },
+        // 获取数据
+        getData() {
+          let obj = Object.assign({}, this.getCommTime, this.form)
+          getCheZhuBrandCount0528(obj).then(res => {
+            console.log(res)
+          })
+        }
+    },
 };
 </script>
 
 <style lang="less" scoped>
 .sr-outter {
-  width: 460px;
-  height: 312px;
-  border: 2px solid #0f2a4d;
-  margin-left: 16px;
+    width: 460px;
+    height: 312px;
+    border: 2px solid #0f2a4d;
+    margin-left: 16px;
 }
 .sr-bd {
     position: relative;
     width: 100%;
     height: calc(100% - 48px);
-
 }
 </style>
diff --git a/src/views/Index/tailInsight/index.vue b/src/views/Index/tailInsight/index.vue
index 460c2ab..8298d76 100644
--- a/src/views/Index/tailInsight/index.vue
+++ b/src/views/Index/tailInsight/index.vue
@@ -1,7 +1,7 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-09 11:56:50
- * @LastEditTime: 2021-10-12 10:44:20
+ * @LastEditTime: 2021-10-21 13:24:45
  * @LastEditors: Please set LastEditors
  * @Description: 尾翼洞察
  * @FilePath: /data-show/src/views/Index/tailInsight/index.vue
@@ -11,23 +11,60 @@
   <div class="tl-outter">
       <vLabel-div title="尾翼洞察">
           <div>
-              <v-tab-group :btns="['品牌', '车型']"></v-tab-group>
+              <v-tab-group :btns="['品牌', '车型']" @change="handlerChange"></v-tab-group>
           </div>
       </vLabel-div>
       <div class="tl-bd">
           <v-echarts :opt="opt"></v-echarts>
-          <v-pagination :style="{position: 'absolute', left: '2px', bottom: '3px'}"></v-pagination>
+          <v-pagination :data="pdata" :style="{position: 'absolute', left: '2px', bottom: '3px'}" @change="handlerData"></v-pagination>
       </div>
   </div>
 </template>
 
 <script>
 import createOpt from "./opt"
+import {getWeiYiCountHome0528} from "@/api/home"
 export default {
   name: "tail-insight",
   data() {
       return {
-          opt: createOpt()
+          form: {
+              sQueryType: 1
+          },
+          opt: {},
+          pdata: []
+      }
+  },
+  created() {
+      this.getData()
+  },
+  methods: {
+      // 切换后台数据
+      handlerChange(n) {
+          this.form.sQueryType = n+1;
+          this.getData();
+      },
+      // 获取后台数据
+      getData() {
+          let obj = Object.assign({}, this.getCommTime, this.form);
+        
+          getWeiYiCountHome0528(obj).then(res => {
+              let data = res.data;
+              this.pdata = data;
+             
+          })
+      },
+      // 获取分页数据
+      handlerData(arr) {
+          let dy = [];
+          let ds = [];
+          arr.forEach(ele => {
+             let key = ele.key;
+             let value = ele.value;
+             dy.push(key);
+             ds.push(value)
+          });
+         this.opt = createOpt(dy,ds);
       }
   }
 };
@@ -35,6 +72,7 @@ export default {
 
 <style lang="less" scoped>
 .tl-outter {
+  position: relative;
   width: 460px;
   height: 312px;
   border: 2px solid #0f2a4d;
diff --git a/src/views/Index/tailInsight/opt.js b/src/views/Index/tailInsight/opt.js
index 1e653bd..9598d74 100644
--- a/src/views/Index/tailInsight/opt.js
+++ b/src/views/Index/tailInsight/opt.js
@@ -3,18 +3,18 @@
 /*
  * @Author: your name
  * @Date: 2021-10-09 12:38:34
- * @LastEditTime: 2021-10-09 16:54:54
+ * @LastEditTime: 2021-10-21 12:56:48
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/Index/tailInsight/opt.js
  */
-export default function createOpt() {
+export default function createOpt(dy=[],ds=[]) {
     return {
         grid: {
-            left: '4%',
-            right: '4%',
-            bottom: '3%',
-            top: "1%",
+            left: 26,
+            right: 16,
+            bottom: 10,
+            top: 16,
             containLabel: true
         },
         tooltip: {
@@ -44,7 +44,7 @@ export default function createOpt() {
         },
         yAxis: {
             type: 'category',
-            data: ['Brazil',  'USA', 'India', 'China', 'World'],
+            data: dy,
             axisTick: {
                 show: false,
             },
@@ -54,13 +54,13 @@ export default function createOpt() {
                     color: "#fff",
                 },
             },
+            inverse: true
         },
         series: [
             {
-                name: '2011',
                 type: 'bar',
                 barWidth: 24,
-                data: [500, 1000, 2220, 3000, 4000]
+                data: ds
             }
         ]
     }