{% extends '@RxConnexion/Admin/content.html.twig' %}
{% block content %}
    <div class="row max-width-initial">
        <div class="small-12 columns">
            <div class="content-container">
                <div class="content-container-content">
                    <div class="row max-width-initial">
                        <div class="large-12 columns">
                            <div class="row max-width-initial">
                                <div class="large-6 medium-6 small-12 columns">
                                    <label>Date From</label>
                                    <input type="text" class="date" id="date_from" value="{{ 'now'| date_modify('first day of this month') | date('m-d-Y') }}" />
                                </div>
                                <div class="large-6 medium-6 small-12 columns">
                                    <label>Date To</label>
                                    <input type="text" class="date" id="date_to" value="{{ 'now'|date('m/d/Y') }}" />
                                </div>
                            </div>
                        </div>
                        <div class="large-12 columns">
                            <div class="row max-width-initial" style="">
                                <div class="large-6 columns">
                                    <div class="row max-width-initial">
                                        <div class="large-12 medium-6 small-12 columns">
                                            <div id="status-report-data-container" class="has-loading">
                                                <div id="status-report-data-loading" class="text-center"></div>
                                                <div class="flat-scroll">
                                                    <div style="height: 100%; width: 100%;">
                                                        <canvas id="status-report-data" width="100%" height="450px;"></canvas>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="large-6 columns">
                                    <div class="row max-width-initial">
                                        <div class="large-12 medium-6 small-12 columns">
                                            <div id="referral-status-report-data-container" class="has-loading">
                                                <div id="referral-status-report-data-loading" class="text-center"></div>
                                                <div class="flat-scroll">
                                                    <div style="height: 100%; width: 100%;">
                                                        <canvas id="referral-status-report-data" width="100%" height="450px;"></canvas>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="reveal large" id="revealTable" data-reveal>
        <div class="tableData"></div>
    </div>
    {% include '@RxConnexion/Admin/js.html.twig' %}
    <script language="javascript">
        //<![CDATA[
        jQ('.date').datepicker({
            onSelect: function(e) {
                let dateFrom = jQ('#date_from').val();
                let dateTo = jQ('#date_to').val();
                statusReport.statusReportData(dateFrom, dateTo);
            }
        });

        statusReport.settings.statusReport_data_url = '{{ path('report_status_data') }}';
        statusReport.settings.statusReport_redirect_preview_url = '{{ path('report_referral_redirect_preview') }}';
        jQ(document).ready(function(){
            report.init('{{ app.environment }}');
            statusReport.init();
        });
        //]]>
    </script>
{% endblock %}