-
Notifications
You must be signed in to change notification settings - Fork 0
/
pemeriksaan_pasien.php
345 lines (274 loc) · 14.3 KB
/
pemeriksaan_pasien.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
<?php
// Koneksi ke database
include_once 'db.php';
// Jika belum memilih list pasien
if (empty($_GET['no_dokter'])) {
// Paksa pengguna alihkan ke list_pasien.php
echo "
<script>
alert('Anda harus memilih list pasien!');
document.location.href='list_pasien.php';
</script>
";
}
// ambil get no dokter
$no_dokter = abs((int)$_GET['no_dokter']);
// lakukan query select pada tabel pasien
$query = "SELECT * FROM tbl_pasien WHERE no_dokter = ?";
$stmt = $db->prepare($query);
$stmt->bind_param("i", $no_dokter);
$stmt->execute();
$res = $stmt->get_result();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="" />
<meta name="author" content="" />
<title>Pemeriksan Pasien</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<!-- Html 2 canvas -->
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
<!-- Css -->
<style>
/* Cursor tanda panah */
.paint {
cursor: crosshair;
}
.alert.w-75 {
width: 75%;
margin: 0 auto;
text-align: center;
}
</style>
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand navbar-dark bg-dark">
<!-- Navbar Brand-->
<h4 class="ps-3 pe-3 text-white"> <i class="bi bi-person-fill-check"></i> Pemeriksaan Pasien</h4>
</nav>
<!-- </Akhir navbar -->
<!-- Main content -->
<div id="Maincontent">
<main>
<div class="container">
<div class="card mb-4 border-success justify-content-center mt-5">
<!-- Form pemeriksaan-->
<form method="post" action="" id="form_pemeriksaan">
<div class="card-body bg-success text-white text-center fs-5">FORM PEMERIKSAAN PASIEN (SOAP)</div>
<div class="row">
<div class="col">
<!-- Hari dan tanggal -->
<?php
function tgl_indo($tanggal)
{
$bulan = array(
1 => 'Januari',
'Februari',
'Maret',
'April',
'Mei',
'Juni',
'Juli',
'Agustus',
'September',
'Oktober',
'November',
'Desember'
);
$pecahkan = explode('-', $tanggal);
return $pecahkan[2] . ' ' . $bulan[(int)$pecahkan[1]] . ' ' . $pecahkan[0];
}
$date = tgl_indo(date('Y-m-d')); // Tanggal, bulan dan tahun sekarang ini
?>
<!-- </Akhir hari dan tanggal -->
<div class="ms-3 align-items-center justify-content-between bg-white mt-4">
<?php foreach ($res as $row) : ?>
<input type="hidden" value="<?php echo $row['norm']; ?>" name="norm" id="norm">
<p>No.RM
<span class="ms-2">: <?php echo $row['norm']; ?></span>
</p>
<p>Nama : <?php echo $row['nama_pasien']; ?></p>
<?php endforeach; ?>
<p>Tanggal <span class="ms-2">: <?php echo $date; ?></span></p>
</div>
</div>
</div>
<div class="row mt-3 mx-1">
<div class="col">
<!-- Informasi simpan pemeriksaan -->
<div id="informasi_simpan_pemeriksaan" class="mb-3 alert alert-success w-75 text-center" style="display: none;">
Form pemeriksaan berhasil di simpan pada folder <div class="fw-bold">img.</div>
</div>
<div id="fail" class="mb-3 alert alert-danger w-75 text-center" style="display: none;">
Folder <div class="fw-bold">img</div> tidak ada.
</div>
<!-- </Akhir informasi simpan pemeriksaan -->
<!-- Tabel -->
<div class="table-responsive">
<div class="screenshot_form_pemeriksaan">
<table class="table table-bordered border-dark">
<thead>
<tr class="text-center">
<th>S : Anamnesa</th>
<th>O : Pemeriksaan</th>
<th>A : Asesment</th>
<th>P : Terapi / Obat</th>
</tr>
</thead>
<!-- Container canvas untuk menulis -->
<tbody id="canvasContainer">
<tr>
<!-- Canvas -->
<td>
<canvas class="paint" width="250px" height="250px"></canvas>
</td>
<td> <canvas class="paint" width="250px" height="250px"></canvas></td>
<td> <canvas class="paint" width="250px" height="250px"></canvas></td>
<td> <canvas class="paint" width="250px" height="250px"></canvas></td>
<!-- </Akhir canvas -->
</tr>
</tbody>
<!-- </Akhir container canvas untuk menulis -->
</table>
</div>
</div>
<!-- </Akhir tabel -->
<!-- Tombol simpan dan hapus -->
<div class="mb-3 mt-3">
<button type="submit" class="btn btn-primary me-2 mb-3" name="simpan" id="simpan">Simpan</button>
<a class="btn btn-info me-2 mb-3 text-white" href="index.php">Kembali</a>
<button type="button" class="btn btn-danger me-4 mb-3" id="hapus">Hapus</button>
<!-- Ketebalan dan ganti warna-->
<input type="range" id="brush-size" min="1" max="10" value="5" class="form-range w-50">
<input type="color" list id="paintColor" class="mt-3 ms-3">
<!-- </Akhir ketebalan dan ganti warna -->
</div>
</div>
</div>
</form>
<!-- </Akhir form pemeriksaan -->
</div>
</div>
</main>
</div>
<!-- </Akhir main content -->
<!-- Jquery bs 5 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
<!-- jquery 3.6.3 -->
<script src="https://code.jquery.com/jquery-3.6.3.min.js" integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
<!-- Script jquery -->
<script>
// ketika dokumen html sudah di load
$(document).ready(function() {
// Variabel form pemeriksaan
let form_pemeriksaan = $('#form_pemeriksaan');
// Ketika tombol simpan di klik
$(form_pemeriksaan).on('submit', function(e) {
e.preventDefault();
let folder = 'img';
let informasi_simpan_pemeriksaan = document.querySelector('#informasi_simpan_pemeriksaan');
// Cek jika folder img ada
$.get(folder)
.done(function() {
// Munculkan pesan informasi simpan pemeriksaan
informasi_simpan_pemeriksaan.style.display = 'block';
// Jika sudah waktu nya 3 detik
setTimeout(function() {
// Maka hapus pesan nya
informasi_simpan_pemeriksaan.style.display = 'none';
}, 3000)
})
// lakukan screenshot form pemeriksaan
html2canvas($('.screenshot_form_pemeriksaan')[0])
.then(canvasData => {
canvasData.style.display = 'none'
document.body.appendChild(canvasData)
return canvasData
})
.then(canvasData => {
const image = canvasData.toDataURL('image/jpeg');
let norm = $('#norm').val();
// Mengirimkan data untuk simpan form pemeriksaan
$.ajax({
type: "POST",
url: "simpan_form_pemeriksaan.php",
data: {
norm: norm,
image: image
}
})
canvasData.remove()
})
});
// Mengambil referensi canvas pada class paint
let canvasList = $(".paint");
// Iterasi melalui setiap canvas
canvasList.each(function() {
let canvas = this;
// Mendapatkan context dari canvas
let ctx = canvas.getContext("2d");
// Variabel untuk menyimpan apakah sedang menggambar atau tidak
let isDrawing = false;
// Variabel untuk menyimpan posisi x dan y mouse saat sebelumnya
let lastX = 0;
let lastY = 0;
// Mengambil referensi elemen input warna
let paintColor = $("#paintColor");
// Event listener untuk mengubah warna garis
paintColor.change(function() {
// Mengambil nilai warna yang dipilih
let color = paintColor.val();
// Mengubah warna garis
ctx.strokeStyle = color;
});
// Event listener untuk memulai menggambar saat mouse ditekan
$(canvas).mousedown(function(e) {
// Menyimpan bahwa sedang menggambar
isDrawing = true;
// Menyimpan posisi x dan y mouse saat ini
lastX = e.pageX - $(canvas).offset().left;
lastY = e.pageY - $(canvas).offset().top;
});
// Event listener untuk menggambar saat mouse digerakkan
$(canvas).mousemove(function(e) {
// Jika sedang menggambar
if (isDrawing) {
// Mendapatkan posisi x dan y mouse saat ini
let currentX = e.pageX - $(canvas).offset().left;
let currentY = e.pageY - $(canvas).offset().top;
// Mulai path baru
ctx.beginPath();
// Pindah ke posisi x dan y saat sebelumnya
ctx.moveTo(lastX, lastY);
// Gambar garis ke posisi x dan y saat ini
ctx.lineTo(currentX, currentY);
// Menggambar garis
ctx.stroke();
// Menyimpan posisi x dan y saat ini sebagai posisi x dan y saat sebelumnya
lastX = currentX;
lastY = currentY;
}
});
// Event listener untuk mengakhiri menggambar saat mouse dilepas
$(canvas).mouseup(function(e) {
// Menyimpan bahwa tidak sedang menggambar
isDrawing = false;
});
$("#brush-size").on("input", function(e) {
ctx.lineWidth = $(this).val()
});
// Tombol hapus
$("#hapus").click(function() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
});
});
});
</script>
</body>
</html>