zx-微博详情-车型热度，词云分布，kol

public/index.html

@@ -12,6 +12,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <meta name="referrer" content="no-referrer">
     <link rel="icon" href="<%= BASE_URL %>sws_32.ico">
     <title>硕为思汽车智能洞察系统</title>
   </head>

src/api/WeiboDetails/index.js

@@ -85,3 +85,93 @@ export function getRegionWeiBo(params) {
         }
     })
 }
+
+//正面词云
+export function getPositive(params) {
+    let obj =  Object.assign({action: 'getPositive', sType: 'BrandWeiBo'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+//负面词云
+export function getNegative(params) {
+    let obj =  Object.assign({action: 'getNegative', sType: 'BrandWeiBo'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+//正面观点KOL
+export function getCoreDiffuseWeiBo0528(params) {
+    let obj =  Object.assign({action: 'getCoreDiffuseWeiBo0528', sType: 'BrandWeiBo'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+//调性分布
+export function getBoauthenAffectionsWeiBo0528(params) {
+    let obj =  Object.assign({action: 'getBoauthenAffectionsWeiBo0528', sType: 'BrandWeiBo'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+//车型热度-热门车型
+export function getCartypeWeiBo0528(params) {
+    let obj =  Object.assign({action: 'getCartypeWeiBo0528', sType: 'BrandWeiBo'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+//车型热度-热赞/热议/热转车型
+export function getTopCarseriesObj(params) {
+    let obj =  Object.assign({action: 'getTopCarseriesObj', sType: 'BrandWeiBo'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}
+
+//微博传播裂变
+export function getDiffuseZhuTi(params) {
+    let obj =  Object.assign({action: 'getDiffuseZhuTi', sType: 'BrandWeiBo'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}

src/views/WeiboDetails/modelPopularity/index.vue

@@ -11,27 +11,161 @@
   <div class="mp-outter">
     <v-label-div title="车型热度">
       <div>
-              <v-tab-group :btns="['热门', '热赞', '热议','热转']"></v-tab-group>
+        <v-tab-group
+          :btns="['热门', '热赞', '热议', '热转']"
+          @change="handlerTab"
+        ></v-tab-group>
       </div>
     </v-label-div>
     <div class="mp-inner">
-            <v-ranking-mpth :num="1" label="奥迪A4" val="594614" :lineShow="false"></v-ranking-mpth>
+      <v-ranking-mpth
-            <v-ranking-mpth :num="2" label="奥迪A1" val="594614"></v-ranking-mpth>
+        v-for="(item, index) in labelArr"
-            <v-ranking-mpth :num="3" label="奥迪S3" val="594614"></v-ranking-mpth>
+        :key="index"
-            <v-ranking-mpth :num="4" label="奥迪A6" val="594614"></v-ranking-mpth>
+        :num="index + 1"
-            <v-ranking-mpth :num="5" label="奥迪S5" val="594614"></v-ranking-mpth>
+        :label="item.key"
+        :val="item.value"
+      ></v-ranking-mpth>
     </div>
   </div>
 </template>
 
 <script>
-import vRankingMpth from "./v-ranking-mpth"
+import { getCartypeWeiBo0528 } from "@/api/WeiboDetails/index.js";
+import { getTopCarseriesObj } from "@/api/WeiboDetails/index.js";
+import vRankingMpth from "./v-ranking-mpth";
 export default {
   name: "modelPopularity",
+  data() {
+    return {
+      form: {
+        sBrand: "",
+        token: "",
+        iType: "",
+      },
+      labelArr: [],
+      hotSeries: [],
+      hotTypes: [],
+      hotComs: [],
+      hotTrans: [],
+    };
+  },
   components: {
-        vRankingMpth
+    vRankingMpth,
+  },
+
+  created() {
+    this.form.token = this.getToken;
+    this.form.sBrand = this.getBrand.brandname || this.brand;
+    this.getData();
+  },
+
+  methods: {
+    getData() {
+      Promise.all([
+        this.getHotSeries(),
+        this.getHotTypes(),
+        this.getHotComs(),
+        this.getHotTrans(),
+      ]).then(() => {
+        // 什么也不执行
+        this.handlerTab(0);
+      });
+    },
+    //热门
+    getHotSeries() {
+      return new Promise((resolve, reject) => {
+        this.form.iType = "";
+        let obj = Object.assign({}, this.getCtime2, this.form);
+        getCartypeWeiBo0528(obj)
+          .then((res) => {
+            let data = res.data || {};
+            this.hotSeries = this.toArr(data);
+            resolve(res);
+          })
+          .catch(() => {
+            reject(false);
+          });
+      });
+    },
+    //热赞
+    getHotTypes() {
+      return new Promise((resolve, reject) => {
+        this.form.iType = 1; //改变参数写在里面
+        let obj = Object.assign({}, this.getCtime2, this.form);
+        getTopCarseriesObj(obj)
+          .then((res) => {
+            this.hotTypes = res.data;
+            resolve(res);
+          })
+          .catch(() => {
+            reject(false);
+          });
+      });
+    },
+    //热议
+    getHotComs() {
+      return new Promise((resolve, reject) => {
+        this.form.iType = 2;
+        let obj = Object.assign({}, this.getCtime2, this.form);
+        getTopCarseriesObj(obj)
+          .then((res) => {
+            this.hotComs = res.data;
+            resolve(res);
+          })
+          .catch(() => {
+            reject(false);
+          });
+      });
+    },
+    //热转
+    getHotTrans() {
+      return new Promise((resolve, reject) => {
+        this.form.iType = 3;
+        let obj = Object.assign({}, this.getCtime2, this.form);
+        getTopCarseriesObj(obj)
+          .then((res) => {
+            this.hotTrans = res.data;
+            resolve(res);
+          })
+          .catch(() => {
+            reject(false);
+          });
+      });
+    },
+    // 将对象变成数组
+    toArr(obj) {
+      let arr = [];
+      for (let key in obj) {
+        let o = {
+          key: key,
+          value: obj[key],
+        };
+        arr.push(o);
       }
-}
+      return arr;
+    },
+    // 切换数据
+    handlerTab(n) {
+      switch (n) {
+        case 0:
+          this.labelArr = this.hotSeries;
+          break;
+        case 1:
+          this.labelArr = this.hotTypes;
+          break;
+        case 2:
+          this.labelArr = this.hotComs;
+          break;
+        case 3:
+          this.labelArr = this.hotTrans;
+          break;
+        default:
+          this.labelArr = this.hotSeries;
+          break;
+      }
+    },
+  },
+};
 </script>
 
 <style lang="less" scoped>

src/views/WeiboDetails/negativeOpinionKOL/index.vue

@@ -11,8 +11,10 @@
         <v-label-div title="负面观点KOL">
         </v-label-div>
         <div class="pv-inner">
-            <div class="pv-item" v-for="(item,index) in list" :key="index">
+            <div class="pv-item" v-for="(item,index) in ds" :key="index">
-                <div class="dm"></div>
+                <div class="dm">
+                    <img class="dm-m1" :src="item.url"/>
+                </div>
                 <div class="d-f">
                     <div class="d1">{{item.title}}</div>
                     <div class="d2">粉丝数：<span class="d2-s1">{{item.fans}}</span></div>
@@ -23,37 +25,45 @@
 </template>
 
 <script>
+import {getCoreDiffuseWeiBo0528} from "@/api/WeiboDetails"
 export default {
     name: "negativeOpinionKOL",
     data() {
         return {
-            list: [
+            ds:[],
-                {
+            form: {
-                    title: "汽车之家",
+                sBrand: "",
-                    fans: '1106w'
+                sQingGan: "2",
-                },
+                iSize: 6,
-                {
+                token: "",
-                    title: "爱卡汽车",
-                    fans: '1326w'
             },
-                {
+        }
-                    title: "新浪汽车",
-                    fans: '1326w'
     },
-                {
+    created() {
-                    title: "车评人",
+        this.form.token = this.getToken;
-                    fans: '1326w'
+        this.form.sBrand = this.getBrand.brandname || this.brand;
+        this.getData();
     },
-                {
+    methods: {
-                    title: "汽车专家",
+        getData() {
-                    fans: '1326w'
+            let obj = Object.assign({}, this.getCtime2, this.form);
+            getCoreDiffuseWeiBo0528(obj).then(res => {
+                let data = res.data || [];
+                //用户名: data._sourse.user_author
+                //粉丝数: data._sourse.weibofans
+                //头像: data._sourse.profileimgurl
+                let arr = [];
+                data.forEach((ele) => {
+                    let o={
+                        title: ele._source.user_author,
+                        fans: ele._source.weibofans,
+                        url: ele._source.profileimgurl
+                    };
+                    arr.push(o);
+                })
+                this.ds = arr;
+            });
         },
-                 {
-                    title: "萝卜报告",
-                    fans: '1326w'
-                }
-            ]
-        }
     }
 };
 </script>
@@ -90,6 +100,11 @@ export default {
                 top: 0px;
                 background-color: #fff;
                 z-index: 10;
+                .dm-m1 {
+                    width: 100%;
+                    height: 100%;
+                    border-radius: 100%;
+                }
             }
             .d-f {
                 position: absolute;

src/views/WeiboDetails/positiveViewKOL/index.vue

@@ -8,14 +8,17 @@
 -->
 <template>
   <div class="pv-outter">
-        <v-label-div title="正面观点KOL">
+    <v-label-div title="正面观点KOL"> </v-label-div>
-        </v-label-div>
     <div class="pv-inner">
-            <div class="pv-item" v-for="(item,index) in list" :key="index">
+      <div class="pv-item" v-for="(item, index) in ds" :key="index">
-                <div class="dm"></div>
+        <div class="dm">
+          <img class="dm-m1" :src="item.url"/>
+        </div>
         <div class="d-f">
-                    <div class="d1">{{item.title}}</div>
+          <div class="d1">{{ item.title }}</div>
-                    <div class="d2">粉丝数：<span class="d2-s1">{{item.fans}}</span></div>
+          <div class="d2">
+            粉丝数：<span class="d2-s1">{{ item.fans }}</span>
+          </div>
         </div>
       </div>
     </div>
@@ -23,38 +26,46 @@
 </template>
 
 <script>
+import { getCoreDiffuseWeiBo0528 } from "@/api/WeiboDetails";
 export default {
   name: "positiveViewKOL",
   data() {
     return {
-            list: [
+      ds: [],
-                {
+      form: {
-                    title: "新浪汽车",
+        sBrand: "",
-                    fans: '1106w'
+        sQingGan: "1",
+        iSize: 6,
+        token: "",
       },
-                {
+    };
-                    title: "易车",
-                    fans: '1326w'
   },
-                {
+  created() {
-                    title: "主编说车",
+    this.form.token = this.getToken;
-                    fans: '1326w'
+    this.form.sBrand = this.getBrand.brandname || this.brand;
+    this.getData();
   },
-                {
+  methods: {
-                    title: "我是评车人",
+    getData() {
-                    fans: '1326w'
+      let obj = Object.assign({}, this.getCtime2, this.form);
+      getCoreDiffuseWeiBo0528(obj).then((res) => {
+        let data = res.data || [];
+        //用户名: data._sourse.user_author
+        //粉丝数: data._sourse.weibofans
+        //头像: data._sourse.profileimgurl
+        let arr = [];
+        data.forEach((ele) => {
+          let o = {
+            title: ele._source.user_author,
+            fans: ele._source.weibofans,
+            url: ele._source.profileimgurl,
+          };
+          arr.push(o);
+        });
+        this.ds = arr;
+      });
     },
-                {
-                    title: "汽车老手",
-                    fans: '1326w'
   },
-                 {
-                    title: "艾兰汽车",
-                    fans: '1326w'
-                }
-            ]
-        }
-    }
 };
 </script>
 
@@ -89,6 +100,11 @@ export default {
         top: 0px;
         background-color: #fff;
         z-index: 10;
+        .dm-m1 {
+            width: 100%;
+            height: 100%;
+            border-radius: 100%;
+        }
       }
       .d-f {
         position: absolute;

src/views/WeiboDetails/weiboWordCloud/index.vue

@@ -7,10 +7,13 @@
  * @FilePath: /data-show/src/views/WeiboDetails/weiboWordCloud/index.vue
 -->
 <template>
-    <div class="wwc-outter">
+  <div class="wwc-outter" v-loading="load">
     <v-label-div title="词云分布">
       <div>
-              <v-tab-group :btns="['正面', '负面']"></v-tab-group>
+        <v-tab-group
+          :btns="['正面', '负面']"
+          @change="handlerTab"
+        ></v-tab-group>
       </div>
     </v-label-div>
     <div class="wwc-inner">
@@ -20,19 +23,84 @@
 </template>
 
 <script>
-import createOpt from "./opt"
+import { getNegative } from "@/api/WeiboDetails";
+import { getPositive } from "@/api/WeiboDetails";
+import createWordCloud from "@/utils/gol/bubbleWord";
+//import createOpt from "./opt";
 export default {
   name: "weiboWordCloud",
   data() {
     return {
-            opt: createOpt()
+      opt: {},
+      load: false,
+      positiveData: {},
+      negativeData: {},
+      form: {
+        sBrand: "",
+        token: "",
+      },
+    };
+  },
+  created() {
+    this.form.token = this.getToken;
+    this.form.sBrand = this.getBrand.brandname || this.brand;
+    this.getData();
+  },
+  methods: {
+    getData() {
+      this.load = true;
+      Promise.all([this.getH(),this.getF()]).then(() => {
+          // 什么也不执行
+          this.handlerTab(0)
+          this.load = false;
+      })
+    },
+    // 正面
+    getH() {
+      return new Promise((resolve, reject) => {
+        let obj = Object.assign({}, this.getCtime2, this.form);
+        getPositive(obj)
+          .then((res) => {
+            this.positiveData = res.data || {};
+            resolve(res);
+          })
+          .catch(() => {
+            reject(false);
+          });
+      });
+    },
+    // 负面
+    getF() {
+      return new Promise((resolve, reject) => {
+        let obj = Object.assign({}, this.getCtime2, this.form);
+        getNegative(obj).then((res) => {
+          this.negativeData = res.data || {};
+          resolve(res)
+        }).catch(() => {
+            reject(false);
+        });
+      });
+    },
+    // 切换数据
+    handlerTab(n) {
+      switch (n) {
+        case 0:
+          this.opt = createWordCloud(this.positiveData);
+          break;
+        case 1:
+          this.opt = createWordCloud(this.negativeData);
+          break;
+        default:
+          this.opt = createWordCloud(this.positiveData);
+          break;
       }
-    }
+    },
-}
+  },
+};
 </script>
 
 <style lang="less" scoped>
-.wwc-outter{
+.wwc-outter {
   width: 460px;
   height: 460px;
   border: 2px solid #0f2a4d;