commit

actions/disk.js

@@ -0,0 +1,26 @@
+
+import axios from "@/config/axios";
+import axios2 from "axios";
+
+
+
+export const getDiskSpace = async (token, date) => {
+	try {
+		const res = await axios.get(`/disk?date=2024-10-29`, { headers: { Authorization: token } });
+		return res.data;
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};
+
+export const getMonthDiskSpace = async (token, date) => {
+	try {
+		const res = await axios.get(`/disk?date=${date}`, { headers: { Authorization: token } });
+		return res.data;
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};
+

components/Main/TableRiwayatCatatan.js

@@ -114,7 +114,10 @@ function TableRiwayatCatatan({ listData, query, editFilePage, newFilePage, readO
                             {listData?.length
                                 ? listData.map((data, i) => (
                                     <tr>
-                                        <td>{moment(data.createdAt).format("D MMMM YYYY")}</td>
+                                        <td>
+                                            <p style={{ display: "none" }}>{data.createdAt}</p>
+                                            {moment(data.createdAt).format("D MMMM YYYY")}
+                                        </td>
                                         <td>
                                             {data.judul}
                                         </td>

components/Riwayat/ChartDonutDisk.js

@@ -0,0 +1,84 @@
+import React, { Component } from "react";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import { Container, Row, Col, Card, CardHeader, CardBody } from "reactstrap";
+
+import Sparkline from "@/components/Common/Sparklines.js";
+import MorrisChart from "@/components/Charts/Morris.js";
+import { getDiskSpace } from "../../actions/disk";
+import moment from "moment";
+
+class ChartDonutDisk extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+
+			use_disk: undefined,
+			free_disk: undefined,
+			loading: true,
+
+		};
+	}
+
+	componentDidMount = async () => {
+		const { token } = this.props;
+		try {
+			const dataDisk = await getDiskSpace(token);
+			const use_disk = parseFloat(`${dataDisk?.data?.map(e => e.use_percent)}`.replace('%', ''));
+			const free_disk = parseFloat(100 - use_disk);
+			this.setState({ use_disk, free_disk, loading: false });
+		} catch (error) {
+			console.error("Error fetching disk space data: ", error);
+			this.setState({ loading: false });
+		}
+	};
+
+	ChartDonut = {
+
+
+		options: {
+			element: 'morris-donut',
+			colors: ['#3e3a8e', '#fad732'],
+			resize: true,
+			formatter: function (value, data) {
+				return value + '%';
+			}
+		},
+	};
+
+
+	render() {
+		const { use_disk, free_disk, loading } = this.state;
+		if (loading) {
+			return <div>Loading...</div>;
+		}
+
+		const chartData = [
+			{
+				label: "Terpakai",
+				color: "#3e3a8e",
+				value: use_disk
+			},
+			{
+				label: "Tidak Terpakai",
+				color: "#b0adfe",
+				value: free_disk
+			}
+		];
+
+		return (
+
+			<Col lg={12}>
+				<Card className="card-default">
+					<CardBody>
+						<MorrisChart type={'Donut'} id="morris-donut" options={this.ChartDonut.options} data={chartData} className="flot-chart" />
+					</CardBody>
+					<div align="center" className=" mb-2">
+						<span>Data Statistik Kapasitas Hardisk Per {moment().locale("id").format("DD MMMM YYYY")}</span>
+					</div>
+				</Card>
+			</Col>
+		);
+	}
+}
+
+export default ChartDonutDisk;

components/Riwayat/ChartLineDisk.js

@@ -0,0 +1,170 @@
+import React, { Component } from "react";
+import { Col, Card, CardBody, FormGroup, Label, Input } from "reactstrap";
+import FlotChart from "@/components/Charts/Flot.js";
+import { getMonthDiskSpace } from "../../actions/disk";
+import moment from "moment";
+import "moment/locale/id";
+
+class ChartLineDisk extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+			dataChart: this.ChartLine,
+			selectedMonth: moment().month(), // Current month (0 = January, 11 = December)
+			selectedYear: moment().year(),   // Current year
+		};
+	}
+
+	// Fetch data when component mounts or when date is changed
+	componentDidMount = async () => {
+		moment.locale('id'); 
+		this.fetchDiskSpaceData();
+	};
+
+	componentDidUpdate(prevProps, prevState) {
+		// Fetch data if selected month or year has changed
+		if (prevState.selectedMonth !== this.state.selectedMonth || prevState.selectedYear !== this.state.selectedYear) {
+			this.fetchDiskSpaceData();
+		}
+	}
+
+	// Function to fetch the disk space data
+	fetchDiskSpaceData = async () => {
+		const { token } = this.props;
+		const { selectedMonth, selectedYear } = this.state;
+		const selectedDate = `${selectedYear}-${(selectedMonth + 1).toString().padStart(2, "0")}`; // Format as YYYY-MM
+
+		const dataDisk = await getMonthDiskSpace(token, selectedDate);
+
+		const sortedDataDisk = dataDisk.data.sort((a, b) => new Date(a.date) - new Date(b.date));
+
+		const chartData = sortedDataDisk.map(item => {
+			const day = new Date(item.date).getDate();
+			const used = (item.used / (1024 ** 2)).toFixed(2);
+			return [day.toString(), used];
+		});
+
+		const updatedChartLine = {
+			...this.ChartLine,
+			data: [
+				{
+					label: "Available Disk Space",
+					color: "#3e3a8e",
+					data: chartData,
+				},
+			],
+		};
+		this.setState({ dataChart: updatedChartLine });
+	};
+
+	handleMonthChange = (e) => {
+		this.setState({ selectedMonth: parseInt(e.target.value) });
+	};
+
+	handleYearChange = (e) => {
+		this.setState({ selectedYear: parseInt(e.target.value) });
+	};
+
+	// Chart configuration
+	ChartLine = {
+		data: [
+			{
+				label: "Available Disk Space",
+				color: "#3e3a8e",
+				data: [],
+			},
+		],
+		options: {
+			series: {
+				lines: {
+					show: true,
+					fill: 0.01,
+				},
+				points: {
+					show: true,
+					radius: 4,
+				},
+			},
+			grid: {
+				borderColor: "#eee",
+				borderWidth: 1,
+				hoverable: true,
+				backgroundColor: "#fcfcfc",
+			},
+			tooltip: true,
+			tooltipOpts: {
+				content: (label, x, y) => `${x} : ${y} GB`,
+			},
+			xaxis: {
+				tickColor: "#eee",
+				mode: "categories",
+			},
+			yaxis: {
+				tickColor: "#eee",
+			},
+			shadowSize: 0,
+		},
+	};
+
+	render() {
+		const { selectedMonth, selectedYear, dataChart } = this.state;
+		const months = moment.months(); 
+		const years = Array.from({ length: 11 }, (_, i) => moment().year() - i);
+
+		return (
+			<Col lg={12}>
+				<Card className="card-default">
+					<CardBody>
+						<FormGroup row>
+							<Label for="month" sm={1}>Bulan:</Label>
+							<Col sm={4}>
+								<Input
+									type="select"
+									name="month"
+									id="month"
+									value={selectedMonth}
+									onChange={this.handleMonthChange}
+								>
+									{months.map((month, index) => (
+										<option key={index} value={index}>
+											{month}
+										</option>
+									))}
+								</Input>
+							</Col>
+							<Col sm={4}>
+								<Input
+									type="select"
+									name="year"
+									id="year"
+									value={selectedYear}
+									onChange={this.handleYearChange}
+								>
+									{years.map((year) => (
+										<option key={year} value={year}>
+											{year}
+										</option>
+									))}
+								</Input>
+							</Col>
+						</FormGroup>
+
+						<FlotChart
+							options={dataChart.options}
+							data={dataChart.data}
+							className="flot-chart"
+							height="300px"
+						/>
+					</CardBody>
+					<div align="center" className="mb-3">
+						<span>
+							Data Statistik Penggunaan Hardisk Bulan {months[selectedMonth]} {selectedYear}
+						</span>
+					</div>
+				</Card>
+			</Col>
+		);
+	}
+}
+
+export default ChartLineDisk;

pages/app/dashboard/index.js

@@ -15,6 +15,7 @@ import ChartRadarA from "../../../components/Riwayat/ChartRadarA";
 
 
 
+
 class Dashboard extends Component {
   constructor(props) {
     super(props);
@@ -45,6 +46,7 @@ class Dashboard extends Component {
           <span className="font-color-white">Dashboard</span>
         </div>
         <Row>
+      
           <Col lg="6">
             <ChartDataBar />
           </Col>

pages/app/naik-sanksi/edit_catatan.js

@@ -168,7 +168,11 @@ class EditFile extends Component {
             modalRemovePeserta: !this.state.modalRemovePeserta
         })
     }
-
+    handlePaste = (event) => {
+        event.preventDefault();
+        const text = event.clipboardData.getData('text/plain');
+        document.execCommand('insertText', false, text);
+    };
     render() {
         const { catatan, pt, isEditTanggal, tanggal } = this.state;
         return (
@@ -323,7 +327,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Aspek_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -331,7 +335,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Laporan_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -339,7 +343,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Hasil_Verifikasi}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
                                                         <td style={{ border: "transparent" }}>
@@ -361,7 +365,7 @@ class EditFile extends Component {
                                                         this.setState({ simpulan: e.target.value });
                                                     }}
                                                     tagName="text"
-
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>
@@ -377,6 +381,7 @@ class EditFile extends Component {
                                                         this.setState({ rekomendasi: e.target.value });
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>

pages/app/naik-sanksi/new_catatan.js

@@ -124,6 +124,11 @@ class Catatan extends Component {
             isi: prevState.isi.filter((_, i) => i !== index)
         }));
     };
+    handlePaste = (event) => {
+        event.preventDefault();
+        const text = event.clipboardData.getData('text/plain');
+        document.execCommand('insertText', false, text);
+    };
     render() {
         const { pt } = this.state
         const { tanggal, isEditTanggal, simpulan, catatan } = this.state
@@ -214,41 +219,38 @@ class Catatan extends Component {
                                             <Button color="primary" className="mb-2 float-md-right" onClick={this.addRow}>Tambah Baris</Button>
                                         </div>
 
-                                        <table className=' ml-auto mr-auto'>
-                                            <thead >
+                                        <table className='ml-auto mr-auto'>
+                                            <thead>
                                                 <tr>
-                                                    <th >NO</th>
+                                                    <th>NO</th>
                                                     <th>ASPEK PERBAIKAN</th>
-                                                    <th >LAPORAN PERBAIKAN</th>
-                                                    <th >HASIL VERIFIKASI DAN VALIDASI</th>
+                                                    <th>LAPORAN PERBAIKAN</th>
+                                                    <th>HASIL VERIFIKASI DAN VALIDASI</th>
                                                 </tr>
                                             </thead>
                                             <tbody>
                                                 {this.state.isi.map((isi, index) => (
                                                     <tr key={index}>
                                                         <td>{index + 1}</td>
-
                                                         <td style={{ width: "30%" }}>
                                                             <ContentEditable
                                                                 html={isi.Aspek_Perbaikan}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-
+                                                                onChange={(evt) => this.handleAspek(evt, index, "Aspek_Perbaikan")}
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
-
                                                         <td style={{ width: "30%" }}>
                                                             <ContentEditable
                                                                 html={isi.Laporan_Perbaikan}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-
+                                                                onChange={(evt) => this.handleAspek(evt, index, "Laporan_Perbaikan")}
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
-
                                                         <td style={{ width: "40%" }}>
                                                             <ContentEditable
                                                                 html={isi.Hasil_Verifikasi}
-                                                                onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-
+                                                                onChange={(evt) => this.handleAspek(evt, index, "Hasil_Verifikasi")}
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
                                                         <td style={{ border: "transparent" }}>
@@ -270,6 +272,7 @@ class Catatan extends Component {
                                                         this.setState({ simpulan: e.target.value });
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
 
                                                 />
                                             </td>
@@ -287,6 +290,7 @@ class Catatan extends Component {
                                                         console.log(e)
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>

pages/app/pencabutan-sanksi/edit_catatan.js

@@ -170,7 +170,11 @@ class EditFile extends Component {
             modalRemovePeserta: !this.state.modalRemovePeserta
         })
     }
-
+    handlePaste = (event) => {
+        event.preventDefault();
+        const text = event.clipboardData.getData('text/plain');
+        document.execCommand('insertText', false, text);
+    };
     render() {
         const { catatan, pt, isEditTanggal, tanggal } = this.state;
         return (
@@ -332,7 +336,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Aspek_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -340,7 +344,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Laporan_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -348,7 +352,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Hasil_Verifikasi}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
                                                         <td style={{ border: "transparent" }}>
@@ -370,7 +374,7 @@ class EditFile extends Component {
                                                         this.setState({ simpulan: e.target.value });
                                                     }}
                                                     tagName="text"
-
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>
@@ -386,6 +390,7 @@ class EditFile extends Component {
                                                         this.setState({ rekomendasi: e.target.value });
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>

pages/app/pencabutan-sanksi/new_catatan.js

@@ -124,6 +124,11 @@ class Catatan extends Component {
             isi: prevState.isi.filter((_, i) => i !== index)
         }));
     };
+    handlePaste = (event) => {
+        event.preventDefault();
+        const text = event.clipboardData.getData('text/plain');
+        document.execCommand('insertText', false, text);
+    };
     render() {
         const { pt } = this.state
         const { tanggal, isEditTanggal, simpulan, catatan } = this.state
@@ -232,7 +237,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Aspek_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -240,7 +245,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Laporan_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -248,7 +253,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Hasil_Verifikasi}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
                                                         <td style={{ border: "transparent" }}>
@@ -270,7 +275,7 @@ class Catatan extends Component {
                                                         this.setState({ simpulan: e.target.value });
                                                     }}
                                                     tagName="text"
-
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>
@@ -287,6 +292,7 @@ class Catatan extends Component {
                                                         console.log(e)
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>

pages/app/perpanjangan-sanksi/edit_catatan.js

@@ -179,7 +179,11 @@ class EditFile extends Component {
             modalRemovePeserta: !this.state.modalRemovePeserta
         })
     }
-
+    handlePaste = (event) => {
+        event.preventDefault();
+        const text = event.clipboardData.getData('text/plain');
+        document.execCommand('insertText', false, text);
+    };
     render() {
         const { catatan, pt, isEditTanggal, tanggal } = this.state;
         return (
@@ -341,7 +345,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Aspek_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -349,7 +353,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Laporan_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -357,7 +361,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Hasil_Verifikasi}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
                                                         <td style={{ border: "transparent" }}>
@@ -379,7 +383,7 @@ class EditFile extends Component {
                                                         this.setState({ simpulan: e.target.value });
                                                     }}
                                                     tagName="text"
-
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>
@@ -395,6 +399,7 @@ class EditFile extends Component {
                                                         this.setState({ rekomendasi: e.target.value });
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>

pages/app/perpanjangan-sanksi/new_catatan.js

@@ -124,6 +124,12 @@ class Catatan extends Component {
             isi: prevState.isi.filter((_, i) => i !== index)
         }));
     };
+    handlePaste = (event) => {
+        event.preventDefault();
+        const text = event.clipboardData.getData('text/plain');
+        document.execCommand('insertText', false, text);
+    };
+    
     render() {
         const { pt } = this.state
         const { tanggal, isEditTanggal, simpulan, catatan } = this.state
@@ -232,7 +238,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Aspek_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -240,7 +246,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Laporan_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -248,7 +254,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Hasil_Verifikasi}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
                                                         <td style={{ border: "transparent" }}>
@@ -270,7 +276,7 @@ class Catatan extends Component {
                                                         this.setState({ simpulan: e.target.value });
                                                     }}
                                                     tagName="text"
-
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>
@@ -287,6 +293,7 @@ class Catatan extends Component {
                                                         console.log(e)
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>

pages/app/riwayat/index.js

@@ -5,6 +5,8 @@ import { connect } from "react-redux";
 import TableRiwayat from "@/components/Riwayat/TableRiwayat";
 import ChartData from "@/components/Riwayat/ChartData";
 import { getLog2 } from "@/actions/log";
+import ChartLineDisk from "../../../components/Riwayat/ChartLineDisk";
+import ChartDonutDisk from "../../../components/Riwayat/ChartDonutDisk";
 
 
 
@@ -22,7 +24,7 @@ class Riwayat extends Component {
 
         const data = await getLog2(this.props.token)
         const dataRiwayat = data.data
-        this.setState({ dataRiwayat })  
+        this.setState({ dataRiwayat })
     }
     setDateFilter = (data) => {
         this.setState({ dataFilter: data })
@@ -33,7 +35,6 @@ class Riwayat extends Component {
             const date1 = moment(this.state.dataFilter.fromDate).format("YYYY-MM-DD")
             const date2 = moment(this.state.dataFilter.toDate).format("YYYY-MM-DD")
             const data = await getLog2(this.props.token, { fromDate: date1, toDate: date2 })
-            // const dataRiwayat = data.data
 
             this.setState({ dataRiwayat });
         }
@@ -47,6 +48,12 @@ class Riwayat extends Component {
                     <span className="font-color-white">Riwayat</span>
                 </div>
                 <Row>
+                    <Col lg="8">
+                        <ChartLineDisk />
+                    </Col>
+                    <Col lg="4">
+                        <ChartDonutDisk />
+                    </Col>
                     <ChartData />
                     <Col lg="12">
                         <TableRiwayat />

pages/app/turun-sanksi/edit_catatan.js

@@ -170,7 +170,11 @@ class EditFile extends Component {
             modalRemovePeserta: !this.state.modalRemovePeserta
         })
     }
-
+    handlePaste = (event) => {
+        event.preventDefault();
+        const text = event.clipboardData.getData('text/plain');
+        document.execCommand('insertText', false, text);
+    };
     render() {
         const { catatan, pt, isEditTanggal, tanggal } = this.state;
         return (
@@ -332,7 +336,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Aspek_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -340,7 +344,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Laporan_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -348,7 +352,7 @@ class EditFile extends Component {
                                                             <ContentEditable
                                                                 html={isi.Hasil_Verifikasi}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
                                                         <td style={{ border: "transparent" }}>
@@ -370,7 +374,7 @@ class EditFile extends Component {
                                                         this.setState({ simpulan: e.target.value });
                                                     }}
                                                     tagName="text"
-
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>
@@ -386,6 +390,7 @@ class EditFile extends Component {
                                                         this.setState({ rekomendasi: e.target.value });
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>

pages/app/turun-sanksi/new_catatan.js

@@ -124,6 +124,11 @@ class Catatan extends Component {
             isi: prevState.isi.filter((_, i) => i !== index)
         }));
     };
+    handlePaste = (event) => {
+        event.preventDefault();
+        const text = event.clipboardData.getData('text/plain');
+        document.execCommand('insertText', false, text);
+    };
     render() {
         const { pt } = this.state
         const { tanggal, isEditTanggal, simpulan, catatan } = this.state
@@ -232,7 +237,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Aspek_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Aspek_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -240,7 +245,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Laporan_Perbaikan}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Laporan_Perbaikan") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
 
@@ -248,7 +253,7 @@ class Catatan extends Component {
                                                             <ContentEditable
                                                                 html={isi.Hasil_Verifikasi}
                                                                 onChange={(evt) => { this.handleAspek(evt, index, "Hasil_Verifikasi") }}
-
+                                                                onPaste={this.handlePaste}
                                                             />
                                                         </td>
                                                         <td style={{ border: "transparent" }}>
@@ -270,7 +275,7 @@ class Catatan extends Component {
                                                         this.setState({ simpulan: e.target.value });
                                                     }}
                                                     tagName="text"
-
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>
@@ -287,6 +292,7 @@ class Catatan extends Component {
                                                         console.log(e)
                                                     }}
                                                     tagName="text"
+                                                    onPaste={this.handlePaste}
                                                 />
                                             </td>
                                         </tr>