{% extends 'dashboard.twig' %}

{% block content %}

{% include "@CoreHome/_siteSelectHeader.twig" %}

<div class="top_controls_inner">
    {% include "@CoreHome/_periodSelect.twig" %}
</div>

<div class="centerLargeDiv">
    <h2>{{ 'ScheduledReports_ManageEmailReports'|translate }}</h2>
    <span id="reportSentSuccess"></span>
    <span id="reportUpdatedSuccess"></span>

    <div class="entityContainer">
        {% import 'ajaxMacros.twig' as ajax %}
        {{ ajax.errorDiv() }}
        {{ ajax.loadingDiv() }}
        {% include "@ScheduledReports/_listReports.twig" %}
        {% include "@ScheduledReports/_addReport.twig" %}
        <a id='bottom'></a>
    </div>
</div>

<div class="ui-confirm" id="confirm">
    <h2>{{ 'ScheduledReports_AreYouSureDeleteReport'|translate }}</h2>
    <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
    <input role="no" type="button" value="{{ 'General_No'|translate }}"/>
</div>

<script type="text/javascript">
    var ReportPlugin = {};
    ReportPlugin.defaultPeriod = '{{ defaultPeriod }}';
    ReportPlugin.defaultHour = '{{ defaultHour }}';
    ReportPlugin.defaultReportType = '{{ defaultReportType }}';
    ReportPlugin.defaultReportFormat = '{{ defaultReportFormat }}';
    ReportPlugin.reportList = {{ reportsJSON | raw }};
    ReportPlugin.createReportString = "{{ 'ScheduledReports_CreateReport'|translate }}";
    ReportPlugin.updateReportString = "{{ 'ScheduledReports_UpdateReport'|translate }}";
    $(function () {
        initManagePdf();
    });
</script>
<style type="text/css">
    .reportCategory {
        font-weight: bold;
        margin-bottom: 5px;
    }

    .entityAddContainer {
        position:relative;
    }

    .entityAddContainer > .entityCancel:first-child {
        position: absolute;
        right:0;
        bottom:100%;
    }
</style>
{% endblock %}
