| 8427 |
daniel |
1 |
<?php
|
|
|
2 |
|
|
|
3 |
declare(strict_types=1);
|
|
|
4 |
|
|
|
5 |
/**
|
|
|
6 |
* @author: Daniel Schmitzer (daniel@maennchen1.de)
|
|
|
7 |
* @date: 13.11.23
|
|
|
8 |
* @time: 19:11
|
|
|
9 |
*/
|
|
|
10 |
|
|
|
11 |
namespace wpsgTicket;
|
|
|
12 |
|
|
|
13 |
?>
|
|
|
14 |
|
|
|
15 |
<div id="qr_scanner_app" style="display:none; padding-right:2rem; padding-top:2rem; max-height:400px;">
|
|
|
16 |
|
|
|
17 |
<div id="reader" style="width:500px;"></div>
|
|
|
18 |
|
|
|
19 |
<div id="ticket_dialog" v-if="ticket_dialog">
|
|
|
20 |
<div class="inner">
|
|
|
21 |
|
|
|
22 |
<div v-if="ticket_dialog.loading" class="loading_layer">
|
|
|
23 |
<img src="<?php echo WPSG_URL; ?>views/gfx/ajax-loader.gif" alt="<?php echo __('Bitte warten ...', 'wpsg'); ?>" />
|
|
|
24 |
</div>
|
|
|
25 |
|
|
|
26 |
<div class="head">
|
|
|
27 |
<div class="flex justify-between items-center">
|
|
|
28 |
<div class="flex items-center justify-start">
|
|
|
29 |
TicketBuchung #{{ticket_dialog.booking_id}}
|
|
|
30 |
<div class="button_wrap">
|
|
|
31 |
<a @click="ticket_dialog.tab = 1" :class="{'active': ticket_dialog.tab === 1}"><?php echo __('Informationen', 'wpsg'); ?></a>
|
|
|
32 |
<a @click="ticket_dialog.tab = 2" :class="{'active': ticket_dialog.tab === 2}"><?php echo __('Protokoll', 'wpsg'); ?></a>
|
|
|
33 |
<a :href="ticket_dialog.urls.pdf" target="_blank"><?php echo __('PDF', 'wpsg'); ?></a>
|
|
|
34 |
<!--<a @click="ticket_dialog.tab = 3" :class="{'active': ticket_dialog.tab === 3}"><?php echo __('RAW', 'wpsg'); ?></a>-->
|
|
|
35 |
</div>
|
|
|
36 |
</div>
|
|
|
37 |
<div class="flex flex-items-center justify-end">
|
|
|
38 |
<div :class="'state ' + 'state' + ticket_dialog.state_code">
|
|
|
39 |
{{ticket_dialog.state_label}}
|
|
|
40 |
</div>
|
|
|
41 |
<a @click.prevent="hideDialg">X</a>
|
|
|
42 |
</div>
|
|
|
43 |
</div>
|
|
|
44 |
</div>
|
|
|
45 |
<div class="content">
|
|
|
46 |
<template v-if="ticket_dialog.tab === 1">
|
|
|
47 |
<div class="grid-cols-2 grid">
|
|
|
48 |
<div>
|
|
|
49 |
<div class="form_row">
|
|
|
50 |
<div class="form_label"><?php echo __('Ticket-Produkt', 'wpsg'); ?></div>
|
|
|
51 |
<div class="form_value">
|
|
|
52 |
<a :href="ticket_dialog.urls.product_edit">{{ticket_dialog.ticket_product_label}}</a>
|
|
|
53 |
</div>
|
|
|
54 |
</div>
|
|
|
55 |
<div class="form_row">
|
|
|
56 |
<div class="form_label"><?php echo __('Datum/Zeitraum', 'wpsg'); ?></div>
|
|
|
57 |
<div class="form_value" :class="{'text-red': ticket_dialog.time_raised}">{{ticket_dialog.ticket_data.label}}</div>
|
|
|
58 |
</div>
|
|
|
59 |
<div class="form_row">
|
|
|
60 |
<div class="form_label"><?php echo __('Kaufpreis', 'wpsg'); ?></div>
|
|
|
61 |
<div class="form_value">{{ticket_dialog.order_product_price_ff}}</div>
|
|
|
62 |
</div>
|
|
|
63 |
</div>
|
|
|
64 |
<div>
|
|
|
65 |
<div class="form_row">
|
|
|
66 |
<div class="form_label"><?php echo __('Bestellnummer', 'wpsg'); ?></div>
|
|
|
67 |
<div class="form_value">
|
|
|
68 |
<a :href="ticket_dialog.urls.order_edit">{{ticket_dialog.order_nr}}</a>
|
|
|
69 |
</div>
|
|
|
70 |
</div>
|
|
|
71 |
<div class="form_row">
|
|
|
72 |
<div class="form_label"><?php echo __('Bestellstatus', 'wpsg'); ?></div>
|
|
|
73 |
<div class="form_value" :class="{
|
|
|
74 |
'text-red': !ticket_dialog.wpsg_mod_ticket_orderstate_active.includes(ticket_dialog.order_state),
|
|
|
75 |
'text-green': ticket_dialog.wpsg_mod_ticket_orderstate_active.includes(ticket_dialog.order_state)
|
|
|
76 |
}">{{ticket_dialog.order_state_label}}</div>
|
|
|
77 |
</div>
|
|
|
78 |
<div class="form_row">
|
|
|
79 |
<div class="form_label"><?php echo __('Käufer', 'wpsg'); ?></div>
|
|
|
80 |
<div class="form_value">{{ticket_dialog.order_title}} {{ticket_dialog.order_firstname}} {{ticket_dialog.order_lastname}}</div>
|
|
|
81 |
</div>
|
|
|
82 |
</div>
|
|
|
83 |
</div>
|
|
|
84 |
<br />
|
|
|
85 |
<div class="form_row form_row_1_4">
|
|
|
86 |
<div class="form_label"><?php echo __('Ticket-Status', 'wpsg'); ?></div>
|
|
|
87 |
<div class="form_value">
|
|
|
88 |
<span class="text-red" v-if="ticket_dialog.state_code === <?php echo TicketBooking::STATUS_UNAVAILABLE; ?>">
|
|
|
89 |
{{ticket_dialog.revoke_text}}
|
|
|
90 |
</span>
|
|
|
91 |
<span class="text-green" v-if="ticket_dialog.state_code === <?php echo TicketBooking::STATUS_AVAILABLE; ?>">
|
|
|
92 |
<?php echo __('Gültig', 'wpsg'); ?>
|
|
|
93 |
</span>
|
|
|
94 |
</div>
|
|
|
95 |
</div>
|
|
|
96 |
<br />
|
|
|
97 |
<div v-if="ticket_dialog.sibling.length > 0">
|
|
|
98 |
<strong><?php echo __('Zusammengkaufte Tickets', 'wpsg'); ?> ({{ticket_dialog.sibling.length}} Stück)</strong>
|
|
|
99 |
<table>
|
|
|
100 |
<thead>
|
|
|
101 |
<tr>
|
|
|
102 |
<td><?php echo __('Buchung', 'wpsg'); ?></td>
|
|
|
103 |
<td><?php echo __('Datum/Zeitraum', 'wpsg'); ?></td>
|
|
|
104 |
<td class="col_ticket_state"><?php echo __('Ticket-Status', 'wpsg'); ?></td>
|
|
|
105 |
</tr>
|
|
|
106 |
</thead>
|
|
|
107 |
<tbody v-for="(ts, i) of ticket_dialog.sibling">
|
|
|
108 |
<tr>
|
|
|
109 |
<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>
|
|
|
110 |
<td :class="{'text-red': ticket_dialog.time_raised}">{{ticket_dialog.ticket_data.label}}</td>
|
|
|
111 |
<td>
|
|
|
112 |
<span class="text-red" v-if="ts.state_code === <?php echo TicketBooking::STATUS_UNAVAILABLE; ?>">
|
|
|
113 |
<span v-if="ts.revoked">
|
|
|
114 |
<?php echo __('Entwertet', 'wpsg'); ?>
|
|
|
115 |
</span>
|
|
|
116 |
<template v-else>
|
|
|
117 |
<span v-if="ts.time_raised" class="text-red"><?php echo __('Ausgelaufen', 'wpsg'); ?></span>
|
|
|
118 |
<span v-else><?php echo __('Ungültig', 'wpsg'); ?></span>
|
|
|
119 |
</template>
|
|
|
120 |
</span>
|
|
|
121 |
<span class="text-green" v-if="ts.state_code === <?php echo TicketBooking::STATUS_AVAILABLE; ?>">
|
|
|
122 |
<?php echo __('Gültig', 'wpsg'); ?>
|
|
|
123 |
[<a v-if="ts.state_code === <?php echo TicketBooking::STATUS_AVAILABLE; ?>" href="#" @click="revokeBooking(ts.booking_id, false)" class="revokeBooking">entwerten</a>]
|
|
|
124 |
</span>
|
|
|
125 |
</td>
|
|
|
126 |
</tr>
|
|
|
127 |
</tbody>
|
|
|
128 |
</table>
|
|
|
129 |
</div>
|
|
|
130 |
</template>
|
|
|
131 |
<div v-if="ticket_dialog.tab === 2">
|
|
|
132 |
<table>
|
|
|
133 |
<thead>
|
|
|
134 |
<tr>
|
|
|
135 |
<th><?php echo __('Datum/Zeit', 'wpsg'); ?></th>
|
|
|
136 |
<th><?php echo __('Benutzer', 'wpsg'); ?></th>
|
|
|
137 |
<th><?php echo __('Aktion', 'wpsg'); ?></th>
|
|
|
138 |
</tr>
|
|
|
139 |
</thead>
|
|
|
140 |
<tbody v-for="(l, i) of ticket_dialog.log">
|
|
|
141 |
<tr>
|
|
|
142 |
<td class="col_time">{{en_de_date_time(l.date_time)}}</td>
|
|
|
143 |
<td class="col_user">{{l.user_name}}</td>
|
|
|
144 |
<td>
|
|
|
145 |
<span class="text-green" v-if="l.log === <?php echo TicketBooking::LOG_SCAN; ?>"><?php echo __('gescannt', 'wpsg'); ?></span>
|
|
|
146 |
<span class="text-red" v-else-if="l.log === <?php echo TicketBooking::LOG_REVOKE; ?>"><?php echo __('entwertet', 'wpsg'); ?></span>
|
|
|
147 |
</td>
|
|
|
148 |
</tr>
|
|
|
149 |
</tbody>
|
|
|
150 |
</table>
|
|
|
151 |
</div>
|
|
|
152 |
<div v-if="ticket_dialog.tab === 3">
|
|
|
153 |
<pre>{{ticket_dialog}}</pre>
|
|
|
154 |
</div>
|
|
|
155 |
</div>
|
|
|
156 |
<div class="foot" v-if="ticket_dialog.state_code === 1">
|
|
|
157 |
<a href="#" @click="revokeBooking(ticket_dialog.booking_id)" v-if="ticket_dialog.state_code === 1" class="revokeBooking"><?php echo __('Ticket entwerten', 'wpsg'); ?></a>
|
|
|
158 |
</div>
|
|
|
159 |
</div>
|
|
|
160 |
</div>
|
|
|
161 |
|
|
|
162 |
</div>
|
|
|
163 |
|
|
|
164 |
<style>
|
|
|
165 |
|
|
|
166 |
#qr_scanner_app .flex { display:flex; }
|
|
|
167 |
#qr_scanner_app .grid { display:grid; }
|
|
|
168 |
#qr_scanner_app .text-red { color:red; }
|
|
|
169 |
#qr_scanner_app .justify-between { justify-content:space-between; }
|
|
|
170 |
#qr_scanner_app .justify-start { justify-content:flex-start; }
|
|
|
171 |
#qr_scanner_app .justify-end { justify-content:flex-end; }
|
|
|
172 |
#qr_scanner_app .items-center { align-items:center; }
|
|
|
173 |
#qr_scanner_app .text-green { color:green; }
|
|
|
174 |
#qr_scanner_app .text-red { color:red; }
|
|
|
175 |
#qr_scanner_app .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
|
|
176 |
|
|
|
177 |
#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); }
|
|
|
178 |
#ticket_dialog > .inner { background-color:white; border:1px solid #003664; position:relative; }
|
|
|
179 |
#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); }
|
|
|
180 |
#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; }
|
|
|
181 |
#ticket_dialog > .inner > .head .button_wrap { font-size:0.75em; margin-left:1.5rem; display:flex; gap:0.5rem; align-items:center; }
|
|
|
182 |
#ticket_dialog > .inner > .head .button_wrap > a { border:1px solid white; display:block; padding:0.25rem 0.75rem; }
|
|
|
183 |
#ticket_dialog > .inner > .head .button_wrap > a.active { background-color:white; color:#003664; }
|
|
|
184 |
#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; }
|
|
|
185 |
#ticket_dialog > .inner > .head .state2 { background-color:red; }
|
|
|
186 |
#ticket_dialog > .inner > .head .state1 { background-color:green; }
|
|
|
187 |
#ticket_dialog > .inner > .head a { color:#FFFFFF; cursor:pointer; }
|
|
|
188 |
#ticket_dialog > .inner > .head > a:hover { text-decoration:none; }
|
|
|
189 |
#ticket_dialog > .inner > .head > a { padding:0.5rem; display:inline-block; cursor:pointer; color:#003664; }
|
|
|
190 |
#ticket_dialog > .inner > .content { padding:1rem; width:50dvw; max-width:calc(100dvw - 60px); height:500px; max-height:calc(100dvh - 60px); overflow:auto; }
|
|
|
191 |
#ticket_dialog > .inner > .content .form_row { display:flex; padding:0.25rem 0; justify-content:space-between; }
|
|
|
192 |
#ticket_dialog > .inner > .content .form_row .form_label { }
|
|
|
193 |
#ticket_dialog > .inner > .content .form_row .form_value { width:50%; }
|
|
|
194 |
#ticket_dialog > .inner > .content .form_row_1_4 .form_value { width:75%; }
|
|
|
195 |
#ticket_dialog > .inner > .content table { width:100%; }
|
|
|
196 |
#ticket_dialog > .inner > .content table thead > tr > * { background-color:#003664; color:#FFFFFF; padding:0.25rem 0.5rem; }
|
|
|
197 |
#ticket_dialog > .inner > .content table tbody > tr > * { padding:0.25rem 0.5rem; }
|
|
|
198 |
#ticket_dialog > .inner > .content table tbody > tr:last-child > * { border-bottom:1px solid #333333; }
|
|
|
199 |
#ticket_dialog > .inner > .content table tr > *.col_time { width:130px; }
|
|
|
200 |
#ticket_dialog > .inner > .content table tr > *.col_user { width:250px; }
|
|
|
201 |
#ticket_dialog > .inner > .foot { border-top:1px solid #003664; padding:0.5rem 1rem; display:flex; justify-content:space-between; align-items:center; }
|
|
|
202 |
#ticket_dialog > .inner > .foot a { padding:0.25rem 0.75rem; background-color:green; border:1px solid #003664; color:#FFFFFF; }
|
|
|
203 |
#ticket_dialog .revokeBooking { }
|
|
|
204 |
#ticket_dialog .col_ticket_state { width:150px; }
|
|
|
205 |
|
|
|
206 |
</style>
|
|
|
207 |
|
|
|
208 |
<script src="<?php echo WPSG_URL; ?>mods/mod_ticket/assets/js/HTML5QrScannerv2.3.8.js"></script>
|
|
|
209 |
<script type="module">
|
|
|
210 |
|
|
|
211 |
const wpsgSettings = {
|
|
|
212 |
baseUrl: '<?php echo WPSG_URL; ?>'
|
|
|
213 |
};
|
|
|
214 |
|
|
|
215 |
import { wpsg_ticket_qrScanner } from '<?php echo WPSG_URL; ?>mods/mod_ticket/assets/js/wpsg_qrscanner.js';
|
|
|
216 |
|
|
|
217 |
wpsg_ticket_qrScanner(wpsgSettings, <?php echo json_encode([
|
|
|
218 |
'admin_url' => \admin_url('admin-ajax.php')
|
|
|
219 |
]); ?>);
|
|
|
220 |
|
|
|
221 |
</script>
|