{% extends 'admin.twig' %}

{% set title %}{{ 'ScheduledReports_PersonalEmailReports'|translate }}{% endset %}

{% block topcontrols %}
    {% include "@CoreHome/_siteSelectHeader.twig" %}
    {% include "@CoreHome/_periodSelect.twig" %}
{% endblock %}

{% block content %}

{% set reportParametersScheduledReportsEvent %}{{ postEvent('Template.reportParametersScheduledReports') }}{% endset %}

{# load the Template.reportParametersScheduledReports event twice, once here outside of vue so any inline scripts
   will execute. then again in the vue slot so it will be used correctly. This is hack to provide some level of BC. #}
<div style="display:none" vue-entry-ignore ng-non-bindable>
    {{ reportParametersScheduledReportsEvent|raw }}
</div>

<div
  vue-entry="ScheduledReports.ManageScheduledReport"
  content-title="{{ title|default(null)|json_encode|e('html_attr') }}"
  user-login="{{ userLogin|default(null)|json_encode|e('html_attr') }}"
  login-module="{{ loginModule|default(null)|json_encode|e('html_attr') }}"
  reports="{{ reports|default([])|json_encode|e('html_attr') }}"
  site-name="{{ siteName|default(null)|json_encode|e('html_attr') }}"
  segment-editor-activated="{{ segmentEditorActivated|default(null)|json_encode|e('html_attr') }}"
  saved-segments-by-id="{{ savedSegmentsById|default(null)|json_encode|e('html_attr') }}"
  periods="{{ periods|default(null)|json_encode|e('html_attr') }}"
  download-output-type="{{ downloadOutputType|default(null)|json_encode|e('html_attr') }}"
  language="{{ language|default(null)|json_encode|e('html_attr') }}"
  report-formats-by-report-type="{{ reportFormatsByReportType|default(null)|json_encode|e('html_attr') }}"
  param-periods="{{ paramPeriods|default(null)|json_encode|e('html_attr') }}"
  report-type-options="{{ reportTypeOptions|default(null)|json_encode|e('html_attr') }}"
  report-formats-by-report-type-options="{{ reportFormatsByReportTypeOptions|default(null)|json_encode|e('html_attr') }}"
  display-formats="{{ displayFormats|default(null)|json_encode|e('html_attr') }}"
  reports-by-category-by-report-type="{{ reportsByCategoryByReportType|default({})|json_encode|e('html_attr') }}"
  allow-multiple-reports-by-report-type="{{ allowMultipleReportsByReportType|default(null)|json_encode|e('html_attr') }}"
  count-websites="{{ countWebsites|default(null)|json_encode|e('html_attr') }}"
  report-types="{{ reportTypes|default(null)|json_encode|e('html_attr') }}"
>
    <template v-slot:report-parameters >
        {{ reportParametersScheduledReportsEvent|raw }}
    </template>
</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 }}";
    ReportPlugin.defaultEvolutionPeriodN = {{ defaultEvolutionPeriodN|json_encode|raw }};
    ReportPlugin.periodTranslations = {{ periodTranslations|json_encode|raw }};
</script>
<style type="text/css">
    .reportCategory {
        font-weight: bold;
        margin-bottom: 5px;
    }

    .entityAddContainer {
        position:relative;
    }

    .emailReports .top_controls {
        padding-bottom: 18px;
    }

</style>
{% endblock %}