Procházet zdrojové kódy

投资页面优化

zhbyyy před 2 roky
rodič
revize
5e8b03b64f

+ 5 - 5
investment/investHomeGroup.html

@@ -380,7 +380,7 @@
               <span class="text">固定资产</span>
             </div>
             <div class="content top-lb">
-              <div v-for="(item,index) in titleList.slice(0,11)" :key="index"
+              <div v-for="(item,index) in titleList.slice(0,11)" :key="index" @mouseover="yellowMouse(index)"
                 class="topCard flex items-center justify-center flex-col  overflow-hidden">
                 <div class="flex items-center justify-center shrink-0"
                   :class="(item.type==1&&item.name)?'titleBackBlue':(item.type==2&&item.name)?'titleBackYellow':''">
@@ -398,7 +398,7 @@
               <span class="text">股权类</span>
             </div>
             <div class="content top-rb">
-              <div class="topCard flex items-center justify-center flex-col  overflow-hidden">
+              <div class="topCard flex items-center justify-center flex-col  overflow-hidden"  @mouseover="yellowMouse(12)">
                 <div class="flex items-center justify-center shrink-0"
                   :class="(titleList[12].type==1)?'titleBackBlue':'titleBackYellow'"><span
                     class="flex items-center justify-center"
@@ -411,7 +411,7 @@
                 <div class="flex items-center justify-center shrink-0">
                 </div>
               </div>
-              <div class="topCard flex items-center justify-center flex-col ">
+              <div class="topCard flex items-center justify-center flex-col " @mouseover="yellowMouse(14)">
                 <div class="flex items-center justify-center shrink-0"
                   :class="(titleList[14].type==1)?'titleBackBlue':'titleBackYellow'"><span
                     class="flex items-center justify-center"
@@ -424,8 +424,8 @@
           </div>
           <!-- 悬浮窗 -->
           <div class="flotage absolute" :style="{left:(yellowPosition + 'px')}" v-if="yellowCount % 2 ==0">
-            <span>项目数量:{{right2[0]}}</span>
-            <span>项目金额:{{numFormat(right2[1])}}</span>
+            <span>项目数量:{{numFormat(right2[yellowCount][0])}}</span>
+            <span>项目金额:{{numFormat(right2[yellowCount][1])}}</span>
           </div>
         </div>
         <div class="right-c">

+ 1 - 1
investment/js/groupData.js

@@ -437,7 +437,7 @@ let right1 = [
   { name: '工商变更登记', type: 1, number: '77' },
   { name: '', type: 1, number: '' },
 ]
-let right2 = [120, 3423094]
+let right2 = [[120, 3423094],[],[121, 3423094],[],[122, 3423094],[],[123, 3423094],[],[124, 3423094],[],[125, 3423094],[],[126, 3423094],[],[127, 3423094]]
 // 中间左边
 let right3 = [
   { name: '正偏差', value: '160', value2: '500' },

+ 20 - 7
investment/js/investHomeGroup.js

@@ -2,6 +2,8 @@ let app = new Vue({
   el: '#app',
   data () {
     return {
+      echartR4Chart:'',// 倒数第二个专用
+      echartR5Chart:'', // 倒是第一个专用
       echartEnterpriseShow: false, // 企业额度分析控制
       mapChart: '',//地图专用echarts
       chartCarousel: '',//做大屏轮播专用echarts
@@ -80,13 +82,20 @@ let app = new Vue({
       this.initChartR1()
       this.initChartR2()
       this.initChartR3()
-      this.initChartR4()
-      this.initChartR5()
+      // this.initChartR4()
+      // this.initChartR5()
       this.changeYellow()
 
     })
   },
   methods: {
+    yellowMouse(index){
+      if(index%2 == 0){
+        this.yellowCount = index
+        this.yellowPosition = (index/2-1) * 315 + 40
+        this.changeYellow()
+      }
+    },
     // 回到中国地图
     backChina () {
       this.backShow = false
@@ -4674,6 +4683,10 @@ let app = new Vue({
       let that = this
       let myChart = echarts.init(this.$refs['echartR3'])
       myChart.on('showTip', (params) => {
+        this.echartR4Chart?this.echartR4Chart.dispose():''
+        this.echartR5Chart?this.echartR5Chart.dispose():''
+        that.initChartR4()
+        that.initChartR5()
         // 如果是7或者15并且满足防抖则切换
         if ((params.dataIndex == 5 || params.dataIndex == 11) && that.echartR3Fd) {
           that.echartR3Fd = false
@@ -4892,7 +4905,7 @@ let app = new Vue({
       })
     },
     initChartR4 () {
-      let myChart = echarts.init(this.$refs['echartR4'])
+      this.echartR4Chart = echarts.init(this.$refs['echartR4'])
       option = {
         title: {
           text: ''
@@ -4997,10 +5010,10 @@ let app = new Vue({
       //   interval: 2000,
       //   loopSeries: true,
       // });
-      myChart.setOption(option)
+      this.echartR4Chart.setOption(option)
     },
     initChartR5 () {
-      let myChart = echarts.init(this.$refs['echartR5'])
+      this.echartR5Chart = echarts.init(this.$refs['echartR5'])
       let option = {
         tooltip: {
           formatter: data => {
@@ -5168,8 +5181,8 @@ let app = new Vue({
           },
         ],
       }
-      myChart.setOption(option)
-      tools.loopShowTooltip(myChart, option, {
+      this.echartR5Chart.setOption(option)
+      tools.loopShowTooltip(this.echartR5Chart, option, {
         interval: 2000,
         loopSeries: true,
       })