{{ include( 'NivaControlBundle:Shared:header.html.twig', { 'section': 'admin', 'mode': 'admin' } ) }}

{{ include( 'NivaControlBundle:Shared:sidebar.html.twig', { 'section': 'admin', 'mode': 'admin', 'active': 'report' } ) }}

<!-- main content -->
<div class="col-sm-10">
    <div class="page-header">
        <h1>Report: Club Conversion Stats</h1>
    </div>

    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <strong>Filters</strong>
                </div>
                <div class="panel-body">
                    <form class="form-horizontal" role="form" action="{{ path('admin_report_club_conversion') }}"
                          method="post">
                        <div class="form-group">
                            <div class="col-lg-4">
                                <select class="form-control" name="clubId">
                                    <option value="0" selected="selected"
                                            {% if params.clubId == 0 %}selected="selected"{% endif %}
                                            >-- Select Club --
                                    </option>
                                    {% for club in clubList %}
                                        <option value="{{ club.clubId }}"
                                                {% if params.clubId == club.clubId %}selected="selected"{% endif %}
                                                >{{ club.clubName }}</option>
                                    {% endfor %}
                                </select>
                            </div>

                            <div class="col-lg-4">
                                <div class="input-group date" id="form_datetime_from" data-date-format="yyyy-mm-dd">
                                    <input class="form-control" id="fromDate" name="fromDate" size="16" type="text"
                                            {% if params.fromDate %}
                                                value="{{ params.fromDate|date('Y-m-d') }}"
                                            {% else %}
                                                value=""
                                            {% endif %}
                                           placeholder="-- From --" readonly />
                                    <span class="input-group-addon"><span
                                                class="glyphicon glyphicon-remove"></span></span>
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                </div>
                                <script type="text/javascript">
                                    $("#form_datetime_from").datetimepicker({
                                        format: "yyyy-mm-dd",
                                        autoclose: true,
                                        minView: 2,
                                        pickerPosition: "bottom-left"
                                    });
                                </script>
                            </div>

                            <div class="col-lg-4">
                                <div class="input-group date" id="form_datetime_to" data-date-format="yyyy-mm-dd">
                                    <input class="form-control" id="toDate" name="toDate" size="16" type="text"
                                            {% if params.toDate %}
                                                value="{{ params.toDate|date('Y-m-d') }}"
                                            {% else %}
                                                value=""
                                            {% endif %}
                                           placeholder="-- To --" readonly />
                                    <span class="input-group-addon"><span
                                                class="glyphicon glyphicon-remove"></span></span>
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                </div>
                                <script type="text/javascript">
                                    $("#form_datetime_to").datetimepicker({
                                        format: "yyyy-mm-dd",
                                        autoclose: true,
                                        minView: 2,
                                        pickerPosition: "bottom-left"
                                    });
                                </script>
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="col-lg-12">
                                <button type="submit" class="btn btn-default btn-block">Run</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    {% if errorMessage %}
    <p class="text-center text-warning">{{ errorMessage }}</p>
    {% else %}
    <table id="maintable" class="table table-striped">
        <thead>
            <tr>
                <th>Date</th>
                <th>Total Activations</th>
                <th>Percent Active</th>
                <th>Still Active</th>
                <th>Avg. Cancellation</th>
                <th>Percent Charged</th>
                <th>Total Charged</th>
                <th>Percent Converted</th>
                <th>Total Converted</th>
                <th>Avg. Charged (MXN)</th>
                <th>Avg. Revenue (MXN)</th>
            </tr>
        </thead>
        <tbody>
            {# TOTAL ROW #}
            <tr>
                <td style="text-align:center;"><strong>Total</strong></td>
                <td><strong>{{ total.active|number_format }}</strong></td>
                <td><strong>{{ total.pStillActive|number_format(2, '.', ',') }}%</strong></td>
                <td><strong>{{ total.stillActive|number_format }}</strong></td>
                <td><strong>--</strong></td>
                <td><strong>{{ total.pCharged|number_format(2, '.', ',') }}%</strong></td>
                <td><strong>{{ total.charged|number_format }}</strong></td>
                <td><strong>{{ total.pConverted|number_format(2, '.', ',') }}%</strong></td>
                <td><strong>{{ total.converted|number_format }}</strong></td>
                <td><strong>${{ total.avgCharged|number_format(2) }}</strong></td>
                <td><strong>${{ total.avgRevenue|number_format(2) }}</strong></td>
            </tr>

        {# BY DAY #}
        {% for result in results %}
            <tr>
                <td>{{ result.datestamp }} {{ result.datestamp|date('D') }}</td>
                <td>{{ result.active|number_format }}</td>
                <td>{{ result.pStillActive|number_format(2, '.', ',') }}%</td>
                <td>{{ result.stillActive|number_format }}</td>
                <td>{{ (result.avgCancellation/(60*60*24))|number_format(2, '.', ',') }} d</td>
                <td>{{ result.pCharged|number_format(2, '.', ',') }}%</td>
                <td>{{ result.charged|number_format }}</td>
                <td>{{ result.pConverted|number_format(2, '.', ',') }}%</td>
                <td>{{ result.converted|number_format }}</td>
                <td>${{ result.avgCharged|number_format(2) }}</td>
                <td>${{ result.avgRevenue|number_format(2) }}</td>
            </tr>

        {% endfor %}

        </tbody>
    </table>

    <p class="text-center"><a id="exportlink" href="" class='btn btn-default btn-sn' download="report-club-conversion-{{ "now"|date("m-d-Y") }}.csv">Export to a spreadsheet</a></p>
    {% endif %}

    <hr>
    <h3>About the report</h3>
    <p>While this report is <i>static</i> in time, it loads data <i>dynamically</i>. In other words, it queries and calculates the moment it's run,
        which means that the numbers shown today might change if the same report is run at a later time because the system is constantly charging clients and
        verifying their conversion status.</p>
    <ul>
        <li><strong>Active:</strong> the total number of clients that were activated that day.</li>
        <li><strong>Charged:</strong> the number of clients that have been successfully charged any amount, even partial charges.</li>
        <li><strong>Converted:</strong> the number of clients that have been successfully charged more than the conversion threshold. <small>(You can set the threshold amount in the club's setting page.)</small></li>
    </ul>

</div>
<!-- /main content -->

{{ include( 'NivaControlBundle:Shared:footer.html.twig' ) }}