cxw-010203

src/api/EventInsight/index.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-27 17:08:02
- * @LastEditTime: 2021-10-28 13:17:27
+ * @LastEditTime: 2021-11-02 17:32:02
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/api/EventInsight/index.js
@@ -20,3 +20,16 @@ export function getPropagationDirection0528(params) {
         }
     })
 }
+
+// 行业TOP热点事件
+export function getHotEventsList(params) {
+    let obj =  Object.assign({action: 'getHotEventsList', sType: 'HotEvent'}, params)
+    return httpService({
+        url: `/api/v6.ashx`,
+        method: 'post',
+        data: obj,
+        headers: {
+            'content-type': 'application/x-www-form-urlencoded'
+        }
+    })
+}

src/lycomponents/iLayout/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-13 14:25:26
- * @LastEditTime: 2021-11-02 15:31:41
+ * @LastEditTime: 2021-11-02 17:24:34
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/lycomponents/iLayout/index.vue
@@ -31,9 +31,11 @@ export default {
     watch: {
         $route: {
             handler: function (val) {
-               if(val.name === 'index') {
-                   this.scrollShow = false;
-               }
+                if(val.name === 'index') {
+                    this.scrollShow = false;
+                } else {
+                   this.scrollShow = true; 
+                }
             },
             // 深度观察监听
             immediate: true,

src/main.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-08 08:41:57
- * @LastEditTime: 2021-10-26 13:03:47
+ * @LastEditTime: 2021-11-02 17:20:09
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/main.js
@@ -19,14 +19,14 @@ import selfUi from "@/components/index.js";
 import compon from "@/lycomponents/index.js";
 import mixins from "@/mixins"
 import vuescroll from 'vuescroll'
-import ops from '@/utils/gol/ops';
+import createOps from '@/utils/gol/ops';
 import '@/utils/rem'
 Vue.use(Antd);
 Vue.use(dataV);
 Vue.use(selfUi);
 Vue.use(compon);
 Vue.use(mixins);
-Vue.use(vuescroll, {ops: ops,name: 'vue-scroll'});
+Vue.use(vuescroll, {ops: createOps(true, true),name: 'vue-scroll'});
 Vue.config.productionTip = false
 Vue.prototype.$vuiSize = 'small'
 new Vue({

src/mixins/index.js

@@ -1,13 +1,36 @@
 /*
  * @Author: your name
  * @Date: 2021-10-12 13:56:13
- * @LastEditTime: 2021-11-02 13:11:30
+ * @LastEditTime: 2021-11-02 16:17:56
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/mixins/index.js
  */
 import { mapGetters, mapActions } from "vuex";
 import Loading from './loading'
+function detectZoom (){ 
+    let ratio = 0,
+      screen = window.screen,
+      ua = navigator.userAgent.toLowerCase();
+  
+     if (window.devicePixelRatio !== undefined) {
+        ratio = window.devicePixelRatio;
+    }
+    else if (~ua.indexOf('msie')) {  
+      if (screen.deviceXDPI && screen.logicalXDPI) {
+        ratio = screen.deviceXDPI / screen.logicalXDPI;
+      }
+    }
+    else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {
+      ratio = window.outerWidth / window.innerWidth;
+    }
+    
+    //  if (ratio){
+    //   ratio ;
+    // }
+    
+     return ratio;
+  }
 export default {
     install(Vue) {
         Vue.mixin({
@@ -20,7 +43,7 @@ export default {
                         function isReize() {
                             const style = document.defaultView.getComputedStyle(el);
                             if (width !== style.width || height !== style.height) {
-                                binding.value({ width: style.width, height: style.height });  // 关键(这传入的是函数,所以执行此函数)
+                                binding.value({ width: style.width, height: style.height, ratio: detectZoom() });  // 关键(这传入的是函数,所以执行此函数)
                             }
                             width = style.width;
                             height = style.height;

src/utils/gol/ops.js

@@ -1,12 +1,13 @@
 /*
  * @Author: your name
  * @Date: 2021-10-16 09:48:35
- * @LastEditTime: 2021-10-16 09:48:35
+ * @LastEditTime: 2021-11-02 17:07:15
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/utils/gol/ops.js
  */
-export default {
+export default function createOps(scrollingX = true, scrollingY = true) {
+ return {
     vuescroll: {
         mode: "native",  //模式:pc natice 移动端是slice
         sizeStrategy: "percent",  //父元素是否是固定的是就percent 不是就是number 填一个数值
@@ -15,8 +16,8 @@ export default {
     scrollPanel: {
         initialScrollY: false,  //初始化距离顶部的位置
         initialScrollX: false,  //初始化距离左侧的位置
-        scrollingX: true,  // 是否开启横向滚动
-        scrollingY: true,  //是否开启竖向滚动
+        scrollingX: scrollingX,  // 是否开启横向滚动
+        scrollingY: scrollingY,  //是否开启竖向滚动
         speed: 300,       //多长时间内完成一次滚动。 数值越小滚动的速度越快。
         easing: 'easeInQuad', //默认动画
         verticalNativeBarPos: "right",
@@ -44,4 +45,5 @@ export default {
         size: "6px",                 //bar 的尺寸。
         disable: false,              //是否禁用滚动条。
     },
+ }
 }

src/views/EventInsight/industryTOPHE/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-18 09:34:53
- * @LastEditTime: 2021-10-19 17:10:48
+ * @LastEditTime: 2021-11-02 17:44:03
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/EventInsight/IndustryTOPHE/index.vue
@@ -11,17 +11,23 @@
     <div class="itp-outter">
         <v-label-div title="行业TOP热点事件">
         </v-label-div>
-        <v-table :columns="columns" :data="tbData" :pagination="false">
-            <a slot="a" slot-scope="text" @click="goDetails">{{ text }}</a>
-        </v-table>
+        <div class="itp-inner">
+            <dv-scroll-board :config="config" :style="{ width: '100%', height: '100%' }" @click="handlerSs"/>
+        </div>
+        
     </div>
 </template>
 
 <script>
+import {getHotEventsList} from "@/api/EventInsight"
 export default {
     name: "industryTOPHE",
     data() {
         return {
+             form: {
+                token: ""
+            },
+            config: {},
             columns: [
                 {
                     title: "事件标题",
@@ -57,9 +63,36 @@ export default {
             ]
         };
     },
+    created() {
+        this.form.token = this.getToken;
+        this.getData();
+    },
     methods: {
         goDetails() {
             this.$router.push({path: '/eventDEC'})
+        },
+        getData() {
+            let obj = Object.assign({}, this.getCommTime, this.form);
+            getHotEventsList(obj).then(res => {
+                let data = res.data || [];
+                let arr = [];
+                data.forEach(ele => {
+                    let o = [`<span style="cursor: pointer;">${ele.events_title}</span>`, ele.events_influence, ele.events_type, ele.events_brand];
+                    arr.push(o)
+                })
+                 this.config = {
+                        headerBGC: "#0c203b",
+                        oddRowBGC: "#173b6d",
+                        evenRowBGC: "rgba(69, 149, 244, 0)",
+                        columnWidth: [900],
+                        rowNum: 6,
+                        header: ["事件标题", "影响力","类型","关联品牌"],
+                        data: arr,
+                    };
+            })
+        },
+        handlerSs() {
+
         }
     }
 };
@@ -71,5 +104,9 @@ export default {
     height: 392px;
     border: 2px solid #0f2a4d;
     margin-top: 16px;
+    .itp-inner {
+        width: 100%;
+        height: calc(100% - 48px);
+    }
 }
 </style>

src/views/Index/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: xw
  * @Date: 2021-10-08 09:17:42
- * @LastEditTime: 2021-11-02 15:12:47
+ * @LastEditTime: 2021-11-02 16:49:41
  * @LastEditors: Please set LastEditors
  * @Description: 行业洞察
  * @FilePath: /data-show/src/views/Index/index.vue
@@ -122,7 +122,8 @@ export default {
                 this.modalObj.visible = true;
             });
         },
-        handleResize({height}) {
+        handleResize({height, ratio}) {
+            console.log(ratio)
            let h = document.body.clientHeight;
            let h2 = parseFloat(height);
            let z = 1;
@@ -130,8 +131,7 @@ export default {
             let marginTop = -m*1.7;
            if(h > 760 && h < 1080) {
                if(h2 > h) {
-                   z = (h2 + m*2.8) / 1080;
-                 
+                   z = (h -90)/h2;
                } else {
                    z = 1;
                    marginTop = 0;
@@ -144,6 +144,7 @@ export default {
                z = 1
                marginTop = 0
            }
+         
          this.outStyle = {
              transform: `scaleY(${z}) translate(0, ${marginTop}px)`,
           }