<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            Sistem Klinik
            <small>Rekam Medis</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Klinik</a></li>
            <li class="active">Dashboard</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content">
        <!-- Default box -->
        <div class="box">
            <div class="box-header with-border">
                <div class="box-tools pull-right">
                    <button class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
                    <button class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
                </div>
            </div>
        <?php
        $caseid = $this->uri->segment(3);
        $query = $this->db->query("select * from Cases c join CaseAdmin ca on c.[Case ID] = ca.[Case ID] where c.[Case ID] = '$caseid' ")->row_array();
        ?>
            <form onsubmit="btnSimpan.disabled = true; return true;" action="<?= base_url('Obat/prosestambahtransaksiobat/'.$query['Case ID'].'/'.$query['PatientCode']); ?>" method="POST">
                                <div class="box-body">
                                <table border='0' id="tab_logic" class="table">
                                        <tr>
                                           <b><td width='100px'>IdResep</td>
                                            <td width='200px'>Nama Obat</td>
                                            <td width='100px'>Qty</td>
                                            <td width='200px'>Aturan Pakai</td>
                                            <td width='200px'>Cara Pakai</td>
                                            <td width='200px'>Ket</td>
                                            <td width='50px'>~</td></b>
                                        </tr>
                                    </table>
                                    <input type="hidden" name="user" value="<?= $user['nama']; ?>" class="">
                                    <input type="hidden" name="idDokter" value="<?= $query['DoctorID']; ?>" class="">

                                    <div class="row" style="margin-top: 15px;">
                                        <div class="col-md-12">
                                                <button id="add_row" class="btn btn-primary btn-sm" type="button">
                                                    <i class="glyphicon glyphicon-plus"> </i> Tambah
                                                </button>
                                                <button type="submit" id="btnSimpan" class="btn btn-sm btn-success"><i class="fa fa-fw fa-save"></i> Simpan Resep</button>
                                            </div>
                                    </div>
                            </form>
                                    </div>
                                </div>
                            </section>
                        </div>
                        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
	                    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
                        <script>
                        $(document).ready(function() {
                            $('.selectpicker').on('hidden.bs.select', function(e) {
                            $('.selectpicker').selectpicker({
                                style: 'btn-info',
                                size: 4,
                                liveSearch: true
                                });
                            });

                            var i = 1;
                            var htmlOption = "<option></option>";
                            var dosisPakai = "<option></option>";
                            var caraPakai = "<option></option>";
                            var satuanPakai = "<option></option>";
                           
                            <?php foreach ($obatmodal as $ob2) { ?>
                                var obat = "<?php echo htmlspecialchars(json_encode($ob2['Description'])); ?>";
                                var kodeObat = "<?php echo $ob2['PharmacyCode']; ?>";
                                htmlOption += "<option value='" + kodeObat + "'" + " >" + obat + "</option>"
                            <?php } ?>

                            <?php foreach ($aturan as $Dosis) { ?>
                                var dosisData = "<?php echo $Dosis['AturanPakai']; ?>";
                                dosisPakai += "<option value='" + dosisData + "'" + " >" + dosisData + "</option>"
                            <?php } ?>

                            <?php foreach ($caraPakai as $cara) { ?>
                                var caraPakaiData = replaceSpecialCharacter("<?php echo htmlspecialchars(json_encode(($cara['CaraPakai']))); ?>");
                                caraPakai += "<option value='" + caraPakaiData + "'" + " >" + caraPakaiData + "</option>"
                            <?php } ?>

                            $("#add_row").click(function() {
                                $('#tab_logic').append('<tr  id="addr' + i + '"></tr>');
                                $('#addr' + i).html(
                                    "<td width='100px' align='center'><input required name='id[]' type='text' Value='#ID' disabled class='form-control input-md'/></td>" +
                                    "<td align='center' width='200px'><select required style='width:500px' class='selectpicker' data-live-search='true' name = 'kodeObat'>" +
                                    htmlOption +
                                    "</select></td>" +
                                    "<td width='100px' align='center'><input required name='qty[]' type='text' placeholder='qty' class='form-control input-md'/></td>" +
                                    "<td width='200px' align='center'><select required class='selectpicker' data-live-search='true' name = 'dosisPakai[]'>" +
                                    dosisPakai +
                                    "</select></td>" +
                                    "<td width='200px' align='center'><select required class='selectpicker' data-live-search='true' name = 'caraPakai[]'>" +
                                    caraPakai +
                                    "</select></td>" +
                                    "<td width='200px'  align='center'><input  name='keterangan[]' type='text' placeholder='keterangan' class='form-control input-md'/></td>" +
                                    '<td width="50px" align="center" ><button id="btnDelete" type=\"button\" style=\"font-size:9px;\"  class=\"btn btn-danger btn-sm btnDelete\">' + ' <i class="fa fa-fw fa-remove"></> ' + '</button></td>');
                                $('.selectpicker').selectpicker('refresh');
                                i++;
                            });

                        });

                        $(document).ready(function() {
                            $("#tab_logic").on('click', '.btnDelete', function() {
                                $(this).closest('tr').remove();
                            });
                        });

                        function escapeHTML(html) {
                            return document.createElement('div').appendChild(document.createTextNode(html)).parentNode.innerHTML;
                        }

                        function replaceSpecialCharacter(text) {
                            //text = text.replace('/', "&sol;");
                            //text = text.replace(',', "&sbquo;");
                            //text = text.replace(' ', "&nbsp;");
                            //text = text.replace("'", "'");
                            //text = text.replace('/\n|<br\s*\/?>/gi', "")
                            return text;
                        }
                        </script>
