{% extends '@RxConnexion/Admin/global.html.twig' %}
{% block body %}
    <form method="GET" action="{{ path('patient_encounter_call') }}">
        <div class="large-8 columns">
            <div style="width: 100%;">
                <div style="width: 50%; float: left;">
                    <div class="input-group">
                        <label class="input-group-label">Branch</label>
                        <select class="js-multiple"  name="branch[]" multiple size="6">
                            <option value='All'>All</option>
                            {% for h in healthFacilities %}
                                <option value={{ h.id }} {{ h.id == branch ? 'selected' : '' }}>{{ h.description }}</option>
                            {% endfor %}
                        </select>
                    </div>
                </div>
                <div style="width: 49%; float: right;">
                    <div class="input-group">
                        <label class="input-group-label" style="font-size: 12px;">Encounter Type</label>
                        <select class="js-multiple-encounter" name="encounterTypes[]" multiple size="6">
                            <option value='All'>All</option>
                            {% for ct in encounterTypes %}
                                <option value={{ ct.id }}>{{ ct.description }}</option>
                            {% endfor %}
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <div class="large-2 columns">
            <label>Date From</label>
            <input type="text" class="date" name="date_from" value="{{ 'now'| date_modify('first day of this month') | date('m-d-Y') }}" />
            <label>Date To</label>
            <input type="text" class="date" name="date_to" value="{{ 'now'|date('m/d/Y') }}" />
        </div>
        <div class="large-2 columns">
            <button type="submit" class="button just-continue" value=""
                    data-message="Are you sure you want to save this information?"
            >Apply filter</button>
            <a href="{{ path('patient_encounter_call') }}" class="button just-continue" value=""
                    data-message="Are you sure you want to save this information?"
            >Reset filter</a>
        </div>
    </form>
    <div class="large-12 columns">
        <h5 class="report-header">{{ page_title }}</h5>
    </div>
    <div class="large-12 columns">
        <table class="report-data" width="100%" id="reminderCall">
        <thead class="header">
            <tr>
                <th>Branch</th>
                <th>Branch Address</th>
                <th>Branch Phone No.</th>
                <th>Schedule Date</th>
                <th>Patient</th>
                <th>PHN</th>
                <th>Phone No(s)</th>
                <th>Clinician</th>
                <th>Referring Physician</th>
                <th>Encounter Type</th>
                <th>Encounter Status</th>
                <th>Start Time</th>
                <th>End Time</th>
                <th>Latest Note</th>
                <th>Action</th>
            </tr>
            </thead>
            <tbody>
            {% set totalRecord = 0 %}
            {% for record in records %}
                {% set totalRecord = totalRecord + 1 %}
                {#<tr>#}
                    {#<td>{{ record.hfDesc }}</td>#}
                    {#<td>{{ record.patientChartId }}</td>#}
                    {#<td style="color: {{ record.noteInterval == 'red' or record.note|raw == '' ? 'red' : '' }}">{{ record.fullName }}</td>#}
                    {#<td>{{ record.accountUser }}</td>#}
                    {#<td><a href="{{ path('patient_chart_form', {patient_id : record.patientId|base64Encode, action : 'u', id: record.patientChartId|base64Encode}) }}" target="_blank">{{ record.chartDate }}</a></td>#}
                    {#<td>{{ record.note|raw }}</td>#}
                    {#<td><a class="href-update-form" data-action="u" data-id="{{ record.patientChartId }}">Update</a></td>#}
                {#</tr>#}

                <tr>
                    <td>{{ record.healthFacility }}</td>
                    <td>{{ record.healthFacilityAddress }}</td>
                    <td>{{ record.healthFacilityPhoneNo }}</td>
                    <td>{{ record.scheduleDate }}</td>
                    <td><a href="{{ path('patient_detail', {patient_id : record.patientId|base64Encode}) }}" target="_blank">{{ record.fullName }}</td>
                    <td>{{ record.phn }}</td>
                    <td>{{ record.phoneNoTwo ? record.phoneNoOne~', '~record.phoneNoTwo : record.phoneNoOne }}</td>
                    <td>{{ record.clinician }}</td>
                    <td>{{ record.referringProvider }}</td>
                    <td>{{ record.chartType }}</td>
                    <td>{{ record.chartStatus }}</td>
                    <td>{{ record.start_time }}</td>
                    <td>{{ record.end_time }}</td>
                    <td>{{ record.note }}</td>
                    <td><a class="href-update-form" data-action="u" data-id="{{ record.patientChartId }}">Update</a></td>
                </tr>
            {% endfor %}
            <tr>
                <td colspan="6">Total: {{ totalRecord }}</td>
            </tr>
        </table>
    </div>
    <div class="reveal" id="modal-small" data-reveal>
        <div id="modal-content" style="padding: 10px;"></div>
        <button class="close-button" data-close aria-label="Close modal" type="button">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>
    {% include '@RxConnexion/Admin/js.html.twig' %}
    <script>

        //<![CDATA[
        var dashboard_report = {
            settings: {
                updateFormUrl: null,
                saveUrl: null,
            },
            init: function() {
                jQ('.js-multiple, .js-multiple-encounter').select2();
                dashboard_report.bindUpdateForm();
                jQ('#reminderCall').tablesorter({widgets:['zebra']});
                setTimeout(function(){
                    jQ('.compatibility').tablesorter();
                    jQ('table.options, table.api').tablesorter({widgets:['stickyHeaders']});
                }, 1000);

            },
            bindUpdateForm: function() {
                if(jQ('.href-update-form').length > 0) {

                    jQ('.href-update-form').unbind('click').bind('click', function(){

                        var requestName = 'patientChartReportStatus',
                            modal = jQ('#modal-small'),
                            modalContent = jQ('#modal-content');

                        global.ajaxCancel(requestName);

                        var settings = {
                            url: dashboard_report.settings.updateFormUrl + '/' + jQ(this).data('action') + '/' + jQ(this).data('id'),
                            type: 'GET',
                            beforeSend: function() {
                                modalContent.html('').addClass('has-loading');
                                modal.foundation('open');
                            },
                            success: function(json) {
                                modal.foundation('close');
                                modalContent.removeClass('has-loading').html(json.html);
                                modal.foundation('open');
                                global.bindFormSubmitted();
                                dashboard_report.bindUpdateFormAction()
                            }
                        };

                        global.ajax(settings, requestName);
                    });
                }
            },
            bindUpdateFormAction: function() {
                jQ('.href-update-is-done-action').unbind('click').bind('click', function () {
                    var requestName = 'patientChartReportStatusFormAction',
                        _form = jQ('#form-patient_chart_update_is_done'),
                        modal = jQ('#modal-small'),
                        axn = jQ(this).data('axn');
                    _form.find('.form-action').val(axn);

                    global.formSubmitted();
                    global.ajaxCancel(requestName);

                    var settings = {
                        url: dashboard_report.settings.saveUrl,
                        type: 'POST',
                        data: _form.serialize(),
                        success: function (json) {
                            if (json.success) {
                                location.reload();
                                // modal.foundation('close');
                                // global.parseFlashMessages(global.settings.vars.flashMessagesContentId, 'success', json.successMessages);
                            } else {
                                global.formSubmittedReverse();
                                global.parseFlashMessages('#flash-messages-content-modal', 'alert', json.errorMessages);
                            }
                        }
                    };

                    global.ajax(settings, requestName);
                });
            },
        };
        dashboard_report.settings.updateFormUrl = '{{ path("patient_chart_update_is_done") }}';
        dashboard_report.settings.saveUrl = '{{ path("patient_chart_update_is_done_save") }}';
        dashboard_report.init();
        //]]>
    </script>
{% endblock %}