From 904b9e9be6da0ddd45526657a9b5dcc5165fa35f Mon Sep 17 00:00:00 2001
From: zx <604444282@qq.com>
Date: Mon, 8 Nov 2021 17:28:55 +0800
Subject: [PATCH] =?UTF-8?q?zx-=E5=93=81=E7=89=8C=E5=AF=B9=E6=AF=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/BrandComparison/index.js              |  66 ++++++++
 .../brandTonalDistribution/index.vue          | 155 +++++++++++-------
 .../brandTonalDistribution/roundata/index.vue |  42 ++---
 .../brandTonalDistribution/roundata/opt.js    | 104 +++++-------
 .../channelDistribution/index.vue             |  77 ++++++---
 .../channelDistribution/opt.js                |  98 +++++------
 .../informationTrend/index.vue                |  75 ++++++---
 .../BrandComparison/informationTrend/opt.js   | 128 +++++----------
 .../overallInformation/index.vue              |  40 ++++-
 .../overallNumberOfInteractions/index.vue     |  44 ++++-
 10 files changed, 496 insertions(+), 333 deletions(-)
 create mode 100644 src/api/BrandComparison/index.js

diff --git a/src/api/BrandComparison/index.js b/src/api/BrandComparison/index.js
new file mode 100644
index 0000000..4c5d601
--- /dev/null
+++ b/src/api/BrandComparison/index.js
@@ -0,0 +1,66 @@
+import httpService from "@/request"
+
+// 品牌对比-品牌调性比例
+export function getAffectionsC(params) {
+    let obj =  Object.assign({action: 'getAffectionsC', sType: 'BrandOverview', iContrastType: 1}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+// 品牌对比-信息量趋势
+export function getCountTime0528C(params) {
+    let obj =  Object.assign({action: 'getCountTime0528C', sType: 'BrandOverview', iContrastType: 1}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+// 品牌对比-整体信息量
+export function getContrastCount0528C(params) {
+    let obj =  Object.assign({action: 'getContrastCount0528C', sType: 'BrandOverview', iContrastType: 1}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+// 品牌对比-整体互动人数
+export function getInteractCount0528C(params) {
+    let obj =  Object.assign({action: 'getInteractCount0528C', sType: 'BrandOverview', iContrastType: 1}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+// 品牌对比-渠道分布
+export function getSourcetypeC(params) {
+    let obj =  Object.assign({action: 'getSourcetypeC', sType: 'BrandOverview', iContrastType: 1}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
\ No newline at end of file
diff --git a/src/views/BrandComparison/brandTonalDistribution/index.vue b/src/views/BrandComparison/brandTonalDistribution/index.vue
index 8878dc9..2f02495 100644
--- a/src/views/BrandComparison/brandTonalDistribution/index.vue
+++ b/src/views/BrandComparison/brandTonalDistribution/index.vue
@@ -7,75 +7,120 @@
  * @FilePath: /data-show/src/views/BrandComparison/brandTonalDistribution/index.vue
 -->
 <template>
-    <div class="bd-outter">
-        <v-label-div title="品牌调性分布">
-        </v-label-div>
-        <div class="bd-d1">
-            <div class="dd1" style="margin-left: 16px"><span class="s1"></span><span class="s2">正面</span></div>
-            <div class="dd1" style="margin-left: 24px;"><span class="s1" :style="{background: '#54BF93'}"></span><span class="s2">中性</span></div>
-            <div class="dd1" style="margin-left: 24px;"><span class="s1" :style="{background: '#CC9D12'}"></span><span class="s2">负面</span></div>
-        </div>
-        <div class="bd-inner">
-            <roundata title="奥迪" color="#3373CC" style="margin-left: 46px"></roundata>
-            <roundata title="宝马" color="#63AECC" style="margin-left: 110px"></roundata>
-            <roundata title="奔驰" color="#54BF93" style="margin-left: 110px"></roundata>
-            <roundata title="吉利" color="#CC9D12" style="margin-left: 110px"></roundata>
-            <roundata title="大众" color="#CC7733" style="margin-left: 110px"></roundata>
-            <roundata title="别克" color="#CC5B41" style="margin-left: 110px"></roundata>
-        </div>
+  <div class="bd-outter">
+    <v-label-div title="品牌调性分布"> </v-label-div>
+    <div class="bd-d1">
+      <div class="dd1" style="margin-left: 16px">
+        <span class="s1"></span><span class="s2">正面</span>
+      </div>
+      <div class="dd1" style="margin-left: 24px">
+        <span class="s1" :style="{ background: '#54BF93' }"></span
+        ><span class="s2">中性</span>
+      </div>
+      <div class="dd1" style="margin-left: 24px">
+        <span class="s1" :style="{ background: '#CC9D12' }"></span
+        ><span class="s2">负面</span>
+      </div>
     </div>
+    <div class="bd-inner">
+      <roundata
+        v-for="(item,index) in list"
+        :key="index"
+        :title="item.Name"
+        :color="colors[index]"
+        :style="index === 0 ? 'margin-left: 46px': 'margin-left: 110px'"
+        :data="item.Data"
+      ></roundata>
+    </div>
+  </div>
 </template>
 
 <script>
+import { getAffectionsC } from "@/api/BrandComparison";
 import roundata from "./roundata";
 export default {
-    name: "brandTonalDistribution",
-    components: {
-        roundata,
+  name: "brandTonalDistribution",
+  components: {
+    roundata,
+  },
+  data() {
+    return {
+      form: {
+        token: "",
+        sBrand: "",
+      },
+      colors: ['#3373CC', '#63AECC', '#54BF93', '#CC9D12', '#CC7733', '#CC5B41'],
+      list: [
+
+      ]
+    };
+  },
+  created() {
+    this.initData();
+  },
+  methods: {
+    initData() {
+      this.form.token = this.getToken;
+      let arr = this.getBComparison;
+      let brands = [];
+      arr.forEach(ele => {
+         brands.push(ele.name)
+      });
+      this.form.sBrand = brands.toString();
+      this.getData();
     },
-    data() {
-        return {
-            opt: {},
-        };
+    //
+    getData() {
+      return new Promise((resolve, reject) => {
+        let obj = Object.assign({}, this.getCtime2, this.form);
+        getAffectionsC(obj).then((res) => {
+          let data = res.data || [];
+          this.list = data;
+          resolve(data)
+        }).catch(() => {
+            reject(false)
+        });
+      });
     },
+  },
 };
 </script>
 <style lang="less" scoped>
 .bd-outter {
+  width: 100%;
+  height: 460px;
+  border: 2px solid #0f2a4d;
+  margin-top: 16px;
+  .bd-d1 {
     width: 100%;
-    height: 460px;
-    border: 2px solid #0f2a4d;
-    margin-top: 16px;
-    .bd-d1 {
-        width: 100%;
-        display: flex;
-        height: 36px;
-        justify-content: flex-start;
-        align-items: center;
-        .dd1 {
-            display: flex;
-            justify-content: flex-start;
-            align-items: center;
-        }
-        .s1 {
-            display: inline-block;
-            width: 12px;
-            height: 12px;
-            background: #3373cc;
-        }
-        .s2 {
-            display: inline-block;
-            font-size: 12px;
-            color: #fff;
-            margin-left: 10px;
-        }
+    display: flex;
+    height: 36px;
+    justify-content: flex-start;
+    align-items: center;
+    .dd1 {
+      display: flex;
+      justify-content: flex-start;
+      align-items: center;
     }
-    .bd-inner {
-        width: 100%;
-        height: calc(100% - 48px);
-        display: flex;
-        justify-content: flex-start;
-        align-items: center;
+    .s1 {
+      display: inline-block;
+      width: 12px;
+      height: 12px;
+      background: #3373cc;
     }
+    .s2 {
+      display: inline-block;
+      font-size: 12px;
+      color: #fff;
+      margin-left: 10px;
+    }
+  }
+  .bd-inner {
+    width: 100%;
+    height: calc(100% - 48px);
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
 }
 </style>
diff --git a/src/views/BrandComparison/brandTonalDistribution/roundata/index.vue b/src/views/BrandComparison/brandTonalDistribution/roundata/index.vue
index 8797c66..3151935 100644
--- a/src/views/BrandComparison/brandTonalDistribution/roundata/index.vue
+++ b/src/views/BrandComparison/brandTonalDistribution/roundata/index.vue
@@ -9,7 +9,7 @@
 <template>
     <div class="bd-item-round">
         <div class="bd-item-r-cav">
-            <v-echarts :opt="opt" @echarsUpdate="echarsFun"></v-echarts>
+            <v-echarts :opt="opt"></v-echarts>
         </div>
         <span class="bd-item-r-c-s1" :style="{color: color}">{{title}}</span>
     </div>
@@ -27,38 +27,26 @@ export default {
             type: String,
             default: "",
         },
+        data: {
+            type: Object,
+            default: () => {}
+        }
+    },
+    watch: {
+       data: {
+           handler(val) {
+              this.opt = createOpt(val) 
+           },
+           immediate: true
+       } 
     },
     data() {
         return {
-            opt: createOpt(),
+           
         };
     },
     methods: {
-        echarsFun(myChart) {
-            let index = 0;
-            myChart.dispatchAction({
-                type: "highlight",
-                seriesIndex: 0,
-                dataIndex: 0,
-            });
-            myChart.on("mouseover", function (e) {
-                if (e.dataIndex != index) {
-                    myChart.dispatchAction({
-                        type: "downplay",
-                        seriesIndex: 0,
-                        dataIndex: index,
-                    });
-                }
-            });
-            myChart.on("mouseout", function (e) {
-                index = e.dataIndex;
-                myChart.dispatchAction({
-                    type: "highlight",
-                    seriesIndex: 0,
-                    dataIndex: e.dataIndex,
-                });
-            });
-        },
+        
     },
 };
 </script>
diff --git a/src/views/BrandComparison/brandTonalDistribution/roundata/opt.js b/src/views/BrandComparison/brandTonalDistribution/roundata/opt.js
index 72c0191..853878b 100644
--- a/src/views/BrandComparison/brandTonalDistribution/roundata/opt.js
+++ b/src/views/BrandComparison/brandTonalDistribution/roundata/opt.js
@@ -7,7 +7,40 @@
  * @FilePath: /data-show/src/views/BrandInsight/weiboKol/opt.js
  */
 import * as echarts from "echarts";
-export default function createOpt() {
+function createData(obj = {}) {
+   if(JSON.stringify(obj) === '{}') {
+      return;
+   }
+   let arr = [];
+   for(let key in obj) {
+      let color = "";
+      if(key === '正面') {
+         color = "#3373CC"
+      } else if(key === '负面') {
+         color = "#b38b14"
+      } else {
+         color = "#54BF93"
+      }
+      let o = {
+         value: obj[key],
+         name: key,
+         itemStyle: {color:  new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
+            //给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
+            //给第一个设置0，第四个设置1，就是垂直渐变
+            offset: 0,
+            color: 'black'
+         }, {
+            offset: 1,
+            color: color
+         }])}
+      }
+      arr.push(o)
+   }
+   return arr
+   
+}
+export default function createOpt(obj = {}) {
+   let data = createData(obj)
     return {
         series: [
             {
@@ -18,52 +51,23 @@ export default function createOpt() {
               label: {
                 show: false,
                 position: 'center',
-                lineHeight: 40
+                lineHeight: 28
               },
               emphasis: {
                 label: {
                   show: true,
-                  fontSize: '20',
+                  fontSize: '18',
                   color: "#ffff",
                   fontWeight: 'bold',
                   formatter: function(p) {
-                      return `${p.data.name}\n25%\n${p.data.value}`
+                      return `${p.data.name}\n${p.percent}%\n${p.data.value}`
                   }
                 }
               },
               labelLine: {
                 show: false
               },
-              data: [
-                { value: 2000, name: '正面', itemStyle: {color:  new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
-                    //给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
-                    //给第一个设置0，第四个设置1，就是垂直渐变
-                    offset: 0,
-                    color: 'black'
-                 }, {
-                    offset: 1,
-                    color: '#3373CC'
-                 }])} },
-               
-                { value: 1000, name: '中性', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
-                    //给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
-                    //给第一个设置0，第四个设置1，就是垂直渐变
-                    offset: 0,
-                    color: 'black'
-                 }, {
-                    offset: 1,
-                    color: '#54BF93'
-                 }])} },
-                 { value: 1000, name: '负面', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
-                    //给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
-                    //给第一个设置0，第四个设置1，就是垂直渐变
-                    offset: 0,
-                    color: 'black'
-                 }, {
-                    offset: 1,
-                    color: '#b38b14'
-                 }])} },
-              ],
+              data: data
             },
             {
                 name: 'Access From1',
@@ -78,37 +82,7 @@ export default function createOpt() {
                   show: false
                 },
                 center: ['50%', '50%'],//边框位置
-                data: [
-                  { value: 2000, name: '正面', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
-                    //给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
-                    //给第一个设置0，第四个设置1，就是垂直渐变
-                    offset: 0,
-                    color: 'black'
-                 }, {
-                    offset: 1,
-                    color: '#3373CC'
-                 }])} },
-                
-                  { value: 1000, name: '中性', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
-                    //给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
-                    //给第一个设置0，第四个设置1，就是垂直渐变
-                    offset: 0,
-                    color: 'black'
-                 }, {
-                    offset: 1,
-                    color: '#54BF93'
-                 }])} },
-                 { value: 1000, name: '负面', itemStyle: {color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
-                    //给颜色设置渐变色 前面4个参数，给第一个设置1，第四个设置0 ，就是水平渐变
-                    //给第一个设置0，第四个设置1，就是垂直渐变
-                    offset: 0,
-                    color: 'black'
-                 }, {
-                    offset: 1,
-                    color: '#b38b14'
-                 }])} },
-               
-                ],
+                data: data
               }
           ]
     }
diff --git a/src/views/BrandComparison/channelDistribution/index.vue b/src/views/BrandComparison/channelDistribution/index.vue
index 7347823..d058c53 100644
--- a/src/views/BrandComparison/channelDistribution/index.vue
+++ b/src/views/BrandComparison/channelDistribution/index.vue
@@ -7,35 +7,72 @@
  * @FilePath: /data-show/src/views/BrandComparison/channelDistribution/index.vue
 -->
 <template>
-    <div class="cd-outter">
-        <v-label-div title="渠道分布">
-        </v-label-div>
-        <div class="cd-inner">
-           <v-echarts :opt="opt"></v-echarts> 
-        </div>
+  <div class="cd-outter">
+    <v-label-div title="渠道分布"> </v-label-div>
+    <div class="cd-inner">
+      <v-echarts :opt="opt"></v-echarts>
     </div>
+  </div>
 </template>
 
 <script>
-import createOpt from "./opt"
+import { getSourcetypeC } from "@/api/BrandComparison";
+import createOpt from "./opt";
 export default {
-    name: "channelDistribution",
-    data() {
-        return {
-            opt: createOpt()
-        }
-    }
+  name: "channelDistribution",
+  data() {
+    return {
+      form: {
+        token: "",
+        sBrand: "",
+      },
+      opt: {},
+    };
+  },
+  created() {
+    this.initData();
+  },
+  methods: {
+    initData() {
+      this.form.token = this.getToken;
+      let arr = this.getBComparison;
+      let brands = [];
+      arr.forEach((ele) => {
+        brands.push(ele.name);
+      });
+      this.form.sBrand = brands.toString();
+      this.getData();
+    },
+    getData() {
+      return new Promise((resolve, reject) => {
+        let obj = Object.assign({}, this.getCtime2, this.form);
+        getSourcetypeC(obj)
+          .then((res) => {
+            let data = res.data || [];
+            let brandList = [];
+            data.forEach(e => {
+                brandList.push(e.Name);
+            })
+            this.opt = createOpt(data,brandList);
+            resolve(data);
+          })
+          .catch(() => {
+            reject(false);
+          });
+      });
+    },
+  },
 };
 </script>
 
 <style lang="less" scoped>
 .cd-outter {
-    width: 936px;
-    height: 460px;
-    border: 2px solid #0f2a4d;
-    .cd-inner {
-        width: 100%;
-        height: calc(100% - 48px);
-    }
+  width: 936px;
+  height: 460px;
+  border: 2px solid #0f2a4d;
+  .cd-inner {
+    width: 100%;
+    height: calc(100% - 48px);
+  }
 }
 </style>
diff --git a/src/views/BrandComparison/channelDistribution/opt.js b/src/views/BrandComparison/channelDistribution/opt.js
index 7c7d12a..4326be4 100644
--- a/src/views/BrandComparison/channelDistribution/opt.js
+++ b/src/views/BrandComparison/channelDistribution/opt.js
@@ -6,8 +6,38 @@
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/BrandComparison/channelDistribution/opt.js
  */
+import { bigNumberTransform } from "@/utils/gol/dataTool"
 let colors = ['#3373CC', '#63AECC', '#54BF93', '#CC9D12', '#CC7733', "#CC5B41", '#452b74', '#71686f']
-export default function createOpt() {
+function createData(dataList = []) {
+    /*series: [
+        {
+            name: '奥迪',
+            type: 'bar',
+            barGap: 0,
+            barWidth: 16,
+            emphasis: {
+                focus: 'series'
+            },
+            data: [320, 332, 301, 334, 390, 400]
+        },*/
+    let arr = [];
+    dataList.forEach(e => {
+        let o = {
+            name: e.Name,
+            type: 'bar',
+            barGap: 0,
+            barWidth: 16,
+            emphasis: {
+                focus: 'series'
+            },
+            data: [e.Data.新闻,e.Data.论坛,e.Data.微信,e.Data.短视频,e.Data.微博,e.Data.其他]
+        };
+        arr.push(o)
+    })
+    return arr;
+}
+export default function createOpt(dataList = [],brandList = []) {
+    let info = createData(dataList);
     return {
         grid: {
             top: "56px",
@@ -18,7 +48,7 @@ export default function createOpt() {
         },
         color: colors,
         legend: {
-            data: ['奥迪', '宝马', '奔驰', '吉利', '大众', '别克'],
+            data: brandList,
             textStyle: { //图例文字的样式
                 color: '#fff'
             },
@@ -59,6 +89,12 @@ export default function createOpt() {
                         color: "#FFF",
                     },
                 },
+                axisLabel: {
+                    formatter: (value) => {
+                      let str = bigNumberTransform(value);
+                      return str;
+                    }
+                },
                 splitLine: {
                     lineStyle: {
                         type: "dashed", // y轴分割线类型
@@ -67,62 +103,6 @@ export default function createOpt() {
                 },
             }
         ],
-        series: [
-            {
-                name: '奥迪',
-                type: 'bar',
-                barGap: 0,
-                barWidth: 16,
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [320, 332, 301, 334, 390, 400]
-            },
-            {
-                name: '宝马',
-                type: 'bar',
-                barWidth: 16,
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [220, 182, 191, 234, 290, 300]
-            },
-            {
-                name: '奔驰',
-                type: 'bar',
-                barWidth: 16,
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [150, 232, 201, 154, 190, 200]
-            },
-            {
-                name: '吉利',
-                type: 'bar',
-                barWidth: 16,
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [98, 77, 101, 99, 40, 44]
-            },
-            {
-                name: '大众',
-                type: 'bar',
-                barWidth: 16,
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [198, 177, 101, 199, 140, 145]
-            },
-            {
-                name: '别克',
-                type: 'bar',
-                barWidth: 16,
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [298, 277, 201, 299, 240, 250]
-            }
-        ]
+        series: info
     }
 }
\ No newline at end of file
diff --git a/src/views/BrandComparison/informationTrend/index.vue b/src/views/BrandComparison/informationTrend/index.vue
index 8c933e6..46e6998 100644
--- a/src/views/BrandComparison/informationTrend/index.vue
+++ b/src/views/BrandComparison/informationTrend/index.vue
@@ -7,34 +7,69 @@
  * @FilePath: /data-show/src/views/BrandComparison/informationTrend/index.vue
 -->
 <template>
-    <div class="it-outter">
-         <v-label-div title="信息量趋势" ></v-label-div>
-         <div class="it-inner">
-             <v-echarts :opt="opt"></v-echarts>
-         </div>
+  <div class="it-outter">
+    <v-label-div title="信息量趋势"></v-label-div>
+    <div class="it-inner">
+      <v-echarts :opt="opt"></v-echarts>
     </div>
+  </div>
 </template>
 
 <script>
-import createOpt from "./opt"
+import { getCountTime0528C } from "@/api/BrandComparison";
+import createOpt from "./opt";
 export default {
-    name: "informationTrend",
-    data() {
-        return {
-            opt: createOpt()
-        }
-    }
-}
+  name: "informationTrend",
+  data() {
+    return {
+      form: {
+        token: "",
+        sBrand: "",
+      },
+      opt: {},
+    };
+  },
+  created() {
+    this.initData();
+  },
+  methods: {
+    initData() {
+      this.form.token = this.getToken;
+      let arr = this.getBComparison;
+      let brands = [];
+      arr.forEach((ele) => {
+        brands.push(ele.name);
+      });
+      this.form.sBrand = brands.toString();
+      this.getData();
+    },
+    getData() {
+      let obj = Object.assign({}, this.getCtime2, this.form);
+      getCountTime0528C(obj).then((res) => {
+         let data = res.data || [];
+         let dx = [];
+         let ds = [];
+         data.forEach(ele => {
+             let key = ele.key;
+             let value = ele.value;
+             dx.push(key);
+             ds.push(value);
+         });
+         this.opt = createOpt(dx, ds);
+      });
+    },
+  },
+};
 </script>
 
 <style lang="less" scoped>
 .it-outter {
-    width: 618px;
-    height: 460px;
-    border: 2px solid #0F2A4D;
-    .it-inner {
-        width: 100%;
-        height: calc(100% - 48px);
-    }
+  width: 618px;
+  height: 460px;
+  border: 2px solid #0f2a4d;
+  .it-inner {
+    width: 100%;
+    height: calc(100% - 48px);
+  }
 }
 </style>
diff --git a/src/views/BrandComparison/informationTrend/opt.js b/src/views/BrandComparison/informationTrend/opt.js
index 346d8e9..1770030 100644
--- a/src/views/BrandComparison/informationTrend/opt.js
+++ b/src/views/BrandComparison/informationTrend/opt.js
@@ -6,7 +6,37 @@
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/BrandInsight/titsopo/opt.js
  */
-export default function createOpt() {
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+function createData(ds = []) {
+    let testData = {}
+    ds.forEach(item => {
+        item.forEach(val => {
+            if (testData[val.key] === undefined) {
+                testData[val.key] = {
+                    name: val.key,
+                    type: 'line',
+                    symbol: 'none',
+                    areaStyle: {
+                        opacity: 0.2
+                    },
+                    emphasis: {
+                        focus: 'series'
+                    },
+                    data: [val.value]
+                }
+            } else {
+                testData[val.key].data.push(val.value)
+            }
+        })
+    })
+    let arr = [];
+    for(let key in testData) {
+        arr.push(testData[key])
+    }
+   return arr 
+}
+export default function createOpt(dx = [], ds = []) {
+    let data = createData(ds);
     return {
         grid: {
             left: 16,
@@ -39,13 +69,19 @@ export default function createOpt() {
             axisTick: {
                 show: false,
             },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = value.substring(10, 16)
+                    return str;
+                }
+            },
             axisLine: {
                 show: false,
                 lineStyle: {
                     color: "#fff",
                 },
             },
-            data: ['00:00', '04:00', '08:00', '12:00', '16:00', '20:00', '24:00']
+            data: dx
         },
         yAxis: {
             type: 'value',
@@ -55,6 +91,12 @@ export default function createOpt() {
                     color: "#fff",
                 },
             },
+            axisLabel: {
+                formatter: (value) => {
+                  let str = bigNumberTransform(value);
+                  return str;
+                }
+            },
             splitLine: {
                 lineStyle: {
                     type: "dashed", // y轴分割线类型
@@ -62,86 +104,6 @@ export default function createOpt() {
                 },
             },
         },
-        series: [
-            {
-                name: '奥迪',
-                type: 'line',
-                stack: 'Total',
-                symbol: 'none',
-                areaStyle: {
-                    opacity: 0.4
-                },
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [2000, 1600, 1000, 2200, 2300, 2100, 1900]
-            },
-            {
-                name: '宝马',
-                type: 'line',
-                stack: 'Total',
-                symbol: 'none',
-                areaStyle: {
-                    opacity: 0.4
-                },
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [1000, 1100, 1300, 2000, 1800, 2100, 1600]
-            },
-            {
-                name: '奔驰',
-                type: 'line',
-                stack: 'Total',
-                symbol: 'none',
-                areaStyle: {
-                    opacity: 0.4
-                },
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [1200, 1200, 1400, 2100, 1400, 1900, 2000]
-            },
-            {
-                name: '吉利',
-                type: 'line',
-                stack: 'Total',
-                symbol: 'none',
-                areaStyle: {
-                    opacity: 0.4
-                },
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [1200, 1200, 1350, 1550, 1750, 1900, 2000]
-            },
-            {
-                name: '大众',
-                type: 'line',
-                stack: 'Total',
-                symbol: 'none',
-                areaStyle: {
-                    opacity: 0.4
-                },
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [1260, 1280, 1390, 1570, 1790, 1950, 2020]
-            },
-            {
-                name: '别克',
-                type: 'line',
-                stack: 'Total',
-                symbol: 'none',
-                areaStyle: {
-                    opacity: 0.4
-                },
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [1260, 1280, 1390, 1570, 1790, 1950, 2020]
-            },
-
-        ]
+        series: data
     }
 }
diff --git a/src/views/BrandComparison/overallInformation/index.vue b/src/views/BrandComparison/overallInformation/index.vue
index 506cad1..fc93ee6 100644
--- a/src/views/BrandComparison/overallInformation/index.vue
+++ b/src/views/BrandComparison/overallInformation/index.vue
@@ -16,12 +16,50 @@
 </template>
 
 <script>
+import {getContrastCount0528C} from "@/api/BrandComparison"
 import {createSingleColumnar} from "@/utils/gol/singleColumnar"
 export default {
     name: "overallInformation",
     data() {
         return {
-            opt: createSingleColumnar(["奥迪", "宝马", "奔驰", "吉利", "大众", "别克"],[2200, 1900, 1800, 1600, 1400, 1500])
+            form: {
+                token: "",
+                sBrand: ""
+            },
+            opt: {}
+        }
+    },
+    created() {
+        this.initData();
+    },
+    methods: {
+        initData() {
+            this.form.token = this.getToken;
+            let arr = this.getBComparison;
+            let brands = [];
+            arr.forEach(ele => {
+                brands.push(ele.name)
+            });
+            this.form.sBrand = brands.toString();
+            this.getData();
+        },
+        getData() {
+            return new Promise((resolve, reject) => {
+            let obj = Object.assign({}, this.getCtime2, this.form);
+            getContrastCount0528C(obj).then((res) => {
+            let data = res.data || [];
+            let brandsList = [];
+            let infoList = [];
+            data.forEach(e => {
+                brandsList.push(e.key);
+                infoList.push(e.value);
+            })
+            this.opt = createSingleColumnar(brandsList, infoList);
+            resolve(data)
+            }).catch(() => {
+                reject(false)
+            });
+        });
         }
     }
 };
diff --git a/src/views/BrandComparison/overallNumberOfInteractions/index.vue b/src/views/BrandComparison/overallNumberOfInteractions/index.vue
index 99ff995..43b11fd 100644
--- a/src/views/BrandComparison/overallNumberOfInteractions/index.vue
+++ b/src/views/BrandComparison/overallNumberOfInteractions/index.vue
@@ -16,15 +16,53 @@
 </template>
 
 <script>
+import {getInteractCount0528C} from "@/api/BrandComparison"
 import {createSingleColumnar} from "@/utils/gol/singleColumnar"
 export default {
-    name: "overallNumberOfInteractions",
+    name: "overallInformation",
     data() {
         return {
-            opt: createSingleColumnar(["奥迪", "宝马", "奔驰", "吉利", "大众", "别克"],[2200, 1900, 1800, 1600, 1400, 1500], '#45a380')
+            form: {
+                token: "",
+                sBrand: ""
+            },
+            opt: {}
+        }
+    },
+    created() {
+        this.initData();
+    },
+    methods: {
+        initData() {
+            this.form.token = this.getToken;
+            let arr = this.getBComparison;
+            let brands = [];
+            arr.forEach(ele => {
+                brands.push(ele.name)
+            });
+            this.form.sBrand = brands.toString();
+            this.getData();
+        },
+        getData() {
+            return new Promise((resolve, reject) => {
+            let obj = Object.assign({}, this.getCtime2, this.form);
+            getInteractCount0528C(obj).then((res) => {
+            let data = res.data || [];
+            let brandsList = [];
+            let infoList = [];
+            data.forEach(e => {
+                brandsList.push(e.key);
+                infoList.push(e.value);
+            })
+            this.opt = createSingleColumnar(brandsList, infoList);
+            resolve(data)
+            }).catch(() => {
+                reject(false)
+            });
+        });
         }
     }
-}
+};
 </script>
 
 <style lang="less" scoped>