{% set userData = app.session.get('userData') %}
<form method="POST" id="form-scheduleCalendar">
    <h5>{{ page_title }}</h5>
    <div id="flash-messages-content-modal"></div>
    <div class="content-detail-container" style="border:none!important;">
        <div class="row max-width-initial">
            <div class="large-12 columns">
                <div class="patient-detalye">
                    <div class="content-detail-container" style="border:none!important;">
                        <div class="row max-width-initial">
                            <div class="large-4 columns" id="patient-autocomplete-detail">
                                <div id="patient-detail"><h5 class="{{ action != 'u' ? 'hide' : '' }}">Patient Details</h5></div>
                                {#<div class="page-detail" id="patient-detail-id"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>ID:</strong> {{ schedule.patient.id|default('') }}</span></div>#}
                                {% if action == 'u' %}
                                    <div class="page-detail" id="patient-detail-name"><span><strong>Full Name:</strong><a href="{{ path('patient_detail', {'patient_id': schedule.patient.id|base64Encode}) }}" target="_blank"> {{ schedule.patient.fullName|default('') }}</a></span></div>
                                {% else %}
                                    <div class="page-detail" id="patient-detail-name"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Full Name:</strong><a href="javascript:void(0)"> {{ schedule.patient.fullName|default('') }}</a></span></div>
                                {% endif %}
                                <div class="page-detail" id="patient-detail-birthDate"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Birth Date:</strong> {{ schedule.patient.birthDateAsString|default('') }}</span></div>
                                <div class="page-detail" id="patient-detail-address"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Address:</strong> {{ schedule.patient.address|default('') }}</span></div>
                                <div class="page-detail" id="patient-detail-phn"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>PHN:</strong> {{ schedule.patient.personalHealthNo|default('') }}</span></div>
                                <div class="page-detail" id="patient-detail-mobile"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Mobile No(s):</strong> {{ schedule.patient.concatenatedMobileNo|default('') }}</span></div>
                                <div class="page-detail" id="patient-detail-phone"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Phone No(s):</strong> {{ schedule.patient.concatenatedPhoneNo|default('') }}</span></div>
                                <div class="page-detail" id="patient-detail-insurance"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Insurance(s):</strong> {{ schedule.patient.concatenatedPatientInsurance|default('') }}</span></div>
                            </div>
                            <div class="large-4 columns">
                                <div id="chart-latest"><h5 class="{{ action != 'u' ? 'hide' : '' }}">Latest Chart</h5></div>
                                <div class="page-detail" id="chart-detail-provider"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Clinician:</strong> {{ latestChartDetails.provider|default('') }}</span></div>
                                <div class="page-detail" id="chart-detail-health-facility"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Branch:</strong> {{ latestChartDetails.healthFacility|default('') }}</span></div>
                                <div class="page-detail" id="chart-detail-chart-type"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Chart Type:</strong> {{ latestChartDetails.chartType|default('') }}</div>
                                <div class="page-detail" id="chart-detail-chart-status"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Chart Status:</strong> {{ latestChartDetails.chartStatus|default('') }}</div>
                                <div class="page-detail" id="chart-detail-chart-date"><span class="{{ action != 'u' ? 'hide' : '' }}"><strong>Chart Date:</strong> {{ latestChartDetails.chartDate|default('') }}</div>
                            </div>
                            <div class="large-4 columns" id="branch-details">
                                <div><h5>Branch Details</h5></div>
                                <div class="page-detail" id="branch-detail-address"><span><strong>Address:</strong> {{ healthFacility.address|default('') }}</span></div>
                                <div class="page-detail" id="branch-detail-mobileNos"><span><strong>Fax No(s):</strong> {{ healthFacility.concatenatedMobileNo|default('') }}</span></div>
                                <div class="page-detail" id="branch-detail-phoneNos"><span><strong>Phone No(s):</strong> {{ healthFacility.concatenatedPhoneNo|default('') }}</span></div>
                                <a id="view-details">View Details</a>
                                <table width="100%" id="distance-table" class="hide">
                                    {#{% if schedule.patient.geoLat|default('') != '' and schedule.patient.geoLong|default('') != '' %}
                                    <thead>
                                        <th>Branch</th>
                                        <th nowrap>Distance</th>
                                        <th>Duration</th>
                                    </thead>
                                    {% endif %}#}
                                    <tbody id="tbody-distance-table">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="city-warning" class="callout warning" style="display: none;"><i class="fa fa-warning"></i> WARNING: Patient is located at a different city.</div>
    <div class="row max-width-initial">
        <div class="large-4 columns">
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    {{ form_label(form.patient_fullName) }}
                </div>
                <div class="large-9 columns">
                    {{ form_widget(form.patient_fullName) }}
                    {{ form_widget(form.patient) }}
                </div>
            </div>
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    {{ form_label(form.health_facility_desc) }}
                </div>
                <div class="large-9 columns">
                    {{ form_widget(form.health_facility_desc) }}
                    {{ form_widget(form.health_facility) }}
                </div>
            </div>
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    {{ form_label(form.provider_fullName) }}
                </div>
                <div class="large-9 columns">
                    {{ form_widget(form.provider_fullName) }}
                    {{ form_widget(form.provider) }}
                </div>
            </div>
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    {{ form_label(form.schedule_status) }}
                </div>
                <div class="large-9 columns">
                    {{ form_widget(form.schedule_status) }}
                </div>
            </div>
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    {{ form_label(form.chart_type) }}
                </div>
                <div class="large-9 columns">
                    {{ form_widget(form.chart_type) }}
                </div>
            </div>
            {% if action == 'u' %}
                <div class="row large-text-center">
                    <div class="large-3 large-text-right columns">
                        <label>Last Updated </label>
                    </div>
                    <div class="large-9 columns" style="text-align: left">
                        {{ schedule.updatedAt|date('m/d/Y') }} ( {{ schedule.updatedBy }} )
                    </div>
                </div>
            {% endif %}
            {% if action == 'u' %}
                <div class="row large-text-center">
                    <div class="large-3 large-text-right columns">
                        <label>Created By </label>
                    </div>
                    <div class="large-9 columns" style="text-align: left">
                        {{ schedule.createdAt|date('m/d/Y') }} ( {{ schedule.createdBy }} )
                    </div>
                </div>
            {% endif %}
            {#{% if action == 'u' %}#}
                {#<div class="row large-text-center">#}
                    {#<div class="large-3 large-text-right columns">#}
                        {#<label>Created </label>#}
                    {#</div>#}
                    {#<div class="large-9 columns" style="text-align: left">#}
                        {#{{ schedule.createdAt|date('m/d/Y') }} ( {{ schedule.createdAt }} )#}
                    {#</div>#}
                {#</div>#}
            {#{% endif %}#}
        </div>
        <div class="large-4 columns">
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    <label class="required">Schedule Date</label>
                </div>
                <div class="large-9 columns">
                    {{ form_widget(form.schedule_date) }}
                </div>
            </div>
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    <label class="required">Start Time</label>
                </div>
                <div class="large-3 columns">
                    {{ form_widget(form.start_time_hour) }}
                </div>
                <div class="large-3 columns">
                    {{ form_widget(form.start_time_minute) }}
                </div>
                <div class="large-3 columns">
                    {{ form_widget(form.start_time_period) }}
                </div>
            </div>
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    <label class="required">End Time</label>
                </div>
                <div class="large-3 columns">
                    {{ form_widget(form.end_time_hour) }}
                </div>
                <div class="large-3 columns">
                    {{ form_widget(form.end_time_minute) }}
                </div>
                <div class="large-3 columns">
                    {{ form_widget(form.end_time_period) }}
                </div>
            </div>
            <div class="row large-text-center">
                <div class="large-3 large-text-right columns">
                    {{ form_label(form.note) }}
                </div>
                <div class="large-9 columns">
                    {{ form_widget(form.note) }}
                </div>
            </div>
        </div>
        <div class="large-4 columns">
            <div id="map-canvas"></div>
        </div>
    </div>
    <hr>
    <div class="row-max-width-initial">
        <div class="small-12 columns no-padding-right">
            <div class="button-container clearfix text-right">
                <a href="javascript:void(0)" class="button just-continue href-schedule-calendar-action {{ action == 'u' ? 'ask-continue' : ''  }} float-right" data-axn="{{ action }}"
                   data-message="Change of appointment status will also take effect in the corresponding encounter. Are you sure you want to continue?"
                   style="margin-left: 10px; margin-right: 0;"
                >Save</a>
                {% if action == 'u' and (userData.type == 'Super Admin' or 'Admin Schedule Delete' in userData.accesses) %}
                    <a href="javascript:void(0)" class="ask-continue button alert href-schedule-calendar-action float-right" data-axn="d"
                       data-message="Are you sure you want to delete this record?"
                       style="margin-left: 10px; margin-right: 0;"
                    >Delete</a>
                {% endif %}
                <a href="javascript:void(0)" class="button secondary" data-close style="margin-left: 10px; margin-right: 0;">Close</a>
            </div>
        </div>
    </div>
    {{ form_widget(form.patient_city_id) }}
    {{ form_widget(form.health_facility_city_id) }}
    {{ form_widget(form.health_facility_geoLat) }}
    {{ form_widget(form.health_facility_geoLong) }}
    {{ form_widget(form.patient_geoLat) }}
    {{ form_widget(form.patient_geoLong) }}
    {{ form_widget(form.action) }}
    {{ form_widget(form.id) }}
    {{ form_widget(form.health_facility) }}
    {{ form_widget(form.start_time) }}
    {#{{ form_widget(form.start_time_period) }}
    {{ form_widget(form.start_time_hour) }}
    {{ form_widget(form.start_time_minute) }}#}
    {{ form_widget(form._token) }}
</form>
