form surat BA di tempat

components/Sanksi/SuratBA.js

@@ -13,6 +13,8 @@ class ComponentToPrint extends React.Component {
         super(props);
         this.state = {
             dataLaporan: {},
+            tempat: "Klik 2 kali untuk Isi tempat",
+            isEditMode: false,
         };
     }
 
@@ -27,11 +29,23 @@ class ComponentToPrint extends React.Component {
         const dataLaporan = await getOneLaporan(token, id);
         this.setState({ dataLaporan });
     };
+    changeEditMode = () => {
+        this.setState({
+            isEditMode: !this.state.isEditMode,
+        })
+    }
+    updateValueTempat = () => {
+        this.setState({
+            isEditMode: false,
+            tempat: this.refs.inputTempat.value
+        })
+    }
 
 
 
     render() {
-        const { dataLaporan, today } = this.state
+        const { dataLaporan, tempat, isEditMode } = this.state
+        console.log(tempat)
         return (
             <div className='BA-div' >
                 <div className='BA-logo'>
@@ -42,7 +56,21 @@ class ComponentToPrint extends React.Component {
                     {dataLaporan.data && (<h3 className='BA-header'>{dataLaporan.data.pt.nama}</h3>)}
                     <div className='BA-body'>
                         <p className='BA-body'>
-                            Pada hari ini <span>{moment(dataLaporan.createAt).locale("id").format("dddd")}</span>, tanggal&nbsp;{moment(dataLaporan.createAt).format("D")}&nbsp; bulan &nbsp;{moment(dataLaporan.createAt).format("MMMM")} tahun &nbsp;{moment(dataLaporan.createAt).format("YYYY")}, bertempat di<span contenteditable='true'>&nbsp;&nbsp;&nbsp;</span>, telah dilakukan rapat evaluasi dan pembahasan dugaan pelanggaran penyelenggaraan oleh perguruan tinggi dan/atau badan penyelenggara {dataLaporan.data && (<span>{dataLaporan.data.pt.nama}</span>)}, yang dihadiri oleh:
+                            Pada hari ini <span>{moment(dataLaporan.createAt).locale("id").format("dddd")}</span>, tanggal&nbsp;{moment(dataLaporan.createAt).format("D")}&nbsp; bulan &nbsp;{moment(dataLaporan.createAt).format("MMMM")} tahun &nbsp;{moment(dataLaporan.createAt).format("YYYY")},
+                            bertempat di
+                            {isEditMode ?
+                                <span>
+                                    <input type='text'
+                                        defaultValue={tempat}
+                                        ref="inputTempat" />
+                                    <button className='bg-transparent button-transparent border-0 fas fa-times-circle text-danger' onClick={this.changeEditMode} />
+                                    <button className='bg-transparent button-transparent border-0 fas fa-check-circle text-success' onClick={this.updateValueTempat} />
+                                </span>
+                                :
+                                <span color='danger' onDoubleClick={this.changeEditMode}>&nbsp;{tempat}</span>
+                            }
+                            ,
+                            telah dilakukan rapat evaluasi dan pembahasan dugaan pelanggaran penyelenggaraan oleh perguruan tinggi dan/atau badan penyelenggara {dataLaporan.data && (<span>{dataLaporan.data.pt.nama}</span>)}, yang dihadiri oleh:
                         </p>
                         <div className='BA-body'>
                             <ol>

pages/app/pelaporan/index.js

@@ -33,9 +33,7 @@ class Pelaporan extends Component {
 			jumlahLaporan: true,
 		});
 		const newLaporan = graph.data.newLaporan;
-		console.log(pelaporan)
 		this.setState({ pelaporan, graph, newLaporan });
-		console.log(this.state.pelaporan)
 	};
 
 	nextButton = async () => {