<!-- Auf dieser Seite werden detailierte Infos zu Prüfaufträgen angezeigt. Unten in der Tabelle kann auch die Ergebnisserfassung zu einem Prüfauftrag stattfinden.  -->

<!DOCTYPE html>
<html>
<head>

<!-- <meta charset="utf-8"> -->
<meta charset="utf-8" name="viewport"
	content="width=device-width, initial-scale=1"/>

<title>Probenbearbeitung</title>
<link rel="icon" type="image/x-icon" href="Logo_blomes_fl_2.png">

<link rel="stylesheet" href="style.css"></link>
<link rel="stylesheet" href="styleTable.css"></link>

<!-- Script für logout und autologout -->
<script src="scriptLogout.js"></script>

<!-- Scripts für Prüfbericht erstellen - generate PDF -->
<script src='pdfmake.min.js'></script>
<script src='vfs_fonts.js'></script>

<!-- Stylesheet für Datumspicker -->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
    <style>
    /* Hier die gewünschte Schriftart einstellen */
    .flatpickr-calendar {
      font-family: 'Arial', sans-serif; /* Ändere 'Arial' zu deiner gewünschten Schriftart */
    }
  </style>


   

</head>

<!-- Menü der Website. Diese Seite muss den Tag class="active" enthalten, damit der Menüpunkt richtig gekennzeichnet ist. -->
<body>
	<header id="section-0" class="header">
		<div class="container">
			<div class="row align-items-center justify-content-between">
				<div class="logo">
					<!-- <a href="/happycodingRestServiceClient/src/main/webapp/Logo_blomesystem.png">Logo</a> -->
					<img class="logoimg" src="gus_lab_logo_genii_1.png"
						onclick="window.open('https://gus-lab.com/', '_blank');" style="width: 200px; height: auto;">
				</div>
				<input type="checkbox" id="nav-check"> <label
					for="nav-check" class="nav-toggler"> <span></span>
				</label>
				<nav class="nav">
					<ul>
						<!-- 	<li><a href="index.html">Login</a></li> -->
						<li><a onclick="seitenwechsel()" href="probenliste.html">Probenliste</a></li>
						<!-- <li><a onclick="seitenwechsel()" href="scanner.html">Probenscanner</a></li> -->
						<li><a onclick="seitenwechsel()" href="probenbearbeitung.html"
							class="active">Probenbearbeitung</a></li>
						<!-- <li><a onclick="seitenwechsel()" href="administrator.html">Administrator</a></li>  -->
						<!-- <li><a onclick="seitenwechsel()" href="help.html">Info</a></li> -->
					</ul>
				</nav>
			</div>
		</div>
	</header>

	<!-- Es wird der Loginstatus des Benutzer überprüft. Ist die Tokenzeit abgelaufen? Der Benutzer wird mit Namen begrüßt. Der Benutzer kann sich ausloggen.  -->
	<p id="loginstatus" style="text-align: right; margin-bottom: 0px;">Login
		Status</p>
	<script src="scriptLoginStatus.js"></script>
	<!-- Benutzer kann sich abmelden, script oben einbinden ("scriptLogout.js") -->
	<div style="display: flex; justify-content: flex-end; margin-top: 0px;">
		<button id="logoutbutton" onclick="logout()"
			style="padding: 2px; font-family: sans-serif; font-size: 12px; font-size: 100%;">Abmelden</button>
	</div>

	<link rel="stylesheet" href="probenbearbeitungStyle.css"></link>

	<h1 class="title"
		style="font-family: verdana; font-size: 150%; font-weight: bold; margin-bottom: 10px; margin-top: 10px;">Probenbearbeitung</h1>

	<div
		style="margin-top: 0px; /* background-color: rgb(117, 141, 156); */ border-radius: 15px;">
		<div style="padding-left: 0px; padding-top: 0px; padding-bottom: 0px">
			<p style="display: none">Gib eine Proben-Id ein und klicke auf
				"Probe anzeigen".</p>
			<!-- <p class="probnanzeigeTextElement" style="margin-top:0px">Proben-Id:</p> -->
			<p style="display: none">
				<input class="inputTyp1" type="text" placeholder="Proben-Id"
					id="probenId"
					onkeypress="checkLoginStatusAndNewTime(); clickPress(event)" />
			</p>

			<p style="display: none">
				<button type="button"
					onclick="checkLoginStatusAndNewTime(); getProbenInfo()"
					style="margin-top: 10px;">Probe anzeigen</button>
			</p>

			<!-- Eine Probe laden über die Probennummer -->
			<!--  <p>Gib eine Probenummer ein und klicke auf "Probe anzeigen".</p> -->
			<!-- <p class="probnanzeigeTextElement" style="margin-top:0px">Proben-Id:</p> -->
			<!-- <p>
				<input class="inputTyp2" type="text" placeholder="Probennummer"
					id="probenProbenNummer"
					onkeypress="checkLoginStatusAndNewTime(); clickPress(event)" />
			</p>

			<p>
				<button type="button"
					onclick="checkLoginStatusAndNewTime(); getProbenInfoSampleNum()"
					style="margin-top: 10px;">Probe anzeigen</button>
			</p>
			 -->
			
			<!-- Button um zur Probenliste zu navigieren -->
			<p>
				<button type="button"
					onclick="checkLoginStatusAndNewTime(); seitenwechsel(); geheZuProbenliste()"
					style="margin-top: 10px;">Zurück</button>
			</p>

			<p>
				<a id="probenauswahlText">Probenauswahl: </a> <a id="multiLoad"
					style="display: none"> --- </a>
			</p>

			<p id="sampleNumList"></p>

			<p id="infoText"></p>
			<button id="probenauswahlButtonLinks" class="triangle-buttons"
				style="display: inline-block;"
				onclick="checkLoginStatusAndNewTime(), multiLoadLeftButton()">
				<!-- Triangle -->
				<div
					class="triangle-buttons__triangle triangle-buttons__triangle--l"></div>

				<!-- Content -->
				&#9650

			</button>
			<button id="probenauswahlButtoRechts" class="triangle-buttons"
				style="display: inline-block;"
				onclick="checkLoginStatusAndNewTime(), multiLoadRightButton()">
				<!-- Content -->
				&#9660

				<!-- Triangle -->
				<div
					class="triangle-buttons__triangle triangle-buttons__triangle--r"></div>
			</button>

		</div>
	</div>

	<details open>
		<summary>Probeninformationen</summary>
		<div class="pannelBackground">
			<div class="innerPannel">

				<p id="KENNUNG_AG_Label" class="probnanzeigeTextElement">Kennung AG:</p>
				 <!-- <p id="KENNUNG_AG">---</p>  -->
				<input class="inputTyp2" type="text" placeholder="Eingabe Kennung AG" id="KENNUNG_AG" onkeyup="checkLoginStatusAndNewTime()" maxlength="20"/>
				
				<p id="EING_VERGABELABOR_DATUM_Label" class="probnanzeigeTextElement">Eingang Vergabelabor Datum:</p>
				<!-- <p id="EING_VERGABELABOR_DATUM">---</p>  -->
				<input class="inputTyp2" type="text" placeholder="Eingang Vergabelabor Datum" id="EING_VERGABELABOR_DATUM" onkeyup="checkLoginStatusAndNewTime()"/>
				<button id="clearDateButton_1" class="clear-button">╳</button>

				<p id="AUFTRAGSLAB_BEARBEITER_Label" class="probnanzeigeTextElement">Vergabelabor Bearbeiter:</p>
				<!-- <p id="AUFTRAGSLAB_BEARBEITER">---</p>  -->
				<input class="inputTyp2" type="text" placeholder="Eingabe Vergabelabor Bearbeiter" id="AUFTRAGSLAB_BEARBEITER" onkeyup="checkLoginStatusAndNewTime()" maxlength="50"/>
				
				<p id="BEMERKUNG_VERGABE_Label" class="probnanzeigeTextElement">Vergabelabor Bemerkung:</p>
				<!-- <p id="BEMERKUNG_VERGABE">---</p>  -->
				<textarea class="inputTyp2" type="text" placeholder="Eingabe Vergabelabor Bemerkung" id="BEMERKUNG_VERGABE" onkeyup="checkLoginStatusAndNewTime()" rows="5" cols="25" maxlength="500"></textarea>
				
				<p id="WEB_STATUS_Label" class="probnanzeigeTextElement">Status:</p>
				<p id="WEB_STATUS">---</p>

				<p id="UNTERS_FERTIG_DATUM_Label" class="probnanzeigeTextElement">Untersuchung fertig Datum:</p>
				<p id="UNTERS_FERTIG_DATUM">---</p>

				<p id="UNTERS_FERTIG_Label" class="probnanzeigeTextElement">Untersuchung fertig:</p>
				<p id="UNTERS_FERTIG">---</p>

				<p id="IMPORT_NEUE_DB_DATUM_Label" class="probnanzeigeTextElement">Import Datum:</p>
				<p id="IMPORT_NEUE_DB_DATUM">---</p>
				
				<p id="EXPORT_NEUE_DB_DATUM_Label" class="probnanzeigeTextElement">Export Datum:</p>
				<p id="EXPORT_NEUE_DB_DATUM">---</p>
				
				<p id="PROBEN_NR_Label" class="probnanzeigeTextElement">Proben Nr.:</p>
				<p id="PROBEN_NR">---</p>

				<p id="PNS_NR_Label" class="probnanzeigeTextElement">PNS Nr.:</p>
				<p id="PNS_NR">---</p>

				<!-- soll erstmal nicht angezeigt werden -->
				<p style="display: none;" id="START_DATUM_Label" class="probnanzeigeTextElement">Startdatum:</p>
				<p style="display: none;" id="START_DATUM">---</p>

				<!-- soll erstmal nicht angezeigt werden -->
				<p style="display: none;" id="ENDE_DATUM_Label" class="probnanzeigeTextElement">Endedatum:</p>
				<p style="display: none;" id="ENDE_DATUM">---</p>

				<p id="BEMERKUNG_Label" class="probnanzeigeTextElement">Bemerkung:</p>
				<p id="BEMERKUNG">---</p>
				
			</div>
		</div>
	</details>

	<!-- <details>
		<summary>Statische Daten</summary>
		<div class="pannelBackground">

			<div class="innerPannel">
				<p id="PROBEN_NR_Label" class="probnanzeigeTextElement">Proben Nr.:</p>
				<p id="PROBEN_NR">---</p>

				<p id="PNS_NR_Label" class="probnanzeigeTextElement">PNS Nr.:</p>
				<p id="PNS_NR">---</p>

				<p id="START_DATUM_Label" class="probnanzeigeTextElement">Startdatum:</p>
				<p id="START_DATUM">---</p>

				<p id="ENDE_DATUM_Label" class="probnanzeigeTextElement">Endedatum:</p>
				<p id="ENDE_DATUM">---</p>

				<p id="BEMERKUNG_Label" class="probnanzeigeTextElement">Bemerkung:</p>
				<p id="BEMERKUNG">---</p>

			</div>

		</div>
	</details>  -->

<!--  
	<details>
		<summary>Sonstiges</summary>
		<div class="pannelBackground">
			<div class="innerPannel">
				<p id="untersuchungsgrundLabel" class="probnanzeigeTextElement">Untersuchungsgrund:</p>
				<p id="untersuchungsgrund">---</p>

				<p id="standartanalyseLabel" class="probnanzeigeTextElement">Standartanalyse:</p>
				<p id="standartanalyse">---</p>

				<p id="grenzwertlisteLabel" class="probnanzeigeTextElement">Grenzwertliste:</p>
				<p id="grenzwertliste">---</p>
			</div>

		</div>
	</details>
-->
	<!-- Speichern der Probeninformationen  TODO: Vielleicht durch Speicherbutton ersetzen der auch gleichzeitig die ergebnisse abspeichert-->
	</br>
	<div id="hint-box" class="hint-box"></div>
	<button class="hint" id="save_probeninfo_button"
			onclick="checkLoginStatusAndNewTime(); saveProbeninfo()" data-hint="Klicken Sie hier, um die Probeninformationen zu speichern.">Speichern der Probeninformationen</button>
	
	</br>
	</br>
	
	<h3>Messungen</h3>

	<!-- Tabelle mit Ergebnissen zu einen Prüfauftrag. Je nach Status können auch Ergebnisse erfasst werden. -->

	<!-- Die mit class="pruefberichttabellekopf" gekennzeichneten Spalten sind die Spalten, die auf den Prüfbericht erscheinen. 
	Siehe auch probenanzeigeGeneratePDF.js und probenanzeigeSkript den Tabellenaufbau. Die Spalte resultid (style="display:none;") wird weder im Prüfbericht berücksichtigt 
	noch auf der Seite angezeigt und ist nur dafür gedacht, um bei späterer Messwerteingabe über die Tabelle die Daten mit einen SQL Befehl richtig zuordnen zu können und in die Datenbank abzuspeichern  -->
	<table id="styledTable" class="table table-striped">
	
	<!--  
		<thead>
			<tr class="bg-info">
				<th style="display: none;" data-column="resultid" data-order="desc">Id</th>
				<th class="pruefberichttabellekopf" data-column="id" data-order="desc">Prüfmerkmal</th>
				<th class="pruefberichttabellekopf" data-column="id" data-order="desc">Ergebnis</th>
				<th class="pruefberichttabellekopf" data-column="sampleNumber" data-order="desc">Einheit</th> -->	
				<!-- 			<th data-column="status" data-order="desc">Methoden ID</th> -->
			<!-- 	<th class="pruefberichttabellekopf" data-column="statusText" data-order="desc">Methode</th>
				<th class="pruefberichttabellekopf" data-column="sampleNumber" data-order="desc">Gerät</th>
				<th class="pruefberichttabellekopf" data-column="status" data-order="desc">Standort</th>
				<th class="pruefberichttabellekopf" data-column="statusText" data-order="desc">Arbeitsbereich</th>
			</tr>
		</thead>
	 -->
	 
		<thead>
			<tr class="bg-info">
				<th style="display: none;" data-column="probenId" data-order="desc">ProbenId</th>
				<th style="display: none;" data-column="exportId" data-order="desc">ExportId</th>
				<th style="display: none;" data-column="probenId" data-order="desc">pmId</th>
				<th style="display: none;" data-column="exportId" data-order="desc">pmVer</th>
				<th class="pruefberichttabellekopf" data-column="pruefmethName" data-order="desc">Prüfmethode</th>
				<th class="pruefberichttabellekopf" data-column="pruefmethKurzname" data-order="desc" style="display: none;">Prüfm. Kurzname</th>
				<th class="pruefberichttabellekopf" data-column="anzahlEinzelmessungen" data-order="desc">Anzahl Einzelmess.</th>
				<th class="pruefberichttabellekopf" data-column="neBegruendungsText" data-order="desc">NE Begründung</th>
				<th style="display: none;" class="pruefberichttabellekopf" data-column="neBegruendungsId" data-order="desc">NE Begründung Id</th>
				<th class="pruefberichttabellekopf" data-column="messwertId" data-order="desc">Messwert ID</th>
				<th class="pruefberichttabellekopf" data-column="messwert" data-order="desc">Messwert</th>
				<th class="pruefberichttabellekopf" data-column="ergebnis" data-order="desc">Ergebnis/ Mittelwert</th>
				<th class="pruefberichttabellekopf" data-column="einheit" data-order="desc">Einheit</th>				
				<th class="pruefberichttabellekopf" data-column="nwg" data-order="desc">NWG</th>
				<th class="pruefberichttabellekopf" data-column="bg" data-order="desc">BG</th>
				<th style="display: none;" class="pruefberichttabellekopf" data-column="flagNumberText" data-order="desc">FLAG NUMBER TEXT</th>
				<th class="pruefberichttabellekopf" data-column="statusText" data-order="desc">Kennung vor Ort Parameter</th>
				<th class="pruefberichttabellekopf" data-column="din" data-order="desc">DIN</th>
			</tr>
		</thead>
		
		<tbody id="myTable">

		</tbody>
	</table>

	<!-- <script src="probenanzeigeSkript.js"></script> -->

	<!-- Prüfbericht erstellen -->
	<script type="text/javascript" charset="UTF-8" src="probenbearbeitungGeneratePDFScript.js"></script>

	<!-- Messwerte speichern -->
	<br>
	<p>
		<button class="hint" id="savebutton"
			onclick="checkLoginStatusAndNewTime(); saveMesswerte()" data-hint="Klicken Sie hier, um die Messergebnisse zu speichern.">Speichern der Messwerte</button>
			
		<button class="hint" id="validieungsbutton"
			onclick="checkLoginStatusAndNewTime(); validierung()" data-hint="Klicken Sie hier, um zu validieren und zu speichern. Bei der Validierung werden die Eingaben auf Richtigkeit geprüft und anschließend die Bearbeitung gesperrt.">Validierung</button>	
		<a id="savetext"></a>
	</p>
	
	 <!-- Dialog -->
    <div class="overlay" id="overlay" style="display: none;"></div>
    <div class="dialog" id="dialog" style="display: none;">
    	<p>Keine Regel verletzt.</p>
        <p>Wollen Sie wirklich validieren?</p>
        <button onclick="checkLoginStatusAndNewTime(); confirmValidation(true)">Ja</button>
        <button onclick="checkLoginStatusAndNewTime(); confirmValidation(false)">Nein</button>
    </div>
	
	

	<!-- Messwerte über Datei einlesen im JSON Format -->
	<br>
	<input class="hint" type="file" name="inputfile" id="inputfile"
		onclick="checkLoginStatusAndNewTime();" data-hint="Beim Klicken auf Durchsuchen können Messwerte über eine Textdatei im JSON-Format eingelesen werden.">
	<p id="inputfileInfo">Beim Klicken auf Durchsuchen können Messwerte über eine Textdatei im JSON-Format eingelesen werden.</p>

	<pre id="output" style="display: none;"></pre>

	<!-- Messwerte über Datei einlesen in csv Format -->

	<br>
	<pre id="output"></pre>

	<br>
	<input class="hint" type="file" name="inputfileCsv" id="inputfileCsv"
		onclick="checkLoginStatusAndNewTime();" data-hint="Beim Klicken auf Durchsuchen können Messwerte über eine Textdatei im CSV-Format einlesen werden.">
	<p id="inputfileCsvInfo">Beim Klicken auf Durchsuchen können
		Messwerte über eine Textdatei im CSV-Format einlesen werden.</p>
	<br>
	<pre id="outputCsv" style="display: none;"></pre>


	<!-- Prüfbericht erstellen -->
	<p>
		<button style="display: none;" type="button"
			onclick="checkLoginStatusAndNewTime(); downloadPDFWithPDFMake()"
			style="margin-top: 20px;">Prüfbericht als PDF erstellen</button>
	</p>

	<!-- Scripts für Datumspicker -->
	<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
	<script src="https://cdn.jsdelivr.net/npm/flatpickr/dist/l10n/de.js"></script>
	
	<script src="probenbearbeitungSkript.js"></script>
	


	<p style="margin-bottom: 20px; margin-top: 20px;">
		<a style="color: rgb(41, 148, 171);" href="#section-0">Seitenanfang</a>
	</p>


</body>
</html>