{% extends '@App/base.html.twig' %}
{% block title %}
    Follow Up Returns
{% endblock %}
{% block body %}
    <div class="alert alert-outline-primary" role="alert">
        <h4 class="alert-heading text-center"><span id="follow_ups_today" class="color-green-600">0</span> APPOINTMENTS
                                                                                                           TODAY</h4>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="widget">
                <div class="row">
                    <div class="col-xs-12">
                        {#{% include 'AppBundle:Reporting:dateForm.html.twig' %}#}
                        <div class="alert alert-success" role="alert">
                            <h3 class="text-center">TOTAL POTENTIAL WORK: <b id="total_potential_work">$</b></h3>
                        </div>
                        <table id="table-export-xls"
                               class="table table-hover table-striped table-bordered text-center dataTable">
                            <thead>
                            <tr>
                                <th>RO NUMBER</th>
                                <th>CUSTOMER</th>
                                <th>DATE RETURNING</th>
                                <th>PHONE</th>
                                <th>POTENTIAL WORK</th>
                                <th>ACTION</th>
                            </tr>
                            </thead>
                            <tfoot class="hidden">
                            <tr>
                                <th>RO NUMBER</th>
                                <th>CUSTOMER</th>
                                <th>DATE SCHEDULED</th>
                                <th>PHONE</th>
                                <th>POTENTIAL WORK</th>
                                <th>ACTION</th>
                            </tr>
                            </tfoot>
                            <tbody>
                            {% set total_potential_work = 0 %}
                            {% set follow_ups_today = 0 %}
                            {% for follow_up in follow_ups %}
                                {% if follow_up.dateRequested|date("m/d/Y") <= "now"|date("m/d/Y") %}
                                    {% set follow_ups_today = follow_ups_today + 1 %}
                                {% endif %}
                                <tr>
                                    <td>{{ follow_up.repairOrder.number }}</td>
                                    <td>{{ follow_up.repairOrder.primaryCustomer.name }}</td>
                                    <td{% if date(follow_up.dateRequested) < date() %} class="bg-red-a700 font-weight-bold"{% endif %}
                                            data-sort="timestamp">
                                        {{ follow_up.dateRequested|date("m/d/Y g:i a") }}
                                    </td>
                                    <td>{{ follow_up.repairOrder.primaryCustomer.phone[0:3] }}
                                        -{{ follow_up.repairOrder.primaryCustomer.phone[3:3] }}
                                        -{{ follow_up.repairOrder.primaryCustomer.phone[6:9] }}</td>
                                    <td>
                                        <div class="btn-group">
                                            <div class="dropdown-menu dropdown-menu-cols dropdown-cols-1">
                                                {% set totalRepair = 0 %}
                                                {% for declined_item in follow_up.repairOrder.declinedWork %}
                                                    <a class="dropdown-item"
                                                       href="javascript:">{{ declined_item.workDescription }}:
                                                                                                   ${{ declined_item.value }}</a>
                                                    {% set totalRepair = totalRepair + declined_item.value %}
                                                    {% set total_potential_work = total_potential_work + declined_item.value %}
                                                {% endfor %}
                                            </div>
                                            <button type="button" class="btn btn-info btn-raised dropdown-toggle"
                                                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                <b>${{ totalRepair }}</b>
                                                <div class="ripple-container"></div>
                                                <div class="ripple-container"></div>
                                            </button>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="dropdown">
                                            <button class="btn btn-primary btn-raised dropdown-toggle" type="button"
                                                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                Actions
                                                <div class="ripple-container"></div>
                                                <div class="ripple-container"></div>
                                            </button>
                                            <div class="dropdown-menu">
                                                <a href="javascript:" id="{{ follow_up.repairOrder.id }}"
                                                   class="dropdown-item" data-toggle="modal"
                                                   data-target="#modal-roDetails"
                                                   data-id="{{ follow_up.repairOrder.id }}">RO DETAILS</a>
                                                {% if follow_up.repairOrder.video %}
                                                    <a target="_blank"
                                                       href="{{ client_url }}{{ follow_up.repairOrder.linkHash }}"
                                                       class="dropdown-item">CUSTOMER VIEW</a>
                                                {% else %}
                                                    <h3 class="dropdown-header btn-danger btn">NO VIDEO</h3>
                                                {% endif %}
                                                <!--<a href="javascript:" id="followup-return-show" data-id="{{ follow_up.repairOrder.id }}" class="dropdown-item" data-toggle="modal" data-target="#modal-return-show">SHOW</a>-->
                                                <a href="javascript:" id="followup-no-show"
                                                   data-id="{{ follow_up.repairOrder.id }}" class="dropdown-item"
                                                   data-toggle="modal" data-target="#modal-no-show">NO SHOW</a>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            {% endfor %}
                            <script>
                                $('#total_potential_work').text('$' + {{ total_potential_work }});
                                $('#follow_ups_today').text({{ follow_ups_today }});
                            </script>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        /*no show repair order followup */
        $('#modal-no-show').on('show.bs.modal', function (e) {
            var repair_order_id = $(e.relatedTarget).data('id');
            $('#followup-repair-order-id').val(repair_order_id);
        });

        $("#confirm-followup-return-no-show").click(function () {
            var repair_order_id = $('#followup-repair-order-id').val();
            $.post('/api/followup/return/no-show', {
                repair_order_id: repair_order_id
            }, function (resp) {
                location.reload();
            }).error(function (e) {
                console.log(e);
            });
        });
        /*no show repair order followup */
        /*show repair order followup */
        $('#modal-return-show').on('show.bs.modal', function (e) {
            var repair_order_id = $(e.relatedTarget).data('id');
            $('#followup-repair-order-id').val(repair_order_id);
        });
        $("#confirm-followup-return-show").click(function () {
            var repair_order_id = $('#followup-repair-order-id').val();
            $.post('/api/followup/return/show', {
                repair_order_id: repair_order_id
            }, function (resp) {
                location.reload();
            }).error(function (e) {
                console.log(e);
            });
        });
        /*show repair order followup */
    </script>
{% endblock %}
{% block modal %}
    {{ include('@App/Default/roDetails.html.twig') }}
    <!--Follow Up Return No Show-->
    <div class="modal modal-primary fade scale" id="modal-no-show" tabindex="-1" role="dialog"
         aria-labelledby="modal-no-show" aria-hidden="true">
        <input type="hidden" id="followup-repair-order-id" value=""/>
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title" id="modal-default-primary-label">Follow Up Return</h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <center><h2 class="text-center"><strong>Are You Sure You Want To Mark The Customer as a No
                                                                Show?</strong></h2></center>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="row">
                        <div class="col-md-6">
                            <button type="button" id="confirm-followup-return-no-show"
                                    class="btn btn-block btn-success btn-block">CONFIRM NO SHOW
                            </button>
                        </div>
                        <div class="col-md-6">
                            <button type="button" class="btn btn-block btn-danger btn-block" data-toggle="modal"
                                    data-target="#modal-no-show">CANCEL
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--Follow Up Return No Show-->
    <!--Follow Up Return Show-->
    <div class="modal modal-primary fade scale" id="modal-return-show" tabindex="-1" role="dialog"
         aria-labelledby="modal-return-show" aria-hidden="true">
        <input type="hidden" id="followup-repair-order-id" value=""/>
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title" id="modal-default-primary-label">Follow Up Return</h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <center><h2 class="text-center"><strong>Please Confirm the Customer is a Show?</strong></h2>
                        </center>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="row">
                        <div class="col-md-6">
                            <button type="button" id="confirm-followup-return-show"
                                    class="btn btn-block btn-success btn-block">CONFIRM SHOW
                            </button>
                        </div>
                        <div class="col-md-6">
                            <button type="button" class="btn btn-block btn-danger btn-block" data-toggle="modal"
                                    data-target="#modal-return-show">CANCEL
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--Follow Up Return Show-->
{% endblock %}
{% block javascripts %}
    <script type="text/javascript">
        $('#table-export-xls').DataTable();
    </script>
{% endblock %}