From 138ed224c67bf08ef96e4ece6991f7e04d06b5cd Mon Sep 17 00:00:00 2001
From: zx <604444282@qq.com>
Date: Tue, 5 Jul 2022 14:45:16 +0800
Subject: [PATCH] zx

---
 src/api/BrandInsight/index.js                 |  13 +
 src/api/EventdEC/index.js                     |  14 ++
 src/api/ModelInsight/index.js                 |  13 +
 .../keyCommunicationPositions/index.vue       | 100 ++++++++
 .../v-ranking-fhtd/index.vue                  | 230 ++++++++++++++++++
 src/views/BrandInsight/titsopo/index.vue      |  12 +-
 src/views/BrandInsight/titsopo/opt.js         |   4 +-
 src/views/EventDEC/esprocess/index.vue        |   2 +-
 src/views/EventDEC/index.vue                  |  23 +-
 .../keyCommunicationPositions/index.vue       | 105 ++++++++
 .../v-ranking-fhtd/index.vue                  | 230 ++++++++++++++++++
 .../keyCommunicationPositionsStoken/index.vue |  60 +++++
 .../tonalCommunicationPosture/index.vue       |   2 +-
 .../tonalCommunicationPostureStoken/index.vue |   2 +-
 .../ModelInsight/ml-brand-data/index.vue      |   3 +-
 src/views/ModelInsight/ml-tts/index.vue       |  12 +-
 src/views/ModelInsight/ml-tts/opt.js          |   4 +-
 .../mlKeyCommunicationPositions/index.vue     | 109 +++++++++
 .../v-ranking-fhtd/index.vue                  | 230 ++++++++++++++++++
 .../ModelInsight/mlWeiboVolumeTrend/index.vue |   1 -
 20 files changed, 1147 insertions(+), 22 deletions(-)
 create mode 100644 src/views/BrandInsight/keyCommunicationPositions/index.vue
 create mode 100644 src/views/BrandInsight/keyCommunicationPositions/v-ranking-fhtd/index.vue
 create mode 100644 src/views/EventDEC/keyCommunicationPositions/index.vue
 create mode 100644 src/views/EventDEC/keyCommunicationPositions/v-ranking-fhtd/index.vue
 create mode 100644 src/views/EventDEC/keyCommunicationPositionsStoken/index.vue
 create mode 100644 src/views/ModelInsight/mlKeyCommunicationPositions/index.vue
 create mode 100644 src/views/ModelInsight/mlKeyCommunicationPositions/v-ranking-fhtd/index.vue

diff --git a/src/api/BrandInsight/index.js b/src/api/BrandInsight/index.js
index 458cac1..484e567 100644
--- a/src/api/BrandInsight/index.js
+++ b/src/api/BrandInsight/index.js
@@ -45,6 +45,19 @@ export function getSourcetypeTime(params) {
     })
 }
 
+//品牌洞察-重点媒体
+export function getWebsiteBrand(params) {
+    let obj =  Object.assign({action: 'getWebsite', sType: 'BrandOverview'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
 // 舆情调性
 export function getAffections(params) {
     let obj =  Object.assign({action: 'getAffections', sType: 'BrandOverview'}, params)
diff --git a/src/api/EventdEC/index.js b/src/api/EventdEC/index.js
index 743b506..cc6d10d 100644
--- a/src/api/EventdEC/index.js
+++ b/src/api/EventdEC/index.js
@@ -35,6 +35,20 @@ export function toExcel(params) {
         }
     })
 }
+
+// 事件详情-重点媒体
+export function getWebsiteEvent(params) {
+    let obj =  Object.assign({action: 'getWebsite', sType: 'HotEvent'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
 // 事件影响力-事件影响力
 export function getCountOrEffectOrHot(params) {
     let obj =  Object.assign({action: 'getCountOrEffectOrHot', sType: 'HotEvent'}, params)
diff --git a/src/api/ModelInsight/index.js b/src/api/ModelInsight/index.js
index afcf191..45540f1 100644
--- a/src/api/ModelInsight/index.js
+++ b/src/api/ModelInsight/index.js
@@ -48,6 +48,19 @@ export function getSourcetypeTime(params) {
     })
 }
 
+// 车型洞察-重点媒体
+export function getWebsiteModel(params) {
+    let obj =  Object.assign({action: 'getWebsite', sType: 'BrandOverview'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
 // 车型热门事件列表
 export function getHotEventsList0528(params) {
     let obj =  Object.assign({action: 'getHotEventsList0528', sType: 'HotEvent'}, params)
diff --git a/src/views/BrandInsight/keyCommunicationPositions/index.vue b/src/views/BrandInsight/keyCommunicationPositions/index.vue
new file mode 100644
index 0000000..fe02957
--- /dev/null
+++ b/src/views/BrandInsight/keyCommunicationPositions/index.vue
@@ -0,0 +1,100 @@
+<!--
+ * @Author: xw
+ * @Date: 2021-10-08 16:37:30
+ * @LastEditTime: 2021-12-16 09:43:56
+ * @LastEditors: Please set LastEditors
+ * @Description: 传播重点阵地
+ * @FilePath: /data-show/src/views/Index/key-communication-positions/index.vue
+-->
+<template>
+    <div class="kcp-outter" v-loading="load">
+        <v-label-div title="传播重点阵地"></v-label-div>
+        <vue-scroll>
+        <div class="kcp-inner">
+            <div class="d1">
+                <v-ranking-fhtd :num="index * 2 + 1" :label="item.label" :val="item.val" :lineShow="index === 0 ?false : true" v-for="(item,index) in d1" :key="index"></v-ranking-fhtd>
+            </div>
+            <div class="d2" style="margin-left: 16px">
+                <v-ranking-fhtd :num="index * 2 + 2" :label="item.label" :val="item.val" :lineShow="index === 0 ?false : true" v-for="(item,index) in d2" :key="index"></v-ranking-fhtd>
+            </div>
+        </div>
+        </vue-scroll>
+    </div>
+</template>
+
+<script>
+import { getWebsiteBrand } from "@/api/BrandInsight";
+import vRankingFhtd from "./v-ranking-fhtd";
+export default {
+    name: "key-communication-positions",
+    props: ["brand"],
+    components: {
+        "v-ranking-fhtd": vRankingFhtd,
+    },
+    data() {
+        return {
+            load: false,
+            d1: [],
+            d2: [],
+            form: {
+                token: "",
+                sBrand: "奥迪",
+            },
+        };
+    },
+    created() {
+        this.form.token = this.getToken;
+        this.form.sBrand = this.getBrand.brandname || this.brand;
+        this.getData();
+    },
+    methods: {
+        // 获取数据
+        getData() {
+            this.load = true;
+            let obj = Object.assign({}, this.getCtime2, this.form);
+            getWebsiteBrand(obj).then((res) => {
+                let data = res.data;
+                let vals = [];
+                for (let key in data) {
+                    let obj = { label: key, val: data[key] };
+                    vals.push(obj);
+                };
+                let arr1 = [];let arr2 = [];
+                for(let i=0;i<vals.length;i++) {
+                    if(i%2 == 0) {
+                        arr1.push(vals[i])
+                    } else {
+                        arr2.push(vals[i])
+                    }
+                }
+                this.d1 = arr1;
+                this.d2 = arr2;
+                this.load = false;
+            });
+        },
+    },
+};
+</script>
+
+<style lang="less" scoped>
+.kcp-outter {
+    width: 618px;
+    height: 240px;
+    border: 2px solid #0f2a4d;
+    margin-top: 16px;
+    display: flex;
+    flex-direction: column;
+}
+.kcp-inner {
+    display: flex;
+    justify-content: flex-start;
+    padding: 0 16px;
+    height: calc(100% - 48px);
+    overflow: hidden;
+    .d1 {
+        display: flex;
+        flex-direction: column;
+        height: 100%;
+    }
+}
+</style>
diff --git a/src/views/BrandInsight/keyCommunicationPositions/v-ranking-fhtd/index.vue b/src/views/BrandInsight/keyCommunicationPositions/v-ranking-fhtd/index.vue
new file mode 100644
index 0000000..a6be586
--- /dev/null
+++ b/src/views/BrandInsight/keyCommunicationPositions/v-ranking-fhtd/index.vue
@@ -0,0 +1,230 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-10-08 16:44:08
+ * @LastEditTime: 2021-11-09 16:25:31
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/components/v-ranking/index.vue
+-->
+<template>
+  <div class="v-r-container">
+    <div class="v-r-line" v-if="lineShow"></div>
+    <div class="v-r-inner">
+      <div :class="ls">
+        <span class="s1">{{ num|numStr }}</span>
+      </div>
+      <div :class="rs">
+          <span class="v-r-label">{{label}}</span>
+          <div class="v-r-res">
+              <span class="s1">传播量</span>
+              <span class="s2">{{val}}</span>
+          </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "v-ranking-fhtd",
+  props: {
+    num: {
+      type: [String, Number],
+      default: 1,
+    },
+    val: {
+        type: [String, Number],
+        default: 0
+    },
+    label: {
+        type: String,
+        default: ""
+    },
+    lineShow: {
+        type: Boolean,
+        default: true
+    },
+    
+  },
+  watch: {
+      num: {
+          handler(val) {
+              if(val == 1) {
+                  this.ls = "v-r-left-1"
+                  this.rs = "v-r-right-1"
+              } else if(val == 2) {
+                  this.ls = "v-r-left-2"
+                  this.rs = "v-r-right-2"
+              } else if(val == 3) {
+                  this.ls = "v-r-left-3"
+                  this.rs = "v-r-right-3"
+              } else {
+                  this.ls = "v-r-left"
+                  this.rs = "v-r-right"
+              }
+          },
+          immediate: true
+      }
+  },
+  data() {
+      return  {
+          ls: "v-r-left",
+          rs: "v-r-right"
+      }
+  },
+  filters: {
+        numStr(val) {
+            let str = ""
+            if(0<val && val<10) {
+                str = '0' + val
+            } else {
+                str = val + ''
+            }
+            return str
+        }
+    }
+};
+</script>
+
+<style lang="less" scoped>
+.v-r-container {
+  width: 282px;
+  height: auto;
+  .v-r-line {
+    width: 100%;
+    height: 1px;
+    background:#0a1d3b;
+    margin-top: 8px;
+    margin-bottom: 8px;
+  }
+  .v-r-inner {
+    position: relative;
+    width: 100%;
+    height: 48px;
+    margin-top: 6px;
+    color: #fff;
+    background: #0a1d3b;
+    border-radius: 2px;
+  }
+  .v-r-label {
+      display: block;
+      font-size: 14px;
+      color: #FFFFFF;
+      margin-left: 40px;
+      font-weight: bold;
+  }
+  .v-r-res {
+      margin-right: 24px;
+      span {
+          display: block;
+          text-align: right;
+          font-size: 12px;
+      }
+      .s1 {
+          color: #9ba4af;
+      }
+      .s2 {
+          color: #fff;
+          font-family: Bebas;
+      }
+  }
+  .v-r-left {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    .s1 {
+      color: #99a2ad;
+      font-size: 16px;
+      line-height: 48px;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right {
+      position: absolute;
+      width: 260px;
+      height: 48px;
+      border-top: 2px solid transparent;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-1 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #cc9d12;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #cc9d12;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-1 {
+      position: absolute;
+      width: 260px;
+      height: 48px;
+      border-top: 2px solid #CC9D12;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-2 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #3373CC;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #3373CC;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-2 {
+      position: absolute;
+      width: 260px;
+      height: 48px;
+      border-top: 2px solid #3373CC;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-3 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #54BF93;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #54BF93;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-3 {
+      position: absolute;
+      width: 260px;
+      height: 48px;
+      border-top: 2px solid #54BF93;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+}
+</style>
diff --git a/src/views/BrandInsight/titsopo/index.vue b/src/views/BrandInsight/titsopo/index.vue
index 40cd380..3e3db9f 100644
--- a/src/views/BrandInsight/titsopo/index.vue
+++ b/src/views/BrandInsight/titsopo/index.vue
@@ -12,7 +12,8 @@
             <a-button type="primary" size="small" @click="goIDE" v-has="'btn_brand_datalist'">进入数据列表页</a-button>
             <a-button type="primary" style="margin-left: 1rem;margin-right: 1rem;" size="small" :loading="btnLoading" @click="exportData" v-has="'btn_brand_toppt'">导出报告</a-button>
         </div>
-        <div class="tit-inner">
+        <keyCommunicationPositions :brand="brand"></keyCommunicationPositions>
+        <div class="tit-inner" v-loading="load">
             <vLabel-div title="舆情传播趋势"></vLabel-div>
             <div class="tit-bd">
                 <v-echarts :opt="opt" @clickMark="clickMark"  @getData="clickEchars"></v-echarts>
@@ -34,6 +35,7 @@
 </template>
 
 <script>
+import keyCommunicationPositions from "@/views/BrandInsight/keyCommunicationPositions";
 import { getSourcetypeTime, getToPptTask } from "@/api/BrandInsight";
 import {doStr} from "@/utils/gol/dataTool"
 import moment from "moment";
@@ -41,6 +43,7 @@ import createOpt from "./opt";
 export default {
     name: "titsopo",
     props: ["brand"],
+    components: {keyCommunicationPositions},
     data() {
         return {
             //弹出框//
@@ -221,11 +224,11 @@ export default {
 <style lang="less" scoped>
 .tit-outter {
     width: 618px;
-    height: 560px;
+    height: 280px;
     margin-left: 16px;
     .tit-header {
         width: 100%;
-        height: 48px;
+        height: 24px;
         background: linear-gradient(270deg, #07192f 0%, #010b19 100%);
         display: flex;
         justify-content: flex-end;
@@ -233,7 +236,7 @@ export default {
     }
     .tit-inner {
         width: 100%;
-        height: 490px;
+        height: 260px;
         margin-top: 16px;
         border: 2px solid #0f2a4d;
         .tit-bd {
@@ -262,6 +265,7 @@ export default {
     width: 300px;
     background: rgb(3, 18, 36);
     border: 4px solid #0f2a4d;
+    margin-top: 260px;
     .vshow-item {
         padding: 11px;
         width: 100%;
diff --git a/src/views/BrandInsight/titsopo/opt.js b/src/views/BrandInsight/titsopo/opt.js
index 7144848..f0f62c5 100644
--- a/src/views/BrandInsight/titsopo/opt.js
+++ b/src/views/BrandInsight/titsopo/opt.js
@@ -112,8 +112,8 @@ export default function createOpt(dx = [], ds = [], hotTopArr=[], hotIndex = [])
                 color: '#fff',
                 fontSize: 10,
             },
-            y: 12,
-            x: 16,
+            y: 3,
+            x: 12,
             itemWidth: 12,
             itemHeight: 12
 
diff --git a/src/views/EventDEC/esprocess/index.vue b/src/views/EventDEC/esprocess/index.vue
index 4c72ab8..70cd344 100644
--- a/src/views/EventDEC/esprocess/index.vue
+++ b/src/views/EventDEC/esprocess/index.vue
@@ -15,7 +15,7 @@
             <div class="coe-ts-d2">
                 <vue-scroll ref="vs">
                     <div class="dd1-label">
-                        <div class="d1x">新车上市</div>
+                        <div class="d1x">传播开始</div>
                         <div class="d2">状态：事件发生</div>
                         <div class="d3">2021-06-01 11:26</div>
                     </div>
diff --git a/src/views/EventDEC/index.vue b/src/views/EventDEC/index.vue
index be943d1..17fab54 100644
--- a/src/views/EventDEC/index.vue
+++ b/src/views/EventDEC/index.vue
@@ -44,10 +44,16 @@
             <incidentSpreadSituation :id="events_id"></incidentSpreadSituation>
             <incidentSpreadSituationStoken slot="skeleton"></incidentSpreadSituationStoken>
             </vue-lazy-component>
-            <vue-lazy-component>
-            <tonalCommunicationPosture :id="events_id"></tonalCommunicationPosture>
-            <tonalCommunicationPostureStoken slot="skeleton"></tonalCommunicationPostureStoken>
-            </vue-lazy-component>
+            <div class="edec-d3">
+                <vue-lazy-component>
+                <tonalCommunicationPosture :id="events_id"></tonalCommunicationPosture>
+                <tonalCommunicationPostureStoken slot="skeleton"></tonalCommunicationPostureStoken>
+                </vue-lazy-component>
+                <vue-lazy-component>
+                <keyCommunicationPositions :id="events_id"></keyCommunicationPositions>
+                <keyCommunicationPositionsStoken slot="skeleton"></keyCommunicationPositionsStoken>
+                </vue-lazy-component>
+            </div>
             <vue-lazy-component>
             <esprocess :id="events_id"></esprocess>
             <esprocessStoken slot="skeleton"></esprocessStoken>
@@ -88,6 +94,7 @@
 <script>
 import incidentSpreadSituation from "./incidentSpreadSituation";
 import tonalCommunicationPosture from "./tonalCommunicationPosture";
+import keyCommunicationPositions from "./keyCommunicationPositions";
 import esprocess from "./esprocess";
 import mediaInterpretationEc from "./mediaInterpretationEc";
 import mediaInterpretationED from "./mediaInterpretationED";
@@ -98,6 +105,7 @@ import pnwcWord from "./pnwcWord"
 //骨架屏
 import incidentSpreadSituationStoken from "./incidentSpreadSituationStoken";
 import tonalCommunicationPostureStoken from "./tonalCommunicationPostureStoken";
+import keyCommunicationPositionsStoken from "./keyCommunicationPositionsStoken";
 import esprocessStoken from "./esprocessStoken";
 import mediaInterpretationEcStoken from "./mediaInterpretationEcStoken";
 import mediaInterpretationEDStoken from "./mediaInterpretationEDStoken";
@@ -112,6 +120,7 @@ export default {
     components: {
         incidentSpreadSituation, // 事件传播态势
         tonalCommunicationPosture, // 调性传播态势
+        keyCommunicationPositions, // 重点传播阵地
         esprocess, // 事件传播历程
         mediaInterpretationEc, // 事件传播历程-媒体解读
         mediaInterpretationED, // 媒体解读
@@ -122,6 +131,7 @@ export default {
         //骨架屏
         incidentSpreadSituationStoken, // 事件传播态势
         tonalCommunicationPostureStoken, // 调性传播态势
+        keyCommunicationPositionsStoken, // 重点传播阵地
         esprocessStoken, // 事件传播历程
         mediaInterpretationEcStoken, // 事件传播历程-媒体解读
         mediaInterpretationEDStoken, // 媒体解读
@@ -276,4 +286,9 @@ export default {
         justify-content: flex-start;
     }
 }
+.edec-d3 {
+    width: 100%;
+    display: flex;
+    justify-content: flex-start;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/EventDEC/keyCommunicationPositions/index.vue b/src/views/EventDEC/keyCommunicationPositions/index.vue
new file mode 100644
index 0000000..e691a29
--- /dev/null
+++ b/src/views/EventDEC/keyCommunicationPositions/index.vue
@@ -0,0 +1,105 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-10-12 16:48:36
+ * @LastEditTime: 2021-11-01 18:07:12
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/forumHotTopicDirection/index.vue
+-->
+<template>
+    <div class="fhtd-outter" v-loading="load">
+        <v-label-div title="传播重点阵地" :eStyle="{ 'border-style': 'none' }" />
+        <div class="fhtd-inner">
+            <div class="d1">
+                <v-ranking-fhtd :num="index + 1" :label="item.label" :val="item.val" :lineShow="index === 0 ?false : true" v-for="(item,index) in d1" :key="index"></v-ranking-fhtd>
+            </div>
+            <div class="d2" style="margin-left: 16px">
+                <v-ranking-fhtd :num="5 + index + 1" :label="item.label" :val="item.val" :lineShow="index === 0 ?false : true" v-for="(item,index) in d2" :key="index"></v-ranking-fhtd>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { getWebsiteEvent } from "@/api/EventdEC";
+import vRankingFhtd from "./v-ranking-fhtd";
+export default {
+    name: "forumHotTopicDirection",
+    props: {
+                id: {
+                    type: String,
+                    default: "",
+                },
+            },
+    components: {
+        "v-ranking-fhtd": vRankingFhtd,
+    },
+    data() {
+        return {
+            load: false,
+            form: {
+                token: "",
+                sRele: "",
+                sTimeType: 20,
+            },
+            d1: [],
+            d2: [],
+        };
+    },
+    created() {
+        this.form.token = this.getToken;
+        this.form.sRele = this.id;
+        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() {
+            this.load = true;
+            let obj = Object.assign({}, this.form);
+            getWebsiteEvent(obj).then((res) => {
+                let data = res.data;
+                let vals = [];
+                for (let key in data) {
+                    let obj = { label: key, val: data[key] };
+                    vals.push(obj);
+                };
+                let arr1 = [];let arr2 = [];
+                for(let i=0;i<vals.length;i++) {
+                    if(i%2 == 0) {
+                        arr1.push(vals[i])
+                    } else {
+                        arr2.push(vals[i])
+                    }
+                }
+                this.d1 = arr1;
+                this.d2 = arr2;
+                this.load = false;
+            });
+        },
+    },
+};
+</script>
+
+<style lang="less" scoped>
+.fhtd-outter {
+    width: 658px;
+    height: 460px;
+    margin-left: 16px;
+    border: 2px solid #0f2a4d;
+    margin-top: 16px;
+    .fhtd-inner {
+        padding: 16px 16px 16px 16px;
+        height: auto;
+        display: flex;
+        justify-content: flex-start;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/EventDEC/keyCommunicationPositions/v-ranking-fhtd/index.vue b/src/views/EventDEC/keyCommunicationPositions/v-ranking-fhtd/index.vue
new file mode 100644
index 0000000..0be9293
--- /dev/null
+++ b/src/views/EventDEC/keyCommunicationPositions/v-ranking-fhtd/index.vue
@@ -0,0 +1,230 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-10-08 16:44:08
+ * @LastEditTime: 2021-11-09 16:25:31
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/components/v-ranking/index.vue
+-->
+<template>
+  <div class="v-r-container">
+    <div class="v-r-line" v-if="lineShow"></div>
+    <div class="v-r-inner">
+      <div :class="ls">
+        <span class="s1">{{ num|numStr }}</span>
+      </div>
+      <div :class="rs">
+          <span class="v-r-label">{{label}}</span>
+          <div class="v-r-res">
+              <span class="s1">传播量</span>
+              <span class="s2">{{val}}</span>
+          </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "v-ranking-fhtd",
+  props: {
+    num: {
+      type: [String, Number],
+      default: 1,
+    },
+    val: {
+        type: [String, Number],
+        default: 0
+    },
+    label: {
+        type: String,
+        default: ""
+    },
+    lineShow: {
+        type: Boolean,
+        default: true
+    },
+    
+  },
+  watch: {
+      num: {
+          handler(val) {
+              if(val == 1) {
+                  this.ls = "v-r-left-1"
+                  this.rs = "v-r-right-1"
+              } else if(val == 2) {
+                  this.ls = "v-r-left-2"
+                  this.rs = "v-r-right-2"
+              } else if(val == 3) {
+                  this.ls = "v-r-left-3"
+                  this.rs = "v-r-right-3"
+              } else {
+                  this.ls = "v-r-left"
+                  this.rs = "v-r-right"
+              }
+          },
+          immediate: true
+      }
+  },
+  data() {
+      return  {
+          ls: "v-r-left",
+          rs: "v-r-right"
+      }
+  },
+  filters: {
+        numStr(val) {
+            let str = ""
+            if(0<val && val<10) {
+                str = '0' + val
+            } else {
+                str = val + ''
+            }
+            return str
+        }
+    }
+};
+</script>
+
+<style lang="less" scoped>
+.v-r-container {
+  width: 305px;
+  height: auto;
+  .v-r-line {
+    width: 100%;
+    height: 1px;
+    background:#0a1d3b;
+    margin-top: 13px;
+    margin-bottom: 13px;
+  }
+  .v-r-inner {
+    position: relative;
+    width: 100%;
+    height: 48px;
+    margin-top: 6px;
+    color: #fff;
+    background: #0a1d3b;
+    border-radius: 2px;
+  }
+  .v-r-label {
+      display: block;
+      font-size: 14px;
+      color: #FFFFFF;
+      margin-left: 40px;
+      font-weight: bold;
+  }
+  .v-r-res {
+      margin-right: 16px;
+      span {
+          display: block;
+          text-align: right;
+          font-size: 12px;
+      }
+      .s1 {
+          color: #9ba4af;
+      }
+      .s2 {
+          color: #fff;
+          font-family: Bebas;
+      }
+  }
+  .v-r-left {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    .s1 {
+      color: #99a2ad;
+      font-size: 16px;
+      line-height: 48px;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right {
+      position: absolute;
+      width: 280px;
+      height: 48px;
+      border-top: 2px solid transparent;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-1 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #cc9d12;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #cc9d12;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-1 {
+      position: absolute;
+      width: 280px;
+      height: 48px;
+      border-top: 2px solid #CC9D12;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-2 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #3373CC;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #3373CC;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-2 {
+      position: absolute;
+      width: 280px;
+      height: 48px;
+      border-top: 2px solid #3373CC;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-3 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #54BF93;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #54BF93;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-3 {
+      position: absolute;
+      width: 280px;
+      height: 48px;
+      border-top: 2px solid #54BF93;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+}
+</style>
diff --git a/src/views/EventDEC/keyCommunicationPositionsStoken/index.vue b/src/views/EventDEC/keyCommunicationPositionsStoken/index.vue
new file mode 100644
index 0000000..c7e9ef2
--- /dev/null
+++ b/src/views/EventDEC/keyCommunicationPositionsStoken/index.vue
@@ -0,0 +1,60 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-10-12 16:48:36
+ * @LastEditTime: 2021-11-01 18:07:12
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/forumHotTopicDirection/index.vue
+-->
+<template>
+    <div class="fhtd-outter">
+        <v-label-div title="传播重点阵地" :showLine="false" :eStyle="{ 'border-style': 'none' }" />
+        <div class="fhtd-inner">
+            <div class="d1">
+                <v-ranking-fhtd :num="index + 1" :label="item.key" :val="item.value" :lineShow="index === 0 ?false : true" v-for="(item,index) in d1" :key="index"></v-ranking-fhtd>
+            </div>
+            <div class="d2" style="margin-left: 16px">
+                <v-ranking-fhtd :num="5 + index + 1" :label="item.key" :val="item.value" :lineShow="index === 0 ?false : true" v-for="(item,index) in d2" :key="index"></v-ranking-fhtd>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "forumHotTopicDirection",
+    props: ["brand"],
+    data() {
+        return {
+            load: false,
+            form: {
+                sBrand: "",
+                token: "",
+            },
+            d1: [],
+            d2: [],
+        };
+    },
+    created() {
+        // this.form.token = this.getToken;
+        // this.form.sBrand = this.getBrand.brandname || this.brand;
+        // this.getData();
+    },
+    methods: {
+    },
+};
+</script>
+
+<style lang="less" scoped>
+.fhtd-outter {
+    width: 658px;
+    height: 460px;
+    margin-left: 16px;
+    .fhtd-inner {
+        padding: 0px 16px 16px 16px;
+        height: auto;
+        display: flex;
+        justify-content: flex-start;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/EventDEC/tonalCommunicationPosture/index.vue b/src/views/EventDEC/tonalCommunicationPosture/index.vue
index 6d555ac..18462f1 100644
--- a/src/views/EventDEC/tonalCommunicationPosture/index.vue
+++ b/src/views/EventDEC/tonalCommunicationPosture/index.vue
@@ -86,7 +86,7 @@ export default {
 
 <style lang="less" scoped>
 .tcp-outter {
-    width: 100%;
+    width: 1214px;
     height: 460px;
     border: 2px solid #0f2a4d;
     margin-top: 16px;
diff --git a/src/views/EventDEC/tonalCommunicationPostureStoken/index.vue b/src/views/EventDEC/tonalCommunicationPostureStoken/index.vue
index b190402..a2f206a 100644
--- a/src/views/EventDEC/tonalCommunicationPostureStoken/index.vue
+++ b/src/views/EventDEC/tonalCommunicationPostureStoken/index.vue
@@ -45,7 +45,7 @@ export default {
 
 <style lang="less" scoped>
 .tcp-outter {
-    width: 100%;
+    width: 1214px;
     height: 460px;
     border: 2px solid #0f2a4d;
     margin-top: 16px;
diff --git a/src/views/ModelInsight/ml-brand-data/index.vue b/src/views/ModelInsight/ml-brand-data/index.vue
index 6eb7407..223ffb5 100644
--- a/src/views/ModelInsight/ml-brand-data/index.vue
+++ b/src/views/ModelInsight/ml-brand-data/index.vue
@@ -136,8 +136,7 @@ export default {
                         this.affObj.a * 1 +
                         this.affObj.b * 1 +
                         this.affObj.c * 1;
-                    resolve(data)   
-                    console.log(this.affObj) 
+                    resolve(data)
                 }).catch(() => {
                     reject(false);
                 });
diff --git a/src/views/ModelInsight/ml-tts/index.vue b/src/views/ModelInsight/ml-tts/index.vue
index a7149ad..d9be88f 100644
--- a/src/views/ModelInsight/ml-tts/index.vue
+++ b/src/views/ModelInsight/ml-tts/index.vue
@@ -12,7 +12,8 @@
             <a-button type="primary" size="small" @click="goIDE" v-has="'btn_model_datalist'">进入数据列表页</a-button>
             <a-button type="primary" :loading="btnLoading" style="margin-left: 1rem;margin-right: 1rem;" size="small" v-has="'btn_model_toppt'" @click="exportData">导出报告</a-button>
         </div>
-        <div class="tit-inner">
+        <mlKeyCommunicationPositions :model="model" :brand="brand"></mlKeyCommunicationPositions>
+        <div class="tit-inner" v-loading="load">
             <vLabel-div title="舆情传播趋势"></vLabel-div>
             <div class="tit-bd">
                 <v-echarts :opt="opt" @clickMark="clickMark" @getData="clickEchars"></v-echarts>
@@ -33,6 +34,7 @@
 </template>
 
 <script>
+import mlKeyCommunicationPositions from "@/views/ModelInsight/mlKeyCommunicationPositions";
 import { getSourcetypeTime } from "@/api/ModelInsight";
 import { getToPptTask } from "@/api/BrandInsight";
 import {doStr} from "@/utils/gol/dataTool"
@@ -41,6 +43,7 @@ import createOpt from "./opt";
 export default {
     name: "ml-tts",
     props: ["brand", "model"],
+    components: {mlKeyCommunicationPositions},
     data() {
         return {
             //弹出框//
@@ -231,11 +234,11 @@ export default {
 <style lang="less" scoped>
 .tit-outter {
     width: 618px;
-    height: 560px;
+    height: 280px;
     margin-left: 16px;
     .tit-header {
         width: 100%;
-        height: 48px;
+        height: 24px;
         background: linear-gradient(270deg, #07192f 0%, #010b19 100%);
         display: flex;
         justify-content: flex-end;
@@ -243,7 +246,7 @@ export default {
     }
     .tit-inner {
         width: 100%;
-        height: 490px;
+        height: 260px;
         margin-top: 16px;
         border: 2px solid #0f2a4d;
         .tit-bd {
@@ -268,6 +271,7 @@ export default {
     width: 300px;
     background: rgb(3, 18, 36);
     border: 4px solid #0f2a4d;
+    margin-top: 260px;
     .vshow-item {
         padding: 11px;
         width: 100%;
diff --git a/src/views/ModelInsight/ml-tts/opt.js b/src/views/ModelInsight/ml-tts/opt.js
index cff30ae..40206c1 100644
--- a/src/views/ModelInsight/ml-tts/opt.js
+++ b/src/views/ModelInsight/ml-tts/opt.js
@@ -100,8 +100,8 @@ export default function createOpt(dx=[], ds=[], hotIndex=[]) {
                 color: '#fff',
                 fontSize: 10
             },
-            y: 12,
-            x: 16,
+            y: 3,
+            x: 12,
             itemWidth: 12,
             itemHeight: 12
         },
diff --git a/src/views/ModelInsight/mlKeyCommunicationPositions/index.vue b/src/views/ModelInsight/mlKeyCommunicationPositions/index.vue
new file mode 100644
index 0000000..f1cbbf8
--- /dev/null
+++ b/src/views/ModelInsight/mlKeyCommunicationPositions/index.vue
@@ -0,0 +1,109 @@
+<!--
+ * @Author: xw
+ * @Date: 2021-10-08 16:37:30
+ * @LastEditTime: 2021-12-16 09:43:56
+ * @LastEditors: Please set LastEditors
+ * @Description: 传播重点阵地
+ * @FilePath: /data-show/src/views/Index/key-communication-positions/index.vue
+-->
+<template>
+    <div class="kcp-outter" v-loading="load">
+        <v-label-div title="传播重点阵地"></v-label-div>
+        <vue-scroll>
+        <div class="kcp-inner">
+            <div class="d1">
+                <v-ranking-fhtd :num="index * 2 + 1" :label="item.label" :val="item.val" :lineShow="index === 0 ?false : true" v-for="(item,index) in d1" :key="index"></v-ranking-fhtd>
+            </div>
+            <div class="d2" style="margin-left: 16px">
+                <v-ranking-fhtd :num="index * 2 + 2" :label="item.label" :val="item.val" :lineShow="index === 0 ?false : true" v-for="(item,index) in d2" :key="index"></v-ranking-fhtd>
+            </div>
+        </div>
+        </vue-scroll>
+    </div>
+</template>
+
+<script>
+import { getWebsiteModel } from "@/api/ModelInsight";
+import vRankingFhtd from "./v-ranking-fhtd";
+export default {
+    name: "key-communication-positions",
+    props: ["brand", "model"],
+    components: {
+        "v-ranking-fhtd": vRankingFhtd,
+    },
+    data() {
+        return {
+            load: false,
+            d1: [],
+            d2: [],
+            form: {
+                sBrand: "",
+                sSeriesName: "",
+                token: "",
+            },
+        };
+    },
+    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: {
+        // 获取数据
+        getData() {
+            this.load = true;
+            let obj = Object.assign({}, this.getCtime2, this.form);
+            getWebsiteModel(obj).then((res) => {
+                let data = res.data;
+                let vals = [];
+                for (let key in data) {
+                    let obj = { label: key, val: data[key] };
+                    vals.push(obj);
+                };
+                let arr1 = [];let arr2 = [];
+                for(let i=0;i<vals.length;i++) {
+                    if(i%2 == 0) {
+                        arr1.push(vals[i])
+                    } else {
+                        arr2.push(vals[i])
+                    }
+                }
+                this.d1 = arr1;
+                this.d2 = arr2;
+                this.load = false;
+            });
+        },
+    },
+};
+</script>
+
+<style lang="less" scoped>
+.kcp-outter {
+    width: 618px;
+    height: 240px;
+    border: 2px solid #0f2a4d;
+    margin-top: 16px;
+    display: flex;
+    flex-direction: column;
+}
+.kcp-inner {
+    display: flex;
+    justify-content: flex-start;
+    padding: 0 16px;
+    height: calc(100% - 48px);
+    overflow: hidden;
+    .d1 {
+        display: flex;
+        flex-direction: column;
+        height: 100%;
+    }
+}
+</style>
diff --git a/src/views/ModelInsight/mlKeyCommunicationPositions/v-ranking-fhtd/index.vue b/src/views/ModelInsight/mlKeyCommunicationPositions/v-ranking-fhtd/index.vue
new file mode 100644
index 0000000..a6be586
--- /dev/null
+++ b/src/views/ModelInsight/mlKeyCommunicationPositions/v-ranking-fhtd/index.vue
@@ -0,0 +1,230 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-10-08 16:44:08
+ * @LastEditTime: 2021-11-09 16:25:31
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/components/v-ranking/index.vue
+-->
+<template>
+  <div class="v-r-container">
+    <div class="v-r-line" v-if="lineShow"></div>
+    <div class="v-r-inner">
+      <div :class="ls">
+        <span class="s1">{{ num|numStr }}</span>
+      </div>
+      <div :class="rs">
+          <span class="v-r-label">{{label}}</span>
+          <div class="v-r-res">
+              <span class="s1">传播量</span>
+              <span class="s2">{{val}}</span>
+          </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "v-ranking-fhtd",
+  props: {
+    num: {
+      type: [String, Number],
+      default: 1,
+    },
+    val: {
+        type: [String, Number],
+        default: 0
+    },
+    label: {
+        type: String,
+        default: ""
+    },
+    lineShow: {
+        type: Boolean,
+        default: true
+    },
+    
+  },
+  watch: {
+      num: {
+          handler(val) {
+              if(val == 1) {
+                  this.ls = "v-r-left-1"
+                  this.rs = "v-r-right-1"
+              } else if(val == 2) {
+                  this.ls = "v-r-left-2"
+                  this.rs = "v-r-right-2"
+              } else if(val == 3) {
+                  this.ls = "v-r-left-3"
+                  this.rs = "v-r-right-3"
+              } else {
+                  this.ls = "v-r-left"
+                  this.rs = "v-r-right"
+              }
+          },
+          immediate: true
+      }
+  },
+  data() {
+      return  {
+          ls: "v-r-left",
+          rs: "v-r-right"
+      }
+  },
+  filters: {
+        numStr(val) {
+            let str = ""
+            if(0<val && val<10) {
+                str = '0' + val
+            } else {
+                str = val + ''
+            }
+            return str
+        }
+    }
+};
+</script>
+
+<style lang="less" scoped>
+.v-r-container {
+  width: 282px;
+  height: auto;
+  .v-r-line {
+    width: 100%;
+    height: 1px;
+    background:#0a1d3b;
+    margin-top: 8px;
+    margin-bottom: 8px;
+  }
+  .v-r-inner {
+    position: relative;
+    width: 100%;
+    height: 48px;
+    margin-top: 6px;
+    color: #fff;
+    background: #0a1d3b;
+    border-radius: 2px;
+  }
+  .v-r-label {
+      display: block;
+      font-size: 14px;
+      color: #FFFFFF;
+      margin-left: 40px;
+      font-weight: bold;
+  }
+  .v-r-res {
+      margin-right: 24px;
+      span {
+          display: block;
+          text-align: right;
+          font-size: 12px;
+      }
+      .s1 {
+          color: #9ba4af;
+      }
+      .s2 {
+          color: #fff;
+          font-family: Bebas;
+      }
+  }
+  .v-r-left {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+    .s1 {
+      color: #99a2ad;
+      font-size: 16px;
+      line-height: 48px;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right {
+      position: absolute;
+      width: 260px;
+      height: 48px;
+      border-top: 2px solid transparent;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-1 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #cc9d12;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #cc9d12;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-1 {
+      position: absolute;
+      width: 260px;
+      height: 48px;
+      border-top: 2px solid #CC9D12;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-2 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #3373CC;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #3373CC;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-2 {
+      position: absolute;
+      width: 260px;
+      height: 48px;
+      border-top: 2px solid #3373CC;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+  .v-r-left-3 {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    border: 2px solid #54BF93;
+    border-radius: 48px;
+    .s1 {
+      color: #ffffff;
+      font-size: 16px;
+      line-height: 42px;
+      text-shadow: 0px 0px 8px #54BF93;
+      font-family: Bebas;
+    }
+  }
+  .v-r-right-3 {
+      position: absolute;
+      width: 260px;
+      height: 48px;
+      border-top: 2px solid #54BF93;
+      top: 0px;
+      left: 24px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+  }
+}
+</style>
diff --git a/src/views/ModelInsight/mlWeiboVolumeTrend/index.vue b/src/views/ModelInsight/mlWeiboVolumeTrend/index.vue
index 963704a..8afd142 100644
--- a/src/views/ModelInsight/mlWeiboVolumeTrend/index.vue
+++ b/src/views/ModelInsight/mlWeiboVolumeTrend/index.vue
@@ -98,7 +98,6 @@ export default {
             let obj = Object.assign({}, this.getCtime2, this.form);
             getCountTime0528(obj).then((res) => {
                 let data = res.data || [];
-                console.log(data)
                 let dx = [];
                 let ds = [];
                 let hotTopArr = [];