{% extends '/layout/pdf_layout.html.twig' %}
{% set labels = class_constants('App\\Label\\InventoryLabel') %}

{% block title %}
	{{ inventory.serialNumber }}
	Report
{% endblock %}

{% block content %}
	<style>
		.brand {
			font-size: 2.5rem;
			color: #184857;
			text-transform: none;
		}

		.confidential {
			text-decoration: underline;
			color: red;
			text-transform: uppercase;
			font-weight: bold;
		}

		.confidential-bottom {
			position: fixed;
			bottom: 0;
			right: 50px;
		}

		.report {
			padding: 50px;
		}

		/***************** HEADER TABLE *****************/
		.header-table {
			margin-bottom: 20px;
			width: 100%;
		}

		.header-table td {
			width: 50%;
		}

		.header-table td:last-child {
			text-align: right;
		}

		/***************** INFO TABLE *****************/
		.info-table {
			border: 2px solid black;
			margin-bottom: 10px;
			width: 100%;
		}

		.info-table tr td {
			padding: 5px;
		}

		.info-table tr td:first-child {
			font-weight: bold;
			text-transform: uppercase;
		}

		.info-table tr td:nth-child(1),
		.info-table tr td:nth-child(2) {
			width: 1%;
			white-space: nowrap;
		}

		/***************** REPORT TABLE *****************/
		.report-table {
			border: 2px solid black;
			width: 100%;
			border-collapse: collapse;
			text-align: center;
		}

		.report-table td,
		.report-table th {
			padding: 15px;
		}

		.report-table thead {
			font-weight: bold;
		}

		.report-table thead th {
			border: 1px solid #c9c9c9;
			border-bottom: 2px solid black;
		}

		.report-table tbody td {
			border: 1px solid #c9c9c9;
		}

		.report-table tbody td:first-child {
			font-weight: bold;
		}

		.report-table tbody td:nth-child(1) {
			width: 1%;
			white-space: nowrap;
		}

		.report-table tbody .report-table-footer td:first-child {
			text-align: left;
			font-weight: normal;
			border-top: 2px solid black;
		}

		.logo {
			height: 100px;
			width: auto;
		}

		body {
			padding: 0;
			margin: 0;
			font-size: 14px;
		}
	</style>

	<div class="report">
		<table class="header-table">
			<tr>
				<td>
					{% if logoPath %}
						<img src="{{ logoPath }}" alt="alt Logo" class="logo">
					{% else %}
						<span class="brand">
							<b>Noctu</b>Vision</span>
					{% endif %}
				</td>
				<td style="vertical-align: bottom;">
					<span class="confidential">Confidential</span>
				</td>
			</tr>
		</table>

		<table class="info-table">
			<tr>
				<td>
					{{ labels.SERIAL_NUMBER }}
				</td>
				<td>:</td>
				<td>
					{{ inventory.serialNumber }}
				</td>
			</tr>
			<tr>
				<td>
					{{ labels.PHOSPHOR_TYPE }}
				</td>
				<td>:</td>
				<td>
					{{ inventory.phosphorType }}
				</td>
			</tr>
			<tr>
				<td>
					{{ labels.AUTO_GATING }}
				</td>
				<td>:</td>
				<td>
					{{ inventory.autoGating ? 'YES' : 'NO' }}
				</td>
			</tr>
			<tr>
				<td>
					{{ labels.EMI }}
				</td>
				<td>:</td>
				<td>
					{{ inventory.emi ? 'YES' : 'NO' }}
				</td>
			</tr>
		</table>

		<table class="report-table">
			<thead>
				<tr>
					<th>PARAMETER</th>
					<th>Min.</th>
					<th>MEASURED</th>
					<th>Max.</th>
					<th>UNIT</th>
				</tr>
			</thead>
			<tbody>
				{% for row in limitations %}
					<tr>
						<td>{{ row.label }}</td>
						<td>{{ row.min ? row.min : '/' }}</td>
						<td>{{ row.value }}</td>
						<td>{{ row.max ? row.max : '/' }}</td>
						<td>{{ row.unit|raw }}</td>
					</tr>
				{% endfor %}
				<tr class="report-table-footer">
					<td colspan="5">
						<b>Comments: FOM =</b>
						Signal to Noise Ratio X Center Resolution
					</td>
				</tr>
			</tbody>
		</table>
		<div class="confidential confidential-bottom">
			Confidential
		</div>
	</div>
{% endblock %}