{% extends 'basic.html' %}
{% load humanize i18n static %}
{% block title %}
Siapkan Kasir
{% endblock %}
{% block head %}
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/css/bootstrap-select.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/js/bootstrap-select.js"></script>
<!-- MODAL PACKAGE -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
{% endblock %}
{% block content %}
{% language 'en-US' %}
<main class="h-100">
    {% include "header.html" %}
    <!-- main page content -->
    <div class="main-container container">
        <!--card pelayanan-->
        <div class="row mb-2">
            {% for x in messages %}
            <button class="btn btn-primary col-lg-12">{{ x }}</button>
            {% endfor %}
        </div>
        <div class="container-fluid">
            <div class="row g-5">
                <div class="card">
                    <div class="col-md-12">
                        <br>
<!--                    <h4 class="mt-3"><a href="" onclick="confirm('Apakah anda yakin?');">Siapkan Kasir</a></h4>-->
                        {% include 'pembayaran/siapkankasir/data-pasien.html' %}
                        <hr class="my-3 text-primary">
                        <!-- nav start  -->
                        <div class="row">
                            <div class="col">
                                <div class="card mr-1">
                                    <div class="card-body">
                                        <div style="display: flex;justify-content: space-between;">
                                            <div class="card-header">Pembayaran untuk pasien</div>
                                            <div>
                                                <button type="button" data-toggle="modal" data-target="#mdInvoice" class="btn btn-success text-light" data-id="{{ semuapendaftaran.id }}" onclick="getInvoicePembayaran({{ semuapendaftaran.id }})">Cetak Invoice</button>
                                            </div>
                                            <!-- Modal -->
                                            <div class="modal fade" id="mdInvoice" tabindex="-1" role="dialog" aria-labelledby="mdInvoiceLabel" aria-hidden="true">
                                                <div class="modal-dialog" style="max-width: 40%" role="document">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                        <h5 class="modal-title" id="mdInvoice">Cetak Invoice Pembayaran</h5>
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                        </div>
                                                        <div class="modal-body">

                                                        </div>
                                                        <!-- Modal Footer -->
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-secondary btn-sm" onclick="cetak()">Cetak</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>  
                                        </div>
<!-- 
                        <a href="#" class="btn btn-success text-light"
                           onclick="window.open('/pembayaran/cetakpembayaran/{{ semuapendaftaran.id }}/','mywindow','location=1,status=1,scrollbars=1,width=500px,height=380px');">Cetak Pembayaran</a> -->
                                        <div class="row mt-4 mb-4">
                                            <div class="col">
                                                <div class="table-responsive">
                                                    <table class="table table-bordered">
                                                        {% if invoicebed %}
                                                        <thead>                                              
                                                        <tr>
                                                            <th class="text-center">#</th>
                                                            <th class="text-center">Nama</th>
                                                            <th class="text-center">Harga</th>
                                                            <th class="text-center">Tanggal Masuk</th>
                                                            <th class="text-center">Jumlah</th>
                                                            <th class="text-center">Kamar</th>
                                                            <th class="text-center">Dibayar</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody>
                                                        {% for y in invoicebed %}
                                                        <tr>
                                                            <td>{{ forloop.counter }}
                                                            </td>
                                                            <td>{{ y.kamar.nama }}</td>
                                                            <td>{{ y.kamar.harga }}</td>
                                                            <td>{{ y.tanggal_masuk }}</td>
                                                            <td>{{ y.kamar.harga|intcomma }}</td>
                                                            <td>{{ y.nama }} {{ y.kamar.nama }}</td>
                                                            <td>{{ y.is_dibayar }}</td>
                                                        </tr>
                                                        {% endfor %}
                                                        <tr>
                                                            <td colspan="4">TOTAL BED</td>
                                                            <td colspan="4"><b>Rp. {{ summaryinvoicebed|intcomma }}</b></td>
                                                        </tr>
                                                        </tbody>
                                                        {% endif %}
                                                        {% if invoicebarang %}
                                                            {% if info_dasar_faskes.is_paket == 1 %}
                                                                <thead>
                                                                    <tr>
                                                                        <th class="text-center">#</th>
                                                                        <th>Nama Barang</th>
                                                                        <th>Harga</th>
                                                                        <th>Kuantitas</th>
                                                                        <th>Diskon</th>
                                                                        <th>Cara Pakai</th>
                                                                        <th class="text-center">Status</th>
                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                {% for y in invoicebarang %}
                                                                <tr>
                                                                    <td>{{ forloop.counter }}
                                                                    </td>
                                                                    <td>{{ y.barang.nama }}</td>
                                                                    {% with rowspan_value=invoicebarang|length %}
                                                                        {% if forloop.first %}
                                                                            <td class="harga-jual" style="text-align: center; vertical-align: middle;" rowspan="{{ rowspan_value }}"><span id="paket" class="btn btn-info btn-sm" style="text-transform: capitalize;color: #fff;display: flex;justify-content: center;">{{info_paket}}</span>{{harga_paket|intcomma}}</td>
                                                                        {% endif %}
                                                                    {% endwith %}
                                                                    <td class="text-center">{{ y.kuantitas|floatformat|default:"0" }}</td>
                                                                    <td>{% if y.diskon_pembelian == "0" %}0 %{% else %}{% if y.tipe_diskon != "%" %}-{%endif%}{{ y.diskon_layanan|floatformat:0|intcomma }} {% if y.tipe_diskon == "%" %}%{%endif%}{%endif%}</td>
                                                                    <!-- ( x.biaya harga / 1 ) * x.kuantitas -->
                                                                    <td>{{ y.catatan }}</td>
                                                                    {% with rowspan_value=invoicebarang|length %}
                                                                        {% if forloop.first %}
                                                                            <td rowspan="{{ rowspan_value }}" style="text-align: center; vertical-align: middle;">
                                                                                {% if y.is_dibayar == False %}
                                                                                    <span id="paket" style="color: red">Belum Bayar</span>
                                                                                {% else %}
                                                                                    <span id="paket" style="color: #3ac79b">Dibayar</span>
                                                                                {% endif %}
                                                                            </td>
                                                                        {% endif %}
                                                                    {% endwith %}
                                                                </tr>
                                                                {% endfor %}
                                                                <tr>
                                                                    <td colspan="4" style="text-align: right;"><b>SUB TOTAL</b></td>
                                                                    <td colspan="4">
                                                                        Rp {{ harga_paket|intcomma }}
                                                                    </td>
                                                                </tr>
                                                                </tbody>
                                                            {% else %}
                                                            <thead>
                                                                <tr>
                                                                    <th class="text-center">#</th>
                                                                    <th>Nama</th>
                                                                    <th>Harga</th>
                                                                    <th>Kuantitas</th>
                                                                    <th>Diskon</th>
                                                                    <th>Jumlah</th>
                                                                    <th class="text-center">Status</th>
                                                                </tr>
                                                                </thead>
                                                                <tbody>
                                                                {% for y in invoicebarang %}
                                                                <tr>
                                                                    <td>{{ forloop.counter }}
                                                                    </td>
                                                                    <td>{{ y.barang.nama }}</td>
                                                                    <td>{{ y.barang.harga_jual|floatformat:0|intcomma }}</td>
                                                                    <td>{{ y.kuantitas|floatformat|default:"0" }}</td>
                                                                    <td>{% if y.diskon_pembelian == "0" %}0 %{% else %}{% if y.tipe_diskon != "%" %}-{%endif%}{{ y.diskon_layanan|floatformat:0|intcomma }} {% if y.tipe_diskon == "%" %}%{%endif%}{%endif%}</td>
                                                                    <!-- ( x.biaya harga / 1 ) * x.kuantitas -->
                                                                    <td>{{ y.total_harga|floatformat:0|intcomma }}</td>
                                                                    <!-- <td>{{ y.catatan }}</td> -->
                                                                    <td class="text-center">
                                                                        {% if y.is_dibayar == False %}
                                                                            <span id="paket" style="color: red">Belum Bayar</span>
                                                                        {% else %}
                                                                            <span id="paket" style="color: #3ac79b">Dibayar</span>
                                                                        {% endif %}
                                                                    </td>
                                                                </tr>
                                                                {% endfor %}
                                                                <tr>
                                                                    <td colspan="4" style="text-align: right;"><b>TOTAL BARANG</b></td>
                                                                    <td colspan="4"><b>Rp {{ summaryinvoicebarang|floatformat:0|intcomma }}</b></td>
                                                                </tr>
                                                                </tbody>
                                                            {% endif %}
                                                        {% endif %}
                                                        {% if invoicelayanan %}
                                                        <thead>
                                                        <tr>
                                                            <th class="text-center">#</th>
                                                            <th>Nama Layanan</th>
                                                            <th>Harga</th>
                                                            <th>Kuantitas</th>
                                                            <th>Diskon</th>
                                                            <th>Jumlah</th>
                                                            <th colspan="2" class="text-center">Status</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody id="table-pelayanan">
                                                        {% for x in invoicelayanan %}
                                                        <tr>
                                                            <td>{{ forloop.counter }}</td>
                                                            <td>{{ x.tarif_layanan.nama }}</td>
                                                            <td><span id="tarif_layanan">{{ x.tarif_layanan.harga|floatformat:0|intcomma }}</span></td>
                                                            <td>{{ x.kuantitas|floatformat|default:"0" }}</td>
                                                            <td>{% if x.diskon_pembelian == "0" %}0 %{% else %}{% if x.tipe_diskon != "%" %}-{%endif%}{{ x.diskon_layanan|floatformat:0|intcomma }} {% if x.tipe_diskon == "%" %}%{%endif%}{%endif%}</td>
                                                            <td>{{ x.total_harga|floatformat:0|intcomma }}</td>
                                                            <td colspan="2" class="text-center">
                                                                {% if x.is_dibayar == False %}
                                                                    <span id="paket" style="color: red">Belum Bayar</span>
                                                                {% else %}
                                                                    <span id="paket" style="color: #3ac79b">Dibayar</span>
                                                                {% endif %}
                                                            </td>
                                                        </tr>
                                                    {% endfor %}
                                                        <tr>
                                                            <td colspan="4" style="text-align: right;"><b>TOTAL LAYANAN</b></td>
                                                            <td colspan="4"><b>Rp {{ summaryinvoicelayanan|floatformat:"0"|intcomma }}</b></td>
                                                        </tr>
                                                        {% endif %}
                                                        {% if invoicelab %}
                                                        <thead>
                                                        <tr>
                                                            <th class="text-center">#</th>
                                                            <th>Nama Layanan Lab</th>
                                                            <th>Harga</th>
                                                            <th>Kuantitas</th>
                                                            <th>Diskon</th>
                                                            <th>Jumlah</th>
                                                            <th colspan="2" class="text-center">Dibayar</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody id="table-pelayanan-lab">
                                                        {% for x in invoicelab %}
                                                        <tr>
                                                            <td>{{ forloop.counter }}</td>
                                                            <td>{{ x.tarif_lab.nama }}</td>
                                                            <td><span id="tarif_lab">{{ x.tarif_lab.harga|floatformat:0|intcomma }}</span></td>
                                                            <td>{{ x.kuantitas|floatformat|default:"0" }}</td>
                                                            <td>{% if x.diskon_pembelian == "0" %}0 %{% else %}{% if x.tipe_diskon != "%" %}-{%endif%}{{ x.diskon_layanan|floatformat:0|intcomma }} {% if x.tipe_diskon == "%" %}%{%endif%}{%endif%}</td>
                                                            <td>{{ x.total_harga|floatformat:0|intcomma }}</td>
                                                            <td colspan="2" class="text-center">
                                                                {% if x.is_dibayar == False %}
                                                                    <span id="paket" style="color: red">Belum Bayar</span>
                                                                {% else %}
                                                                    <span id="paket" style="color: #3ac79b">Dibayar</span>
                                                                {% endif %}
                                                            </td>
                                                        </tr>
                                                        {% endfor %}
                                                        <tr>
                                                            <td colspan="4" style="text-align: right;"><b>TOTAL LAYANAN LAB</b></td>
                                                            <td colspan="4"><b>Rp {{ summaryinvoicelab|floatformat:0|intcomma }}</b></td>
                                                        </tr>
                                                        {% endif %}
                                                        <tr>
                                                            <td colspan="4" style="text-align: right;"><b>Administrasi Pendaftaran</b></td>
                                                            <td colspan="4" class="text-center"><b>
                                                                {% if semuapendaftaran.is_new_pasien == True %}
                                                                    Rp {{ info_dasar_faskes.fee_new_pasien|floatformat:0|intcomma }}
                                                                {% else %}
                                                                    Rp {{ info_dasar_faskes.fee_old_pasien|floatformat:0|intcomma }}
                                                                {% endif %}
                                                            </b></td>
                                                        </tr>
                                                        <tr>
                                                            <td colspan="4" style="text-align: right;"><b>TOTAL KESELURUHAN</b></td>
                                                            <td colspan="4" class="text-center"><b>Rp {{ allsummary|floatformat:0|intcomma }}</b></td>
                                                        </tr>
                                                        {% if is_voucher %}
                                                        <tr>
                                                            <td colspan="4" style="text-align: right;"><b>VOUCHER DISKON</b></td>
                                                            <td colspan="4" class="text-center"><b>Rp - {{ potongan|floatformat:0|intcomma }}</b></td>
                                                        </tr>
                                                        {% endif %}
                                                        <tr>
                                                            <td colspan="4" style="text-align: right;"><b>UANG PASIEN</b></td>
                                                            <td colspan="4" class="text-center"><b>Rp {{ pembayaranselesai.uang_pasien|floatformat:0|intcomma }}</b></td>
                                                        </tr>
                                                        <tr>
                                                            <td colspan="4" style="text-align: right;"><b>KEMBALIAN</b></td>
                                                            <td colspan="4" class="text-center"><b>Rp {{ pembayaranselesai.kembalian|floatformat:0|intcomma }}</b></td>
                                                        </tr>
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                            <div class="col">
                            <form method="POST" action="/pembayaran/pasienbayarselesai/{{ semuapendaftaran.id }}/" class="row mt-4 mb-3">
                                {% csrf_token %}
                                <div class="col-6 form-group">
                                    <label style="margin-bottom: 10px;">Keadaan Pasien Keluar {{ pembayaranselesai.keadaan_keluar }}</label>
                                <input type="text" name="keadaan_keluar" class="form-control"></div>
                                <div class="col-6 form-group">
                                    <label for="voucher">Gunakan Voucher</label>
                                    <div style="display: flex;">
                                        <input {% if is_voucher %}readonly{%endif%} type="text" name="voucher" id="voucher" class="form-control" style="border-top-right-radius: 0px;border-bottom-right-radius: 0px;" oninput="updateValue(this)" value="{{voucher_code}}">
                                        {% if not is_voucher %}
                                            <button class="btn btn-success text-light" style="border-top-left-radius: 0px;border-bottom-left-radius: 0px;" type="button" onclick="checkVoucher({{ semuapendaftaran.id }})">GUNAKAN</button>
                                        {% else %}
                                            <button class="btn btn-danger text-light" style="border-top-left-radius: 0px;border-bottom-left-radius: 0px;" type="button" onclick="hapusVoucher({{ semuapendaftaran.id }})">HAPUS VOUCHER</button>
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="form-group col-6">
                                    <label>Uang Pasien {{ pembayaranselesai.uang_pasien|floatformat:0|intcomma }}</label>
                                    <div style="display: flex;">
                                        <input type="text" name="uang_pasien" class="form-control" style="border-top-right-radius: 0px;border-bottom-right-radius: 0px;" required oninvalid="this.setCustomValidity('Harap menginputkan uang pasien')" oninput="this.setCustomValidity('')">
                                        <input type="hidden" id="tipe_metode_{{x.id}}" value="lunas">
                                        <input type="hidden" id="is_dp_{{x.id}}" name="is_dp" value="{% if pembayaranselesai.is_dp == 1 %}True{% else %}False{% endif %}">
                                        <button class="btn btn-success text-light" style="width: 100px;border-top-left-radius: 0px;border-bottom-left-radius: 0px;" type="button" id="show_tipe_{{x.id}}" onclick="editMetode('{{x.id}}')">{% if pembayaranselesai.is_dp == 1 %}DP{% else %}LUNAS{% endif %}</button>
                                    </div>
                                </div>  
                                <div class="form-group col-6">
                                    <label>Total Harus Bayar</label>
                                    <h4>Rp <span style="{% if is_voucher %}font-style:italic;text-decoration: line-through;{%endif%}" id="total_bayar">{{ allsummary|floatformat:0|intcomma }}</span> {% if is_voucher %}&nbsp; <span id="harga_diskon">{{ total_bayar|floatformat:0|intcomma }}</span> {%endif%}</h4></div>
                                <div class="form-group col-6">
                                    <label>Kembalian</label>
                                    <h4>Rp {{ pembayaranselesai.kembalian|floatformat:0|intcomma }}</h4>
                                </div>


                                <div class="form-group col-12">
                                    <button class="btn btn-success" type="submit" style="width: 100%;">SUBMIT</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {% include 'footer.html' %}
</main>
<!-- <script src="//code.jquery.com/jquery-1.12.4.js"></script> -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
<script>
    function editMetode(id) {
        var tipe = $('#tipe_metode_' + id).val();
        var is_dp_value = (tipe === "lunas") ? 'True' : 'False';//Baris ini adalah ekspresi ternary, yang merupakan singkat dari if...else statement.
        $('#is_dp_' + id).val(is_dp_value);

        if (tipe === "lunas") {
            $('#tipe_metode_' + id).val('dp');
            $('#show_tipe_' + id).text('DP');
        } else {
            $('#tipe_metode_' + id).val('lunas');
            $('#show_tipe_' + id).text('LUNAS');
        }
    }
    function updateValue(inputElement) {
        inputElement.setAttribute('value', inputElement.value);
    }
    function checkVoucher(idPendaftaran){
        var csrftoken = $("[name=csrfmiddlewaretoken]").val();
        var voucherCode = $('#voucher').val()
        $.ajax({
            url: '/promotion/check_voucher',
            type: 'POST',
            headers: {
                'X-CSRFToken': csrftoken  // Get the CSRF token from a cookie
            },
            data: {
                code: voucherCode,
                id: idPendaftaran
            },
            success: function(data) {
                if(data.status_code == 400){
                    Swal.fire({
                        title: 'Error!',
                        text: data.msg,
                        icon: 'error',
                        confirmButtonText: 'OK'
                    });
                } else {
                    window.location.reload()
                }
            },
            error: function(error) {
            console.error('Error:', error);
            }
        });
    }

    function hapusVoucher(idPendaftaran){
        var csrftoken = $("[name=csrfmiddlewaretoken]").val();
        $.ajax({
            url: '/promotion/hapus_voucher',
            type: 'POST',
            headers: {
                'X-CSRFToken': csrftoken  // Get the CSRF token from a cookie
            },
            data: {
                id: idPendaftaran
            },
            success: function(data) {
                window.location.reload()
            },
            error: function(error) {
            console.error('Error:', error);
            }
        });
    }
    function cetak() {
        var printContents = document.getElementById("printInvoice").innerHTML;
        var iframe = document.createElement('iframe');
        iframe.style.display = 'none';
        document.body.appendChild(iframe);
        
        // Get the iframe's document
        var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
        
        // Write your print contents to the iframe's document
        iframeDoc.write(printContents);
        iframeDoc.close();
        
        // Trigger the print action
        iframe.contentWindow.print();
        
        // Remove the iframe when done
        iframe.onload = function () {
        document.body.removeChild(iframe);
        };
    }
    function fakeProgressBarAnimation() {
        var progressBar = document.getElementById('progress-bar');
        var currentValue = parseInt(progressBar.getAttribute('aria-valuenow'), 10);

        // Increment the progress value
        if (currentValue < 100) {
            currentValue += 10; // You can adjust the increment value as needed
            progressBar.setAttribute('aria-valuenow', currentValue);
            progressBar.style.width = currentValue + '%';
            progressBar.textContent = currentValue + '%';

            // Call the function again after a delay (simulating animation frames)
            setTimeout(fakeProgressBarAnimation, 500); // Adjust the delay as needed
        }
    }
    function getInvoicePembayaran(id){
        console.log("anjay")
        $('#mdInvoice .modal-body').html(`<div class="progress">
        <div id="progress-bar" class="progress-bar progress-bar-striped active" role="progressbar"
            aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width:0%">
            0%
        </div>
        </div>`)
        fakeProgressBarAnimation();
        $.ajax({
            url: '/pembayaran/cetakpembayaran/' + id,
            type: 'GET',
            success: function(data) {
                // Display the HTML content in the modal
                $('#mdInvoice .modal-body').html(data);
            },
            error: function(error) {
            console.error('Error:', error);
            }
        });
    }
</script>

{% endlanguage %}
{% endblock %}