Created
January 12, 2026 04:34
-
-
Save AIbnuHIbban/aa87fb8a523fd8d4610abeeb2f7e7a81 to your computer and use it in GitHub Desktop.
HTML files upload
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style> | |
| * { | |
| box-sizing: border-box; | |
| font: 12px "Tahoma"; | |
| } | |
| #dynamicForm { | |
| width: 100%; | |
| height: 100%; | |
| margin: 0; | |
| padding: 16px; | |
| background-color: #fafafa; | |
| } | |
| .page-container { | |
| width: 210mm; | |
| min-height: 297mm; | |
| padding: 4mm; | |
| margin: auto; | |
| border: 1px solid #d3d3d3; | |
| border-radius: 5px; | |
| background: #fff; | |
| box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); | |
| } | |
| .table-full { | |
| width: 100%; | |
| border-collapse: collapse; | |
| } | |
| .signature-area{ | |
| padding-top: 40px; | |
| } | |
| .form-textarea { | |
| width: 100%; | |
| font-size: 11px; | |
| resize: none; | |
| overflow: hidden; | |
| text-align: center; | |
| } | |
| .text-underline { | |
| border-bottom: 1px solid #d3d3d3; | |
| } | |
| .border { | |
| border: 1px solid; | |
| } | |
| .border-right { | |
| border-right: 1px solid; | |
| } | |
| .border-left { | |
| border-left: 1px solid; | |
| } | |
| .border-top { | |
| border-top: 1px solid; | |
| } | |
| .border-bottom { | |
| border-bottom: 1px solid; | |
| } | |
| .border-sides { | |
| border-left: 1px solid; | |
| border-right: 1px solid; | |
| } | |
| .no-border-top { | |
| border-top: none !important; | |
| } | |
| .form-title { | |
| font-weight: 800; | |
| font-size: 16px; | |
| } | |
| .bold { | |
| font-weight: 800; | |
| } | |
| input[type="checkbox"] { | |
| width: 14px; | |
| height: 14px; | |
| margin: 3px; | |
| border: 1px solid #b0b0b0; | |
| cursor: pointer; | |
| -webkit-appearance: none; | |
| appearance: none; | |
| vertical-align: middle; | |
| } | |
| input[type="checkbox"]:checked { | |
| appearance: auto; | |
| } | |
| .question-text { | |
| display: inline; | |
| } | |
| input.form-text { | |
| text-align: start; | |
| border: none; | |
| outline: none; | |
| width: 100%; | |
| } | |
| /* Input line as contenteditable span */ | |
| .input-line { | |
| border: none; | |
| border-bottom: 1px dotted #000; | |
| outline: none; | |
| font-size: 12px; | |
| box-sizing: border-box; | |
| display: inline; | |
| vertical-align: bottom; | |
| line-height: 1.4; | |
| padding: 0; | |
| margin: 0; | |
| font-family: inherit; | |
| white-space: pre-wrap; | |
| word-wrap: break-word; | |
| position: relative; | |
| overflow-wrap: anywhere; | |
| } | |
| /* For empty state - add visible space with border */ | |
| .input-line[contenteditable="true"]:empty::before { | |
| content: '\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0'; | |
| } | |
| /* For textarea variant */ | |
| textarea.input-line { | |
| resize: none; | |
| overflow: hidden; | |
| vertical-align: middle; | |
| border-bottom: 1px dotted #000; | |
| } | |
| .print-signature:hover::after { | |
| content: ""; | |
| position: absolute; | |
| left: 70%; | |
| z-index: 999; | |
| background-image: url('/img/icon/tooltip-change-signature.svg'); | |
| background-size: contain; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| width: 200px; | |
| height: 80px; | |
| } | |
| /* Hide dotted underline when printing */ | |
| @media print { | |
| .input-line[contenteditable="true"] { | |
| border-bottom: none; | |
| } | |
| .input-line[contenteditable="true"]:empty::before { | |
| content: none; | |
| } | |
| textarea.input-line { | |
| border-bottom: none; | |
| } | |
| /* Prevent shift header from separating from its content */ | |
| .shift-header-row { | |
| page-break-after: avoid; | |
| page-break-inside: avoid; | |
| } | |
| } | |
| .date-td { | |
| width: 16.1%; | |
| } | |
| .date-td-content { | |
| width: 16.1%; | |
| } | |
| .day-td-content { | |
| width: 72.5%; | |
| } | |
| .leopold-text { | |
| width: 81%; | |
| } | |
| @media print { | |
| html, | |
| body { | |
| margin: 0; | |
| padding: 0; | |
| } | |
| #dynamicForm { | |
| background-color: #fff; | |
| padding: 0; | |
| } | |
| /* Paged.js page configuration */ | |
| @page { | |
| size: A4; | |
| margin: 15mm 10mm 15mm 10mm; | |
| } | |
| /* Prevent awkward breaks */ | |
| .shift-section { | |
| page-break-inside: avoid; | |
| } | |
| .date-td { | |
| width: 15%; | |
| } | |
| .date-td-content { | |
| width: 15%; | |
| } | |
| .day-td-content { | |
| width: 67%; | |
| } | |
| #letterHead { | |
| width: 175mm; | |
| } | |
| .page-container { | |
| margin: 0; | |
| padding: 0; | |
| border: none; | |
| border-radius: 0; | |
| width: auto; | |
| box-shadow: none; | |
| } | |
| .print-no-border { | |
| border: none !important; | |
| } | |
| .leopold-text { | |
| width: 77%; | |
| } | |
| .form-textarea { | |
| width: 100%; | |
| resize: none; | |
| border: none; | |
| } | |
| .input-line { | |
| border: none; | |
| outline: none; | |
| font-size: 12px; | |
| } | |
| .signature-area { | |
| min-height: 40px; | |
| } | |
| /* hide placeholder sign-here on print preview */ | |
| img[src*="sign-here.svg"] { | |
| display: none !important; | |
| } | |
| } | |
| </style> | |
| <!-- Template for continuation header (hidden, used by Paged.js) --> | |
| <template id="continuation-header-template"> | |
| <tr class="shift-header-row" style="text-align:center" data-shift="{{SHIFT_NAME}}"> | |
| <th style="padding: 8px" class="border-right date-td border-bottom"> | |
| <span class="bold">HARI,<br />TANGGAL<br />& JAM</span> | |
| </th> | |
| <th style="padding: 8px" class="border-right border-bottom"> | |
| <span class="bold">{{SHIFT_NAME}}</span> | |
| </th> | |
| <th style="padding: 8px" class="border-bottom"> | |
| <span class="bold">PARAF, NAMA<br />PERAWAT/BIDAN</span> | |
| </th> | |
| </tr> | |
| </template> | |
| <form id="dynamicForm"> | |
| <div class="page-container"> | |
| <div class="letter-head"> | |
| <!-- Letter head content will be inserted here via useEffect --> | |
| </div> | |
| <div class="page-header no-border-top"> | |
| <table class="table-full border-sides"> | |
| <tr style="text-align: center;"> | |
| <td> | |
| <div style="padding: 5px" class="form-title"> | |
| Implementasi Keperawatan | |
| </div> | |
| </td> | |
| </tr> | |
| </table> | |
| </div> | |
| <div class="page-content"> | |
| <!-- Info Section --> | |
| <table class="table-full border"> | |
| <tr> | |
| <td style="width: 25%; padding: 10px" class="border-right"> | |
| <table class="table-full"> | |
| <tr> | |
| <td style="width: 45%">Hari Perawatan</td> | |
| <td style="width: 5%">:</td> | |
| <td> | |
| <span id="hari_perawatan" name="hari_perawatan" contenteditable="true" class="input-line" data-placeholder="" style="width: 100px"></span> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| <td style="width: 40%; padding: 10px" class="border-right"> | |
| <table class="table-full"> | |
| <tr> | |
| <td style="width: 30%">Ruang Rawat</td> | |
| <td style="width: 5%">:</td> | |
| <td> | |
| <span id="ruang_rawat" name="ruang_rawat" contenteditable="true" class="input-line" data-placeholder="" style="width: 180px"></span> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| <td style=" | |
| width: 35%; | |
| padding: 10px; | |
| vertical-align: middle; | |
| "> | |
| <div>Kode I :</div> | |
| <div><span class="bold">Latihan Batuk Efektif</span></div> | |
| <div>(I.01006)</div> | |
| </td> | |
| </tr> | |
| </table> | |
| <!-- Main Table --> | |
| <table class="table-full border no-border-top"> | |
| <thead> | |
| <!-- Header Row --> | |
| <tr class="shift-header-row" style="text-align: center" data-shift="PAGI"> | |
| <th style="width: 15%; padding: 4px" class="border-right border-bottom"> | |
| <span class="bold">HARI,<br />TANGGAL<br />& JAM</span> | |
| </th> | |
| <th style="width: 72%; padding: 8px" class="border-right border-bottom"> | |
| <span class="bold">PAGI</span> | |
| </th> | |
| <th style="width: 18%; padding: 8px" class="border-bottom"> | |
| <span class="bold">PARAF, NAMA<br />PERAWAT/BIDAN</span> | |
| </th> | |
| </tr> | |
| </thead> | |
| <tbody class="shift-section" data-shift="PAGI"> | |
| <!-- PAGI --> | |
| <tr> | |
| <td style="padding: 8px; vertical-align: top;padding-top:10px;" class="border-right"> | |
| <textarea id="hari_tanggal_jam_pagi" name="hari_tanggal_jam_pagi" class="form-textarea print-no-border auto-resize-textarea" placeholder=""></textarea> | |
| </td> | |
| <td style="padding: 8px; vertical-align: top" class="border-right border-bottom"> | |
| <table class="table-full" style="font-size:11px"> | |
| <!-- Observasi --> | |
| <tr> | |
| <td> | |
| <span class="bold" >Observasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Mengidentifikasi kemampuan batuk :</span> | |
| <span id="pagi_obs_1" name="pagi_obs_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor adanya retensi sputum :</span> | |
| <span id="pagi_obs_2" name="pagi_obs_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor tanda dan gejala infeksi saluran napas :</span> | |
| <span id="pagi_obs_3" name="pagi_obs_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor input dan output cairan (mis. jumlah dan karakteristik) :</span> | |
| <span id="pagi_obs_4" name="pagi_obs_4" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <!-- Terapeutik --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Terapeutik :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Mengatur posisi semi-Fowler atau Fowler :</span> | |
| <span id="pagi_ter_1" name="pagi_ter_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memasang perlak dan bengkok di pangkuan pasien :</span> | |
| <span id="pagi_ter_2" name="pagi_ter_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Membuang sekret pada tempat sputum :</span> | |
| <span id="pagi_ter_3" name="pagi_ter_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <!-- Edukasi --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Edukasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menjelaskan tujuan dan prosedur batuk efektif :</span> | |
| <span id="pagi_edu_1" name="pagi_edu_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-edu input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan tarik napas dalam melalui hidung selama 4 detik, ditahan selama 2 detik, kemudian keluarkan dari mulut dengan bibir mencucu (dibulatkan) selama 8 detik :</span> | |
| <span id="pagi_edu_2" name="pagi_edu_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-edu input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan mengulangi tarik napas dalam hingga 3 kali :</span> | |
| <span id="pagi_edu_3" name="pagi_edu_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-edu input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan batuk dengan kuat langsung setelah tarik napas dalam yang ke-3 :</span> | |
| <span id="pagi_edu_4" name="pagi_edu_4" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-edu input-line"></span> | |
| </td> | |
| </tr> | |
| <!-- Kolaborasi --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Kolaborasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Berkolaborasi pemberian mukolitik atau ekspektoran :</span> | |
| <span id="pagi_kol_1" name="pagi_kol_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| <!-- Kolom Paraf/TTD - ROWSPAN untuk semua shift --> | |
| <td style="padding: 8px; vertical-align: top"> | |
| <table class="table-full"> | |
| <tr> | |
| <td style="padding: 0px 10px;"> | |
| <input type="text" id="signature_title_1" name="signature_title_1" | |
| data-title="TTD Perawat/Bidan" class="form-text text-underline" | |
| maxlength="50" value="Perawat/Bidan" style="text-align: center;"> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="text-align: center;"> | |
| <table class="table-full"> | |
| <tr> | |
| <td style="cursor: pointer; width: 120px; height: 80px; position: relative;"> | |
| <label for="signature_image_1" style="display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; cursor: pointer; text-align: center;" class="print-signature"> | |
| <img id="preview-selected-signature_image_1" src="/img/icon/sign-here.svg" style="max-width: 100px; max-height: 60px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_1" name="signature_image_1" accept="image/*" style="display: none"/> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="text-align: center;"> | |
| <span id="signature_name_1" name="signature_name_1" contenteditable="true" class="input-line" data-placeholder="" data-title="Nama, Tanda tangan" style="text-align: center;">Nama, Tanda tangan</span> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </tbody> | |
| <!-- SORE Section --> | |
| <tbody class="shift-section" data-shift="SORE"> | |
| <tr class="shift-header-row" style="text-align:center" data-shift="SORE"> | |
| <th style="width: 14.1%;padding: 8px" | |
| class="border-right date-td border-bottom only-print-after-first-border"> | |
| <span class="bold">HARI,<br />TANGGAL<br />& JAM</span> | |
| </th> | |
| <th style="padding: 8px" class="border-right border-bottom"> | |
| <span class="bold">SORE</span> | |
| </th> | |
| <th style="width: 21.7%; padding: 8px" | |
| class="border-bottom only-print-after-first-border"> | |
| <span class="bold">PARAF, NAMA<br />PERAWAT/BIDAN</span> | |
| </th> | |
| </tr> | |
| <tr> | |
| <td style="padding: 8px; vertical-align: top;padding-top:10px;" class="border-right date-td-content"> | |
| <textarea id="hari_tanggal_jam_sore" name="hari_tanggal_jam_sore" class="form-textarea print-no-border auto-resize-textarea" placeholder=""></textarea> | |
| </td> | |
| <td style="padding: 8px; vertical-align: top" class="border-right border-bottom day-td-content"> | |
| <table class="table-full" style="font-size:11px"> | |
| <!-- Observasi --> | |
| <tr> | |
| <td> | |
| <span class="bold" >Observasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Mengidentifikasi kemampuan batuk :</span> | |
| <span id="sore_obs_1" name="sore_obs_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor adanya retensi sputum :</span> | |
| <span id="sore_obs_2" name="sore_obs_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor tanda dan gejala infeksi saluran napas :</span> | |
| <span id="sore_obs_3" name="sore_obs_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor input dan output cairan (mis. jumlah dan karakteristik) :</span> | |
| <span id="sore_obs_4" name="sore_obs_4" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <!-- Terapeutik --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Terapeutik :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Mengatur posisi semi-Fowler atau Fowler :</span> | |
| <span id="sore_ter_1" name="sore_ter_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memasang perlak dan bengkok di pangkuan pasien :</span> | |
| <span id="sore_ter_2" name="sore_ter_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Membuang sekret pada tempat sputum :</span> | |
| <span id="sore_ter_3" name="sore_ter_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <!-- Edukasi --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Edukasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menjelaskan tujuan dan prosedur batuk efektif :</span> | |
| <span id="sore_edu_1" name="sore_edu_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-edu input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan tarik napas dalam melalui hidung selama 4 detik, ditahan selama 2 detik, kemudian keluarkan dari mulut dengan bibir mencucu (dibulatkan) selama 8 detik :</span> | |
| <span id="sore_edu_2" name="sore_edu_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-edu input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan mengulangi tarik napas dalam hingga 3 kali :</span> | |
| <span id="sore_edu_3" name="sore_edu_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-edu input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan batuk dengan kuat langsung setelah tarik napas dalam yang ke-3 :</span> | |
| <span id="sore_edu_4" name="sore_edu_4" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-edu input-line"></span> | |
| </td> | |
| </tr> | |
| <!-- Kolaborasi --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Kolaborasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Berkolaborasi pemberian mukolitik atau ekspektoran :</span> | |
| <span id="sore_kol_1" name="sore_kol_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| <!-- Kolom Paraf/TTD - ROWSPAN untuk semua shift --> | |
| <td style="width: 18%; padding: 8px; vertical-align: top"> | |
| <table class="table-full"> | |
| <tr> | |
| <td style="padding: 0px 10px;"> | |
| <input type="text" id="signature_title_2" name="signature_title_2" | |
| data-title="TTD Perawat/Bidan" class="form-text text-underline" | |
| maxlength="50" value="Perawat/Bidan" style="text-align: center;"> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="text-align: center;"> | |
| <table class="table-full"> | |
| <tr> | |
| <td style="cursor: pointer; width: 120px; height: 80px; position: relative;"> | |
| <label for="signature_image_2" style="display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; cursor: pointer; text-align: center;" class="print-signature"> | |
| <img id="preview-selected-signature_image_2" src="/img/icon/sign-here.svg" style="max-width: 100px; max-height: 60px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_2" name="signature_image_2" accept="image/*" style="display: none"/> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="text-align: center;"> | |
| <span id="signature_name_2" name="signature_name_2" contenteditable="true" class="input-line" data-placeholder="" data-title="Nama, Tanda tangan" style="text-align: center;">Nama, Tanda tangan</span> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </tbody> | |
| <tbody class="shift-section" data-shift="MALAM"> | |
| <tr class="shift-header-row" style="text-align: center" data-shift="MALAM"> | |
| <th style="width: 14.1%;padding: 8px" class="border-right date-td border-bottom only-print-after-first-border"> | |
| <!-- SHOULD ONLY SHOW IN PAGE 2 <. IF PAGE > 1 --> | |
| <span class="bold">HARI,<br />TANGGAL<br />& JAM</span> | |
| <!-- END --> | |
| </th> | |
| <th style="padding: 8px" class="border-right border-bottom"> | |
| <span class="bold">MALAM</span> | |
| </th> | |
| <th style="width: 21.7%; padding: 8px" class="border-bottom only-print-after-first-border"> | |
| <!-- SHOULD ONLY SHOW IN PAGE 2 <. IF PAGE > 1 --> | |
| <span class="bold">PARAF, NAMA<br />PERAWAT/BIDAN</span> | |
| <!-- END --> | |
| </th> | |
| </tr> | |
| <tr> | |
| <td style="padding: 8px; vertical-align: top;padding-top:10px;" class="border-right date-td-content"> | |
| <textarea id="hari_tanggal_jam_malam" name="hari_tanggal_jam_malam" class="form-textarea print-no-border auto-resize-textarea" placeholder=""></textarea> | |
| </td> | |
| <td style="padding: 8px; vertical-align: top" class="border-right border-bottom day-td-content"> | |
| <table class="table-full" style="font-size:11px"> | |
| <!-- Observasi --> | |
| <tr> | |
| <td> | |
| <span class="bold" >Observasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Mengidentifikasi kemampuan batuk :</span> | |
| <span id="malam_obs_1" name="malam_obs_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor adanya retensi sputum :</span> | |
| <span id="malam_obs_2" name="malam_obs_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor tanda dan gejala infeksi saluran napas :</span> | |
| <span id="malam_obs_3" name="malam_obs_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memonitor input dan output cairan (mis. jumlah dan karakteristik) :</span> | |
| <span id="malam_obs_4" name="malam_obs_4" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <!-- Terapeutik --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Terapeutik :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Mengatur posisi semi-Fowler atau Fowler :</span> | |
| <span id="malam_ter_1" name="malam_ter_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Memasang perlak dan bengkok di pangkuan pasien :</span> | |
| <span id="malam_ter_2" name="malam_ter_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Membuang sekret pada tempat sputum :</span> | |
| <span id="malam_ter_3" name="malam_ter_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| <!-- Edukasi --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Edukasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menjelaskan tujuan dan prosedur batuk efektif :</span> | |
| <span id="malam_edu_1" name="malam_edu_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line input-edu"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan tarik napas dalam melalui hidung selama 4 detik, ditahan selama 2 detik, kemudian keluarkan dari mulut dengan bibir mencucu (dibulatkan) selama 8 detik :</span> | |
| <span id="malam_edu_2" name="malam_edu_2" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line input-edu"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan mengulangi tarik napas dalam hingga 3 kali :</span> | |
| <span id="malam_edu_3" name="malam_edu_3" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line input-edu"></span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Menganjurkan batuk dengan kuat langsung setelah tarik napas dalam yang ke-3 :</span> | |
| <span id="malam_edu_4" name="malam_edu_4" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line input-edu"></span> | |
| </td> | |
| </tr> | |
| <!-- Kolaborasi --> | |
| <tr> | |
| <td style="padding-top: 8px"> | |
| <span class="bold" >Kolaborasi :</span> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px 0"> | |
| <span class="question-text">- Berkolaborasi pemberian mukolitik atau ekspektoran :</span> | |
| <span id="malam_kol_1" name="malam_kol_1" contenteditable="true" data-placeholder="true" | |
| class="form-text text-underline input-line"></span> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| <!-- Kolom Paraf/TTD - ROWSPAN untuk semua shift --> | |
| <td style="width: 18%; padding: 8px; vertical-align: top"> | |
| <table class="table-full"> | |
| <tr> | |
| <td style="padding: 0px 10px;"> | |
| <input type="text" id="signature_title_3" name="signature_title_3" | |
| data-title="TTD Perawat/Bidan" class="form-text text-underline" | |
| maxlength="50" value="Perawat/Bidan" style="text-align: center;"> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="text-align: center;"> | |
| <table class="table-full"> | |
| <tr> | |
| <td style="cursor: pointer; width: 120px; height: 80px; position: relative;"> | |
| <label for="signature_image_3" style="display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; cursor: pointer; text-align: center;" class="print-signature"> | |
| <img id="preview-selected-signature_image_3" src="/img/icon/sign-here.svg" style="max-width: 100px; max-height: 60px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_3" name="signature_image_3" accept="image/*" style="display: none"/> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td style="text-align: center;"> | |
| <span id="signature_name_3" name="signature_name_3" contenteditable="true" class="input-line" data-placeholder="" data-title="Nama, Tanda tangan" style="text-align: center;">Nama, Tanda tangan</span> | |
| </td> | |
| </tr> | |
| </table> | |
| </td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <div style="display: none;"> | |
| <input | |
| type="number" | |
| id="count_signature" | |
| data-title="Jumlah kotak TTD untuk HTML ini" | |
| value="3" | |
| > | |
| </div> | |
| </div> | |
| </form> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style> | |
| * { | |
| box-sizing: border-box; | |
| font: 10px "Tahoma"; | |
| } | |
| #dynamicForm { | |
| width: 100%; | |
| height: 100%; | |
| margin: 0; | |
| padding: 16px; | |
| background-color: #fafafa; | |
| } | |
| .page-container { | |
| width: 297mm; | |
| min-height: 210mm; | |
| padding: 4mm; | |
| margin: auto; | |
| border: 1px solid #d3d3d3; | |
| border-radius: 5px; | |
| background: #fff; | |
| box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); | |
| } | |
| .table-ews { | |
| width: 100%; | |
| border-collapse: collapse; | |
| font-size: 9px; | |
| } | |
| .table-ews th, | |
| .table-ews td { | |
| border: 1px solid #000; | |
| padding: 1px 2px; | |
| text-align: center; | |
| vertical-align: middle; | |
| } | |
| .table-ews th { | |
| font-weight: bold; | |
| } | |
| .table-ews .category-cell { | |
| text-align: left; | |
| font-weight: bold; | |
| width: 10px; | |
| font-size: 8px; | |
| } | |
| .table-ews .range-cell { | |
| text-align: center; | |
| width: 10px; | |
| font-size: 8px; | |
| } | |
| .table-ews .score-cell { | |
| text-align: center; | |
| width: 20px; | |
| font-weight: bold; | |
| } | |
| .table-ews .data-cell { | |
| background-color: #fff; | |
| width: 30px; | |
| min-width: 30px; | |
| max-width: 30px; | |
| vertical-align: middle; | |
| padding: 0; | |
| height: 1px; | |
| } | |
| .table-ews .total-row td { | |
| font-weight: bold; | |
| } | |
| .input-header { | |
| border: none; | |
| outline: none; | |
| font-size: 8px; | |
| width: 100%; | |
| text-align: center; | |
| background: #fff; | |
| padding: 1px; | |
| border-bottom: 1px solid gray; | |
| } | |
| .input-data { | |
| border: none; | |
| outline: none; | |
| font-size: 9px; | |
| width: 90%; | |
| text-align: center; | |
| background: #fff; | |
| padding: 2px; | |
| border-bottom: 1px solid gray; | |
| } | |
| .input-footer { | |
| border: none; | |
| border-bottom: 1px dotted #000; | |
| outline: none; | |
| font-size: 8px; | |
| width: 100%; | |
| text-align: center; | |
| background: transparent; | |
| } | |
| .form-title { | |
| font-weight: 800; | |
| font-size: 12px; | |
| text-align: center; | |
| margin-bottom: 8px; | |
| } | |
| .text-small { | |
| font-size: 7px; | |
| } | |
| .form-text { | |
| text-align: start; | |
| border: none; | |
| outline: none; | |
| width: 100%; | |
| } | |
| .text-underline { | |
| border-bottom: 1px solid #d3d3d3; | |
| } | |
| .print-signature:hover::after { | |
| content: ""; | |
| position: absolute; | |
| left: 70%; | |
| z-index: 999; | |
| background-image: url('/img/icon/tooltip-change-signature.svg'); | |
| background-size: contain; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| width: 200px; | |
| height: 80px; | |
| } | |
| @media print { | |
| html, body { | |
| margin: 0; | |
| padding: 0; | |
| } | |
| #dynamicForm { | |
| background-color: #fff; | |
| padding: 0; | |
| } | |
| @page { | |
| size: A4 landscape; | |
| margin: 5mm; | |
| } | |
| .page-container { | |
| margin: 0; | |
| padding: 0; | |
| border: none; | |
| border-radius: 0; | |
| width: auto; | |
| box-shadow: none; | |
| } | |
| .input-footer { | |
| border-bottom: none; | |
| } | |
| .input-header, | |
| .input-data { | |
| border: none !important; | |
| } | |
| img[src*="sign-here.svg"] { | |
| display: none !important; | |
| } | |
| } | |
| </style> | |
| <form id="dynamicForm"> | |
| <div class="page-container"> | |
| <div class="letter-head"> | |
| <!-- Letter head content will be inserted here via useEffect --> | |
| </div> | |
| <div class="page-content"> | |
| <div class="form-title">LEMBAR OBSERVASI EARLY WARNING SCORE (EWS)</div> | |
| <div id="auto_total_config" data-columns="15" data-categories="frekuensi_nafas,saturasi_o2,penggunaan_o2,suhu,td_sistolik,nadi,tingkat_kesadaran" data-min="0" data-total-max="20" hidden></div> | |
| <table class="table-ews"> | |
| <thead> | |
| <tr class="header-row"> | |
| <th colspan="2"></th> | |
| <th>Tanggal</th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| </tr> | |
| <tr class="header-row"> | |
| <th colspan="2"></th> | |
| <th>Jam</th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| </tr> | |
| </thead> | |
| <tbody> | |
| <!-- Frekuensi Nafas --> | |
| <tr> | |
| <td class="category-cell" rowspan="5">Frekuensi Nafas<br>(x/menit)</td> | |
| <td class="range-cell">≥25</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_1" name="frekuensi_nafas.1" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_2" name="frekuensi_nafas.2" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_3" name="frekuensi_nafas.3" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_4" name="frekuensi_nafas.4" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_5" name="frekuensi_nafas.5" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_6" name="frekuensi_nafas.6" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_7" name="frekuensi_nafas.7" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_8" name="frekuensi_nafas.8" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_9" name="frekuensi_nafas.9" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_10" name="frekuensi_nafas.10" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_11" name="frekuensi_nafas.11" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_12" name="frekuensi_nafas.12" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_13" name="frekuensi_nafas.13" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_14" name="frekuensi_nafas.14" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="frekuensi_nafas_15" name="frekuensi_nafas.15" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">21-24</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">12-20</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">9-11</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">≤8</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Saturasi O2 --> | |
| <tr> | |
| <td class="category-cell" rowspan="4">Saturasi O<sub>2</sub> (%)</td> | |
| <td class="range-cell">≥96</td> | |
| <td class="score-cell">0</td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_1" name="saturasi_o2.1" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_2" name="saturasi_o2.2" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_3" name="saturasi_o2.3" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_4" name="saturasi_o2.4" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_5" name="saturasi_o2.5" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_6" name="saturasi_o2.6" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_7" name="saturasi_o2.7" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_8" name="saturasi_o2.8" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_9" name="saturasi_o2.9" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_10" name="saturasi_o2.10" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_11" name="saturasi_o2.11" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_12" name="saturasi_o2.12" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_13" name="saturasi_o2.13" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_14" name="saturasi_o2.14" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="saturasi_o2_15" name="saturasi_o2.15" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">94-95</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">92-93</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">≤91</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Penggunaan O2 --> | |
| <tr> | |
| <td class="category-cell" rowspan="2">Penggunaan O<sub>2</sub></td> | |
| <td class="range-cell">Ya</td> | |
| <td class="score-cell">2</td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_1" name="penggunaan_o2.1" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_2" name="penggunaan_o2.2" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_3" name="penggunaan_o2.3" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_4" name="penggunaan_o2.4" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_5" name="penggunaan_o2.5" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_6" name="penggunaan_o2.6" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_7" name="penggunaan_o2.7" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_8" name="penggunaan_o2.8" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_9" name="penggunaan_o2.9" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_10" name="penggunaan_o2.10" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_11" name="penggunaan_o2.11" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_12" name="penggunaan_o2.12" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_13" name="penggunaan_o2.13" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_14" name="penggunaan_o2.14" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_15" name="penggunaan_o2.15" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Tidak</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <!-- Suhu --> | |
| <tr> | |
| <td class="category-cell" rowspan="5">Suhu (°C)</td> | |
| <td class="range-cell">≥39.1</td> | |
| <td class="score-cell">2</td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_1" name="suhu.1" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_2" name="suhu.2" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_3" name="suhu.3" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_4" name="suhu.4" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_5" name="suhu.5" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_6" name="suhu.6" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_7" name="suhu.7" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_8" name="suhu.8" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_9" name="suhu.9" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_10" name="suhu.10" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_11" name="suhu.11" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_12" name="suhu.12" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_13" name="suhu.13" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_14" name="suhu.14" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="suhu_15" name="suhu.15" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">38.1-39.0</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">36.1-38.0</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">35.1-36.0</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">≤35.0</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- TD Sistolik --> | |
| <tr> | |
| <td class="category-cell" rowspan="5">TD Sistolik (mmHg)</td> | |
| <td class="range-cell">≥220</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_1" name="td_sistolik.1" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_2" name="td_sistolik.2" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_3" name="td_sistolik.3" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_4" name="td_sistolik.4" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_5" name="td_sistolik.5" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_6" name="td_sistolik.6" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_7" name="td_sistolik.7" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_8" name="td_sistolik.8" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_9" name="td_sistolik.9" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_10" name="td_sistolik.10" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_11" name="td_sistolik.11" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_12" name="td_sistolik.12" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_13" name="td_sistolik.13" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_14" name="td_sistolik.14" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_15" name="td_sistolik.15" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">111-219</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">101-110</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">91-100</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">≤90</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Nadi --> | |
| <tr> | |
| <td class="category-cell" rowspan="6">Nadi (x/menit)</td> | |
| <td class="range-cell">≥131</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_1" name="nadi.1" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_2" name="nadi.2" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_3" name="nadi.3" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_4" name="nadi.4" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_5" name="nadi.5" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_6" name="nadi.6" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_7" name="nadi.7" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_8" name="nadi.8" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_9" name="nadi.9" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_10" name="nadi.10" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_11" name="nadi.11" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_12" name="nadi.12" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_13" name="nadi.13" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_14" name="nadi.14" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_15" name="nadi.15" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">111-130</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">91-110</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">51-90</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">41-50</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">≤40</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Tingkat Kesadaran --> | |
| <tr> | |
| <td class="category-cell" rowspan="2">Tingkat Kesadaran</td> | |
| <td class="range-cell text-small">Verbal, Pain atau tidak merespon</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_1" name="tingkat_kesadaran.1" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_2" name="tingkat_kesadaran.2" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_3" name="tingkat_kesadaran.3" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_4" name="tingkat_kesadaran.4" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_5" name="tingkat_kesadaran.5" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_6" name="tingkat_kesadaran.6" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_7" name="tingkat_kesadaran.7" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_8" name="tingkat_kesadaran.8" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_9" name="tingkat_kesadaran.9" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_10" name="tingkat_kesadaran.10" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_11" name="tingkat_kesadaran.11" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_12" name="tingkat_kesadaran.12" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_13" name="tingkat_kesadaran.13" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_14" name="tingkat_kesadaran.14" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_15" name="tingkat_kesadaran.15" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Sadar Penuh</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <!-- Total Skor --> | |
| <tr class="total-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Total Skor</td> | |
| <td><input type="text" id="total_1" name="total.1" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_2" name="total.2" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_3" name="total.3" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_4" name="total.4" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_5" name="total.5" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_6" name="total.6" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_7" name="total.7" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_8" name="total.8" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_9" name="total.9" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_10" name="total.10" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_11" name="total.11" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_12" name="total.12" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_13" name="total.13" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_14" name="total.14" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_15" name="total.15" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| </tr> | |
| <!-- Nama Petugas (TTD) --> | |
| <tr class="footer-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Nama Petugas</td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_1" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_1" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_1" name="signature_image_1" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_1" name="signature_name_1" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_2" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_2" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_2" name="signature_image_2" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_2" name="signature_name_2" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_3" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_3" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_3" name="signature_image_3" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_3" name="signature_name_3" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_4" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_4" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_4" name="signature_image_4" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_4" name="signature_name_4" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_5" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_5" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_5" name="signature_image_5" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_5" name="signature_name_5" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_6" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_6" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_6" name="signature_image_6" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_6" name="signature_name_6" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_7" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_7" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_7" name="signature_image_7" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_7" name="signature_name_7" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_8" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_8" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_8" name="signature_image_8" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_8" name="signature_name_8" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_9" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_9" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_9" name="signature_image_9" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_9" name="signature_name_9" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_10" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_10" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_10" name="signature_image_10" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_10" name="signature_name_10" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_11" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_11" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_11" name="signature_image_11" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_11" name="signature_name_11" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_12" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_12" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_12" name="signature_image_12" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_12" name="signature_name_12" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_13" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_13" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_13" name="signature_image_13" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_13" name="signature_name_13" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_14" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_14" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_14" name="signature_image_14" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_14" name="signature_name_14" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_15" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_15" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_15" name="signature_image_15" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_15" name="signature_name_15" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| </tr> | |
| <!-- Ruang Rawat/Bed --> | |
| <tr class="footer-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Ruang Rawat/Bed</td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| </tr> | |
| <!-- Score Interpretation --> | |
| <tr> | |
| <td colspan="3" style="font-weight: bold; text-align: left; padding: 2px 4px;">Skor 0</td> | |
| <td colspan="15" style="text-align: left; padding: 2px 4px;">Lanjutkan monitoring rutin oleh perawat.</td> | |
| </tr> | |
| <tr> | |
| <td colspan="3" style="font-weight: bold; text-align: left; padding: 2px 4px;">Skor 1-4</td> | |
| <td colspan="15" style="text-align: left; padding: 2px 4px;">Perawat PJ yang bertugas memberikan penilaian klinis dan kapan untuk intervensi (lapor ke dokter jaga). Lakukan pengkajian ulang setiap 2 jam.</td> | |
| </tr> | |
| <tr> | |
| <td colspan="3" style="font-weight: bold; text-align: left; padding: 2px 4px;">Skor 5-6 atau satu parameter bernilai 3</td> | |
| <td colspan="15" style="text-align: left; padding: 2px 4px;">Dokter jaga mengobservasi dan menilai status pasien serta memberikan instruksi tatalaksana pasien.</td> | |
| </tr> | |
| <tr> | |
| <td colspan="3" style="font-weight: bold; text-align: left; padding: 2px 4px;">Skor ≥7</td> | |
| <td colspan="15" style="text-align: left; padding: 2px 4px;">Lakukan tatalaksana kegawatan pada pasien, aktivasi code blue. Persiapkan untuk masuk ICU dan diinfokan kepada DPJP termasuk edukasi kepada keluarga pasien.</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <div style="display: none;"> | |
| <input | |
| type="number" | |
| id="count_signature" | |
| data-title="Jumlah kotak TTD untuk HTML ini" | |
| value="15" | |
| > | |
| </div> | |
| </div> | |
| </form> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style> | |
| * { | |
| box-sizing: border-box; | |
| font: 10px "Tahoma"; | |
| } | |
| #dynamicForm { | |
| width: 100%; | |
| height: 100%; | |
| margin: 0; | |
| padding: 16px; | |
| background-color: #fafafa; | |
| } | |
| .page-container { | |
| width: 297mm; | |
| min-height: 210mm; | |
| padding: 4mm; | |
| margin: auto; | |
| border: 1px solid #d3d3d3; | |
| border-radius: 5px; | |
| background: #fff; | |
| box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); | |
| } | |
| .table-ews { | |
| width: 100%; | |
| border-collapse: collapse; | |
| font-size: 9px; | |
| } | |
| .table-ews th, | |
| .table-ews td { | |
| border: 1px solid #000; | |
| padding: 1px 2px; | |
| text-align: center; | |
| vertical-align: middle; | |
| } | |
| .table-ews th { | |
| font-weight: bold; | |
| } | |
| .table-ews .category-cell { | |
| text-align: left; | |
| font-weight: bold; | |
| width: 1%; | |
| white-space: nowrap; | |
| font-size: 8px; | |
| } | |
| .table-ews .range-cell { | |
| text-align: left; | |
| width: 1%; | |
| white-space: nowrap; | |
| font-size: 7px; | |
| } | |
| .table-ews .score-cell { | |
| text-align: center; | |
| width: 1%; | |
| white-space: nowrap; | |
| font-weight: bold; | |
| } | |
| .table-ews .data-cell { | |
| background-color: #fff; | |
| width: 30px; | |
| min-width: 30px; | |
| max-width: 30px; | |
| vertical-align: middle; | |
| padding: 0; | |
| height: 1px; | |
| } | |
| .table-ews .total-row td { | |
| font-weight: bold; | |
| } | |
| .input-header { | |
| border: none; | |
| outline: none; | |
| font-size: 8px; | |
| width: 100%; | |
| text-align: center; | |
| background: #fff; | |
| padding: 1px; | |
| border-bottom: 1px solid gray; | |
| } | |
| .input-data { | |
| border: none; | |
| outline: none; | |
| font-size: 9px; | |
| width: 90%; | |
| text-align: center; | |
| background: #fff; | |
| padding: 2px; | |
| border-bottom: 1px solid gray; | |
| } | |
| .input-footer { | |
| border: none; | |
| border-bottom: 1px dotted #000; | |
| outline: none; | |
| font-size: 8px; | |
| width: 100%; | |
| text-align: center; | |
| background: transparent; | |
| } | |
| .form-title { | |
| font-weight: 800; | |
| font-size: 12px; | |
| text-align: center; | |
| padding-block: 8px; | |
| border-inline: 1px solid #000; | |
| } | |
| .text-small { | |
| font-size: 7px; | |
| } | |
| .form-text { | |
| text-align: start; | |
| border: none; | |
| outline: none; | |
| width: 100%; | |
| } | |
| .text-underline { | |
| border-bottom: 1px solid #d3d3d3; | |
| } | |
| .print-signature:hover::after { | |
| content: ""; | |
| position: absolute; | |
| left: 70%; | |
| z-index: 999; | |
| background-image: url('/img/icon/tooltip-change-signature.svg'); | |
| background-size: contain; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| width: 200px; | |
| height: 80px; | |
| } | |
| @page | |
| { | |
| size: A4 landscape; | |
| margin: 0; | |
| } | |
| @media print { | |
| html, body { | |
| margin: 0; | |
| padding: 0; | |
| } | |
| #dynamicForm { | |
| background-color: #fff; | |
| padding: 0; | |
| } | |
| #letterHead { | |
| width: 268mm; | |
| } | |
| @page { | |
| size: A4 landscape; | |
| margin: 0; | |
| } | |
| .page-container { | |
| margin: 0; | |
| padding: 0; | |
| border: none; | |
| border-radius: 0; | |
| width: auto; | |
| box-shadow: none; | |
| } | |
| .input-footer { | |
| border-bottom: none; | |
| } | |
| .input-header, | |
| .input-data { | |
| border: none !important; | |
| } | |
| img[src*="sign-here.svg"] { | |
| display: none !important; | |
| } | |
| } | |
| </style> | |
| <div id="dynamicPaddingTop" data-padding-top="10.76cm" hidden></div> | |
| <form id="dynamicForm"> | |
| <div class="page-container"> | |
| <div class="letter-head"> | |
| <!-- Letter head content will be inserted here via useEffect --> | |
| </div> | |
| <div class="page-content"> | |
| <div class="form-title">LEMBAR OBSERVASI MATERNAL EARLY OBSTETRIC WARNING SCORE (MEOWS) IBU HAMIL</div> | |
| <div id="auto_total_config" data-columns="12" data-categories="frekuensi_nafas,saturasi_o2,penggunaan_o2,suhu,td_sistolik,td_diastolik,nadi,tingkat_kesadaran,nyeri,discharge_lochia,proteinuria" data-min="0" data-total-max="32" hidden></div> | |
| <table class="table-ews"> | |
| <thead> | |
| <tr class="header-row"> | |
| <th colspan="2"></th> | |
| <th>Tanggal</th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| </tr> | |
| <tr class="header-row"> | |
| <th colspan="2"></th> | |
| <th>Jam</th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| </tr> | |
| </thead> | |
| <tbody> | |
| <!-- Frekuensi Nafas --> | |
| <tr> | |
| <td class="category-cell" rowspan="4">Frekuensi Nafas (x/menit)</td> | |
| <td class="range-cell">>25</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_1" name="frekuensi_nafas.1" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_2" name="frekuensi_nafas.2" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_3" name="frekuensi_nafas.3" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_4" name="frekuensi_nafas.4" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_5" name="frekuensi_nafas.5" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_6" name="frekuensi_nafas.6" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_7" name="frekuensi_nafas.7" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_8" name="frekuensi_nafas.8" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_9" name="frekuensi_nafas.9" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_10" name="frekuensi_nafas.10" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_11" name="frekuensi_nafas.11" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="frekuensi_nafas_12" name="frekuensi_nafas.12" data-title="Frekuensi Nafas" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">21-25</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">12-20</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell"><12</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Saturasi O2 --> | |
| <tr> | |
| <td class="category-cell" rowspan="3">Saturasi O<sub>2</sub> (%)</td> | |
| <td class="range-cell">>95</td> | |
| <td class="score-cell">0</td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_1" name="saturasi_o2.1" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_2" name="saturasi_o2.2" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_3" name="saturasi_o2.3" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_4" name="saturasi_o2.4" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_5" name="saturasi_o2.5" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_6" name="saturasi_o2.6" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_7" name="saturasi_o2.7" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_8" name="saturasi_o2.8" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_9" name="saturasi_o2.9" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_10" name="saturasi_o2.10" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_11" name="saturasi_o2.11" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="3"><input type="text" id="saturasi_o2_12" name="saturasi_o2.12" data-title="Saturasi O2" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">92-95</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell"><92</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Penggunaan O2 --> | |
| <tr> | |
| <td class="category-cell" rowspan="2">Penggunaan O<sub>2</sub></td> | |
| <td class="range-cell">Ya</td> | |
| <td class="score-cell">2</td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_1" name="penggunaan_o2.1" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_2" name="penggunaan_o2.2" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_3" name="penggunaan_o2.3" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_4" name="penggunaan_o2.4" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_5" name="penggunaan_o2.5" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_6" name="penggunaan_o2.6" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_7" name="penggunaan_o2.7" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_8" name="penggunaan_o2.8" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_9" name="penggunaan_o2.9" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_10" name="penggunaan_o2.10" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_11" name="penggunaan_o2.11" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="penggunaan_o2_12" name="penggunaan_o2.12" data-title="Penggunaan O2" class="input-data" maxlength="1" data-max="2"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Tidak</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <!-- Suhu --> | |
| <tr> | |
| <td class="category-cell" rowspan="4">Suhu (°C)</td> | |
| <td class="range-cell">>37.7</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_1" name="suhu.1" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_2" name="suhu.2" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_3" name="suhu.3" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_4" name="suhu.4" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_5" name="suhu.5" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_6" name="suhu.6" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_7" name="suhu.7" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_8" name="suhu.8" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_9" name="suhu.9" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_10" name="suhu.10" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_11" name="suhu.11" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="suhu_12" name="suhu.12" data-title="Suhu" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">37.3-37.7</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">36.1-37.2</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">≤36</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- TD Sistolik --> | |
| <tr> | |
| <td class="category-cell" rowspan="5">TD Sistolik (mmHg)</td> | |
| <td class="range-cell">>160</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_1" name="td_sistolik.1" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_2" name="td_sistolik.2" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_3" name="td_sistolik.3" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_4" name="td_sistolik.4" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_5" name="td_sistolik.5" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_6" name="td_sistolik.6" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_7" name="td_sistolik.7" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_8" name="td_sistolik.8" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_9" name="td_sistolik.9" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_10" name="td_sistolik.10" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_11" name="td_sistolik.11" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="5"><input type="text" id="td_sistolik_12" name="td_sistolik.12" data-title="TD Sistolik" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">151-160</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">131-150</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">90-130</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell"><90</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- TD Diastolik --> | |
| <tr> | |
| <td class="category-cell" rowspan="4">TD Diastolik (mmHg)</td> | |
| <td class="range-cell">>110</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_1" name="td_diastolik.1" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_2" name="td_diastolik.2" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_3" name="td_diastolik.3" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_4" name="td_diastolik.4" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_5" name="td_diastolik.5" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_6" name="td_diastolik.6" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_7" name="td_diastolik.7" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_8" name="td_diastolik.8" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_9" name="td_diastolik.9" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_10" name="td_diastolik.10" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_11" name="td_diastolik.11" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="td_diastolik_12" name="td_diastolik.12" data-title="TD Diastolik" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">100-110</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">90-100</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell"><90</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <!-- Nadi --> | |
| <tr> | |
| <td class="category-cell" rowspan="6">Nadi (x/menit)</td> | |
| <td class="range-cell">>120</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_1" name="nadi.1" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_2" name="nadi.2" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_3" name="nadi.3" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_4" name="nadi.4" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_5" name="nadi.5" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_6" name="nadi.6" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_7" name="nadi.7" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_8" name="nadi.8" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_9" name="nadi.9" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_10" name="nadi.10" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_11" name="nadi.11" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="6"><input type="text" id="nadi_12" name="nadi.12" data-title="Nadi" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">111-120</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">101-110</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">61-100</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">50-60</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell"><50</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Tingkat Kesadaran --> | |
| <tr> | |
| <td class="category-cell" rowspan="2">Tingkat Kesadaran</td> | |
| <td class="range-cell">Verbal, Pain atau Tidak Merespon</td> | |
| <td class="score-cell">3</td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_1" name="tingkat_kesadaran.1" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_2" name="tingkat_kesadaran.2" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_3" name="tingkat_kesadaran.3" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_4" name="tingkat_kesadaran.4" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_5" name="tingkat_kesadaran.5" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_6" name="tingkat_kesadaran.6" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_7" name="tingkat_kesadaran.7" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_8" name="tingkat_kesadaran.8" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_9" name="tingkat_kesadaran.9" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_10" name="tingkat_kesadaran.10" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_11" name="tingkat_kesadaran.11" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="tingkat_kesadaran_12" name="tingkat_kesadaran.12" data-title="Tingkat Kesadaran" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Sadar Penuh</td> | |
| <td class="score-cell">0</td> | |
| </tr> | |
| <!-- Nyeri --> | |
| <tr> | |
| <td class="category-cell" rowspan="2">Nyeri</td> | |
| <td class="range-cell">Normal</td> | |
| <td class="score-cell">0</td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_1" name="nyeri.1" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_2" name="nyeri.2" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_3" name="nyeri.3" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_4" name="nyeri.4" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_5" name="nyeri.5" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_6" name="nyeri.6" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_7" name="nyeri.7" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_8" name="nyeri.8" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_9" name="nyeri.9" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_10" name="nyeri.10" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_11" name="nyeri.11" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="nyeri_12" name="nyeri.12" data-title="Nyeri" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Abnormal</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Discharge/Lochia --> | |
| <tr> | |
| <td class="category-cell" rowspan="2">Discharge/Lochia</td> | |
| <td class="range-cell">Normal</td> | |
| <td class="score-cell">0</td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_1" name="discharge_lochia.1" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_2" name="discharge_lochia.2" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_3" name="discharge_lochia.3" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_4" name="discharge_lochia.4" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_5" name="discharge_lochia.5" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_6" name="discharge_lochia.6" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_7" name="discharge_lochia.7" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_8" name="discharge_lochia.8" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_9" name="discharge_lochia.9" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_10" name="discharge_lochia.10" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_11" name="discharge_lochia.11" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="discharge_lochia_12" name="discharge_lochia.12" data-title="Discharge/Lochia" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Abnormal</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Proteinuria --> | |
| <tr> | |
| <td class="category-cell" rowspan="2">Proteinuria</td> | |
| <td class="range-cell">+</td> | |
| <td class="score-cell">2</td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_1" name="proteinuria.1" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_2" name="proteinuria.2" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_3" name="proteinuria.3" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_4" name="proteinuria.4" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_5" name="proteinuria.5" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_6" name="proteinuria.6" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_7" name="proteinuria.7" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_8" name="proteinuria.8" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_9" name="proteinuria.9" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_10" name="proteinuria.10" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_11" name="proteinuria.11" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="2"><input type="text" id="proteinuria_12" name="proteinuria.12" data-title="Proteinuria" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">++></td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Total Skor --> | |
| <tr class="total-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Total Skor</td> | |
| <td><input type="text" id="total_1" name="total.1" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_2" name="total.2" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_3" name="total.3" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_4" name="total.4" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_5" name="total.5" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_6" name="total.6" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_7" name="total.7" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_8" name="total.8" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_9" name="total.9" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_10" name="total.10" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_11" name="total.11" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_12" name="total.12" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| </tr> | |
| <!-- Nama Petugas (TTD) --> | |
| <tr class="footer-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Nama Petugas</td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_1" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_1" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_1" name="signature_image_1" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_1" name="signature_name_1" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_2" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_2" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_2" name="signature_image_2" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_2" name="signature_name_2" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_3" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_3" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_3" name="signature_image_3" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_3" name="signature_name_3" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_4" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_4" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_4" name="signature_image_4" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_4" name="signature_name_4" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_5" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_5" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_5" name="signature_image_5" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_5" name="signature_name_5" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_6" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_6" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_6" name="signature_image_6" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_6" name="signature_name_6" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_7" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_7" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_7" name="signature_image_7" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_7" name="signature_name_7" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_8" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_8" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_8" name="signature_image_8" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_8" name="signature_name_8" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_9" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_9" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_9" name="signature_image_9" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_9" name="signature_name_9" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_10" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_10" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_10" name="signature_image_10" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_10" name="signature_name_10" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_11" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_11" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_11" name="signature_image_11" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_11" name="signature_name_11" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_12" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_12" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_12" name="signature_image_12" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_12" name="signature_name_12" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| </tr> | |
| <!-- Ruang Rawat/Bed --> | |
| <tr class="footer-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Ruang Rawat/Bed</td> | |
| <td><div id="registrationDetail_bedRoom"></div></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| <td><input type="text" class="registrationDetail_bedRoom input-footer"></td> | |
| </tr> | |
| <!-- Interpretasi Skor --> | |
| <tr> | |
| <td colspan="3" style="font-weight: bold; text-align: left; padding: 2px 4px; width: 180px; min-width: 180px;">Skor 1-4<br>Risiko Ringan</td> | |
| <td colspan="12" style="text-align: left; padding: 2px 4px;">Asesmen segera oleh perawat, eskalasi perawatan dan monitoring per jam 4-6 jam, jika diperlukan konsultasi ke dokter jaga dan konsultasikan DPJP. Jika terdapat gejala impending eklamsia (nyeri kepala, gangguan penglihatan, nyeri ulu hati) eskalasi perawatan dan monitoring lebih dini.</td> | |
| </tr> | |
| <tr> | |
| <td colspan="3" style="font-weight: bold; text-align: left; padding: 2px 4px; width: 180px; min-width: 180px;">Skor 5-6 atau Salah satu parameter bernilai 3<br>Risiko Sedang</td> | |
| <td colspan="12" style="text-align: left; padding: 2px 4px;">Asesmen segera oleh dokter jaga (respon segera, maksimal 5 menit), konsultasi DPJP dan spesialis terkait. Eskalasi perawatan, monitoring tiap 1-2 jam, pertimbangkan perawatan HCU/ICU.</td> | |
| </tr> | |
| <tr> | |
| <td colspan="3" style="font-weight: bold; text-align: left; padding: 2px 4px;">Skor ≥7</td> | |
| <td colspan="12" style="text-align: left; padding: 2px 4px;">Resusitasi dan monitoring secara kontinu oleh dokter jaga dan perawat senior, panggil tim medis reaksi cepat, informasikan dan konsultasikan ke DPJP.</td> | |
| </tr> | |
| <tr> | |
| <td colspan="3" style="font-weight: bold; text-align: left; padding: 2px 4px;">Henti Napas/Jantung</td> | |
| <td colspan="12" style="text-align: left; padding: 2px 4px;">Lakukan RJP, aktivasi code blue, resusitasi lanjut oleh tim code blue.</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <div style="display: none;"> | |
| <input | |
| type="number" | |
| id="count_signature" | |
| data-title="Jumlah kotak TTD untuk HTML ini" | |
| value="12" | |
| > | |
| </div> | |
| </div> | |
| </form> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style> | |
| * { | |
| box-sizing: border-box; | |
| font: 10px "Tahoma"; | |
| } | |
| #dynamicForm { | |
| width: 100%; | |
| height: 100%; | |
| margin: 0; | |
| padding: 16px; | |
| background-color: #fafafa; | |
| } | |
| .page-container { | |
| width: 297mm; | |
| min-height: 210mm; | |
| padding: 4mm; | |
| margin: auto; | |
| border: 1px solid #d3d3d3; | |
| border-radius: 5px; | |
| background: #fff; | |
| box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); | |
| } | |
| .table-ews { | |
| width: 100%; | |
| border-collapse: collapse; | |
| font-size: 9px; | |
| } | |
| .table-ews th, | |
| .table-ews td { | |
| border: 1px solid #000; | |
| padding: 1px 2px; | |
| text-align: center; | |
| vertical-align: middle; | |
| } | |
| .table-ews th { | |
| font-weight: bold; | |
| } | |
| .table-ews .category-cell { | |
| text-align: left; | |
| font-weight: bold; | |
| width: 50px; | |
| min-width: 50px; | |
| max-width: 50px; | |
| font-size: 8px; | |
| } | |
| .table-ews .range-cell { | |
| text-align: left; | |
| width: 120px; | |
| min-width: 120px; | |
| max-width: 120px; | |
| font-size: 7px; | |
| } | |
| .table-ews .score-cell { | |
| text-align: center; | |
| width: 15px; | |
| min-width: 15px; | |
| max-width: 15px; | |
| font-weight: bold; | |
| } | |
| .table-ews .data-cell { | |
| background-color: #fff; | |
| width: 30px; | |
| min-width: 30px; | |
| max-width: 30px; | |
| vertical-align: middle; | |
| padding: 0; | |
| height: 1px; | |
| } | |
| .table-ews .total-row td { | |
| font-weight: bold; | |
| } | |
| .input-header { | |
| border: none; | |
| outline: none; | |
| font-size: 8px; | |
| width: 100%; | |
| text-align: center; | |
| background: #fff; | |
| padding: 1px; | |
| border-bottom: 1px solid gray; | |
| } | |
| .input-data { | |
| border: none; | |
| outline: none; | |
| font-size: 9px; | |
| width: 90%; | |
| text-align: center; | |
| background: #fff; | |
| padding: 2px; | |
| border-bottom: 1px solid gray; | |
| } | |
| .input-footer { | |
| border: none; | |
| border-bottom: 1px dotted #000; | |
| outline: none; | |
| font-size: 8px; | |
| width: 100%; | |
| text-align: center; | |
| background: transparent; | |
| } | |
| .form-title { | |
| font-weight: 800; | |
| font-size: 12px; | |
| text-align: center; | |
| margin-bottom: 8px; | |
| } | |
| .text-small { | |
| font-size: 7px; | |
| } | |
| .form-text { | |
| text-align: start; | |
| border: none; | |
| outline: none; | |
| width: 100%; | |
| } | |
| .text-underline { | |
| border-bottom: 1px solid #d3d3d3; | |
| } | |
| .print-signature:hover::after { | |
| content: ""; | |
| position: absolute; | |
| left: 70%; | |
| z-index: 999; | |
| background-image: url('/img/icon/tooltip-change-signature.svg'); | |
| background-size: contain; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| width: 200px; | |
| height: 80px; | |
| } | |
| @media print { | |
| html, body { | |
| margin: 0; | |
| padding: 0; | |
| } | |
| #dynamicForm { | |
| background-color: #fff; | |
| padding: 0; | |
| } | |
| @page { | |
| size: A4 landscape; | |
| margin: 5mm; | |
| } | |
| .page-container { | |
| margin: 0; | |
| padding: 0; | |
| border: none; | |
| border-radius: 0; | |
| width: auto; | |
| box-shadow: none; | |
| } | |
| .input-footer { | |
| border-bottom: none; | |
| } | |
| .input-header, | |
| .input-data { | |
| border: none !important; | |
| } | |
| img[src*="sign-here.svg"] { | |
| display: none !important; | |
| } | |
| } | |
| </style> | |
| <form id="dynamicForm"> | |
| <div class="page-container"> | |
| <div class="letter-head"> | |
| <!-- Letter head content will be inserted here via useEffect --> | |
| </div> | |
| <div class="page-content"> | |
| <div class="form-title">LEMBAR OBSERVASI PEDIATRIC EARLY WARNING SCORE (PEWS) ANAK DAN BAYI</div> | |
| <div id="auto_total_config" data-columns="12" data-categories="keadaan_umum,kardiovaskular,respirasi,poin_tambahan" data-min="0" data-total-max="11" hidden></div> | |
| <table class="table-ews"> | |
| <thead> | |
| <tr class="header-row"> | |
| <th colspan="2"></th> | |
| <th>Tanggal</th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| <th><input type="text" class="input-header" maxlength="10"></th> | |
| </tr> | |
| <tr class="header-row"> | |
| <th colspan="2"></th> | |
| <th>Jam</th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| <th><input type="text" class="input-header" maxlength="5"></th> | |
| </tr> | |
| </thead> | |
| <tbody> | |
| <!-- Keadaan Umum --> | |
| <tr> | |
| <td class="category-cell" rowspan="4">Keadaan Umum</td> | |
| <td class="range-cell">Bermain/Interaksi Biasa</td> | |
| <td class="score-cell">0</td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_1" name="keadaan_umum.1" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_2" name="keadaan_umum.2" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_3" name="keadaan_umum.3" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_4" name="keadaan_umum.4" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_5" name="keadaan_umum.5" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_6" name="keadaan_umum.6" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_7" name="keadaan_umum.7" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_8" name="keadaan_umum.8" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_9" name="keadaan_umum.9" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_10" name="keadaan_umum.10" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_11" name="keadaan_umum.11" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="keadaan_umum_12" name="keadaan_umum.12" data-title="Keadaan Umum" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Tidur</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Iritable</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Letargi, gelisah, penurunan terhadap nyeri</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Kardiovaskular --> | |
| <tr> | |
| <td class="category-cell" rowspan="4">Kardiovaskular</td> | |
| <td class="range-cell">Tidak sianosis atau pengisian kapiler < 2 detik</td> | |
| <td class="score-cell">0</td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_1" name="kardiovaskular.1" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_2" name="kardiovaskular.2" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_3" name="kardiovaskular.3" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_4" name="kardiovaskular.4" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_5" name="kardiovaskular.5" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_6" name="kardiovaskular.6" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_7" name="kardiovaskular.7" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_8" name="kardiovaskular.8" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_9" name="kardiovaskular.9" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_10" name="kardiovaskular.10" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_11" name="kardiovaskular.11" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="kardiovaskular_12" name="kardiovaskular.12" data-title="Kardiovaskular" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Tampak pucat atau pengisian kapiler 2 detik</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Tampak sianotik atau pengisian kapiler > 2 detik atau takikardi >20x di atas parameter RR sesuai usia per menit</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Sianotik dan motlet, atau pengisian kapiler > 5 detik atau takikardi >30 diatas parameter RR sesuai usia permenit atau bradikardia (sesuai usia)</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Respirasi --> | |
| <tr> | |
| <td class="category-cell" rowspan="4">Respirasi</td> | |
| <td class="range-cell">Respirasi dalam parameter normal, tidak terdapat retraksi</td> | |
| <td class="score-cell">0</td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_1" name="respirasi.1" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_2" name="respirasi.2" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_3" name="respirasi.3" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_4" name="respirasi.4" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_5" name="respirasi.5" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_6" name="respirasi.6" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_7" name="respirasi.7" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_8" name="respirasi.8" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_9" name="respirasi.9" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_10" name="respirasi.10" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_11" name="respirasi.11" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| <td class="data-cell" rowspan="4"><input type="text" id="respirasi_12" name="respirasi.12" data-title="Respirasi" class="input-data" maxlength="1" data-max="3"></td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Takipneu >10 di atas parameter RR atau usia permenit atau menggunakan otot alat bantu nafas, atau menggunakan FiO2 lebih dari 30% (setara dengan 3 L per menit nasal kanul)</td> | |
| <td class="score-cell">1</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Takipneu >20 di atas parameter RR atau usia per menit atau ada retraksi atau ada retraksi, atau menggunakan FiO2 lebih dari 40% (setara dengan 6 L per menit simple mask)</td> | |
| <td class="score-cell">2</td> | |
| </tr> | |
| <tr> | |
| <td class="range-cell">Laju respirasi >5 di bawah nilai normal dengan retraksi berat, atau merintih atau menggunakan FiO2 lebih dari 50% (setara dengan 8 L per menit simple mask)</td> | |
| <td class="score-cell">3</td> | |
| </tr> | |
| <!-- Poin Tambahan --> | |
| <tr> | |
| <td class="category-cell" colspan="2">2 poin tambahan diberikan jika terjadi muntah terus-menerus setelah operasi atau setiap 20 menit nebulisasi (termasuk nebulisasi berkelanjutan)</td> | |
| <td class="score-cell">2</td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_1" name="poin_tambahan.1" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_2" name="poin_tambahan.2" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_3" name="poin_tambahan.3" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_4" name="poin_tambahan.4" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_5" name="poin_tambahan.5" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_6" name="poin_tambahan.6" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_7" name="poin_tambahan.7" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_8" name="poin_tambahan.8" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_9" name="poin_tambahan.9" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_10" name="poin_tambahan.10" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_11" name="poin_tambahan.11" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| <td class="data-cell"><input type="text" id="poin_tambahan_12" name="poin_tambahan.12" data-title="Poin Tambahan" class="input-data" maxlength="1" data-max="2"></td> | |
| </tr> | |
| <!-- Total Skor --> | |
| <tr class="total-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Total Skor</td> | |
| <td><input type="text" id="total_1" name="total.1" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_2" name="total.2" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_3" name="total.3" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_4" name="total.4" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_5" name="total.5" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_6" name="total.6" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_7" name="total.7" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_8" name="total.8" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_9" name="total.9" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_10" name="total.10" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_11" name="total.11" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| <td><input type="text" id="total_12" name="total.12" data-title="Total Skor" class="input-header" maxlength="3" readonly></td> | |
| </tr> | |
| <!-- Nama Petugas (TTD) --> | |
| <tr class="footer-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Nama Petugas</td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_1" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_1" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_1" name="signature_image_1" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_1" name="signature_name_1" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_2" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_2" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_2" name="signature_image_2" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_2" name="signature_name_2" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_3" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_3" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_3" name="signature_image_3" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_3" name="signature_name_3" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_4" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_4" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_4" name="signature_image_4" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_4" name="signature_name_4" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_5" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_5" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_5" name="signature_image_5" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_5" name="signature_name_5" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_6" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_6" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_6" name="signature_image_6" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_6" name="signature_name_6" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_7" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_7" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_7" name="signature_image_7" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_7" name="signature_name_7" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_8" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_8" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_8" name="signature_image_8" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_8" name="signature_name_8" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_9" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_9" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_9" name="signature_image_9" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_9" name="signature_name_9" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_10" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_10" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_10" name="signature_image_10" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_10" name="signature_name_10" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_11" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_11" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_11" name="signature_image_11" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_11" name="signature_name_11" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| <td style="padding: 2px;"> | |
| <div style="cursor: pointer; position: relative;"> | |
| <label for="signature_image_12" style="display: flex; align-items: center; justify-content: center; cursor: pointer;" class="print-signature"> | |
| <img id="preview-selected-signature_image_12" src="/img/icon/sign-here.svg" style="max-width: 25px; max-height: 20px; object-fit: contain;"/> | |
| </label> | |
| <input type="file" id="signature_image_12" name="signature_image_12" accept="image/*" style="display: none"/> | |
| </div> | |
| <input type="text" id="signature_name_12" name="signature_name_12" data-title="Nama" class="form-text text-underline" maxlength="50" style="text-align: center; font-size: 6px;"> | |
| </td> | |
| </tr> | |
| <!-- Ruang Rawat/Bed --> | |
| <tr class="footer-row"> | |
| <td colspan="3" style="text-align: right; padding-right: 5px;">Ruang Rawat/Bed</td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| <td><input type="text" class="input-footer"></td> | |
| </tr> | |
| <!-- Tabel Referensi --> | |
| <tr> | |
| <th style="border: 1px solid #000; padding: 2px;">Kategori</th> | |
| <th colspan="2" style="border: 1px solid #000; padding: 2px;">Usia</th> | |
| <th colspan="6" style="border: 1px solid #000; padding: 2px;">Nadi Saat Istirahat<br>(kali/menit)</th> | |
| <th colspan="6" style="border: 1px solid #000; padding: 2px;">Nafas Saat Istirahat<br>(kali/menit)</th> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px;">Neonatus</td> | |
| <td colspan="2" style="padding: 2px;">0 - 1 Bulan</td> | |
| <td colspan="6" style="padding: 2px;">100 - 180</td> | |
| <td colspan="6" style="padding: 2px;">40 - 60</td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px;">Bayi</td> | |
| <td colspan="2" style="padding: 2px;">1 - 12 Bulan</td> | |
| <td colspan="6" style="padding: 2px;">100 - 180</td> | |
| <td colspan="6" style="padding: 2px;">35 - 40</td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px;">Balita</td> | |
| <td colspan="2" style="padding: 2px;">13 - 36 Bulan</td> | |
| <td colspan="6" style="padding: 2px;">70 - 110</td> | |
| <td colspan="6" style="padding: 2px;">25 - 30</td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px;">Pra-Sekolah</td> | |
| <td colspan="2" style="padding: 2px;">4 - 6 Tahun</td> | |
| <td colspan="6" style="padding: 2px;">70 - 110</td> | |
| <td colspan="6" style="padding: 2px;">21 - 23</td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px;">Sekolah</td> | |
| <td colspan="2" style="padding: 2px;">7 - 12 Tahun</td> | |
| <td colspan="6" style="padding: 2px;">70 - 110</td> | |
| <td colspan="6" style="padding: 2px;">19 - 21</td> | |
| </tr> | |
| <tr> | |
| <td style="padding: 2px;">Remaja</td> | |
| <td colspan="2" style="padding: 2px;">13 - 19 Tahun</td> | |
| <td colspan="6" style="padding: 2px;">55 - 90</td> | |
| <td colspan="6" style="padding: 2px;">16 - 18</td> | |
| </tr> | |
| <!-- Interpretasi Skor --> | |
| <tr> | |
| <td style="font-weight: bold; text-align: left; padding: 2px 4px;">Skor 1-2<br>Risiko Ringan</td> | |
| <td colspan="14" style="text-align: left; padding: 2px 4px;">Pasien dalam kondisi stabil, monitoring secara rutin, jika diperlukan per 4 jam, dan jika perlu asesmen oleh dokter jaga.</td> | |
| </tr> | |
| <tr> | |
| <td style="font-weight: bold; text-align: left; padding: 2px 4px;">Skor 3-4<br>Risiko Sedang</td> | |
| <td colspan="14" style="text-align: left; padding: 2px 4px;">Ada perubahan kondisi pasien, lakukan evaluasi setiap 2 jam atau lebih cepat. Lapor ke penanggung jawab tim jaga. Konsultasikan ke DPJP, eskalasi terapi sesuai kondisi.</td> | |
| </tr> | |
| <tr> | |
| <td style="font-weight: bold; text-align: left; padding: 2px 4px;">Skor ≥5 atau Skor bernilai 3 pada salah satu parameter</td> | |
| <td colspan="14" style="text-align: left; padding: 2px 4px;">Ada perubahan yang signifikan. Monitoring setiap 1 jam atau lebih cepat. Konsultasi ke DPJP. Lakukan resusitasi dan monitoring kontinu pada kondisi yang mengancam jiwa. Aktivasi tim medis reaksi cepat.</td> | |
| </tr> | |
| <tr> | |
| <td style="font-weight: bold; text-align: left; padding: 2px 4px;">Henti Napas/Jantung</td> | |
| <td colspan="14" style="text-align: left; padding: 2px 4px;">Lakukan RJP, aktivasi code blue, resusitasi lanjut oleh tim code blue.</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| <div style="display: none;"> | |
| <input | |
| type="number" | |
| id="count_signature" | |
| data-title="Jumlah kotak TTD untuk HTML ini" | |
| value="12" | |
| > | |
| </div> | |
| </div> | |
| </form> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment