mt-yd-ui/src/views/modules/monitoring/reportPreview.vue

<!--
 * @Author: gtz
 * @Date: 2021-03-07 18:39:03
 * @LastEditors: gtz
 * @LastEditTime: 2022-02-24 16:35:51
 * @Description: file content
-->
<template>
	<div v-loading="loading" :class="$style.container">
		<small-title :size="'md'" style="margin-bottom: 10px">报表名称：{{ $route.query.name }}</small-title>

		<iframe id="reportView" :class="$style.mainIframe" name="mainIframe" :src="url" frameborder="0" scrolling="auto" />
	</div>
</template>
<script>
import SmallTitle from '@/components/small-title'

export default {
	components: { SmallTitle },
	props: {},
	data() {
		return {
			loading: true,
			// url: process.env.VUE_APP_REPORT_VIEW_URL
			url: window.SITE_CONFIG['apiURL'] + '/yd-monitor/ureport/preview'
		}
	},
	mounted() {
		const vm = this
		console.log(this.$route.query)
		this.url += '?_u=db:' + this.$route.query.name + '.ureport.xml'
		// if (this.$route.query.params) {
		//   const params = JSON.parse(this.$route.query.params)
		//   params.map(item => {
		//     this.url += '&' + item.key + '=' + item.value
		//   })
		// }
		if (this.$route.query.substrateId) {
			this.url += '&substrateId=' + this.$route.query.substrateId
		}
		if (this.$route.query.equipmentId) {
			this.url += '&equipmentId=' + this.$route.query.equipmentId
		}
		if (this.$route.query.dataId) {
			this.url += '&dataId=' + this.$route.query.dataId
		}
		if (this.$route.query.workOrderNo) {
			this.url += '&workOrderNo=' + this.$route.query.workOrderNo
		}
		if (this.$route.query.id) {
			this.url += '&id=' + this.$route.query.id
		}
		const ifream = document.getElementById('reportView')
		ifream.onload = function() {
			console.log('加载完成')
			vm.loading = false
		}
	},
	methods: {}
}
</script>
<style lang="scss" module>
.container {
	margin: 0px 16px 0 8px;
	width: 98.5%;
	height: calc(100vh - 180px);
	.mainIframe {
		width: 100%;
		height: 100%;
	}
}
</style>