<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <div class=" well col-xs-6 col-md-3"> RM234567</br> <b>Permata Sari</b></br> 29 tahun / 23 Jan 1986 <hr> <ul class="nav nav-pills nav-stacked"> <li role="presentation"><a href="#"><span class="glyphicon glyphicon-dashboard" aria-hidden="true"></span> Dashboard</a></li> <li role="presentation"><a href="#"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Rekam Medis</a></li> <li role="presentation"><a href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span> Diagnosis</a></li> <li role="presentation" class="active"><a href="#"><span class="glyphicon glyphicon-heart" aria-hidden="true"></span> Tindakan Medis</a></li> <li role="presentation"><a href="#"><span class="glyphicon glyphicon-align-left" aria-hidden="true"></span> Hasil Radiologi</a></li> </ul> </div> <div class=" col-xs-12 col-sm-6 col-md-9"> <h3><span class="glyphicon glyphicon-heart" aria-hidden="true"></span> Tindakan Medis</h3> <div class="panel panel-default"> <div class="panel-heading"><h4>SOAP</h4></div> <div class="panel-body"> <form> <div class="row"> <div class="col-md-6"> <div class="form-group"> <label for="subjective">Subjective</label> <textarea class="form-control" id="subjective" placeholder="Deskripsi subjective" rows="3"></textarea> </div> <div class="form-group"> <label for="objective">Objective</label> <textarea class="form-control" id="objective" placeholder="Deskripsi objective" rows="3"></textarea> </div> </div> <div class="col-md-6"> <div class="form-group"> <label for="assessment">Assessment</label> <textarea class="form-control" id="assessment" placeholder="Deskripsi assessment" rows="3"></textarea> </div> <div class="form-group"> <label for="plan">Plan</label> <textarea class="form-control" id="plan" placeholder="Deskripsi plan" rows="3"></textarea> </div> </div> </div> </form> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <div class="row"> <div class="col-md-3"> <h4>Daftar kode ICD-10</h4> </div> <div class="col-md-7 pull-right"> <div class="input-group"> <input type="search" id="search" class="form-control" placeholder="Cari..."> <span class="input-group-btn"> <button class="btn btn-default" type="button"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></button> </span> </div><!-- /input-group --> </div> </div> </div> <div style="height: 200px; overflow: auto"> <table class="table" id="table" > <thead> <tr> <th>Kode</th> <th>Deskripsi tindakan</th> <th></th> </tr> </thead> <tbody> <tr> <td>I42.0</td> <td>Dilated cardiomyopathy</td> <td><a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></td> </tr> <tr> <td>J18.2</td> <td>Hypostatic pneumonia, unspecified</td> <td><a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></td> </tr> <tr> <td>K71.4</td> <td>Toxic liver disease with chronic lobular hepatitis</td> <td><a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></td> </tr> <tr> <td>I30.0</td> <td>Acute nonspecific idiopathic pericarditis</td> <td><a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></td> </tr> <tr> <td>E70.8</td> <td>Other disorders of aromatic amino-acid metabolism</td> <td><a href="#"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></td> </tr> </tbody> </table> </div> </div> <div class="panel panel-default"> <div class="panel-heading"><h4>Tindakan</h4></div> <table class="table" width="100%"> <thead> <tr> <th width="20%"> Waktu </th> <th width="20%"> SOA </th> <th> Plan </th> <th width="20%"> Informed Consent </th> </tr> </thead> <tbody> <tr> <td data-name="datetime"> 26/Feb/15 - 10:34 </td> <td data-name="soa"> <a href="#"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Rincian SOA</a> </td> <td data-name="plan"> Corinary surgery </td> <td data-name="informedConsent"> <a href="#" data-toggle="modal" data-target="#informedConsentModal"> Belum ditandatangani </td> </tr> <tr> <td data-name="datetime"> 26/Feb/15 - 10:34 </td> <td data-name="soa"> <a href="#"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Rincian SOA</a> </td> <td data-name="plan"> Lorem ipsum </td> <td data-name="informedConsent"> <center><a href="#"><span class="glyphicon glyphicon-paperclip" aria-hidden="true"></span></a></center> </td> </tr> </tbody> </table> </div> </div> </div> <!-- Modal --> <div class="modal fade" id="informedConsentModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="myModalLabel">Informed Consent - Corinary Surgery</h4> </div> <div class="modal-body"> <p> Saya yang bertanda tangan dibawah ini: </br> </p> <p> <b>Nama</b>: Susilo Santoso </br> <b>TTL</b>: Semarang, 23 Feb 1973 </br> <b>Alamat</b>: Jl. Surakarta 23, Semarang </br> </p> <p> Bersama ini menyatakan kesediannya untuk dilakukan tindakan dan prosedur <i>Corinary Surgery</i> pada diri saya. Persetujuan ini saya berikan setelah mendapat penjelasan oleh <i>dr. Silvia Nurahman</i>. Dengan demikian terjadi kesepahaman diantara pasien dan dokter tentang upaya serta tujuan tindakan, untuk mencegah terjadinya masalah hukum dikemudian hari. </p> <p> Demikian surat persetujuan ini saya buat tanpa ada paksaan dari pihak manapun dan agar dapat dipergunakan sebagaimana mestinya. </p> <p class="text-right"> Semarang, 24 Feb 2015 13:45 </p> <form> <div class="row"> <div class="col-md-4"> <div class="form-group"> <label for="doctorSignature">Dokter</label> <textarea class="form-control" id="doctorSignature" placeholder="Tanda tangan dokter" rows="3"></textarea> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="witnessSignature">Saksi</label> <textarea class="form-control" id="witnessSignature" placeholder="Tanda tangan saksi" rows="3"></textarea> </div> </div> <div class="col-md-4"> <div class="form-group"> <label for="patientSignature">Pasien/Wali</label> <textarea class="form-control" id="patientSignature" placeholder="Tanda tangan pasien/wali" rows="3"></textarea> </div> </div> </div> </form> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Tutup</button> <button type="button" class="btn btn-primary">Simpan</button> </div> </div> </div> </div>