128 lines
3.8 KiB
JavaScript
128 lines
3.8 KiB
JavaScript
import React, {useEffect, useState } from 'react';
|
|
import { Modal, Button, ConfigProvider } from 'antd';
|
|
import { jsPDF } from 'jspdf';
|
|
import logoPiEnergi from '../../../../assets/images/logo/pi-energi.png';
|
|
import { kopReportPdf } from '../../../../components/Global/KopReport';
|
|
|
|
const GeneratePdf = (props) => {
|
|
const [pdfUrl, setPdfUrl] = useState(null);
|
|
|
|
useEffect(() => {
|
|
const token = localStorage.getItem('token');
|
|
if (token) {
|
|
generatePdf();
|
|
} else {
|
|
navigate('/signin');
|
|
}
|
|
}, []);
|
|
|
|
const handleCancel = () => {
|
|
props.setSelectedData(null);
|
|
props.setActionMode('list');
|
|
};
|
|
|
|
const generatePdf = async () => {
|
|
const {images, title} = await kopReportPdf(logoPiEnergi, 'COLD WORK PERMIT');
|
|
|
|
const doc = new jsPDF({
|
|
orientation: "portrait",
|
|
unit: "mm",
|
|
format: "a4"
|
|
});
|
|
|
|
const width = 45;
|
|
const height = 23;
|
|
const marginTop = 6;
|
|
const marginLeft = 10;
|
|
doc.addImage(images, 'PNG', marginLeft, marginTop, width, height);
|
|
|
|
doc.setFont('helvetica', 'bold');
|
|
doc.setFontSize(25);
|
|
doc.setTextColor(35, 165, 90);
|
|
doc.setTextColor('#00b0f0');
|
|
doc.text(title, 100, 25);
|
|
doc.setTextColor('#000000');
|
|
doc.setFontSize(11);
|
|
doc.setFont('helvetica', 'normal');
|
|
|
|
doc.setLineWidth(0.2);
|
|
doc.line(10, 32, 200, 32);
|
|
doc.setLineWidth(0.6);
|
|
doc.line(10, 32.8, 200, 32.8);
|
|
|
|
doc.text("Tanggal Pengajuan", 10, 42);
|
|
doc.text(":", 59, 42);
|
|
|
|
doc.text("Deskripsi Pekerjaan", 10, 48);
|
|
doc.text(":", 59, 48);
|
|
|
|
doc.text("No. Permit", 10, 54);
|
|
doc.text(":", 59, 54);
|
|
doc.text("Spesifik Lokasi", 120, 54);
|
|
doc.text(":", 160, 54);
|
|
|
|
doc.text("No. Order", 10, 60);
|
|
doc.text(":", 59, 60);
|
|
doc.text("Jum. Personil Terlihat", 120, 60);
|
|
doc.text(":", 160, 60);
|
|
|
|
doc.text("Peralatan yang digunakan", 10, 66);
|
|
doc.text(":", 59, 66);
|
|
|
|
doc.text("Jenis APD yang digunakan", 10, 72);
|
|
doc.text(":", 59, 72);
|
|
|
|
const blob = doc.output('blob');
|
|
const url = URL.createObjectURL(blob);
|
|
|
|
setPdfUrl(url);
|
|
|
|
setTimeout(() => {
|
|
URL.revokeObjectURL(url);
|
|
}, 1000);
|
|
};
|
|
|
|
return (
|
|
<Modal
|
|
width='60%'
|
|
title="Preview PDF"
|
|
open={props.showPdf}
|
|
// open={true}
|
|
onCancel={handleCancel}
|
|
footer={[
|
|
<>
|
|
<ConfigProvider
|
|
theme={{
|
|
token: { colorBgContainer: '#E9F6EF' },
|
|
components: {
|
|
Button: {
|
|
defaultBg: 'white',
|
|
defaultColor: '#23A55A',
|
|
defaultBorderColor: '#23A55A',
|
|
defaultHoverColor: '#23A55A',
|
|
defaultHoverBorderColor: '#23A55A',
|
|
defaultHoverColor: '#23A55A',
|
|
},
|
|
},
|
|
}}
|
|
>
|
|
<Button onClick={handleCancel}>Batal</Button>
|
|
</ConfigProvider>
|
|
</>,
|
|
]}
|
|
>
|
|
{pdfUrl && (
|
|
<iframe
|
|
src={`${pdfUrl}#zoom=100`}
|
|
title="PDF Viewer"
|
|
width="100%"
|
|
height="600px"
|
|
style={{ marginTop: '20px', border: '1px solid #ccc' }}
|
|
/>
|
|
)}
|
|
</Modal>
|
|
);
|
|
};
|
|
|
|
export default GeneratePdf;
|