{% include 'mcp_header.html' %}

<div class="iz-mcp">

	<form id="mcp" method="post" action="{{ S_MCP_ACTION }}" class="iz-form">

		<header class="iz-pagehead" aria-labelledby="iz-mcp-reports-title">
			<h2 class="iz-pagehead__title" id="iz-mcp-reports-title">{{ L_TITLE }}</h2>
			<p class="iz-pagehead__lead">{{ L_EXPLAIN }}</p>
		</header>

		<section class="iz-card iz-card--mcp" aria-labelledby="iz-reports-filter-title">
			<header class="iz-card__header">
				<h3 class="iz-card__title" id="iz-reports-filter-title">{{ L_OPTIONS }}</h3>
			</header>

			<div class="iz-card__body">
				<div class="iz-grid iz-grid--2">
					{% if not S_PM %}
						<div class="iz-field">
							<label class="iz-label" for="fo">{{ L_FORUM }}{{ L_COLON }}</label>
							<div class="iz-field__row iz-field__row--actions">
								<select class="iz-select" name="f" id="fo">
									{{ S_FORUM_OPTIONS }}
								</select>
								<button class="iz-btn iz-btn--primary" type="submit" name="sort" value="{{ L_GO }}">
									{{ L_GO }}
								</button>
							</div>
							{{ S_FORM_TOKEN }}
						</div>
					{% endif %}

					<div class="iz-field">
						<div class="iz-field__row iz-field__row--actions iz-field__row--end">
							<nav class="iz-pagination iz-pagination--compact" aria-label="{{ L_PAGINATION }}">
								<ul class="iz-pagination__list">
									<li class="iz-pagination__item">
										<span class="iz-pagination__meta">{{ TOTAL_REPORTS }}</span>
									</li>

									{% if pagination %}
										{% include 'pagination.html' %}
									{% else %}
										<li class="iz-pagination__item">
											<span class="iz-pagination__current" aria-current="page">{{ PAGE_NUMBER }}</span>
										</li>
									{% endif %}
								</ul>
							</nav>
						</div>
					</div>
				</div>
			</div>
		</section>


		{% if postrow %}
			<section class="iz-card iz-card--mcp" aria-labelledby="iz-reports-title">
				<header class="iz-card__header">
					<h3 class="iz-card__title" id="iz-reports-title">{{ L_REPORTS }}</h3>
				</header>

				<div class="iz-card__body">

					<div class="iz-table" role="region" aria-label="{{ L_REPORTS }}">
						<table class="iz-table__table">
							<thead class="iz-table__head">
								<tr class="iz-table__row">
									<th scope="col" class="iz-table__th iz-table__th--grow">{{ L_VIEW_DETAILS }}</th>
									<th scope="col" class="iz-table__th">
										{{ L_REPORTER }}
										{% if not S_PM %}&nbsp;{{ L_FORUM }}{% endif %}
									</th>
									<th scope="col" class="iz-table__th">{{ L_MARK }}</th>
								</tr>
							</thead>

							<tbody class="iz-table__body">
								{% for postrow in postrow %}
									<tr class="iz-table__row">

										{% if S_PM %}
											<td class="iz-table__td">
												<a class="iz-link iz-link--strong" href="{{ postrow.U_VIEW_DETAILS }}">
													{{ postrow.PM_SUBJECT }}
												</a>
												&nbsp;{{ postrow.ATTACH_ICON_IMG }}

												<p class="iz-help">
													{{ L_MESSAGE_BY_AUTHOR }}&nbsp;{{ postrow.PM_AUTHOR_FULL }}&nbsp;{{ L_MESSAGE_TO }}&nbsp;{{ postrow.RECIPIENTS }}
													&nbsp;&raquo;&nbsp;<time>{{ postrow.PM_TIME }}</time>
												</p>
											</td>

											<td class="iz-table__td">
												<p class="iz-help">
													{{ postrow.REPORTER_FULL }}<br />
													<time>{{ postrow.REPORT_TIME }}</time>
												</p>
											</td>
										{% else %}
											<td class="iz-table__td">
												<a class="iz-link iz-link--strong" href="{{ postrow.U_VIEW_DETAILS }}">
													{{ postrow.POST_SUBJECT }}
												</a>
												&nbsp;{{ postrow.ATTACH_ICON_IMG }}

												<p class="iz-help">
													{{ L_POST_BY_AUTHOR }}&nbsp;{{ postrow.POST_AUTHOR_FULL }}
													&nbsp;&raquo;&nbsp;<time>{{ postrow.POST_TIME }}</time>
												</p>
											</td>

											<td class="iz-table__td">
												<p class="iz-help">
													{{ postrow.REPORTER_FULL }}
													&nbsp;&raquo;&nbsp;<time>{{ postrow.REPORT_TIME }}</time><br />
													{{ L_FORUM }}{{ L_COLON }}&nbsp;
													{% if postrow.U_VIEWFORUM %}
														<a class="iz-link" href="{{ postrow.U_VIEWFORUM }}">{{ postrow.FORUM_NAME }}</a>
													{% else %}
														{{ postrow.FORUM_NAME }}
													{% endif %}
												</p>
											</td>
										{% endif %}

										<td class="iz-table__td">
											<label class="iz-choice" for="report_{{ postrow.REPORT_ID }}">
												<input class="iz-choice__input"
													   type="checkbox"
													   name="report_id_list[]"
													   value="{{ postrow.REPORT_ID }}"
													   id="report_{{ postrow.REPORT_ID }}" />
												<span class="iz-choice__label">{{ L_MARK }}</span>
											</label>
										</td>

									</tr>
								{% endfor %}
							</tbody>
						</table>
					</div>

					<hr class="iz-hr" />

					<div class="iz-toolbar" role="region" aria-label="{{ L_OPTIONS }}">
						<div class="iz-toolbar__left">
							{% if TOPIC_ID %}
								<label class="iz-choice" for="t">
									<input class="iz-choice__input"
										   type="checkbox"
										   name="t"
										   id="t"
										   value="{{ TOPIC_ID }}"
										   checked="checked" />
									<span class="iz-choice__label">{{ L_ONLY_TOPIC }}</span>
								</label>
							{% endif %}
						</div>

						<div class="iz-toolbar__right">
							<fieldset class="iz-actions iz-actions--inline" aria-label="{{ L_OPTIONS }}">
								<button class="iz-btn iz-btn--danger" type="submit" name="action[delete]" value="{{ L_DELETE_REPORTS }}" title="{{ L_DELETE_REPORTS }}">
									{{ L_DELETE_REPORTS }}
								</button>

								{% if not S_CLOSED %}
									<button class="iz-btn iz-btn--secondary" type="submit" name="action[close]" value="{{ L_CLOSE_REPORTS }}" title="{{ L_CLOSE_REPORTS }}">
										{{ L_CLOSE_REPORTS }}
									</button>
								{% endif %}

								<span class="iz-actions__sep" aria-hidden="true"></span>

								<button class="iz-btn iz-btn--secondary"
										type="button"
										onclick="marklist('mcp', 'report_id_list', true); return false;">
									{{ L_MARK_ALL }}
								</button>

								<button class="iz-btn iz-btn--secondary"
										type="button"
										onclick="marklist('mcp', 'report_id_list', false); return false;">
									{{ L_UNMARK_ALL }}
								</button>
							</fieldset>
						</div>
					</div>

					<div class="iz-toolbar" role="region" aria-label="{{ L_PAGINATION }}">
						<div class="iz-toolbar__left"></div>
						<div class="iz-toolbar__right">
							<nav class="iz-pagination" aria-label="{{ L_PAGINATION }}">
								<ul class="iz-pagination__list">
									<li class="iz-pagination__item">
										<span class="iz-pagination__meta">{{ TOTAL_REPORTS }}</span>
									</li>

									{% if pagination %}
										{% include 'pagination.html' %}
									{% else %}
										<li class="iz-pagination__item">
											<span class="iz-pagination__current" aria-current="page">{{ PAGE_NUMBER }}</span>
										</li>
									{% endif %}
								</ul>
							</nav>
						</div>
					</div>

					{% include 'display_options.html' %}
				</div>
			</section>

		{% else %}
			<p class="iz-alert iz-alert--info" role="status">{{ L_NO_REPORTS }}</p>
		{% endif %}

	</form>

	<script>
	(function () {
		'use strict';

		// Preserve legacy "Only topic" refresh behavior without head.js/iCheck dependencies.
		document.addEventListener('DOMContentLoaded', function () {
			var onlyTopic = document.getElementById('t');
			var form = document.getElementById('mcp');
			if (!onlyTopic || !form) return;

			onlyTopic.addEventListener('change', function () {
				if (!onlyTopic.checked) form.submit();
			});
		});
	})();
	</script>

</div>

{% include 'mcp_footer.html' %}