模块添加双击放大功能

whyczyk

2021-10-18 edba26ba8377814d94b65b4a1a1fe04f0365afc9

 src/components/charts/RoseChart.vue

@@ -1,5 +1,5 @@
<template>
   <div class="echarts-wrapper" @click="toParentPage">
   <div class="echarts-wrapper" @click="toParentPage" @dblclick="dblclick">
      <div class="echarts-content" ref="chart"></div>
   </div>
</template>
@@ -7,6 +7,7 @@
<script>
import * as echarts from 'echarts';
import { WebSocketClass } from '@/assets/js/socket'
import { checkboxs } from '@/assets/js/powerInfoData'
export default {
   name: "RoseChart",
   chart: "",
@@ -23,21 +24,107 @@
      }
   },
   methods: {
      toParentPage() {
         window.parent.parent.postMessage({
            cmd: "syncPage",
            params: {
               pageInfo: {
                  label: "设备状态查询",
                  name: 'btsStatusTest',
                  src: '#/dataMager/btsStatus',
                  closable: true
               },
            }
         }, "*");
      findParents(node, select) {
         var parent = node.parentNode;
         if (parent === null || parent.className.indexOf(select) != -1) {
            return parent;
         } else {
            return this.findParents(parent, select);
         }
      },
      dblclick(e) {
         this.isAllScreen = !this.isAllScreen
         let parents = this.findParents(e.currentTarget, 'vdr')
         if (this.isAllScreen) {
            this.parentsStyle = JSON.parse(JSON.stringify(parents.style));
            parents.style.transform = 'none';
            parents.style.width = '100%';
            parents.style.height = '100%';
            parents.style.position = 'fixed';
            parents.style.left = 0;
            parents.style.right = 0;
            parents.style.bottom = 0;
            parents.style.top = 0;
            parents.style.zIndex = 99999;
         } else {
            parents.style.transform = this.parentsStyle.transform;
            parents.style.width = this.parentsStyle.width;
            parents.style.height = this.parentsStyle.height;
            parents.style.position = this.parentsStyle.position;
            parents.style.left = 'initial';
            parents.style.right = 'initial';
            parents.style.bottom = 'initial';
            parents.style.top = 'initial';
            parents.style.zIndex = 'auto';
         }
         this.$options.chart.resize();
      },
      toParentPage(value) {
         if (typeof (value) == 'string') {
            window.parent.parent.postMessage({
               cmd: "syncPage",
               params: {
                  pageInfo: {
                     label: "设备状态查询",
                     name: "btsStatusTest",
                     src: "#/dataMager/btsStatus?workStauts=" + value,
                     closable: true
                  },
               }
            }, "*");
         }
      },
      toParentPage2(value) {
         if (typeof (value) == 'string') {
            window.parent.parent.postMessage({
               cmd: "syncPage",
               params: {
                  pageInfo: {
                     label: "设备工作状态",
                     name: "deviceWorkState",
                     src: "#/device-work-state?signalStatus=" + value,
                     closable: true
                  },
               }
            }, "*");
         }
      },
      setOption(opt) {
         this.$options.chart.setOption(opt);
         this.$options.chart.on('click', (params) => {
            let name;
            if (params.name == '在线浮充') {
               name = '浮充'
               checkboxs.sbzt.map(item => {
                  if (item.label == name) {
                     this.toParentPage(item.value)
                  }
               })
            } else if (params.name == '充电数量') {
               name = '充电'
               checkboxs.sbzt.map(item => {
                  if (item.label == name) {
                     this.toParentPage(item.value)
                  }
               })
            } else if (params.name == '内阻测试数量') {
               name = '内阻测试'
               checkboxs.sbzt.map(item => {
                  if (item.label == name) {
                     this.toParentPage(item.value)
                  }
               })
            } else if (params.name == '通讯故障数量') {
               this.toParentPage2('1')
            } else if (params.name == '核容数量') {
               name = '放电'
               checkboxs.sbzt.map(item => {
                  if (item.label == name) {
                     this.toParentPage(item.value)
                  }
               })
            }
         })
      },
      organizeData(data) {
         let option = {