ReactJS export 메뉴가 잘 작동하지 않음
추천0 비추천 0
페이지 정보
작성자 MESCIUSMAN
작성일 2024-02-06 12:08 조회 44회
댓글 0건
제품 버전 : "@grapecity/wijmo.react.all": "^5.20221.857",
컨트롤 이름 : 뷰어 내보내기
본문
관련링크
안녕하세요
첫번째 버튼을 누르면 아래 이미지 처럼 잘 작동합니다
첫번째 이후 버튼들을 누르면 각각 다른 인쇄물들이 호출되는데 위 이미지 처럼 export 메뉴가 나오지 않습니다.
눌렀을 때 화살표만 움직이고 메뉴가 나오지 않는군요
확인 부탁드립니다.
import "@grapecity/wijmo.styles/wijmo.css";
import "bootstrap/dist/css/bootstrap.css";
import "@grapecity/wijmo.react.grid";
import React, { useState, useEffect, useRef } from "react";
import axios from "axios";
import { Viewer } from "@grapecity/activereports-react";
import "@grapecity/activereports/pdfexport";
import "@grapecity/activereports/htmlexport";
import "@grapecity/activereports/tabulardataexport";
import { useSelector, useDispatch } from "react-redux";
import Loading from "utils/loading";
const Report = ({ printData, pPgm, loaDing, pProc, repOrdNo, repOrdDate, selectPlant, selectRdc }) => {
//redux
const dispatch = useDispatch();
const getLoading = useSelector((state) => state.setLoaDing.loaDing);
async function loadReport() {
// load report definition from the file
const reportResponse = await fetch(`/rep/${pPgm}.rdlx-json`);
const report = await reportResponse.json();
return report;
}
const viewerRef = useRef();
useEffect(() => {
// if (repOrdNo !== "" || null || undefined) {
async function openReport() {
const data = printData;
const report = await loadReport();
// const data = await loadData();
// const report = await loadReport();
report.DataSources[0].ConnectionProperties.ConnectString = "jsondata=" + JSON.stringify(data);
viewerRef.current.Viewer.open(report);
}
openReport();
// }
}, [loaDing]);
useEffect(() => {
dispatch({ type: "SET_LOADING", loaDing: loaDing });
return () => {};
}, [loaDing]);
const exportsSettings = {
pdf: {
title: "BILLOFLADING",
subject: "Reporting",
printing: "none",
copying: false,
modifying: false,
annotating: false,
contentAccessibility: false,
documentAssembly: false,
pdfVersion: "1.7",
autoPrint: true,
filename: "ActiveReportsJS-Sample.pdf",
},
html: {
title: "BILLOFLADING",
autoPrint: true,
multiPage: true,
outputType: "html",
filename: "BILLOFLADING.html",
},
xlsx: {
sheetName: "BILLOFLADING",
filename: "BILLOFLADING..xlsx",
size: "A4",
},
};
return (
<div id='viewer-host'>
{getLoading ? <Loading /> : null}
<Viewer ref={viewerRef} exportsSettings={exportsSettings} />
</div>
);
};
export { Report };
현재 적용한 소스 입니다.
댓글목록
등록된 댓글이 없습니다.
2 답변
