boa noite, consegui gerar o pdf com meus dados da api, porém quero pegar uma constante no meu arquivo(o mesmo que puxa os dados da api), que seria um valor total, mas não consigo, poderia me dar uma luz? Ele diz que minha constante não está definida. Estou usando hooks. Em qual parte ele puxa os dados de app.js e de qual forma? A constante que quero implementar no meu pdf é -> valorTotal
Como estava dando erro, eu retirei e deixei como funciona mas sem o valorTotal
Como eu poderia implementar?
const visualizarImpressao = async () => {
console.log('report', filtro);
const classeImpressao = new Impressao(filtro);
const documento = await classeImpressao.PreparaDocumento();
pdfMake.createPdf(documento).open({}, window.open('', '_blank'));
}
E muito obrigado por ter compartilhado esse conteúdo, foi muito util para mim.
Hi there! 👋My name is Welker, I'm passionate about Javascript, Design and Web Development. In my free time I write programming tutorials here and I also have some videos on my Youtube
essa lib não se comunica diretamente com o state do react, você precisa montar um objeto com todas as informações que precisa e passar no construtor da classe de impressão. Ex.:
const dados = {
valorTotal: valorTotalState,
};
const classeImpressao = new Impressao(dados);
Hi there! 👋My name is Welker, I'm passionate about Javascript, Design and Web Development. In my free time I write programming tutorials here and I also have some videos on my Youtube
Substitua seu método CriaCorpoDocumento pelo exemplo que vou deixar abaixo, aí você vai conseguir adicionar outros elementos como texto, imagem, etc... Basta fazer page.push(elemento_que_deseja_adicionar)
CriaCorpoDocumento(){letpage=[]page.push({text:'Tabela de Itens',fontSize:14,bold:true,alignment:'center'})constheader=[{text:'Codigo',bold:true,fontSize:9,margin:[0,4,0,0]},{text:'Titulo',bold:true,fontSize:9,margin:[0,4,0,0]},{text:'Descrição',bold:true,fontSize:9,margin:[0,4,0,0]},{text:'Link',bold:true,fontSize:9,margin:[0,4,0,0]},];constlineHeader=[{text:'__________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________',alignment:'center',fontSize:5,colSpan:4,},{},{},{}];consttableContent=[]tableContent.push(header)tableContent.push(lineHeader)for(constitemofthis.dadosParaImpressao){tableContent.push([{text:item.id,fontSize:10},{text:item.title,fontSize:10},{text:item.description,fontSize:10},{text:'Google.com',link:'https://www.google.com/',fontSize:10}])}page.push({layout:'noBorders',table:{headerRows:1,widths:[40,55,'*',55],body:tableContent}})returnpage;}
`
Outra coisa, no método GerarDocumento substitua a linha da propriedade content pra ficar assim:
content: corpoDocumento
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
boa noite, consegui gerar o pdf com meus dados da api, porém quero pegar uma constante no meu arquivo(o mesmo que puxa os dados da api), que seria um valor total, mas não consigo, poderia me dar uma luz? Ele diz que minha constante não está definida. Estou usando hooks. Em qual parte ele puxa os dados de app.js e de qual forma? A constante que quero implementar no meu pdf é -> valorTotal
Como estava dando erro, eu retirei e deixei como funciona mas sem o valorTotal
Como eu poderia implementar?
const visualizarImpressao = async () => {
console.log('report', filtro);
const classeImpressao = new Impressao(filtro);
const documento = await classeImpressao.PreparaDocumento();
pdfMake.createPdf(documento).open({}, window.open('', '_blank'));
}
E muito obrigado por ter compartilhado esse conteúdo, foi muito util para mim.
essa lib não se comunica diretamente com o state do react, você precisa montar um objeto com todas as informações que precisa e passar no construtor da classe de impressão. Ex.:
const dados = {
valorTotal: valorTotalState,
};
const classeImpressao = new Impressao(dados);
Está assim o código, quero exibir o valorTotal depois da tabela que está no body
Poderia me ajudar?
export class Impressao {
constructor(dadosParaImpressao) {
this.dadosParaImpressao = dadosParaImpressao;
}
async PreparaDocumento() {
const corpoDocumento = this.CriaCorpoDocumento();
const documento = this.GerarDocumento(corpoDocumento);
return documento;
}
CriaCorpoDocumento() {
const header = [
{ text: 'Mês Chamado', bold: true, fontSize: 12, margin: [0, 4, 0, 0] },
{ text: 'Número Chamado', bold: true, fontSize: 12, margin: [0, 4, 0, 0] },
{ text: 'Valor Boleto', bold: true, fontSize: 12, margin: [0, 4, 0, 0] },
{ text: 'Técnico Chamado', bold: true, fontSize: 12, margin: [0, 4, 0, 0] },
{ text: 'Sistema', bold: true, fontSize: 12, margin: [0, 4, 0, 0] },
}
}
Substitua seu método CriaCorpoDocumento pelo exemplo que vou deixar abaixo, aí você vai conseguir adicionar outros elementos como texto, imagem, etc... Basta fazer
page.push(elemento_que_deseja_adicionar)
`
Outra coisa, no método GerarDocumento substitua a linha da propriedade content pra ficar assim:
content: corpoDocumento