@ -1,4 +1,4 @@
import React , { useEffect , useState } from 'react' import React , { useEffect , useState , useRef } from 'react'
import { Modal , ModalHeader , ModalBody , ModalFooter } from 'reactstrap' ; import { Modal , ModalHeader , ModalBody , ModalFooter } from 'reactstrap' ;
import { Button } from 'reactstrap' ; import { Button } from 'reactstrap' ;
import moment from 'moment' ; import moment from 'moment' ;
@ -6,13 +6,18 @@ import 'antd/dist/antd.css';
import _ from 'underscore' import _ from 'underscore'
import './style.css' import './style.css'
import { formatThousand , sortBy } from '../../../const/CustomFunc' ; import { formatThousand , sortBy } from '../../../const/CustomFunc' ;
import { BASE _OSPRO } from "../../../const/ApiConst" ; import { BASE _OSPRO , PROYEK _SEARCH } from "../../../const/ApiConst" ;
import { Tooltip , Spin } from 'antd' ;
import { useTranslation } from 'react-i18next' ;
import axios from "../../../const/interceptorApi"
import autoTable from "jspdf-autotable" ;
import jsPDF from "jspdf" ;
const createMarkup = ( element ) => { const createMarkup = ( element ) => {
return { _ _html : element } ; return { _ _html : element } ;
} }
const ViewProject = ( { openDialog , closeDialog , toggleDialog , projectCharter , projectParticipant , projectChecklist , projectIssue , projectRisk , projectMilestone , projectApproval , projectManager , projectK3 , assignHR , projectImage } ) => { const ViewProject = ( { idTask , openDialog , closeDialog , toggleDialog , projectCharter , projectParticipant , projectChecklist , projectIssue , projectRisk , projectMilestone , projectApproval , projectManager , projectK3 , assignHR , projectImage } ) => {
const [ proyekName , setProyekName ] = useState ( "" ) const [ proyekName , setProyekName ] = useState ( "" )
const [ description , setDescription ] = useState ( "" ) const [ description , setDescription ] = useState ( "" )
const [ shortname , setKodeShortname ] = useState ( "" ) const [ shortname , setKodeShortname ] = useState ( "" )
@ -41,6 +46,18 @@ const createMarkup = (element) => {
const [ K3Search , setDataK3Search ] = useState ( "" ) const [ K3Search , setDataK3Search ] = useState ( "" )
const [ HR , setAssignHR ] = useState ( "" ) const [ HR , setAssignHR ] = useState ( "" )
const formatDate = "DD-MM-YYYY" ; const formatDate = "DD-MM-YYYY" ;
const reportTemplateRef = useRef ( null ) ;
const [ loading , setLoading ] = useState ( true ) ;
const { t } = useTranslation ( ) ;
const token = localStorage . getItem ( "token" ) ;
const HEADER = {
headers : {
"Content-Type" : "application/json" ,
Authorization : ` Bearer ${ token } ` ,
} ,
} ;
useEffect ( ( ) => { useEffect ( ( ) => {
if ( ! openDialog ) { if ( ! openDialog ) {
setProyekName ( "" ) setProyekName ( "" )
@ -69,15 +86,16 @@ const createMarkup = (element) => {
setMilestone ( [ ] ) setMilestone ( [ ] )
setPotentialRisks ( "" ) setPotentialRisks ( "" )
setApproval ( [ ] ) setApproval ( [ ] )
setLoading ( false )
} }
} , [ openDialog ] ) ; } , [ openDialog ] ) ;
useEffect ( ( ) => { useEffect ( ( ) => {
if ( projectCharter && projectCharter != { } ) { if ( projectCharter && projectCharter != { } ) {
setProyekName ( projectCharter . nama ) ; setProyekName ( projectCharter . nama ) ;
setDescription ( projectCharter . keterangan ) ; setDescription ( projectCharter . keterangan ) ;
setKodeShortname ( projectCharter . kode _sortname ) ; setKodeShortname ( projectCharter . kode _sortname ) ;
setLokasiKantor ( projectCharter . lokasi _kantor ) ; setLokasiKantor ( projectCharter . area _kerja ) ;
setDurasiProyek ( projectCharter . durasi _proyek ) ; setDurasiProyek ( projectCharter . durasi _proyek ) ;
setMulaiProyek ( projectCharter . mulai _proyek ) ; setMulaiProyek ( projectCharter . mulai _proyek ) ;
setValueProyek ( projectCharter . value _proyek ) ; setValueProyek ( projectCharter . value _proyek ) ;
@ -155,6 +173,19 @@ const createMarkup = (element) => {
setAssignHR ( assignHR ) setAssignHR ( assignHR )
} }
} , [ assignHR ] ) ; } , [ assignHR ] ) ;
const handleExportPdf = async ( ) => {
const doc = new jsPDF ( {
orientation : 'landscape' ,
unit : 'px' ,
format : [ 1106 , 1000 ]
} ) ;
doc . html ( reportTemplateRef . current , {
async callback ( doc ) {
await doc . save ( 'Project Charter' ) ;
} ,
} ) ;
} ;
const RenderParticipant = ( ) => { const RenderParticipant = ( ) => {
if ( participants && participants . length > 0 ) { if ( participants && participants . length > 0 ) {
@ -182,14 +213,18 @@ const createMarkup = (element) => {
const K3Number = number [ index ] ; const K3Number = number [ index ] ;
return ( return (
< tr key = { index } > < tr key = { index } >
< td style = { { ... tdStyle , width : 50 , textAlign : 'center' } } > < p style = { pStyle } > { K3Number } < / p > < / t d > < td style = { { ... tdStyle , width : 50 , textAlign : 'center' } } > < p style = { { ... pStyle , fontWeight : 'normal' } } > { K3Number } < / p > < / t d >
< td style = { tdStyle } className = 'plr-10' > < p style = { pStyle } > { val . checklist _k3 _name ? val . checklist _k3 _name : "-" } < / p > < / t d > < td style = { tdStyle } className = 'plr-10' > < p style = { { ... pStyle , fontWeight : 'normal' } } > { val . checklist _k3 _name ? val . checklist _k3 _name : "-" } < / p > < / t d >
< / t r > < / t r >
) )
} ) } )
) )
} else { } else {
return ( < tr > < td > < br > < / b r > < / t d > < / t r > ) return (
< tr >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< / t r > ) ;
} }
} }
@ -201,10 +236,10 @@ const createMarkup = (element) => {
const ChecklistNumber = number [ index ] ; const ChecklistNumber = number [ index ] ;
return ( return (
< tr key = { index } > < tr key = { index } >
< td style = { { ... tdStyle , width : 50 , textAlign : 'center' } } > < p style = { pStyle } > { ChecklistNumber } < / p > < / t d > < td style = { { ... tdStyle , width : 50 , textAlign : 'center' } } > < p style = { { ... pStyle , fontWeight : 'normal' } } > { ChecklistNumber } < / p > < / t d >
< td style = { tdStyle } className = 'plr-10' > < p style = { pStyle } > { val . item ? val . item : "-" } < / p > < / t d > < td style = { tdStyle } className = 'plr-10' > < p style = { { ... pStyle , fontWeight : 'normal' } } > { val . item ? ? "-" } < / p > < / t d >
< td style = { tdStyle } className = 'plr-10' > < td style = { tdStyle } className = 'plr-10' >
< p style = { pStyle } > < p style = { { ... pStyle , fontWeight : 'normal' } } >
{ val . status _exist === true ? "Tersedia" : "Tidak tersedia" } { val . status _exist === true ? "Tersedia" : "Tidak tersedia" }
< / p > < / p >
< / t d > < / t d >
@ -213,7 +248,12 @@ const createMarkup = (element) => {
} ) } )
) )
} else { } else {
return ( < tr > < td > < br > < / b r > < / t d > < / t r > ) return (
< tr >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< / t r > ) ;
} }
} }
@ -224,17 +264,21 @@ const createMarkup = (element) => {
return ( return (
< tr key = { index } > < tr key = { index } >
< td style = { { ... tdStyle , width : 50 , textAlign : 'center' } } className = 'plr-10' > < td style = { { ... tdStyle , width : 50 , textAlign : 'center' } } className = 'plr-10' >
< p style = { pStyle } > < p style = { { ... pStyle , fontWeight : 'normal' } } >
{ val . level _issue ? val . level _issue : "-" } { val . level _issue ? val . level _issue : "-" }
< / p > < / p >
< / t d > < / t d >
< td style = { tdStyle } className = 'plr-10' > < p style = { pStyle } > { val . description ? val . description : "-" } < / p > < / t d > < td style = { tdStyle } className = 'plr-10' > < p style = { { ... pStyle , fontWeight : 'normal' } } > { val . description ? val . description : "-" } < / p > < / t d >
< / t r > < / t r >
) )
} ) } )
) )
} else { } else {
return ( < tr > < td > < br > < / b r > < / t d > < / t r > ) return (
< tr >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< / t r > )
} }
} }
@ -245,18 +289,23 @@ const createMarkup = (element) => {
return ( return (
< tr key = { index } > < tr key = { index } >
< td style = { { ... tdStyle , width : 50 , textAlign : 'center' } } className = 'plr-10' > < td style = { { ... tdStyle , width : 50 , textAlign : 'center' } } className = 'plr-10' >
< p style = { pStyle } > < p style = { { ... pStyle , fontWeight : 'normal' } } >
{ val . level _risk ? val . level _risk : "-" } { val . level _risk ? ? "-" }
< / p > < / p >
< / t d > < / t d >
< td style = { tdStyle } className = 'plr-10' > < p style = { pStyle } > { val . description ? val . description : "-" } < / p > < / t d > < td style = { tdStyle } className = 'plr-10' > < p style = { { ... pStyle , fontWeight : 'normal' } } > { val . description ? ? "-" } < / p > < / t d >
< td style = { tdStyle } className = 'plr-10' > < p style = { pStyle } > { val . preventive _risk ? val . preventive _risk : "-" } < / p > < / t d > < td style = { tdStyle } className = 'plr-10' > < p style = { { ... pStyle , fontWeight : 'normal' } } > { val . preventive _risk ? ? "-" } < / p > < / t d >
< / t r > < / t r >
) )
} ) } )
) )
} else { } else {
return ( < tr > < td > < br > < / b r > < / t d > < / t r > ) return (
< tr >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< / t r > )
} }
} }
@ -267,20 +316,25 @@ const createMarkup = (element) => {
return ( return (
< tr key = { index } > < tr key = { index } >
< td style = { tdStyle } className = 'plr-10' > < td style = { tdStyle } className = 'plr-10' >
< p > { val . join _first _name ? val . join _first _name : val . join _first _name } < / p > < p > { val . join _first _name ? val . join _first _name : "-" } < / p >
< / t d > < / t d >
< td style = { tdStyle } className = 'plr-10' > < td style = { tdStyle } className = 'plr-10' >
< p > { val . join _second _name ? val . join _second _name : val . join _second _name } < / p > < p > { val . join _second _name ? val . join _second _name : "-" } < / p >
< / t d > < / t d >
< td style = { tdStyle } className = 'plr-10' > < td style = { tdStyle } className = 'plr-10' >
< p > { val . join _second _description ? val . join _second _description : val . join _second _description } < / p > < p > { val . join _second _description ? val . join _second _description : "-" } < / p >
< / t d > < / t d >
< / t r > < / t r >
) )
} ) } )
) )
} else { } else {
return ( < tr > < td > < br > < / b r > < / t d > < / t r > ) return (
< tr >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< / t r > )
} }
} }
@ -298,20 +352,28 @@ const createMarkup = (element) => {
return ( return (
< tr key = { index } > < tr key = { index } >
< td style = { tdStyle } > < td style = { tdStyle } >
< p style = { { ... pStyle , textAlign : 'center' } } > { milestoneLetter } < / p > < p style = { { ... pStyle , fontWeight : 'normal' , textAlign : 'center' } } > { milestoneLetter } < / p >
< / t d > < / t d >
< td className = 'plr-10' style = { tdStyle } > < td className = 'plr-10' style = { tdStyle } >
< p style = { { ... pStyle , color : '#000000' } } > { val . status } < / p > < p style = { { ... pStyle , fontWeight : 'normal' , color : '#000000' } } > { val . status ? ? "-" } < / p >
< / t d > < / t d >
< td className = 'plr-10' style = { { ... tdStyle , textAlign : 'center' } } > < td className = 'plr-10' style = { { ... tdStyle , textAlign : 'center' } } >
< p > & nbsp ; { moment ( val . deadline ) . format ( formatDate ) } < / p > < p style = { { ... pStyle , fontWeight : 'normal' , color : '#000000' } } >
& nbsp ; { moment ( val . deadline ) . format ( formatDate ) }
< / p >
< / t d > < / t d >
< / t r > < / t r >
) ; ) ;
} ) } )
) ; ) ;
} else { } else {
return ( < tr > < td > < br > < / b r > < / t d > < / t r > ) ; return (
< tr >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< td style = { { ... tdStyle , textAlign : "center" } } > - < / t d >
< / t r > ) ;
} }
} }
@ -329,7 +391,10 @@ const createMarkup = (element) => {
} ) } )
) )
} else { } else {
return ( < tr > < td > < br > < / b r > < / t d > < / t r > ) return (
< tr >
< td style = { { textAlign : "center" } } > & nbsp ; - < / t d >
< / t r > )
} }
} }
@ -353,26 +418,24 @@ const createMarkup = (element) => {
marginLeft : '5pt' , marginLeft : '5pt' ,
marginTop : '2pt' , marginTop : '2pt' ,
marginBottom : '2pt' , marginBottom : '2pt' ,
fontFamily : 'Arial' ,
fontSize : '10pt' , fontSize : '10pt' ,
fontWeight : 'bold' , fontWeight : 'bold' ,
} ; } ;
const italicStyle = {
fontStyle : 'italic'
} ;
const boldStyle = {
fontWeight : 'bold' ,
fontVariant : 'small-caps' ,
} ;
const emptyCellStyle = { const emptyCellStyle = {
padding : '0' , padding : '0' ,
} ; } ;
const paddingTable = {
paddingTop : "20px" ,
paddingLeft : "30px" ,
paddingRight : "30px"
}
const renderForm = ( ) => { const renderForm = ( ) => {
return ( return (
< div > < div id = "pdf-content" style = { paddingTable } >
< h3 > Project Charter < / h 3 >
< table style = { tableStyle } className = "a" > < table style = { tableStyle } className = "a" >
< tbody > < tbody >
< tr > < tr >
@ -385,7 +448,7 @@ const createMarkup = (element) => {
< p style = { pStyle } > Nama Proyek < / p > < p style = { pStyle } > Nama Proyek < / p >
< / t d > < / t d >
< td colSpan = "2" style = { tdStyle } > < td colSpan = "2" style = { tdStyle } >
< p style = { { ... pStyle , fontWeight : 'normal' , fontStyle : 'italic ' } } > { proyekName ? ? '-' } < / p > < p className = "capitalize" style = { { ... pStyle , fontWeight : 'normal' } } > { proyekName ? ? '-' } < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
@ -393,7 +456,7 @@ const createMarkup = (element) => {
< p style = { pStyle } > Project description < / p > < p style = { pStyle } > Project description < / p >
< / t d > < / t d >
< td colSpan = "2" style = { tdStyle } > < td colSpan = "2" style = { tdStyle } >
< p style = { { ... pStyle , fontWeight : 'normal' , fontStyle : 'italic' } } > { description ? ? '-' } < / p > < p style = { { ... pStyle , fontWeight : 'normal' } } > { description != "" ? description : '-' } < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
@ -409,7 +472,7 @@ const createMarkup = (element) => {
< p style = { pStyle } > Lokasi Proyek < / p > < p style = { pStyle } > Lokasi Proyek < / p >
< / t d > < / t d >
< td colSpan = "2" style = { tdStyle } > < td colSpan = "2" style = { tdStyle } >
< p > & nbsp ; { lokasi ? ? '-' } < / p > < p > & nbsp ; { lokasi != "" ? lokasi : '-' } < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
@ -441,7 +504,7 @@ const createMarkup = (element) => {
< p style = { pStyle } > Anggaran Proyek < / p > < p style = { pStyle } > Anggaran Proyek < / p >
< / t d > < / t d >
< td colSpan = "2" style = { tdStyle } > < td colSpan = "2" style = { tdStyle } >
< p style = { { ... pStyle , fontWeight : 'normal' , fontStyle : 'italic' } } > { currency } . { formatThousand ( budget ) } < / p > < p style = { { ... pStyle , fontWeight : 'normal' } } > { currency } . { formatThousand ( budget ) } < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
@ -462,7 +525,7 @@ const createMarkup = (element) => {
< p style = { pStyle } > Project Manager < / p > < p style = { pStyle } > Project Manager < / p >
< / t d > < / t d >
< td colSpan = "2" style = { tdStyle } > < td colSpan = "2" style = { tdStyle } >
< p > & nbsp ; { PM } < / p > < p > & nbsp ; { PM ? ? "-" } < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
@ -480,12 +543,18 @@ const createMarkup = (element) => {
< tbody > < tbody >
< tr > < tr >
< td bgcolor = "#F2F2F2" style = { tdStyle } > < td bgcolor = "#F2F2F2" style = { tdStyle } >
< p style = { { ... pStyle , fontVariant : 'small-caps' } } > 2.0 OBJEKTIF PROYEK ( TUJUAN ) < / p > < p style = { pStyle } > 2.0 OBJEKTIF PROYEK ( TUJUAN ) < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
< td style = { tdStyle } > < td style = { tdStyle } >
< p style = { italicStyle } > { objectives ? ? '-' } < / p > < p style = { { ... pStyle , fontWeight : 'normal' } } >
{ objectives ? (
< span dangerouslySetInnerHTML = { createMarkup ( objectives ) } / >
) : (
'-'
) }
< / p >
< / t d > < / t d >
< / t r > < / t r >
< / t b o d y > < / t b o d y >
@ -495,13 +564,17 @@ const createMarkup = (element) => {
< tbody > < tbody >
< tr > < tr >
< th style = { thStyle } > < th style = { thStyle } >
< p style = { { ... pStyle , ... boldStyle } } > 3.0 RUANG LINGKUP PROYEK < / p > < p style = { pStyle } > 3.0 RUANG LINGKUP PROYEK < / p >
< / t h > < / t h >
< / t r > < / t r >
< tr > < tr >
< td style = { tdStyle } > < td style = { tdStyle } >
< ul > < ul >
< li style = { pStyle } > { scoupeProyek ? ? '-' } < / l i > { scoupeProyek ? (
< li style = { pStyle } > { scoupeProyek ? ? '-' } < / l i >
) : (
"-"
) }
< / u l > < / u l >
< / t d > < / t d >
< / t r > < / t r >
@ -512,7 +585,7 @@ const createMarkup = (element) => {
< tbody > < tbody >
< tr > < tr >
< td colSpan = "3" style = { thStyle } > < td colSpan = "3" style = { thStyle } >
< p style = { { ... pStyle , fontVariant : 'small-caps' } } > 4.0 ANGGOTA PROYEK < / p > < p style = { pStyle } > 4.0 ANGGOTA PROYEK < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
@ -534,14 +607,14 @@ const createMarkup = (element) => {
< tbody > < tbody >
< tr > < tr >
< th style = { thStyle } > < th style = { thStyle } >
< p style = { { ... pStyle , fontVariant : 'small-caps' } } > 5.0 STRUKTUR ORGANISASI < / p > < p style = { pStyle } > 5.0 STRUKTUR ORGANISASI < / p >
< / t h > < / t h >
< / t r > < / t r >
< tr > < tr >
< th style = { emptyCellStyle } > < th style = { emptyCellStyle } >
< p > & nbsp ; < p > & nbsp ;
{ image ? ( { image ? (
< img src = { ` ${ BASE _OSPRO } /assets/image/ ` + image } style = { { width : "50px "} } > < / i m g > < img src = { ` ${ BASE _OSPRO } /assets/image/ ` + image } style = { { maxWidth : "100% "} } > < / i m g >
) : ( ) : (
'-' '-'
) } ) }
@ -555,7 +628,7 @@ const createMarkup = (element) => {
< tbody > < tbody >
< tr > < tr >
< th colSpan = "3" style = { thStyle } > < th colSpan = "3" style = { thStyle } >
< p style = { { ... pStyle , fontVariant : 'small-caps' } } > 6.0 TARGET UTAMA & amp ; MILESTONE PENCAPAIAN < / p > < p style = { pStyle } > 6.0 TARGET UTAMA & amp ; MILESTONE PENCAPAIAN < / p >
< / t h > < / t h >
< / t r > < / t r >
< tr > < tr >
@ -577,7 +650,7 @@ const createMarkup = (element) => {
< tbody > < tbody >
< tr > < tr >
< td colSpan = "2" style = { thStyle } > < td colSpan = "2" style = { thStyle } >
< p style = { { ... pStyle , fontVariant : 'small-caps' } } > 7.0 ISU & amp ; HAMBATAN UTAMA < / p > < p style = { pStyle } > 7.0 ISU & amp ; HAMBATAN UTAMA < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
@ -591,13 +664,13 @@ const createMarkup = (element) => {
< RenderIssueProject / > < RenderIssueProject / >
< / t b o d y > < / t b o d y >
< / t a b l e > < / t a b l e >
< p style = { { ... pStyle , fontSize : '10pt' , fontStyle : 'italic' } } > * Skala 1 ke 7 ( 1 = kecil , 7 = besar ) < / p > < p style = { { ... pStyle , fontSize : '10pt' , fontWeight : 'normal' , font Style : 'italic' } } > * Skala 1 ke 7 ( 1 = kecil , 7 = besar ) < / p >
< p > & nbsp ; < / p > < p > & nbsp ; < / p >
< table style = { tableStyle } className = "a6" > < table style = { tableStyle } className = "a6" >
< tbody > < tbody >
< tr > < tr >
< td colSpan = "3" style = { thStyle } > < td colSpan = "3" style = { thStyle } >
< p style = { { ... pStyle , fontVariant : 'small-caps' } } > 8.0 RESIKO < / p > < p style = { pStyle } > 8.0 RESIKO < / p >
< / t d > < / t d >
< / t r > < / t r >
< tr > < tr >
@ -614,7 +687,7 @@ const createMarkup = (element) => {
< RenderRiskProject / > < RenderRiskProject / >
< / t b o d y > < / t b o d y >
< / t a b l e > < / t a b l e >
< p style = { { ... pStyle , fontSize : '10pt' , fontStyle : 'italic' } } > * Skala 1 ke 7 ( 1 = kecil , 7 = besar ) < / p > < p style = { { ... pStyle , fontSize : '10pt' , fontWeight : 'normal' , font Style : 'italic' } } > * Skala 1 ke 7 ( 1 = kecil , 7 = besar ) < / p >
< p > & nbsp ; < / p > < p > & nbsp ; < / p >
< table style = { tableStyle } className = "a7" > < table style = { tableStyle } className = "a7" >
< tbody > < tbody >
@ -624,7 +697,13 @@ const createMarkup = (element) => {
< / t h > < / t h >
< / t r > < / t r >
< tr > < tr >
< p dangerouslySetInnerHTML = { createMarkup ( lateProyek ? ? '-' ) } > < / p > < p style = { { ... pStyle , fontWeight : 'normal' } } >
{ lateProyek ? (
< span dangerouslySetInnerHTML = { createMarkup ( lateProyek ) } / >
) : (
"-"
) }
< / p >
< / t r > < / t r >
< / t b o d y > < / t b o d y >
< / t a b l e > < / t a b l e >
@ -638,7 +717,13 @@ const createMarkup = (element) => {
< / t r > < / t r >
< tr > < tr >
< th > < th >
< p style = { pStyle } > { projectSuccess ? ? '-' } < / p > < p style = { { ... pStyle , fontWeight : 'normal' } } >
{ projectSuccess ? (
< span dangerouslySetInnerHTML = { createMarkup ( projectSuccess ) } / >
) : (
'-'
) }
< / p >
< / t h > < / t h >
< / t r > < / t r >
< / t b o d y > < / t b o d y >
@ -653,7 +738,13 @@ const createMarkup = (element) => {
< / t r > < / t r >
< tr > < tr >
< td > < td >
< p dangerouslySetInnerHTML = { createMarkup ( assumtionProyek ? ? '-' ) } > < / p > < p style = { { ... pStyle , fontWeight : 'normal' } } >
{ assumtionProyek ? (
< span dangerouslySetInnerHTML = { createMarkup ( assumtionProyek ) } / >
) : (
'-'
) }
< / p >
< / t d > < / t d >
< / t r > < / t r >
< / t b o d y > < / t b o d y >
@ -719,9 +810,17 @@ const createMarkup = (element) => {
return ( return (
< > < >
< Modal size = "xl" isOpen = { openDialog } toggle = { toggleDialog } > < Modal size = "xl" isOpen = { openDialog } toggle = { toggleDialog } >
< ModalHeader className = "capitalize" toggle = { closeDialog } > Project < / M o d a l H e a d e r > < ModalHeader className = "capitalize" toggle = { closeDialog } >
< div >
< Tooltip title = { t ( 'Export PDF' ) } >
< Button style = { { marginLeft : "5px" } } onClick = { ( e ) => handleExportPdf ( ) } > < i className = "fa fa-print" > < / i > E x p o r t P D F < / B u t t o n >
< / T o o l t i p >
< / d i v >
< / M o d a l H e a d e r >
< ModalBody > < ModalBody >
{ renderForm ( ) } < div ref = { reportTemplateRef } >
{ renderForm ( ) }
< / d i v >
< / M o d a l B o d y > < / M o d a l B o d y >
< ModalFooter > < ModalFooter >
< Button color = "primary" onClick = { closeDialog } > Close < / B u t t o n > < Button color = "primary" onClick = { closeDialog } > Close < / B u t t o n >
wahyu
1 year ago