本帖最后由 破名想半天 于 2022-6-20 19:34 编辑
<template ref='reportViewer'>
<div id="viewer-host">
<ReportViewer ref="reportViewer" language="zh"/>
</div>
</template>
<script lang='ts' setup>
import {Core, PdfExport} from "@grapecity/activereports";
import {Viewer} from "@grapecity/activereports-vue";
import {FontStore} from "@grapecity/activereports/core";
import "@grapecity/activereports/styles/ar-js-ui.css";
import "@grapecity/activereports/styles/ar-js-viewer.css";
import "../../public/locales/ar-js-locales.js";
import axios from "axios";
import {ref, onMounted} from "vue";
import Qs from "qs";
const ReportViewer = Viewer
const reportViewer = ref()
Core.setLicenseKey("");
const viewer = ref(null)
const from_par = Qs.parse(location.search.substring(1))
const from_host = Qs.parse(location.host)
const token = from_par.token
const apply_id = from_par.apply_id
const report_data = ref(null)
const report = ref(null)
console.log('来源域名：', from_host)
console.log('参数：', from_par.token)
const loadReport = async function () {
//从文件加载定义报表
const reportResponse = await fetch("/Report/zs/ApplyReport.rdlx-json");
const report = await reportResponse.json();
console.log(report);
return report;
}
FontStore.registerFonts("/fonts/fontsConfig.json");
onMounted(() => {
viewer.value = reportViewer.value.Viewer();
viewer.value.toggleSidebar()
// viewer.value.toggleToolbar(false); //隐藏整个工具栏；
axios.get('https://xxxxx/api/user_apply/apply_show', {
params: {
apply_id: apply_id,
},
headers: {
Authorization: token
}
}).then(async (res) => {
if (res.data.code === 200) {
report_data.value = res.data
report.value = await loadReport();
viewer.value.toolbar.updateLayout({
default: ["navigation", "$split", "$print"],
})
report.value.DataSources[0].ConnectionProperties.ConnectString = "jsondata=" + JSON.stringify(report_data.value);
viewer.value.open(report.value);
viewer.value.zoom = "FitToWidth"; //（FitToWidth）宽度自适应 （FitPage）整页显示
}
})
})
window.addEventListener('message', async (event) => {
// if (event.data && typeof event.data === 'string' && window.self !== window.top) {
if (event.data === 'PrintReport') {
// viewer.value.print();
var pageReport = new Core.PageReport();
var PDF = PdfExport;
var settings = {
info: {
title: 'XX义务教育阶段报名表',
author: 'XX教育云',
autoPrint: true,
},
pdfVersion: "1.7"
}
await pageReport.load(report.value)
const doc = await pageReport.run();
await PDF.exportDocument(doc, settings)
.then(function (result) {
// result.download(result.data)
window.open(URL.createObjectURL(result.data))
}
)
}
}
)
</script>
<style>
#viewer-host {
width: 100%;
height: 100vh;
}
</style>
|
陕公网安备：61019002000258 |
隐私政策 |
网站地图