From edba26ba8377814d94b65b4a1a1fe04f0365afc9 Mon Sep 17 00:00:00 2001
From: whyczyk <525500596@qq.com>
Date: 星期一, 18 十月 2021 14:59:41 +0800
Subject: [PATCH] 模块添加双击放大功能

---
 src/components/charts/RoseChart.vue            |   37 ++
 src/components/charts/imgPieChart.vue          |   38 ++
 src/components/charts/PictorialBar.vue         |   37 ++
 src/components/charts/dischargeCircuit.vue     |   37 ++
 src/components/charts/powerChart.vue           |   40 ++
 src/pages/exhibition.vue                       |    1 
 src/components/charts/monomerVoltage.vue       |   37 ++
 src/components/charts/triangleBarChart.vue     |   37 ++
 src/components/charts/AcInput.vue              |  262 +++++++++---------
 src/components/charts/CustomPie.vue            |   37 ++
 src/components/charts/AcInputWarp.vue          |   40 ++
 src/components/charts/RoseChartHea.vue         |   37 ++
 src/components/charts/abeamProChart.vue        |   38 ++
 src/components/charts/MonCap.vue               |   37 ++
 src/components/charts/latticeBar.vue           |   37 ++
 src/components/charts/histogramAlternating.vue |   37 ++
 src/components/charts/RoseChartED.vue          |   37 ++
 17 files changed, 679 insertions(+), 147 deletions(-)

diff --git a/src/components/charts/AcInput.vue b/src/components/charts/AcInput.vue
index 4e79fef..8443d4a 100644
--- a/src/components/charts/AcInput.vue
+++ b/src/components/charts/AcInput.vue
@@ -1,144 +1,144 @@
 <template>
-    <div class="echarts-wrapper">
-        <div class="echarts-content" ref="chart"></div>
-        <div class="echarts-text-wrapper">
-            <div class="color-strip" :style="{'backgroundColor':resColor}"></div>
-            <div class="echarts-text">
-                {{title}}
-            </div>
-        </div>
-    </div>
+	<div class="echarts-wrapper">
+		<div class="echarts-content" ref="chart"></div>
+		<div class="echarts-text-wrapper">
+			<div class="color-strip" :style="{'backgroundColor':resColor}"></div>
+			<div class="echarts-text">
+				{{title}}
+			</div>
+		</div>
+	</div>
 </template>
 
 <script>
-    import * as echarts from "echarts";
+import * as echarts from "echarts";
 
-    export default {
-        name: "AcInput",
-        chart: "",
-        chartData: "",
-        data() {
-            return {
-                acColor: '#813a74',
-                resColor: '#ff649d',
-                title: ''
-            }
-        },
-        methods: {
-            setOption(opt) {
-                this.$options.chart.setOption(opt);
-            },
-            setData(sendData) {
-                this.$options.chartData = sendData;
-                this.acColor = sendData.acColor;
-                this.resColor = sendData.resColor;
-                this.title = sendData.title;
-                let option = {
-                    title: {
-                        text: sendData.data + '%',
-                        x: 'center',
-                        y: 'center',
-                        textStyle: {
-                            color: "#fff",
-                            fontSize: 24,
-                        }
-                    },
-                    series: [{
-                        name: "",
-                        type: 'gauge',
-                        radius: '90%',
-                        startAngle: 180.5,
-                        endAngle: -0.5,
-                        min: 0,
-                        max: 100,
-                        title: {
-                            show: false
-                        },
-                        detail: {
-                            show: false
-                        },
-                        axisLine: {
-                            show: true,
-                            lineStyle: {
-                                width: 20,
-                                color: [
-                                    [
-                                        sendData.data / 100, this.acColor
-                                    ],
-                                    [
-                                        1, this.resColor
-                                    ]
-                                ]
-                            }
-                        },
-                        axisTick: {
-                            show: false,
-                        },
-                        splitLine: {
-                            show: false,
-                        },
-                        axisLabel: {
-                            show: false
-                        },
-                        pointer: {
-                            show: false,
-                        },
-                        itemStyle: {
-                            normal: {
-                                color: '#FF0000',
-                            }
-                        },
-                        data: [{
-                            value: sendData,
-                            name: '骞村敭鐢甸噺鎯呭喌'
-                        }]
-                    }]
-                };
+export default {
+	name: "AcInput",
+	chart: "",
+	chartData: "",
+	data() {
+		return {
+			acColor: '#813a74',
+			resColor: '#ff649d',
+			title: ''
+		}
+	},
+	methods: {
+		setOption(opt) {
+			this.$options.chart.setOption(opt);
+		},
+		setData(sendData) {
+			this.$options.chartData = sendData;
+			this.acColor = sendData.acColor;
+			this.resColor = sendData.resColor;
+			this.title = sendData.title;
+			let option = {
+				title: {
+					text: sendData.data + '%',
+					x: 'center',
+					y: 'center',
+					textStyle: {
+						color: "#fff",
+						fontSize: 24,
+					}
+				},
+				series: [{
+					name: "",
+					type: 'gauge',
+					radius: '90%',
+					startAngle: 180.5,
+					endAngle: -0.5,
+					min: 0,
+					max: 100,
+					title: {
+						show: false
+					},
+					detail: {
+						show: false
+					},
+					axisLine: {
+						show: true,
+						lineStyle: {
+							width: 20,
+							color: [
+								[
+									sendData.data / 100, this.acColor
+								],
+								[
+									1, this.resColor
+								]
+							]
+						}
+					},
+					axisTick: {
+						show: false,
+					},
+					splitLine: {
+						show: false,
+					},
+					axisLabel: {
+						show: false
+					},
+					pointer: {
+						show: false,
+					},
+					itemStyle: {
+						normal: {
+							color: '#FF0000',
+						}
+					},
+					data: [{
+						value: sendData,
+						name: '骞村敭鐢甸噺鎯呭喌'
+					}]
+				}]
+			};
 
-                // 璁剧疆閰嶇疆椤�
-                this.setOption(option);
-            },
-            resize() {
-                setTimeout(() => {
-                    this.$options.chart.resize();
-                    if (JSON.stringify(this.$options.chartData) != '{}') {
-                        this.setData(this.$options.chartData);
-                    }
-                }, 300)
-            }
-        },
-        mounted() {
-            // 鍩轰簬鍑嗗濂界殑dom锛屽垵濮嬪寲echarts瀹炰緥
-            this.$options.chart = echarts.init(this.$refs.chart);
+			// 璁剧疆閰嶇疆椤�
+			this.setOption(option);
+		},
+		resize() {
+			setTimeout(() => {
+				this.$options.chart.resize();
+				if (JSON.stringify(this.$options.chartData) != '{}') {
+					this.setData(this.$options.chartData);
+				}
+			}, 300)
+		}
+	},
+	mounted() {
+		// 鍩轰簬鍑嗗濂界殑dom锛屽垵濮嬪寲echarts瀹炰緥
+		this.$options.chart = echarts.init(this.$refs.chart);
 
-            window.addEventListener('resize', this.resize);
-        },
-        destroyed() {
-            window.removeEventListener('resize', this.resize);
-        }
-    }
+		window.addEventListener('resize', this.resize);
+	},
+	destroyed() {
+		window.removeEventListener('resize', this.resize);
+	}
+}
 </script>
 
 <style scoped>
-    .echarts-text-wrapper {
-        position: absolute;
-        top: 56%;
-        left: 22.5%;
-        width: 55%;
-        text-align: center;
-    }
+.echarts-text-wrapper {
+	position: absolute;
+	top: 56%;
+	left: 22.5%;
+	width: 55%;
+	text-align: center;
+}
 
-    .color-strip {
-        height: 4px;
-    }
+.color-strip {
+	height: 4px;
+}
 
-    .echarts-text {
-        display: inline-block;
-        margin-top: 8px;
-        padding: 8px 20px;
-        background-color: #083880;
-        border: 1px solid #01b1e0;
-        border-radius: 16px;
-        font-size: 12px;
-    }
+.echarts-text {
+	display: inline-block;
+	margin-top: 8px;
+	padding: 8px 20px;
+	background-color: #083880;
+	border: 1px solid #01b1e0;
+	border-radius: 16px;
+	font-size: 12px;
+}
 </style>
\ No newline at end of file
diff --git a/src/components/charts/AcInputWarp.vue b/src/components/charts/AcInputWarp.vue
index 03a003e..a72157a 100644
--- a/src/components/charts/AcInputWarp.vue
+++ b/src/components/charts/AcInputWarp.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="chartCon">
+	<div class="chartCon" @dblclick="dblclick">
 		<div class="chartItem" @click="clickItem('鐔斾笣鍛婅')">
 			<ac-input id="AcInput0" ref="AcInput0"></ac-input>
 		</div>
@@ -32,6 +32,44 @@
 
 	},
 	methods: {
+		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.$refs.AcInput0.resize();
+			this.$refs.AcInput1.resize();
+			this.$refs.AcInput2.resize();
+			this.$refs.AcInput3.resize();
+		},
 		toParentPage(value) {
 			if (typeof (value) == 'string') {
 				window.parent.parent.postMessage({
diff --git a/src/components/charts/CustomPie.vue b/src/components/charts/CustomPie.vue
index d4d2cf6..d46d828 100644
--- a/src/components/charts/CustomPie.vue
+++ b/src/components/charts/CustomPie.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="echarts-wrapper">
+	<div class="echarts-wrapper" @dblclick="dblclick">
 		<div class="echarts-content" ref="chart"></div>
 	</div>
 </template>
@@ -22,6 +22,41 @@
 		}
 	},
 	methods: {
+		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({
diff --git a/src/components/charts/MonCap.vue b/src/components/charts/MonCap.vue
index 2824b65..b6e7f80 100644
--- a/src/components/charts/MonCap.vue
+++ b/src/components/charts/MonCap.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="flex-box" @click="toParentPage">
+	<div class="flex-box" @click="toParentPage" @dblclick="dblclick">
 		<div class="flex-box-body">
 			<circle-chart id="circleChart" ref="circleChart"></circle-chart>
 		</div>
@@ -57,6 +57,41 @@
 		}
 	},
 	methods: {
+		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.$refs.circleChart.resize();
+		},
 		toParentPage() {
 			window.parent.parent.postMessage({
 				cmd: "syncPage",
diff --git a/src/components/charts/PictorialBar.vue b/src/components/charts/PictorialBar.vue
index e311aab..e05e15d 100644
--- a/src/components/charts/PictorialBar.vue
+++ b/src/components/charts/PictorialBar.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>
@@ -24,6 +24,41 @@
 		}
 	},
 	methods: {
+		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({
diff --git a/src/components/charts/RoseChart.vue b/src/components/charts/RoseChart.vue
index 6ffcdbd..ade1477 100644
--- a/src/components/charts/RoseChart.vue
+++ b/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>
@@ -24,6 +24,41 @@
 		}
 	},
 	methods: {
+		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({
diff --git a/src/components/charts/RoseChartED.vue b/src/components/charts/RoseChartED.vue
index 8cf8050..356800f 100644
--- a/src/components/charts/RoseChartED.vue
+++ b/src/components/charts/RoseChartED.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>
@@ -24,6 +24,41 @@
 		}
 	},
 	methods: {
+		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({
diff --git a/src/components/charts/RoseChartHea.vue b/src/components/charts/RoseChartHea.vue
index 282c3f7..deb5e11 100644
--- a/src/components/charts/RoseChartHea.vue
+++ b/src/components/charts/RoseChartHea.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>
@@ -23,6 +23,41 @@
 		}
 	},
 	methods: {
+		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() {
 			window.parent.parent.postMessage({
 				cmd: "syncPage",
diff --git a/src/components/charts/abeamProChart.vue b/src/components/charts/abeamProChart.vue
index 92b6c85..c49f9aa 100644
--- a/src/components/charts/abeamProChart.vue
+++ b/src/components/charts/abeamProChart.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="flexCon">
+	<div class="flexCon" @dblclick="dblclick">
 		<div class="con">
 			<div class="echarts-wrapper">
 				<div class="echarts-content" ref="chart">
@@ -35,6 +35,41 @@
 		}
 	},
 	methods: {
+		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({
@@ -63,7 +98,6 @@
 		},
 		organizeData(posData) {
 			let dataColor = posData.color;
-			let bgColor = posData.bgColor;
 			let yData = posData.yData;
 			let radius = (this.$refs.chart.clientHeight / 4 - 7) > 0 ? this.$refs.chart.clientHeight / 4 - 7 : 0;
 			let data = posData.data;
diff --git a/src/components/charts/dischargeCircuit.vue b/src/components/charts/dischargeCircuit.vue
index 3a17a1d..776643f 100644
--- a/src/components/charts/dischargeCircuit.vue
+++ b/src/components/charts/dischargeCircuit.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="dischargeCircuit">
 
 		</div>
@@ -45,6 +45,41 @@
 		}
 	},
 	methods: {
+		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.discharge.resize();
+		},
 		toParentPage(value) {
 			if (typeof (value) == 'string') {
 				window.parent.parent.postMessage({
diff --git a/src/components/charts/histogramAlternating.vue b/src/components/charts/histogramAlternating.vue
index 5fbae60..412d29e 100644
--- a/src/components/charts/histogramAlternating.vue
+++ b/src/components/charts/histogramAlternating.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="echarts-wrapper echartsAlternating" ref="echartsAlternating">
+	<div class="echarts-wrapper echartsAlternating" ref="echartsAlternating" @dblclick="dblclick">
 		<div class="echarts-content" ref="alternating">
 
 		</div>
@@ -45,6 +45,41 @@
 		}
 	},
 	methods: {
+		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({
diff --git a/src/components/charts/imgPieChart.vue b/src/components/charts/imgPieChart.vue
index 1258c78..c611d86 100644
--- a/src/components/charts/imgPieChart.vue
+++ b/src/components/charts/imgPieChart.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="echarts-wrapper">
+	<div class="echarts-wrapper" @dblclick="dblclick">
 		<div class="echarts-content" ref="chart">
 
 		</div>
@@ -32,6 +32,42 @@
 		}
 	},
 	methods: {
+		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();
+			this.organizeData(this.$options.chartData)
+		},
 		toParentPage(value) {
 			if (typeof (value) == 'string') {
 				window.parent.parent.postMessage({
diff --git a/src/components/charts/latticeBar.vue b/src/components/charts/latticeBar.vue
index 11295cb..b417218 100644
--- a/src/components/charts/latticeBar.vue
+++ b/src/components/charts/latticeBar.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="echarts-wrapper">
+	<div class="echarts-wrapper" @dblclick="dblclick">
 		<div class="echarts-content" ref="chart">
 
 		</div>
@@ -30,6 +30,41 @@
 		}
 	},
 	methods: {
+		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({
diff --git a/src/components/charts/monomerVoltage.vue b/src/components/charts/monomerVoltage.vue
index 93ce1a5..854e5bf 100644
--- a/src/components/charts/monomerVoltage.vue
+++ b/src/components/charts/monomerVoltage.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="monomerVoltage">
 
 		</div>
@@ -45,6 +45,41 @@
 		}
 	},
 	methods: {
+		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({
diff --git a/src/components/charts/powerChart.vue b/src/components/charts/powerChart.vue
index 659af32..f2c6fa5 100644
--- a/src/components/charts/powerChart.vue
+++ b/src/components/charts/powerChart.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="chartCon">
+	<div class="chartCon" @dblclick="dblclick">
 		<div class="chartItem">
 			<pross-pie-chart id="prossPieChart0" ref="prossPieChart0"></pross-pie-chart>
 		</div>
@@ -32,6 +32,44 @@
 
 	},
 	methods: {
+		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.$refs.prossPieChart0.resize();
+			this.$refs.prossPieChart1.resize();
+			this.$refs.prossPieChart2.resize();
+			this.$refs.prossPieChart3.resize();
+		},
 		setData(data) {
 			this.$nextTick(() => {
 				if (data) {
diff --git a/src/components/charts/triangleBarChart.vue b/src/components/charts/triangleBarChart.vue
index 0b8d409..6161ca5 100644
--- a/src/components/charts/triangleBarChart.vue
+++ b/src/components/charts/triangleBarChart.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="echarts-wrapper">
+	<div class="echarts-wrapper" @dblclick="dblclick">
 		<div class="echarts-content" ref="chart">
 
 		</div>
@@ -31,6 +31,41 @@
 		}
 	},
 	methods: {
+		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({
diff --git a/src/pages/exhibition.vue b/src/pages/exhibition.vue
index 974fae7..4db6d80 100644
--- a/src/pages/exhibition.vue
+++ b/src/pages/exhibition.vue
@@ -61,6 +61,7 @@
 		})
 	},
 	methods: {
+
 		// 鍔犺浇甯冨眬鏁版嵁
 		loadLayout() {
 			let sendData = {

--
Gitblit v1.9.1