2024-09-26 14:04:18 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<div v-loading="loading">
|
|
|
|
|
|
<el-button
|
|
|
|
|
|
type="primary"
|
|
|
|
|
|
size="mini"
|
|
|
|
|
|
style="margin-bottom: 10px"
|
|
|
|
|
|
@click="dianji"
|
|
|
|
|
|
>
|
|
|
|
|
|
全屏
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
<iframe
|
|
|
|
|
|
id="iframeId"
|
|
|
|
|
|
ref="iframe"
|
|
|
|
|
|
:src="src"
|
|
|
|
|
|
style="width: 100%; height: 495px"
|
|
|
|
|
|
></iframe>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
export default {
|
|
|
|
|
|
props: {
|
|
|
|
|
|
deviceCode: {
|
|
|
|
|
|
type: String,
|
|
|
|
|
|
default: '',
|
|
|
|
|
|
},
|
|
|
|
|
|
// screenView: {
|
|
|
|
|
|
// type: String,
|
|
|
|
|
|
// default: '',
|
|
|
|
|
|
// },
|
|
|
|
|
|
},
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
|
|
|
|
|
technologyData: [],
|
|
|
|
|
|
loading: true,
|
|
|
|
|
|
fullscreenLoading: true,
|
|
|
|
|
|
queryForm: {
|
|
|
|
|
|
deviceCode: '',
|
|
|
|
|
|
},
|
|
|
|
|
|
src: '',
|
|
|
|
|
|
};
|
|
|
|
|
|
},
|
|
|
|
|
|
watch: {
|
|
|
|
|
|
deviceCode: function (newVal, oldVal) {
|
|
|
|
|
|
this.queryForm.deviceCode = newVal;
|
|
|
|
|
|
this.src =
|
|
|
|
|
|
'https://dp.lidinghb.com/chudy_visual/view/' +
|
|
|
|
|
|
newVal[1] +
|
|
|
|
|
|
'?' +
|
|
|
|
|
|
'deviceCode=' +
|
|
|
|
|
|
newVal[0];
|
|
|
|
|
|
console.log(111, newVal);
|
|
|
|
|
|
console.log(123, this.src);
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
created() {},
|
|
|
|
|
|
mounted() {
|
|
|
|
|
|
const { iframe } = this.$refs;
|
|
|
|
|
|
// IE和非IE浏览器，监听iframe加载事件不一样，需要兼容
|
|
|
|
|
|
const that = this;
|
|
|
|
|
|
if (iframe.attachEvent) {
|
|
|
|
|
|
// IE
|
|
|
|
|
|
iframe.attachEvent('onload', () => {
|
|
|
|
|
|
that.stateChange();
|
|
|
|
|
|
});
|
|
|
|
|
|
} else {
|
|
|
|
|
|
// 非IE
|
|
|
|
|
|
iframe.onload = function () {
|
|
|
|
|
|
that.stateChange();
|
|
|
|
|
|
};
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
showData(row) {
|
|
|
|
|
|
console.log(row);
|
|
|
|
|
|
},
|
|
|
|
|
|
stateChange() {
|
|
|
|
|
|
this.loading = false;
|
|
|
|
|
|
},
|
|
|
|
|
|
dianji() {
|
|
|
|
|
|
//设置后就是id==con_lf_top_div 的容器全屏
|
2025-02-20 14:27:17 +08:00
|
|
|
|
debugger;
|
2024-09-26 14:04:18 +08:00
|
|
|
|
const case1 = document.getElementById('iframeId');
|
|
|
|
|
|
if (this.fullscreen) {
|
|
|
|
|
|
if (document.exitFullscreen) {
|
|
|
|
|
|
document.exitFullscreen();
|
|
|
|
|
|
} else if (document.webkitCancelFullScreen) {
|
|
|
|
|
|
document.webkitCancelFullScreen();
|
|
|
|
|
|
} else if (document.mozCancelFullScreen) {
|
|
|
|
|
|
document.mozCancelFullScreen();
|
|
|
|
|
|
} else if (document.msExitFullscreen) {
|
|
|
|
|
|
document.msExitFullscreen();
|
|
|
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
|
|
|
if (case1.requestFullscreen) {
|
|
|
|
|
|
case1.requestFullscreen();
|
|
|
|
|
|
} else if (case1.webkitRequestFullScreen) {
|
|
|
|
|
|
case1.webkitRequestFullScreen();
|
|
|
|
|
|
} else if (case1.mozRequestFullScreen) {
|
|
|
|
|
|
case1.mozRequestFullScreen();
|
|
|
|
|
|
} else if (case1.msRequestFullscreen) {
|
|
|
|
|
|
// IE11
|
|
|
|
|
|
case1.msRequestFullscreen();
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
</script>
|
