Open kantsverma opened 4 years ago
import React, { Component } from "react"; import $ from "jquery"; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import { confirmAlert } from 'react-confirm-alert'; // Import import html2canvas from "html2canvas"; import * as jsPDF from "jspdf"; import { history } from "../helper/History"; import 'react-confirm-alert/src/react-confirm-alert.css' // Import css class DoAlert extends Component { constructor(props) { //console.log("Inside DoAlert => "+JSON.stringify(props)); super(props); this.state = { loader2: false, redirectUrl: "", showDialog: false, testType: props.type, buttonName: props.buttonName, className: props.className, target: props.target, href: props.href, pdfName: null, canvasSelector: null }; } submit = () => { const { href,buttonName } = this.props; //console.log('inside submit => '+this.state.testType+' == '+buttonName+' -- '+JSON.stringify(buttonName)); // const alreadySave = 'It’s already saved'; const alertTitle = <FormattedMessage id="do.alert.title" defaultMessage="Did you save you results?"/> const alertMessage = <FormattedMessage id="do.alert.subtitle" defaultMessage={`We are not keeping your result please save your result before {action} otherwise you will loose it.`} values={{action: buttonName}}/> const saveNow = <FormattedMessage id="do.alert.saveButton" defaultMessage="I save now"/> const alreadySave = <FormattedMessage id="do.alert.alreadySavebutton" defaultMessage="It’s already saved"/> confirmAlert({ title: <FormattedMessage id="do.alert.title" defaultMessage="Did you save you results?"/>, message: alertMessage, buttons: [ { label: saveNow, onClick: () => { // nothing to do this.printResult(); } }, { label: alreadySave, onClick: () => { //console.log('href '+href+' == '+this.state.testType); if(href == undefined){ // check conditoin if button type is do another test if(this.state.testType == 'individual'){ history.push("/individual"); }else{ history.push("/hr"); } }else{ // redirect to contact to coach history.push(href); } } } ] }); }; printResult(){ const { canvasSelector, pdfName } = this.props; console.log(canvasSelector+' -- '+pdfName); if(canvasSelector != undefined && pdfName != undefined){ this.setState({ loader2: true }); let CurrentDate = new Date(); let copyRightDate = CurrentDate.getFullYear(); var pilotRhLogo = new Image(); pilotRhLogo.src = 'assets/images/logo.png'; var PDF_Heighti = document.querySelector('#'+canvasSelector).offsetWidth; //var HTML_Width = $("#happinessTest").width(); var HTML_Width = 790; //console.log('Html width => '+HTML_Width); var HTML_Height = $('#'+canvasSelector).height(); //console.log('Html height => '+HTML_Height); var top_left_margin = 5; var PDF_Width = HTML_Width+(top_left_margin*2); //var PDF_Height = 2000; var PDF_Height = HTML_Height+(top_left_margin*2); //console.log('PDF Height x Width => '+PDF_Height+'x'+PDF_Width); var canvas_image_width = HTML_Width; var canvas_image_height = HTML_Height; var totalPDFPages = Math.ceil(HTML_Height/PDF_Height)-1; //console.log('NoOfPage => '+totalPDFPages); //html2canvas($("#happinessTest")[0],{allowTaint:true}).then(function(canvas) { html2canvas($('#'+canvasSelector)[0],{allowTaint:true}).then((canvas) => { canvas.getContext('2d'); //console.log(canvas.height+" "+canvas.width); var imgData = canvas.toDataURL("image/jpeg", 1.0); var pdf = new jsPDF('p', 'pt', [PDF_Width, PDF_Height]); //var pdf = new jsPDF(); pdf.addImage(pilotRhLogo, 'PNG', 330, 10); pdf.addImage(imgData, 'JPG', 10, 80); for (var i = 1; i <= totalPDFPages; i++) { pdf.addPage(PDF_Width, PDF_Height); pdf.addImage(imgData, 'JPG', top_left_margin, -PDF_Heighti+(top_left_margin)); } pdf.setFontSize(12); pdf.setTextColor(108, 117, 125); pdf.text(160, (PDF_Height-40),'© Copyright 5W PILOT RH SOLUTIONS '+ CurrentDate.getFullYear() +' – All right reserved – www.pilotrhsolutions.com.'); pdf.setTextColor(23, 162, 184); pdf.setFontType("bold"); pdf.text(310, (PDF_Height-20), localStorage.getItem("userName").toUpperCase()+' - '+("0" + (CurrentDate.getDate() + 1)).slice(-2) +'/'+ ("0" + (CurrentDate.getMonth() + 1)).slice(-2) +'/'+ CurrentDate.getFullYear()+' - '+ CurrentDate.getHours()+':'+ CurrentDate.getMinutes()); pdf.save(pdfName+".pdf"); this.setState({ loader2: false }); }); } } render() { const { testType,buttonName, className, target, href } = this.props; return ( <React.Fragment> <button onClick={e => this.submit(e)} className={className} target={target} > {buttonName} </button> </React.Fragment> ); } } export default DoAlert;