From cb896e5a07c02178133c676d699e4a0a37109b04 Mon Sep 17 00:00:00 2001
From: "lily.zhang" <daylily.zhang@akuhome.com>
Date: Mon, 1 Nov 2021 14:55:23 +0800
Subject: [PATCH] cxw-010203

---
 src/api/ModelInsight/index.js                 |  28 +++-
 src/views/BrandInsight/brandData/index.vue    |   7 +-
 src/views/BrandInsight/titsopo/index.vue      |  24 +---
 src/views/ModelInsight/index.vue              |   4 +-
 .../ModelInsight/ml-brand-data/index.vue      |  54 ++++++--
 src/views/ModelInsight/ml-tts/index.vue       |  88 +++++++++++--
 src/views/ModelInsight/ml-tts/opt.js          | 123 ++++++++----------
 7 files changed, 212 insertions(+), 116 deletions(-)

diff --git a/src/api/ModelInsight/index.js b/src/api/ModelInsight/index.js
index 259f94b..7273f66 100644
--- a/src/api/ModelInsight/index.js
+++ b/src/api/ModelInsight/index.js
@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-28 16:40:48
- * @LastEditTime: 2021-10-28 19:09:07
+ * @LastEditTime: 2021-11-01 14:15:10
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/api/ModelInsight/index.js
@@ -21,3 +21,29 @@ export function getBrandOverviewCount0528(params) {
         }
     })
 }
+
+// 车型数据-舆情调性
+export function getAffections(params) {
+    let obj =  Object.assign({action: 'getAffections', sType: 'BrandOverview'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+// 车型数据-舆情传播趋势
+export function getSourcetypeTime(params) {
+    let obj =  Object.assign({action: 'getSourcetypeTime', sType: 'BrandOverview'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
diff --git a/src/views/BrandInsight/brandData/index.vue b/src/views/BrandInsight/brandData/index.vue
index 2f77e06..a8c0449 100644
--- a/src/views/BrandInsight/brandData/index.vue
+++ b/src/views/BrandInsight/brandData/index.vue
@@ -1,7 +1,7 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-11 18:42:58
- * @LastEditTime: 2021-11-01 09:57:44
+ * @LastEditTime: 2021-11-01 13:50:31
  * @LastEditors: Please set LastEditors
  * @Description: 品牌数据
  * @FilePath: /data-show/src/views/BrandInsight/brandData/index.vue
@@ -31,7 +31,7 @@
                     <img class="m1" src="../../../assets/images/BrandInsight/ic_dx.png" />
                     <span class="s1">舆情整体调性</span>
                 </div>
-                <a-popover title="传播数据">
+                <a-popover title="舆情整体调性">
                     <template slot="content">
                         <template v-for="(item,index) in affObj">
                             <div class="pd-item" :key="index" v-if="index != 'z'">
@@ -169,8 +169,9 @@ export default {
             font-family: Bebas;
             margin-right: 16px;
             display: flex;
-            justify-content: flex-start;
+            justify-content: flex-end;
             width: 276px;
+            cursor: pointer;
             .s2-s1 {
                 display: block;
                 width: 102px;
diff --git a/src/views/BrandInsight/titsopo/index.vue b/src/views/BrandInsight/titsopo/index.vue
index 4f7f661..3e8fde9 100644
--- a/src/views/BrandInsight/titsopo/index.vue
+++ b/src/views/BrandInsight/titsopo/index.vue
@@ -1,7 +1,7 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-12 09:32:35
- * @LastEditTime: 2021-11-01 09:59:32
+ * @LastEditTime: 2021-11-01 14:46:34
  * @LastEditors: Please set LastEditors
  * @Description: 舆情传播趋势
  * @FilePath: /data-show/src/views/BrandInsight/titsopo/index.vue
@@ -70,30 +70,12 @@ export default {
         clickEchars(data = []) {
             let qudao = [];
             let startTime = "";
-            let endTime = "";
+            let endTime = moment(new Date()).format('YYYY-MM-DD hh:mm:ss');
            data.forEach(ele => {
                let seriesName = ele.seriesName;
-               endTime = ele.name;
+               startTime = ele.name;
                qudao.push(seriesName);
            })
-           if (this.getCommTime.sTimeType == 34) {
-                //  let endTime = moment(time).add(24, "hours").format("YYYY-MM-DD HH:mm:ss");
-                startTime = moment(endTime)
-                    .subtract(24, "hours")
-                    .format("YYYY-MM-DD HH:mm:ss");
-            } else if (this.getCommTime.sTimeType == 23) {
-                startTime = moment(endTime)
-                    .subtract(3, "days")
-                    .format("YYYY-MM-DD HH:mm:ss");
-            } else if (this.getCommTime.sTimeType == 3) {
-              startTime = moment(endTime)
-                    .subtract(7, "days")
-                    .format("YYYY-MM-DD HH:mm:ss");
-            } else {
-              startTime = moment(endTime)
-                    .subtract(30, "days")
-                    .format("YYYY-MM-DD HH:mm:ss");
-            }
             let sTimeType = 4;
             this.$router.push({
                 path: "/industryDataExport",
diff --git a/src/views/ModelInsight/index.vue b/src/views/ModelInsight/index.vue
index ac594a7..e25c10c 100644
--- a/src/views/ModelInsight/index.vue
+++ b/src/views/ModelInsight/index.vue
@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-25 13:12:20
- * @LastEditTime: 2021-11-01 09:54:33
+ * @LastEditTime: 2021-11-01 14:00:36
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/ModelInsight/index.vue
@@ -18,7 +18,7 @@
                     </div>
                     <img class="m2" src="../../assets/images/ModelInsight/img_qhcx.png" @click="openModel" />
                 </div>
-                <mlTts></mlTts>
+                <mlTts :brand="brand" :model="model"></mlTts>
             </div>
             <div class="bdl-d2">
                 <v-label-div title="事件洞察">
diff --git a/src/views/ModelInsight/ml-brand-data/index.vue b/src/views/ModelInsight/ml-brand-data/index.vue
index f41c433..8c5f4e8 100644
--- a/src/views/ModelInsight/ml-brand-data/index.vue
+++ b/src/views/ModelInsight/ml-brand-data/index.vue
@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-25 13:20:36
- * @LastEditTime: 2021-11-01 10:25:44
+ * @LastEditTime: 2021-11-01 13:48:39
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/ModelInsight/ml-brand-data/index.vue
@@ -17,7 +17,7 @@
                     <span class="s1">传播数据总量</span>
                 </div>
                 <div class="d2">
-                    <a-popover title="传播数据总量">
+                    <a-popover title="传播数据">
                         <template slot="content">
                             <div class="pd-item" v-for="(item,index) in totalArr" :key="index">
                                 <span>{{item.key}}</span>
@@ -43,9 +43,23 @@
                     <span class="s1">舆情整体调性</span>
                 </div>
                 <div class="d2">
-                    <span class="s2-s1"></span>
-                    <span class="s2-s1" style="width: 104px;background: #54BF93;"></span>
-                    <span class="s2-s1" style="width: 68px; background: #CC9D12"></span>
+                    <a-popover title="舆情整体调性">
+                        <template slot="content">
+                            <template v-for="(item,index) in affObj">
+                                <div class="pd-item" :key="index" v-if="index != 'z'">
+                                    <span v-if="index === 'a'">正面</span>
+                                    <span v-if="index === 'b'">中性</span>
+                                    <span v-if="index === 'c'">负面</span>
+                                    <span>{{item}}</span>
+                                </div>
+                            </template>
+                        </template>
+                        <span class="s2">
+                            <span class="s2-s1" :style="{width: affObj.a/affObj.z * width +'px'}"></span>
+                            <span class="s2-s1" :style="{width: affObj.b/affObj.z * width + 'px', background: '#54BF93'}"></span>
+                            <span class="s2-s1" :style="{width: affObj.c/affObj.z *  width + 'px',background: '#CC9D12'}"></span>
+                        </span>
+                    </a-popover>
                 </div>
             </div>
         </div>
@@ -53,12 +67,13 @@
 </template>
 
 <script>
-import { getBrandOverviewCount0528 } from "@/api/ModelInsight";
+import { getBrandOverviewCount0528, getAffections } from "@/api/ModelInsight";
 export default {
     name: "ml-brand-data",
     props: ["brand", "model"],
     data() {
         return {
+            width: 274,
             form: {
                 sBrand: "",
                 sSeriesName: "",
@@ -67,6 +82,12 @@ export default {
             totalArr: [],
             count: 0,
             countPercent: 0,
+            affObj: {
+                a: 0,
+                b: 0,
+                c: 0,
+                z: 0,
+            },
         };
     },
     watch: {
@@ -77,6 +98,7 @@ export default {
                     this.form.sBrand = this.brand;
                     this.form.sSeriesName = this.model;
                     this.getData1();
+                    this.getData2();
                 }
             },
             immediate: true,
@@ -91,7 +113,18 @@ export default {
                 this.count = data.count;
                 this.countPercent = data.countPercent;
                 this.totalArr = data.data;
-                console.log(this.totalArr)
+                console.log(this.countPercent)
+            });
+        },
+        getData2() {
+            let obj = Object.assign({}, this.getCtime2, this.form);
+            getAffections(obj).then((res) => {
+                let data = res.data || {};
+                this.affObj.a = data["正面"] || 0;
+                this.affObj.b = data["中性"] || 0;
+                this.affObj.c = data["负面"] || 0;
+                this.affObj.z =
+                    this.affObj.a * 1 + this.affObj.b * 1 + this.affObj.c * 1;
             });
         },
     },
@@ -131,12 +164,17 @@ export default {
                 }
             }
             .d2 {
-                font-size: 44px;
+                font-size: 44px; 
                 font-family: Bebas;
                 color: #ffffff;
                 margin-right: 16px;
+                cursor: pointer;
+            }
+            .s2 {
+                margin-right: 0px;
                 display: flex;
                 justify-content: flex-start;
+                cursor: pointer;
                 .s2-s1 {
                     display: block;
                     width: 102px;
diff --git a/src/views/ModelInsight/ml-tts/index.vue b/src/views/ModelInsight/ml-tts/index.vue
index e529459..e3d860b 100644
--- a/src/views/ModelInsight/ml-tts/index.vue
+++ b/src/views/ModelInsight/ml-tts/index.vue
@@ -1,7 +1,7 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-12 09:32:35
- * @LastEditTime: 2021-10-25 14:47:23
+ * @LastEditTime: 2021-11-01 14:45:45
  * @LastEditors: Please set LastEditors
  * @Description: 舆情传播趋势
  * @FilePath: /data-show/src/views/BrandInsight/titsopo/index.vue
@@ -9,28 +9,96 @@
 <template>
     <div class="tit-outter">
         <div class="tit-header">
-            <a-button type="primary" size="small">进入数据列表页</a-button>
+            <a-button type="primary" size="small" @click="goIDE">进入数据列表页</a-button>
             <a-button type="primary" style="margin-left: 16px;margin-right: 16px;" size="small">导出报告</a-button>
         </div>
         <div class="tit-inner">
             <vLabel-div title="舆情传播趋势"></vLabel-div>
             <div class="tit-bd">
-                <v-echarts :opt="opt"></v-echarts>
-            </div> 
+                <v-echarts :opt="opt" @getData="clickEchars"></v-echarts>
+            </div>
         </div>
     </div>
 </template>
 
 <script>
-import createOpt from "./opt"
+import { getSourcetypeTime } from "@/api/ModelInsight";
+import moment from "moment";
+import createOpt from "./opt";
 export default {
     name: "ml-tts",
+    props: ["brand", "model"],
     data() {
         return {
-            opt: createOpt()
+            form: {
+                sBrand: "",
+                sSeriesName: "",
+                token: "",
+            },
+            opt: {},
+        };
+    },
+    watch: {
+        model: {
+            handler(val) {
+                if (val) {
+                    this.form.token = this.getToken;
+                    this.form.sBrand = this.brand;
+                    this.form.sSeriesName = this.model;
+                    this.getData();
+                }
+            },
+            immediate: true,
+        },
+    },
+    methods: {
+        // 前往数据表格
+        goIDE() {
+            this.$router.push({
+                path: "/industryDataExport",
+                query: {
+                    token: this.getToken,
+                    action: "getList",
+                    sType: "BrandData",
+                    brand: this.form.sBrand,
+                    seriesName: this.form.sSeriesName,
+                    title: "车型-行业数据",
+                },
+            });
+        },
+        // 获取后台数据
+        getData() {
+            let obj = Object.assign({}, this.getCtime2, this.form);
+            getSourcetypeTime(obj).then((res) => {
+                let data = res.data || [];
+                let dx = [];
+                let ds = [];
+                data.forEach((ele) => {
+                    let time = ele.Time;
+                    let value = ele.Data;
+                    dx.push(time);
+                    ds.push(value);
+                });
+                this.opt = createOpt(dx, ds);
+            });
+        },
+         clickEchars(data = []) {
+            let qudao = [];
+            let startTime = "";
+            let endTime = moment(new Date()).format('YYYY-MM-DD hh:mm:ss');
+           data.forEach(ele => {
+               let seriesName = ele.seriesName;
+               startTime = ele.name;
+               qudao.push(seriesName);
+           })
+            let sTimeType = 4;
+            this.$router.push({
+                path: "/industryDataExport",
+                query: { startTime, endTime, qudao, sTimeType, token: this.getToken, action: 'getList', sType: 'BrandData', brand: this.form.sBrand, seriesName: this.form.sSeriesName, title: "车型-行业数据" },
+            });
         }
-    }
-}
+    },
+};
 </script>
 
 <style lang="less" scoped>
@@ -41,7 +109,7 @@ export default {
     .tit-header {
         width: 100%;
         height: 48px;
-        background: linear-gradient(270deg, #07192f 0%, #010B19 100%);
+        background: linear-gradient(270deg, #07192f 0%, #010b19 100%);
         display: flex;
         justify-content: flex-end;
         align-items: center;
@@ -50,7 +118,7 @@ export default {
         width: 100%;
         height: 490px;
         margin-top: 16px;
-        border: 2px solid #0F2A4D;
+        border: 2px solid #0f2a4d;
         .tit-bd {
             width: 100%;
             height: calc(100% - 48px);
diff --git a/src/views/ModelInsight/ml-tts/opt.js b/src/views/ModelInsight/ml-tts/opt.js
index 99d975a..af8cf40 100644
--- a/src/views/ModelInsight/ml-tts/opt.js
+++ b/src/views/ModelInsight/ml-tts/opt.js
@@ -1,12 +1,54 @@
 /*
  * @Author: your name
  * @Date: 2021-10-12 10:11:24
- * @LastEditTime: 2021-10-13 16:04:39
+ * @LastEditTime: 2021-11-01 14:25:41
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/BrandInsight/titsopo/opt.js
  */
-export default function createOpt() {
+import * as echarts from "echarts";
+// import { bigNumberTransform } from "@/utils/gol/dataTool"
+let colors = ['#546fc5', '#91cb74', '#f9c857', '#ed6565', '#72bfde', '#3aa272', '#fb8351'];
+function createData(ds = []) {
+    let arr = [];
+    for (let i = 0; i < ds.length; i++) {
+        let arr1 = ds[i];
+        for (let j = 0; j < arr1.length; j++) {
+            let n = arr.findIndex(ele => {
+                return ele.name === arr1[j].key;
+            })
+            if (n === -1) {
+                let obj =
+                {
+                    name: arr1[j].key,
+                    type: 'line',
+                    symbol: 'none',
+                    areaStyle: {
+                        normal: {
+                            opacity: 0.4,
+                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                                offset: 0, color: colors[j] // 0% 处的颜色
+                            }, {
+                                offset: 1, color: '#000' // 100% 处的颜色
+                            }]
+                            ),
+                        }
+                    },
+                    emphasis: {
+                        focus: 'series'
+                    },
+                    data: [arr1[j].value]
+                }
+                arr.push(obj)
+            } else {
+                arr[n].data.push(arr1[j].value)
+            }
+        }
+    }
+    return arr;
+}
+export default function createOpt(dx=[], ds=[]) {
+    let data = createData(ds)
     return {
         grid: {
             left: '3%',
@@ -45,7 +87,13 @@ export default function createOpt() {
                     color: "#fff",
                 },
             },
-            data: ['00:00', '04:00', '08:00', '12:00', '16:00', '20:00', '24:00']
+            axisLabel: {
+                formatter: (value) => {
+                    let str = value.substring(10, 16)
+                    return str;
+                }
+            },
+            data: dx
         },
         yAxis: {
             type: 'value',
@@ -62,73 +110,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: 'APP',
-                type: 'line',
-                stack: 'Total',
-                symbol: 'none',
-                areaStyle: {
-                    opacity: 0.4
-                },
-                emphasis: {
-                    focus: 'series'
-                },
-                data: [1260, 1280, 1390, 1570, 1790, 1950, 2020]
-            },
-
-        ]
+        series: data
     }
 }