{% extends '@App/base.html.twig' %}
{% block buttonNew %}{% endblock %}
{% block body %}

    {% include 'AppBundle:iService//Reporting:dateForm.html.twig' %}
    <div class="row">
        <div class="col-xs-12">
            <div class="widget">
                <div class="row">
                    <table id="dashboard_table" class="table table-hover table-striped table-bordered text-center dataTable"
                           role="grid" aria-describedby="datatable-example-2_info">
                        <thead>
                        <tr role="row">
                            <th width="10%" class="text-center sorting" tabindex="0" rowspan="1"
                                colspan="1" role="columnheader"
                                style="width: 107px;">
                                ADVISOR
                            </th>
                            <th width="10%" class="text-center sorting" tabindex="0" rowspan="1"
                                colspan="1" role="columnheader"
                                style="width: 107px;">
                                REPAIR ORDER
                            </th>
                            <th width="10%" class="text-center sorting" tabindex="0" rowspan="1"
                                colspan="1" role="columnheader" style="width: 107px;">
                                CUSTOMER
                            </th>
                            <th class="text-center sorting" role="columnheader" tabindex="0" rowspan="1" colspan="1" style="width: 216px;">
                                VIN
                            </th>
                            <th class="text-center sorting" role="columnheader" tabindex="0" rowspan="1" colspan="1" style="width: 216px;">
                                LAST ACTION CUSTOMER
                            </th>
                            <th class="text-center sorting" role="columnheader" tabindex="0" rowspan="1" colspan="1" style="width: 181px;">
                                LAST ACTION MANAGER
                            </th>
                            <th class="text-center sorting" role="columnheader" tabindex="0" rowspan="1" colspan="1" style="width: 181px;">
                                VALUE RANGE
                            </th>
                            <th class="text-center sorting" role="columnheader" tabindex="0" rowspan="1" colspan="1" style="width: 413px;">
                                SERVICE DATE
                            </th>
                            <th class="text-center sorting" role="columnheader" tabindex="0" rowspan="1" colspan="1" style="width: 413px;">
                                DEALER OFFER
                            </th>
                        </tr>
                        </thead>
                        <tfoot class="hidden">
                        <tr>
                            <th width="10%" class="text-center" rowspan="1" colspan="1">ADVISOR</th>
                            <th width="10%" class="text-center" rowspan="1" colspan="1">REPAIR ORDER</th>
                            <th width="10%" class="text-center" rowspan="1" colspan="1">CUSTOMER</th>
                            <th class="text-center" rowspan="1" colspan="1">VIN</th>
                            <th class="text-center" rowspan="1" colspan="1">LAST ACTION CUSTOMER</th>
                            <th class="text-center" rowspan="1" colspan="1">LAST ACTION MANAGER</th>
                            <th class="text-center" rowspan="1" colspan="1">VALUE RANGE</th>
                            <th class="text-center" rowspan="1" colspan="1">SERVICE VISIT</th>
                            <th class="text-center" rowspan="1" colspan="1">DEALER OFFER</th>
                        </tr>
                        </tfoot>
                        <tbody>
                            {% for upgrade in upgradeData %}
                            <tr role="row">
                                <td class="">{{ upgrade.advisor }}</td>
                                <td class="">{{ upgrade.repairOrder }}</td>
                                <td class="">
                                    <span class="" data-toggle="tooltip" data-placement="top" title="" data-original-title="{{ upgrade.customer.phone[0:3] }}-{{ upgrade.customer.phone[3:3] }}-{{ upgrade.customer.phone[6:9] }}">
                                        {{ upgrade.customer.name }}
                                    </span>
                                </td>
                                <td class="">
                                    <span class="" data-toggle="tooltip" data-placement="top" title="" data-original-title="{{ upgrade.ymm }}/{{ upgrade.miles|number_format }} Miles">
                                        {{ upgrade.vin }}
                                    </span>
                                </td>
                                <td>
                                    <span class="" data-toggle="tooltip" data-placement="top" title="" data-original-title="{{ upgrade.lastCustomerAction.timeStamp|date('m/d/Y h:i a') }}">
                                        {{ upgrade.lastCustomerAction.action }}
                                    </span>
                                </td>
                                <td>
                                    <span class="" data-toggle="tooltip" data-placement="top" title="" data-original-title="{{ upgrade.lastCustomerAction.timeStamp|date('m/d/Y h:i a') }}">
                                        {{ upgrade.lastManagerAction.action }}
                                    </span>
                                </td>
                                <td>${{ upgrade.minValue|number_format(2, '.', ',') }} - ${{ upgrade.maxValue|number_format(2, '.', ',') }}</td>
                                <td>{{ upgrade.date|date('m/d/Y g:ia') }}</td>
                                <td><a href="{{ client_url }}{{ upgrade.hash }}/upgrade/make-offer" target="_blank" class="btn btn-primary">Make Offer</a> </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
{% endblock %}