From 9fe431fa6deafd65a0af38f77a7352374d557e6f Mon Sep 17 00:00:00 2001
From: Daniel Schmitzer <noreply@maennchen1.de>
Date: Fri, 23 Aug 2024 08:26:41 +0000
Subject: - TicketModul in den Shop

git-svn-id: https://[internal]/wordpress/plugins/wpsg4@8427 0d5edaf7-2b12-4e95-93f4-047927463d4b
---
 views/mods/mod_ticket/qrScanner.phtml | 221 ++++++++++++++++++++++++++++++++++
 1 file changed, 221 insertions(+)
 create mode 100644 views/mods/mod_ticket/qrScanner.phtml

(limited to 'views/mods/mod_ticket/qrScanner.phtml')

diff --git a/views/mods/mod_ticket/qrScanner.phtml b/views/mods/mod_ticket/qrScanner.phtml
new file mode 100644
index 0000000..3b9bd59
--- /dev/null
+++ b/views/mods/mod_ticket/qrScanner.phtml
@@ -0,0 +1,221 @@
+<?php
+	
+	declare(strict_types=1);
+	
+	/**
+	 * @author: Daniel Schmitzer (daniel@maennchen1.de)
+	 * @date: 13.11.23
+	 * @time: 19:11
+	 */
+	
+	namespace wpsgTicket;
+	
+?>
+
+<div id="qr_scanner_app" style="display:none; padding-right:2rem; padding-top:2rem; max-height:400px;">
+	
+	<div id="reader" style="width:500px;"></div>
+	
+	<div id="ticket_dialog" v-if="ticket_dialog">
+		<div class="inner">
+			
+			<div v-if="ticket_dialog.loading" class="loading_layer">
+				<img src="<?php echo WPSG_URL; ?>views/gfx/ajax-loader.gif" alt="<?php echo __('Bitte warten ...', 'wpsg'); ?>" />
+			</div>
+			
+			<div class="head">
+				<div class="flex justify-between items-center">
+					<div class="flex items-center justify-start">
+						TicketBuchung #{{ticket_dialog.booking_id}}
+						<div class="button_wrap">
+							<a @click="ticket_dialog.tab = 1" :class="{'active': ticket_dialog.tab === 1}"><?php echo __('Informationen', 'wpsg'); ?></a>
+							<a @click="ticket_dialog.tab = 2" :class="{'active': ticket_dialog.tab === 2}"><?php echo __('Protokoll', 'wpsg'); ?></a>
+							<a :href="ticket_dialog.urls.pdf" target="_blank"><?php echo __('PDF', 'wpsg'); ?></a>
+							<!--<a @click="ticket_dialog.tab = 3" :class="{'active': ticket_dialog.tab === 3}"><?php echo __('RAW', 'wpsg'); ?></a>-->
+						</div>
+					</div>
+					<div class="flex flex-items-center justify-end">
+						<div :class="'state ' + 'state' + ticket_dialog.state_code">
+							{{ticket_dialog.state_label}}
+						</div>
+						<a @click.prevent="hideDialg">X</a>
+					</div>
+				</div>
+			</div>
+			<div class="content">
+				<template v-if="ticket_dialog.tab === 1">
+					<div class="grid-cols-2 grid">
+						<div>
+							<div class="form_row">
+								<div class="form_label"><?php echo __('Ticket-Produkt', 'wpsg'); ?></div>
+								<div class="form_value">
+									<a :href="ticket_dialog.urls.product_edit">{{ticket_dialog.ticket_product_label}}</a>
+								</div>
+							</div>
+							<div class="form_row">
+								<div class="form_label"><?php echo __('Datum/Zeitraum', 'wpsg'); ?></div>
+								<div class="form_value" :class="{'text-red': ticket_dialog.time_raised}">{{ticket_dialog.ticket_data.label}}</div>
+							</div>
+							<div class="form_row">
+								<div class="form_label"><?php echo __('Kaufpreis', 'wpsg'); ?></div>
+								<div class="form_value">{{ticket_dialog.order_product_price_ff}}</div>
+							</div>
+						</div>
+						<div>
+							<div class="form_row">
+								<div class="form_label"><?php echo __('Bestellnummer', 'wpsg'); ?></div>
+								<div class="form_value">
+									<a :href="ticket_dialog.urls.order_edit">{{ticket_dialog.order_nr}}</a>
+								</div>
+							</div>
+							<div class="form_row">
+								<div class="form_label"><?php echo __('Bestellstatus', 'wpsg'); ?></div>
+								<div class="form_value" :class="{
+									'text-red': !ticket_dialog.wpsg_mod_ticket_orderstate_active.includes(ticket_dialog.order_state),
+									'text-green': ticket_dialog.wpsg_mod_ticket_orderstate_active.includes(ticket_dialog.order_state)
+								}">{{ticket_dialog.order_state_label}}</div>
+							</div>
+							<div class="form_row">
+								<div class="form_label"><?php echo __('Käufer', 'wpsg'); ?></div>
+								<div class="form_value">{{ticket_dialog.order_title}} {{ticket_dialog.order_firstname}} {{ticket_dialog.order_lastname}}</div>
+							</div>
+						</div>
+					</div>
+					<br />
+					<div class="form_row form_row_1_4">
+						<div class="form_label"><?php echo __('Ticket-Status', 'wpsg'); ?></div>
+						<div class="form_value">
+							<span class="text-red" v-if="ticket_dialog.state_code === <?php echo TicketBooking::STATUS_UNAVAILABLE; ?>">
+								{{ticket_dialog.revoke_text}}
+							</span>
+							<span class="text-green" v-if="ticket_dialog.state_code === <?php echo TicketBooking::STATUS_AVAILABLE; ?>">
+								<?php echo __('Gültig', 'wpsg'); ?>
+							</span>
+						</div>
+					</div>
+					<br />
+					<div v-if="ticket_dialog.sibling.length > 0">
+						<strong><?php echo __('Zusammengkaufte Tickets', 'wpsg'); ?> ({{ticket_dialog.sibling.length}} Stück)</strong>
+						<table>
+							<thead>
+								<tr>
+									<td><?php echo __('Buchung', 'wpsg'); ?></td>
+									<td><?php echo __('Datum/Zeitraum', 'wpsg'); ?></td>
+									<td class="col_ticket_state"><?php echo __('Ticket-Status', 'wpsg'); ?></td>
+								</tr>
+							</thead>
+							<tbody v-for="(ts, i) of ticket_dialog.sibling">
+								<tr>
+									<td><a @click.prevent="showTicket(ts.booking_id)" href="#">#{{ts.booking_id}}</a> <a :href="ts.urls.pdf" target="_blank">[<?php echo __('PDF', 'wpsg'); ?>]</a></td>
+									<td :class="{'text-red': ticket_dialog.time_raised}">{{ticket_dialog.ticket_data.label}}</td>
+									<td>
+										<span class="text-red" v-if="ts.state_code === <?php echo TicketBooking::STATUS_UNAVAILABLE; ?>">
+											<span v-if="ts.revoked">
+												<?php echo __('Entwertet', 'wpsg'); ?>
+											</span>
+											<template v-else>
+												<span v-if="ts.time_raised" class="text-red"><?php echo __('Ausgelaufen', 'wpsg'); ?></span>
+												<span v-else><?php echo __('Ungültig', 'wpsg'); ?></span>
+											</template>
+										</span>
+										<span class="text-green" v-if="ts.state_code === <?php echo TicketBooking::STATUS_AVAILABLE; ?>">
+											<?php echo __('Gültig', 'wpsg'); ?>
+											[<a v-if="ts.state_code === <?php echo TicketBooking::STATUS_AVAILABLE; ?>" href="#" @click="revokeBooking(ts.booking_id, false)" class="revokeBooking">entwerten</a>]
+										</span>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+				</template>
+				<div v-if="ticket_dialog.tab === 2">
+					<table>
+						<thead>
+							<tr>
+								<th><?php echo __('Datum/Zeit', 'wpsg'); ?></th>
+								<th><?php echo __('Benutzer', 'wpsg'); ?></th>
+								<th><?php echo __('Aktion', 'wpsg'); ?></th>
+							</tr>
+						</thead>
+						<tbody v-for="(l, i) of ticket_dialog.log">
+							<tr>
+								<td class="col_time">{{en_de_date_time(l.date_time)}}</td>
+								<td class="col_user">{{l.user_name}}</td>
+								<td>
+									<span class="text-green" v-if="l.log === <?php echo TicketBooking::LOG_SCAN; ?>"><?php echo __('gescannt', 'wpsg'); ?></span>
+									<span class="text-red" v-else-if="l.log === <?php echo TicketBooking::LOG_REVOKE; ?>"><?php echo __('entwertet', 'wpsg'); ?></span>
+								</td>
+							</tr>
+						</tbody>
+					</table>
+				</div>
+				<div v-if="ticket_dialog.tab === 3">
+					<pre>{{ticket_dialog}}</pre>
+				</div>
+			</div>
+			<div class="foot" v-if="ticket_dialog.state_code === 1">
+				<a href="#" @click="revokeBooking(ticket_dialog.booking_id)" v-if="ticket_dialog.state_code === 1" class="revokeBooking"><?php echo __('Ticket entwerten', 'wpsg'); ?></a>
+			</div>
+		</div>
+	</div>
+	
+</div>
+
+<style>
+	
+	#qr_scanner_app .flex { display:flex; }
+	#qr_scanner_app .grid { display:grid; }
+	#qr_scanner_app .text-red { color:red; }
+	#qr_scanner_app .justify-between { justify-content:space-between; }
+	#qr_scanner_app .justify-start { justify-content:flex-start; }
+	#qr_scanner_app .justify-end { justify-content:flex-end; }
+	#qr_scanner_app .items-center { align-items:center; }
+	#qr_scanner_app .text-green { color:green; }
+	#qr_scanner_app .text-red { color:red; }
+	#qr_scanner_app .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+	
+	#ticket_dialog { position:fixed; left:0; top:0; width:100dvw; height:100dvh; display:flex; justify-content:center; align-items:center; z-index:10000; background-color:rgba(255, 255, 255, 0.95); }
+	#ticket_dialog > .inner { background-color:white; border:1px solid #003664; position:relative; }
+	#ticket_dialog > .inner .loading_layer { position:absolute; left:0; top:0; width:100%; height:100%; transition:all 0.1s; display:flex; align-items:center; justify-content:center; background-color:rgba(255, 255, 255, 0.75); }
+	#ticket_dialog > .inner > .head { border-bottom:1px solid #003664; padding:0.5rem 1rem; font-size:1.25em; font-weight:bold; color:white; background-color:#003664; }
+	#ticket_dialog > .inner > .head .button_wrap { font-size:0.75em; margin-left:1.5rem; display:flex; gap:0.5rem; align-items:center; }
+	#ticket_dialog > .inner > .head .button_wrap > a { border:1px solid white; display:block; padding:0.25rem 0.75rem; }
+	#ticket_dialog > .inner > .head .button_wrap > a.active { background-color:white; color:#003664; }
+	#ticket_dialog > .inner > .head .state { font-size:0.75em; border:1px solid white; display:flex; align-items:center; padding:0.25rem 0.75rem; margin-right:1.5rem; }
+	#ticket_dialog > .inner > .head .state2 { background-color:red; }
+	#ticket_dialog > .inner > .head .state1 { background-color:green; }
+    #ticket_dialog > .inner > .head a { color:#FFFFFF; cursor:pointer; }
+    #ticket_dialog > .inner > .head > a:hover { text-decoration:none; }
+    #ticket_dialog > .inner > .head > a { padding:0.5rem; display:inline-block; cursor:pointer; color:#003664; }
+	#ticket_dialog > .inner > .content { padding:1rem; width:50dvw; max-width:calc(100dvw - 60px); height:500px; max-height:calc(100dvh - 60px); overflow:auto; }
+	#ticket_dialog > .inner > .content .form_row { display:flex; padding:0.25rem 0; justify-content:space-between; }
+	#ticket_dialog > .inner > .content .form_row .form_label {  }
+	#ticket_dialog > .inner > .content .form_row .form_value { width:50%; }
+	#ticket_dialog > .inner > .content .form_row_1_4 .form_value { width:75%; }
+	#ticket_dialog > .inner > .content table { width:100%; }
+	#ticket_dialog > .inner > .content table thead > tr > * { background-color:#003664; color:#FFFFFF; padding:0.25rem 0.5rem; }
+	#ticket_dialog > .inner > .content table tbody > tr > * { padding:0.25rem 0.5rem; }
+	#ticket_dialog > .inner > .content table tbody > tr:last-child > * { border-bottom:1px solid #333333; }
+	#ticket_dialog > .inner > .content table tr > *.col_time { width:130px; }
+	#ticket_dialog > .inner > .content table tr > *.col_user { width:250px; }
+	#ticket_dialog > .inner > .foot { border-top:1px solid #003664; padding:0.5rem 1rem; display:flex; justify-content:space-between; align-items:center; }
+	#ticket_dialog > .inner > .foot a { padding:0.25rem 0.75rem; background-color:green; border:1px solid #003664; color:#FFFFFF; }
+	#ticket_dialog .revokeBooking {  }
+	#ticket_dialog .col_ticket_state { width:150px; }
+	
+</style>
+
+<script src="<?php echo WPSG_URL; ?>mods/mod_ticket/assets/js/HTML5QrScannerv2.3.8.js"></script>
+<script type="module">
+	
+	const wpsgSettings = {
+		baseUrl: '<?php echo WPSG_URL; ?>'
+	};
+	
+	import { wpsg_ticket_qrScanner } from '<?php echo WPSG_URL; ?>mods/mod_ticket/assets/js/wpsg_qrscanner.js';
+	
+	wpsg_ticket_qrScanner(wpsgSettings, <?php echo json_encode([
+		'admin_url' => \admin_url('admin-ajax.php')
+	]); ?>);
+	
+</script>
\ No newline at end of file
-- 
cgit v1.2.3