@7365admin1/layer-common 4.90.2-staging.490 → 4.90.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +10 -4
- package/assets/css/primitives.css +0 -57
- package/assets/css/screens.css +4 -8
- package/components/AccessCardDetailsDialog.vue +6 -59
- package/components/AccessCardPreviewDialog.vue +53 -371
- package/components/AppSelect.vue +4 -143
- package/components/BuildingUnitFormEdit.vue +0 -6
- package/components/Dialog/UpdateMoreAction.vue +1 -11
- package/components/DocumentForm.vue +112 -407
- package/components/DocumentManagement.vue +12 -213
- package/components/Facility/BookingSetup.vue +0 -63
- package/components/HidAccessLogDashboard.vue +17 -74
- package/components/HidIntercomManagement.vue +14 -183
- package/components/HidQrCodeConfiguration.vue +195 -17
- package/components/HidReaderManagement.vue +0 -398
- package/components/HidReaderUserRoster.vue +3 -44
- package/components/HidUserEnrollment.vue +292 -2255
- package/components/InvitationClientForm.vue +1 -19
- package/components/InvitationForm.vue +4 -31
- package/components/InvitationMain.vue +22 -124
- package/components/MemberInformation.vue +4 -4
- package/components/PassInformation.vue +2 -2
- package/components/SiteSettings.vue +0 -48
- package/components/TableMain.vue +7 -22
- package/components/VehicleManagement.vue +5 -80
- package/components/VisitorForm.vue +19 -65
- package/components/VisitorManagement.vue +5 -267
- package/composables/useAccessManagement.ts +1 -17
- package/composables/useDocument.ts +0 -7
- package/composables/useFacility.ts +0 -11
- package/composables/useHidAmico.ts +0 -165
- package/composables/useHidNavigation.ts +1 -25
- package/composables/useMember.ts +0 -12
- package/composables/useNFCPatrolReportFilters.ts +3 -21
- package/composables/useNFCPatrolRoute.ts +1 -8
- package/composables/usePeople.ts +0 -19
- package/composables/useServiceProvider.ts +2 -45
- package/composables/useSettingsPermission.ts +0 -14
- package/composables/useUser.ts +2 -6
- package/composables/useVehicle.ts +1 -40
- package/composables/useVerification.ts +0 -3
- package/middleware/01.auth.ts +7 -3
- package/package.json +1 -1
- package/pages/[org]/[site]/access-mgmt/administrator/index.vue +1 -1
- package/pages/[org]/[site]/access-mgmt/hid-cards/index.vue +1 -1
- package/pages/[org]/[site]/access-mgmt/hid-readers/index.vue +1 -1
- package/types/document.d.ts +0 -14
- package/types/facility.d.ts +0 -4
- package/types/member.d.ts +0 -4
- package/types/people.d.ts +1 -28
- package/types/service-provider.d.ts +0 -5
- package/types/site.d.ts +1 -7
- package/components/BuildingUnitManagement.vue +0 -298
- package/components/HidAccessPermissions.vue +0 -424
- package/components/HidProfileQrCode.vue +0 -332
- package/components/VehicleQrStickerDialog.vue +0 -249
- package/composables/useHidReaderSelection.ts +0 -50
- package/composables/useSiteCategory.ts +0 -45
- package/pages/[org]/[site]/access-mgmt/hid-qr-code/index.vue +0 -23
- package/utils/hid-enrolment-subject.ts +0 -344
- package/utils/hid-permission-assignments.ts +0 -198
- package/utils/hid-reader-selection.ts +0 -52
- package/utils/invite-group.ts +0 -61
- package/utils/invite-sites.ts +0 -25
- package/utils/occupancy-role.ts +0 -109
- package/utils/service-type.ts +0 -30
- package/utils/vehicle-qr-sticker.ts +0 -184
|
@@ -1,332 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
MY HID QR CODE.
|
|
3
|
-
|
|
4
|
-
The signed-in member's own pass for one reader. Every other HID screen acts on
|
|
5
|
-
somebody else - a resident being enrolled, a visitor being issued a pass. This
|
|
6
|
-
one has no subject picker at all, because the server takes the caller from the
|
|
7
|
-
session and there is no user id to send.
|
|
8
|
-
|
|
9
|
-
Issuing a code does NOT grant access. A member's door permission comes from the
|
|
10
|
-
HID permissions screen, and minting an access rule here would let anyone who
|
|
11
|
-
can press Generate admit themselves. So the screen reports what the permissions
|
|
12
|
-
screen says (`assigned`) and warns when a code would be refused at the door,
|
|
13
|
-
rather than handing out something that silently fails.
|
|
14
|
-
-->
|
|
15
|
-
<template>
|
|
16
|
-
<div class="hid-profile-qr">
|
|
17
|
-
<div class="hid-profile-qr__header">
|
|
18
|
-
<h2 class="hid-profile-qr__title">HID QR Code</h2>
|
|
19
|
-
<AppSelect
|
|
20
|
-
v-if="readerOptions.length"
|
|
21
|
-
v-model="selectedReaderId"
|
|
22
|
-
class="reader-select"
|
|
23
|
-
:items="readerOptions"
|
|
24
|
-
@update:model-value="loadProfile"
|
|
25
|
-
/>
|
|
26
|
-
</div>
|
|
27
|
-
|
|
28
|
-
<v-card class="screen-modal hid-profile-qr__card">
|
|
29
|
-
<v-card-text class="screen-modal__body">
|
|
30
|
-
<div v-if="loading" class="hid-profile-qr__state">Loading...</div>
|
|
31
|
-
|
|
32
|
-
<div v-else-if="!readerOptions.length" class="hid-profile-qr__state">
|
|
33
|
-
No HID reader is set up for this site yet.
|
|
34
|
-
</div>
|
|
35
|
-
|
|
36
|
-
<template v-else>
|
|
37
|
-
<p class="hid-profile-qr__reader">
|
|
38
|
-
{{ profile?.readerName || "HID reader" }}
|
|
39
|
-
<span>{{ profile?.portalName || "Portal not configured" }}</span>
|
|
40
|
-
</p>
|
|
41
|
-
|
|
42
|
-
<!-- A code this reader cannot read is worse than no code, so the
|
|
43
|
-
capability is checked before anything is offered. -->
|
|
44
|
-
<v-alert
|
|
45
|
-
v-if="profile && !profile.qrEnabled"
|
|
46
|
-
type="warning"
|
|
47
|
-
variant="tonal"
|
|
48
|
-
density="compact"
|
|
49
|
-
class="mb-4"
|
|
50
|
-
>
|
|
51
|
-
This reader is not set up to read QR codes.
|
|
52
|
-
</v-alert>
|
|
53
|
-
|
|
54
|
-
<!-- The honest part: a code opens the door only for a member the
|
|
55
|
-
permissions screen already admits. `assigned` is null when the
|
|
56
|
-
lookup failed, which is not the same as "no". -->
|
|
57
|
-
<v-alert
|
|
58
|
-
v-else-if="profile && profile.assigned === false"
|
|
59
|
-
type="warning"
|
|
60
|
-
variant="tonal"
|
|
61
|
-
density="compact"
|
|
62
|
-
class="mb-4"
|
|
63
|
-
>
|
|
64
|
-
You are not assigned to this reader, so this code will be refused at
|
|
65
|
-
the door. Ask a property manager to add you on the HID permissions
|
|
66
|
-
screen.
|
|
67
|
-
</v-alert>
|
|
68
|
-
|
|
69
|
-
<div v-if="qrImage" class="hid-profile-qr__code">
|
|
70
|
-
<img :src="qrImage" alt="Your HID QR code" width="220" height="220" />
|
|
71
|
-
<p class="hid-profile-qr__issued">
|
|
72
|
-
Issued {{ formatIssuedAt(profile?.issuedAt) }}
|
|
73
|
-
</p>
|
|
74
|
-
</div>
|
|
75
|
-
<p v-else class="hid-profile-qr__state">
|
|
76
|
-
You have no QR code on this reader yet.
|
|
77
|
-
</p>
|
|
78
|
-
|
|
79
|
-
<div class="hid-profile-qr__actions">
|
|
80
|
-
<AppButton
|
|
81
|
-
:disabled="working || !profile?.qrEnabled"
|
|
82
|
-
@click="generate"
|
|
83
|
-
>
|
|
84
|
-
{{ profile?.issued ? "Regenerate" : "Generate QR Code" }}
|
|
85
|
-
</AppButton>
|
|
86
|
-
<AppButton
|
|
87
|
-
v-if="qrImage"
|
|
88
|
-
variant="ghost"
|
|
89
|
-
icon="mdi-download"
|
|
90
|
-
@click="downloadQr"
|
|
91
|
-
>
|
|
92
|
-
Download
|
|
93
|
-
</AppButton>
|
|
94
|
-
<AppButton
|
|
95
|
-
v-if="profile?.issued"
|
|
96
|
-
variant="ghost"
|
|
97
|
-
:disabled="working"
|
|
98
|
-
@click="remove"
|
|
99
|
-
>
|
|
100
|
-
Remove
|
|
101
|
-
</AppButton>
|
|
102
|
-
</div>
|
|
103
|
-
|
|
104
|
-
<p class="field-hint">
|
|
105
|
-
Regenerating replaces the previous code. The old one stops working
|
|
106
|
-
immediately.
|
|
107
|
-
</p>
|
|
108
|
-
</template>
|
|
109
|
-
</v-card-text>
|
|
110
|
-
</v-card>
|
|
111
|
-
|
|
112
|
-
<v-snackbar v-model="snackbar.show" :color="snackbar.color" timeout="4000">
|
|
113
|
-
{{ snackbar.message }}
|
|
114
|
-
</v-snackbar>
|
|
115
|
-
</div>
|
|
116
|
-
</template>
|
|
117
|
-
|
|
118
|
-
<script setup lang="ts">
|
|
119
|
-
import QRCode from "qrcode";
|
|
120
|
-
import type { HidProfileQr } from "../composables/useHidAmico";
|
|
121
|
-
|
|
122
|
-
const props = defineProps<{ site: string }>();
|
|
123
|
-
|
|
124
|
-
const { getReaders, getProfileQr, issueProfileQr, deleteProfileQr } = useHidAmico();
|
|
125
|
-
|
|
126
|
-
type HidReaderOption = { _id: string; name?: string; portalName?: string };
|
|
127
|
-
|
|
128
|
-
const readers = ref<HidReaderOption[]>([]);
|
|
129
|
-
const { selectHidReader, resolveForSite } = useHidReaderSelection();
|
|
130
|
-
const selectedReaderId = ref("");
|
|
131
|
-
const profile = ref<HidProfileQr | null>(null);
|
|
132
|
-
const qrImage = ref("");
|
|
133
|
-
const loading = ref(false);
|
|
134
|
-
const working = ref(false);
|
|
135
|
-
const snackbar = reactive({ show: false, color: "success", message: "" });
|
|
136
|
-
|
|
137
|
-
const readerOptions = computed(() => readers.value.map((reader) => ({
|
|
138
|
-
title: `${reader.name || reader._id} — ${reader.portalName || "Portal not configured"}`,
|
|
139
|
-
value: reader._id,
|
|
140
|
-
})));
|
|
141
|
-
|
|
142
|
-
function showToast(message: string, color: "success" | "error" = "success") {
|
|
143
|
-
snackbar.message = message;
|
|
144
|
-
snackbar.color = color;
|
|
145
|
-
snackbar.show = true;
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
function toRecord(value: unknown): Record<string, any> {
|
|
149
|
-
return value && typeof value === "object" ? (value as Record<string, any>) : {};
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
function errorMessage(error: unknown) {
|
|
153
|
-
const record = toRecord(error);
|
|
154
|
-
return String(toRecord(record.data).message || record.message || "Something went wrong.");
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
function formatIssuedAt(value?: string) {
|
|
158
|
-
if (!value) return "";
|
|
159
|
-
const date = new Date(value);
|
|
160
|
-
return Number.isNaN(date.getTime()) ? "" : date.toLocaleString();
|
|
161
|
-
}
|
|
162
|
-
|
|
163
|
-
/**
|
|
164
|
-
* The image is drawn here, never fetched. The value is the credential itself,
|
|
165
|
-
* so keeping it on this page and out of any URL is the point.
|
|
166
|
-
*/
|
|
167
|
-
async function renderQr(value: string) {
|
|
168
|
-
if (!value) {
|
|
169
|
-
qrImage.value = "";
|
|
170
|
-
return;
|
|
171
|
-
}
|
|
172
|
-
try {
|
|
173
|
-
qrImage.value = await QRCode.toDataURL(value, { width: 440, margin: 1 });
|
|
174
|
-
} catch (error) {
|
|
175
|
-
console.error("Unable to render the HID QR code:", error);
|
|
176
|
-
qrImage.value = "";
|
|
177
|
-
}
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
/**
|
|
181
|
-
* Saves the rendered code as a PNG.
|
|
182
|
-
*
|
|
183
|
-
* Straight off the data URL already in the page - no request, so the credential
|
|
184
|
-
* never travels again to be downloaded. Same anchor-click approach `VisitorForm`
|
|
185
|
-
* uses for a visitor pass, and the reader name is in the file name because a
|
|
186
|
-
* member can hold one code per reader.
|
|
187
|
-
*/
|
|
188
|
-
function downloadQr() {
|
|
189
|
-
if (!qrImage.value) return;
|
|
190
|
-
const slug = String(profile.value?.readerName || "reader")
|
|
191
|
-
.trim()
|
|
192
|
-
.replace(/[^a-z0-9]+/gi, "-")
|
|
193
|
-
.replace(/^-|-$/g, "")
|
|
194
|
-
.toLowerCase();
|
|
195
|
-
const link = document.createElement("a");
|
|
196
|
-
link.href = qrImage.value;
|
|
197
|
-
link.download = `hid-qr-${slug || "reader"}.png`;
|
|
198
|
-
link.click();
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
async function loadReaders() {
|
|
202
|
-
if (!props.site) return;
|
|
203
|
-
const response = toRecord(await getReaders({ site: props.site, page: 1, limit: 100 }));
|
|
204
|
-
const data = toRecord(response.data);
|
|
205
|
-
const items = response.items ?? data.items ?? data.readers ?? [];
|
|
206
|
-
readers.value = (Array.isArray(items) ? items : []).filter((reader) => reader?._id);
|
|
207
|
-
/* Shared with every other HID screen — see `useHidReaderSelection`. The
|
|
208
|
-
resolver refuses a remembered reader that is not this site's, so a site
|
|
209
|
-
switch or a deleted reader falls back to the first rather than querying
|
|
210
|
-
an id the site does not own. */
|
|
211
|
-
selectedReaderId.value = resolveForSite(props.site, readers.value);
|
|
212
|
-
}
|
|
213
|
-
|
|
214
|
-
async function loadProfile() {
|
|
215
|
-
if (!selectedReaderId.value) return;
|
|
216
|
-
loading.value = true;
|
|
217
|
-
try {
|
|
218
|
-
const response = await getProfileQr(selectedReaderId.value);
|
|
219
|
-
profile.value = response?.data ?? null;
|
|
220
|
-
await renderQr(profile.value?.qrValue || "");
|
|
221
|
-
} catch (error: unknown) {
|
|
222
|
-
profile.value = null;
|
|
223
|
-
qrImage.value = "";
|
|
224
|
-
showToast(errorMessage(error), "error");
|
|
225
|
-
} finally {
|
|
226
|
-
loading.value = false;
|
|
227
|
-
}
|
|
228
|
-
}
|
|
229
|
-
|
|
230
|
-
async function generate() {
|
|
231
|
-
if (!selectedReaderId.value) return;
|
|
232
|
-
working.value = true;
|
|
233
|
-
try {
|
|
234
|
-
const response = await issueProfileQr(selectedReaderId.value);
|
|
235
|
-
profile.value = response?.data ?? null;
|
|
236
|
-
await renderQr(profile.value?.qrValue || "");
|
|
237
|
-
showToast("QR code generated.");
|
|
238
|
-
} catch (error: unknown) {
|
|
239
|
-
showToast(errorMessage(error), "error");
|
|
240
|
-
} finally {
|
|
241
|
-
working.value = false;
|
|
242
|
-
}
|
|
243
|
-
}
|
|
244
|
-
|
|
245
|
-
async function remove() {
|
|
246
|
-
if (!selectedReaderId.value) return;
|
|
247
|
-
if (!window.confirm("Remove your QR code from this reader?")) return;
|
|
248
|
-
working.value = true;
|
|
249
|
-
try {
|
|
250
|
-
const response = await deleteProfileQr(selectedReaderId.value);
|
|
251
|
-
profile.value = response?.data ?? null;
|
|
252
|
-
await renderQr("");
|
|
253
|
-
showToast("QR code removed.");
|
|
254
|
-
} catch (error: unknown) {
|
|
255
|
-
showToast(errorMessage(error), "error");
|
|
256
|
-
} finally {
|
|
257
|
-
working.value = false;
|
|
258
|
-
}
|
|
259
|
-
}
|
|
260
|
-
|
|
261
|
-
watch(
|
|
262
|
-
() => props.site,
|
|
263
|
-
async () => {
|
|
264
|
-
await loadReaders();
|
|
265
|
-
await loadProfile();
|
|
266
|
-
},
|
|
267
|
-
{ immediate: true },
|
|
268
|
-
);
|
|
269
|
-
|
|
270
|
-
/* Publish every change, including the seed above: a screen that had to fall
|
|
271
|
-
back to the first reader should leave the others agreeing with it. */
|
|
272
|
-
watch(selectedReaderId, (value) => {
|
|
273
|
-
if (value) selectHidReader(props.site, value);
|
|
274
|
-
});
|
|
275
|
-
</script>
|
|
276
|
-
|
|
277
|
-
<style scoped>
|
|
278
|
-
.hid-profile-qr__header {
|
|
279
|
-
display: flex;
|
|
280
|
-
align-items: center;
|
|
281
|
-
gap: 12px;
|
|
282
|
-
flex-wrap: wrap;
|
|
283
|
-
}
|
|
284
|
-
|
|
285
|
-
.hid-profile-qr__title {
|
|
286
|
-
margin: 0;
|
|
287
|
-
font-size: 18px;
|
|
288
|
-
font-weight: 600;
|
|
289
|
-
}
|
|
290
|
-
|
|
291
|
-
.hid-profile-qr__card {
|
|
292
|
-
margin-top: 16px;
|
|
293
|
-
max-width: 460px;
|
|
294
|
-
}
|
|
295
|
-
|
|
296
|
-
.hid-profile-qr__reader {
|
|
297
|
-
margin: 0 0 14px;
|
|
298
|
-
font-size: 14px;
|
|
299
|
-
font-weight: 600;
|
|
300
|
-
}
|
|
301
|
-
|
|
302
|
-
.hid-profile-qr__reader span {
|
|
303
|
-
display: block;
|
|
304
|
-
color: var(--muted);
|
|
305
|
-
font-size: 12px;
|
|
306
|
-
font-weight: 500;
|
|
307
|
-
}
|
|
308
|
-
|
|
309
|
-
.hid-profile-qr__code {
|
|
310
|
-
display: grid;
|
|
311
|
-
place-items: center;
|
|
312
|
-
margin-bottom: 14px;
|
|
313
|
-
}
|
|
314
|
-
|
|
315
|
-
.hid-profile-qr__issued {
|
|
316
|
-
margin: 8px 0 0;
|
|
317
|
-
color: var(--muted);
|
|
318
|
-
font-size: 12px;
|
|
319
|
-
}
|
|
320
|
-
|
|
321
|
-
.hid-profile-qr__state {
|
|
322
|
-
color: var(--muted);
|
|
323
|
-
font-size: 13.5px;
|
|
324
|
-
padding: 8px 0 14px;
|
|
325
|
-
}
|
|
326
|
-
|
|
327
|
-
.hid-profile-qr__actions {
|
|
328
|
-
display: flex;
|
|
329
|
-
gap: 8px;
|
|
330
|
-
flex-wrap: wrap;
|
|
331
|
-
}
|
|
332
|
-
</style>
|
|
@@ -1,249 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<v-dialog :model-value="modelValue" width="1100" scrollable persistent @update:model-value="close">
|
|
3
|
-
<v-card data-test="vehicle-qr-dialog">
|
|
4
|
-
<v-card-title class="d-flex align-center">
|
|
5
|
-
<v-icon class="mr-2">mdi-qrcode</v-icon>
|
|
6
|
-
{{ step === "select" ? "Print QR stickers" : "Check before printing" }}
|
|
7
|
-
<v-spacer />
|
|
8
|
-
<v-btn icon="mdi-close" variant="text" size="small" aria-label="Close" @click="close(false)" />
|
|
9
|
-
</v-card-title>
|
|
10
|
-
|
|
11
|
-
<v-card-text>
|
|
12
|
-
<v-alert v-if="error" type="error" variant="tonal" density="compact" class="mb-3">{{ error }}</v-alert>
|
|
13
|
-
|
|
14
|
-
<!-- Step 1: choose vehicles -->
|
|
15
|
-
<template v-if="step === 'select'">
|
|
16
|
-
<div class="d-flex flex-wrap align-center ga-2 mb-2">
|
|
17
|
-
<v-checkbox-btn :model-value="allOnPageTicked" :indeterminate="someOnPageTicked && !allOnPageTicked"
|
|
18
|
-
aria-label="Select all on this page" @update:model-value="(v: any) => tickGroup(plates.map((p) => p.id), !!v)" />
|
|
19
|
-
<span class="text-body-2">Select all on this page</span>
|
|
20
|
-
<v-spacer />
|
|
21
|
-
<v-btn variant="tonal" size="small" class="text-none" :loading="loadingAll" @click="loadAll">
|
|
22
|
-
Select all matching the current tab and search
|
|
23
|
-
</v-btn>
|
|
24
|
-
</div>
|
|
25
|
-
<v-table density="compact" fixed-header height="360">
|
|
26
|
-
<thead>
|
|
27
|
-
<tr><th style="width: 48px" /><th>Blk-Level-Unit</th><th>Owner</th><th>Plate</th><th>Status</th></tr>
|
|
28
|
-
</thead>
|
|
29
|
-
<tbody>
|
|
30
|
-
<tr v-for="p in plates" :key="p.id">
|
|
31
|
-
<td><v-checkbox-btn :model-value="selected.includes(p.id)" :aria-label="`Select ${p.plateNumber}`"
|
|
32
|
-
@update:model-value="(v: any) => tickGroup([p.id], !!v)" /></td>
|
|
33
|
-
<td>{{ p.unitLabel || "-" }}</td>
|
|
34
|
-
<td>{{ p.ownerName || "-" }}</td>
|
|
35
|
-
<td class="font-weight-bold">{{ p.plateNumber }}</td>
|
|
36
|
-
<td>{{ p.status || "-" }}</td>
|
|
37
|
-
</tr>
|
|
38
|
-
<tr v-if="!plates.length"><td colspan="5" class="text-center text-medium-emphasis py-6">No vehicles to list</td></tr>
|
|
39
|
-
</tbody>
|
|
40
|
-
</v-table>
|
|
41
|
-
<p class="text-caption text-medium-emphasis mt-2 mb-0">
|
|
42
|
-
Up to {{ STICKER_MAX_PER_REQUEST }} stickers at a time. Ticked: {{ selected.length }}.
|
|
43
|
-
</p>
|
|
44
|
-
</template>
|
|
45
|
-
|
|
46
|
-
<!-- Step 2: review + preview -->
|
|
47
|
-
<template v-else>
|
|
48
|
-
<v-alert v-if="missing.length" type="warning" variant="tonal" density="compact" class="mb-3">
|
|
49
|
-
{{ missing.length }} vehicle(s) could not be found and were skipped.
|
|
50
|
-
</v-alert>
|
|
51
|
-
<v-alert v-if="dropped" type="info" variant="tonal" density="compact" class="mb-3">
|
|
52
|
-
{{ dropped }} more vehicle(s) were over the {{ STICKER_MAX_PER_REQUEST }} limit - print again for the rest.
|
|
53
|
-
</v-alert>
|
|
54
|
-
<v-table density="compact" fixed-header height="220">
|
|
55
|
-
<thead>
|
|
56
|
-
<tr><th style="width: 48px" /><th>Blk-Level-Unit</th><th>Owner</th><th>Plate</th><th>Check</th></tr>
|
|
57
|
-
</thead>
|
|
58
|
-
<tbody>
|
|
59
|
-
<tr v-for="it in items" :key="it.vehicleId">
|
|
60
|
-
<td><v-checkbox-btn :model-value="ticked.includes(it.vehicleId)" :aria-label="`Print ${it.plateNumber}`"
|
|
61
|
-
@update:model-value="(v: any) => (ticked = setIds(ticked, [it.vehicleId], !!v))" /></td>
|
|
62
|
-
<td>{{ installerLine(it).place || "-" }}</td>
|
|
63
|
-
<td>{{ installerLine(it).owner || "-" }}</td>
|
|
64
|
-
<td class="font-weight-bold">{{ it.plateNumber }}</td>
|
|
65
|
-
<td>
|
|
66
|
-
<v-chip v-if="stickerWarning(it.status)" size="small" variant="tonal"
|
|
67
|
-
:color="stickerWarning(it.status)!.level" prepend-icon="mdi-alert">
|
|
68
|
-
{{ stickerWarning(it.status)!.text }}
|
|
69
|
-
</v-chip>
|
|
70
|
-
<span v-else class="text-medium-emphasis">OK</span>
|
|
71
|
-
</td>
|
|
72
|
-
</tr>
|
|
73
|
-
</tbody>
|
|
74
|
-
</v-table>
|
|
75
|
-
<p class="text-caption text-medium-emphasis my-2">
|
|
76
|
-
Expired, blocklisted and inactive vehicles start unticked. Each sticker has a cut-off strip under the
|
|
77
|
-
dashed line saying which unit and owner it is for - cut it off before pasting the sticker on the car.
|
|
78
|
-
</p>
|
|
79
|
-
<iframe ref="frame" title="Sticker sheet preview" :srcdoc="docHtml" class="sticker-preview" />
|
|
80
|
-
</template>
|
|
81
|
-
</v-card-text>
|
|
82
|
-
|
|
83
|
-
<v-card-actions>
|
|
84
|
-
<v-btn v-if="step === 'review' && !fromReissue" variant="text" class="text-none" @click="step = 'select'">Back</v-btn>
|
|
85
|
-
<v-spacer />
|
|
86
|
-
<v-btn variant="text" class="text-none" @click="close(false)">Cancel</v-btn>
|
|
87
|
-
<v-btn v-if="step === 'select'" color="primary" variant="flat" class="text-none" :disabled="!selected.length"
|
|
88
|
-
:loading="loading" @click="goReview">
|
|
89
|
-
Preview {{ selected.length }} sticker{{ selected.length === 1 ? "" : "s" }}
|
|
90
|
-
</v-btn>
|
|
91
|
-
<v-btn v-else color="primary" variant="flat" class="text-none" prepend-icon="mdi-printer"
|
|
92
|
-
:disabled="!ticked.length || !docHtml" @click="print">
|
|
93
|
-
Print {{ ticked.length }} sticker{{ ticked.length === 1 ? "" : "s" }}
|
|
94
|
-
</v-btn>
|
|
95
|
-
</v-card-actions>
|
|
96
|
-
</v-card>
|
|
97
|
-
</v-dialog>
|
|
98
|
-
</template>
|
|
99
|
-
|
|
100
|
-
<script lang="ts" setup>
|
|
101
|
-
import QRCode from "qrcode";
|
|
102
|
-
import useVehicle from "../composables/useVehicle";
|
|
103
|
-
import { errorConverter } from "../utils/data";
|
|
104
|
-
import {
|
|
105
|
-
STICKER_MAX_PER_REQUEST,
|
|
106
|
-
buildStickerDocument,
|
|
107
|
-
defaultPlateIds,
|
|
108
|
-
defaultStickerIds,
|
|
109
|
-
idsForRequest,
|
|
110
|
-
installerLine,
|
|
111
|
-
setIds,
|
|
112
|
-
stickerPlateRows,
|
|
113
|
-
stickerWarning,
|
|
114
|
-
type StickerItem,
|
|
115
|
-
type StickerPlateRow,
|
|
116
|
-
} from "../utils/vehicle-qr-sticker";
|
|
117
|
-
|
|
118
|
-
const props = defineProps({
|
|
119
|
-
modelValue: { type: Boolean, default: false },
|
|
120
|
-
site: { type: String, required: true },
|
|
121
|
-
/** The list's rows on the current page. */
|
|
122
|
-
rows: { type: Array as PropType<Array<Record<string, any>>>, default: () => [] },
|
|
123
|
-
/** The list's current tab and search, used by "select all matching". */
|
|
124
|
-
view: { type: String, default: "" },
|
|
125
|
-
search: { type: String, default: "" },
|
|
126
|
-
/** Vehicle ids to go straight to review with (a re-issued sticker). */
|
|
127
|
-
vehicleIds: { type: Array as PropType<string[]>, default: () => [] },
|
|
128
|
-
});
|
|
129
|
-
const emit = defineEmits(["update:modelValue"]);
|
|
130
|
-
|
|
131
|
-
const { getVehicles, getVehicleQrStickers } = useVehicle();
|
|
132
|
-
|
|
133
|
-
const step = ref<"select" | "review">("select");
|
|
134
|
-
const plates = ref<StickerPlateRow[]>([]);
|
|
135
|
-
const selected = ref<string[]>([]);
|
|
136
|
-
const items = ref<StickerItem[]>([]);
|
|
137
|
-
const ticked = ref<string[]>([]);
|
|
138
|
-
const missing = ref<string[]>([]);
|
|
139
|
-
const dropped = ref(0);
|
|
140
|
-
const loading = ref(false);
|
|
141
|
-
const loadingAll = ref(false);
|
|
142
|
-
const error = ref("");
|
|
143
|
-
const docHtml = ref("");
|
|
144
|
-
const frame = ref<HTMLIFrameElement | null>(null);
|
|
145
|
-
const fromReissue = computed(() => props.vehicleIds.length > 0);
|
|
146
|
-
|
|
147
|
-
const allOnPageTicked = computed(() => plates.value.length > 0 && plates.value.every((p) => selected.value.includes(p.id)));
|
|
148
|
-
const someOnPageTicked = computed(() => plates.value.some((p) => selected.value.includes(p.id)));
|
|
149
|
-
|
|
150
|
-
function tickGroup(ids: string[], on: boolean) {
|
|
151
|
-
selected.value = setIds(selected.value, ids, on);
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
function close(value: boolean) {
|
|
155
|
-
emit("update:modelValue", value);
|
|
156
|
-
}
|
|
157
|
-
|
|
158
|
-
watch(
|
|
159
|
-
() => props.modelValue,
|
|
160
|
-
async (open) => {
|
|
161
|
-
if (!open) return;
|
|
162
|
-
error.value = "";
|
|
163
|
-
items.value = [];
|
|
164
|
-
docHtml.value = "";
|
|
165
|
-
step.value = "select";
|
|
166
|
-
plates.value = stickerPlateRows(props.rows);
|
|
167
|
-
selected.value = defaultPlateIds(plates.value);
|
|
168
|
-
if (props.vehicleIds.length) {
|
|
169
|
-
selected.value = [...props.vehicleIds];
|
|
170
|
-
await goReview();
|
|
171
|
-
}
|
|
172
|
-
},
|
|
173
|
-
{ immediate: true },
|
|
174
|
-
);
|
|
175
|
-
|
|
176
|
-
/** Every page of the current tab + search, up to the per-request cap. */
|
|
177
|
-
async function loadAll() {
|
|
178
|
-
loadingAll.value = true;
|
|
179
|
-
error.value = "";
|
|
180
|
-
try {
|
|
181
|
-
const all: Array<Record<string, any>> = [];
|
|
182
|
-
let page = 1;
|
|
183
|
-
let pages = 1;
|
|
184
|
-
do {
|
|
185
|
-
const res: any = await getVehicles({ page, limit: 100, search: props.search, view: props.view, site: props.site });
|
|
186
|
-
all.push(...(res?.items ?? []));
|
|
187
|
-
pages = res?.pages || 1;
|
|
188
|
-
page += 1;
|
|
189
|
-
} while (page <= pages && stickerPlateRows(all).length < STICKER_MAX_PER_REQUEST);
|
|
190
|
-
plates.value = stickerPlateRows(all);
|
|
191
|
-
selected.value = defaultPlateIds(plates.value);
|
|
192
|
-
} catch (e: any) {
|
|
193
|
-
error.value = errorConverter(e);
|
|
194
|
-
} finally {
|
|
195
|
-
loadingAll.value = false;
|
|
196
|
-
}
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
async function goReview() {
|
|
200
|
-
loading.value = true;
|
|
201
|
-
error.value = "";
|
|
202
|
-
try {
|
|
203
|
-
const { ids, dropped: over } = idsForRequest(selected.value);
|
|
204
|
-
const res = await getVehicleQrStickers(props.site, ids);
|
|
205
|
-
items.value = (res?.items ?? []) as StickerItem[];
|
|
206
|
-
missing.value = res?.missing ?? [];
|
|
207
|
-
dropped.value = over;
|
|
208
|
-
ticked.value = defaultStickerIds(items.value);
|
|
209
|
-
step.value = "review";
|
|
210
|
-
} catch (e: any) {
|
|
211
|
-
error.value = errorConverter(e);
|
|
212
|
-
} finally {
|
|
213
|
-
loading.value = false;
|
|
214
|
-
}
|
|
215
|
-
}
|
|
216
|
-
|
|
217
|
-
// The same document is the preview and the print job. Error correction Q and a
|
|
218
|
-
// 4-module quiet zone; the QR is drawn at 32 mm so it scans from arm's length.
|
|
219
|
-
let renderToken = 0;
|
|
220
|
-
watch([items, ticked], async () => {
|
|
221
|
-
const mine = ++renderToken;
|
|
222
|
-
const chosen = items.value.filter((i) => ticked.value.includes(i.vehicleId));
|
|
223
|
-
if (!chosen.length) {
|
|
224
|
-
docHtml.value = "";
|
|
225
|
-
return;
|
|
226
|
-
}
|
|
227
|
-
const svgs = await Promise.all(
|
|
228
|
-
chosen.map((i) => QRCode.toString(i.qr, { type: "svg", errorCorrectionLevel: "Q", margin: 4 })),
|
|
229
|
-
);
|
|
230
|
-
if (mine === renderToken) docHtml.value = buildStickerDocument(chosen, svgs);
|
|
231
|
-
});
|
|
232
|
-
|
|
233
|
-
function print() {
|
|
234
|
-
const win = frame.value?.contentWindow;
|
|
235
|
-
if (!win) return;
|
|
236
|
-
win.focus();
|
|
237
|
-
win.print();
|
|
238
|
-
}
|
|
239
|
-
</script>
|
|
240
|
-
|
|
241
|
-
<style scoped>
|
|
242
|
-
.sticker-preview {
|
|
243
|
-
width: 100%;
|
|
244
|
-
height: 460px;
|
|
245
|
-
border: 1px solid var(--v-border-color, #ccc);
|
|
246
|
-
border-radius: 8px;
|
|
247
|
-
background: #e9e9e9;
|
|
248
|
-
}
|
|
249
|
-
</style>
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
EMPTY_HID_READER_CHOICE,
|
|
3
|
-
resolveHidReaderId,
|
|
4
|
-
type HidReaderChoice,
|
|
5
|
-
} from "../utils/hid-reader-selection";
|
|
6
|
-
|
|
7
|
-
/**
|
|
8
|
-
* ONE HID READER CHOICE, SHARED BY EVERY HID SCREEN.
|
|
9
|
-
*
|
|
10
|
-
* Declared at MODULE scope on purpose. Each screen held its own `ref("")`, and
|
|
11
|
-
* because the HID screens are separate pages the ref was rebuilt on every
|
|
12
|
-
* navigation — HID Reader Users, HID Cards, Access Logs and HID QR Code each
|
|
13
|
-
* reset to the first reader no matter what had just been picked next door.
|
|
14
|
-
*
|
|
15
|
-
* A module-scoped ref is enough because moving between those pages is a ROUTE
|
|
16
|
-
* change, not a page load: the menu's items carry a `route` and
|
|
17
|
-
* `NavigationItem.vue` renders them through `:to`, so vue-router handles them
|
|
18
|
-
* and this module is never re-evaluated.
|
|
19
|
-
*
|
|
20
|
-
* Deliberately NOT persisted. `localStorage` would carry the choice through a
|
|
21
|
-
* hard refresh as well, which is a real but much smaller benefit than the
|
|
22
|
-
* navigation case, and it is worth adding only once somebody has felt the
|
|
23
|
-
* absence. See `utils/hid-reader-selection.ts` for the staleness rule that
|
|
24
|
-
* would have to hold either way.
|
|
25
|
-
*
|
|
26
|
-
* Intercom keeps its own reader and is not wired to this. Its question is which
|
|
27
|
-
* panel you are calling, not which door you are administering, and joining them
|
|
28
|
-
* would mean switching reader on Access Logs changed who you would dial.
|
|
29
|
-
*/
|
|
30
|
-
const choice = ref<HidReaderChoice>({ ...EMPTY_HID_READER_CHOICE });
|
|
31
|
-
|
|
32
|
-
export default function useHidReaderSelection() {
|
|
33
|
-
/** Remember a choice. The site travels with it; an id alone means nothing. */
|
|
34
|
-
function selectHidReader(siteId: string, readerId: string) {
|
|
35
|
-
choice.value = { siteId: String(siteId ?? ""), readerId: String(readerId ?? "") };
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* The reader this screen should show, given the readers it just loaded.
|
|
40
|
-
*
|
|
41
|
-
* Call it after the reader list arrives, and write the answer back with
|
|
42
|
-
* `selectHidReader` so the screens agree on what "current" means even when
|
|
43
|
-
* one of them had to fall back to the first reader.
|
|
44
|
-
*/
|
|
45
|
-
function resolveForSite(siteId: string, readers: readonly { _id?: unknown }[]) {
|
|
46
|
-
return resolveHidReaderId(siteId, readers, choice.value);
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
return { choice, selectHidReader, resolveForSite };
|
|
50
|
-
}
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* THE CATEGORY OF THE SITE THE USER IS CURRENTLY IN.
|
|
3
|
-
*
|
|
4
|
-
* One shared answer, published once by the application's layout from the site
|
|
5
|
-
* it already loaded for the switcher, and read by anything that has to behave
|
|
6
|
-
* differently on a commercial or industrial site - the business Add Tenant
|
|
7
|
-
* form, the tenant list. Publishing it rather than re-fetching it per
|
|
8
|
-
* component means no two screens can disagree about which site this is.
|
|
9
|
-
*
|
|
10
|
-
* READ FROM THE CUSTOMER-SITE RECORD, NOT THE SITE RECORD. Both carry a
|
|
11
|
-
* `category` and `customer-site.service` keeps them equal (it writes the site
|
|
12
|
-
* on create and on update), but `siteSchema` DEFAULTS the site's own copy to
|
|
13
|
-
* `commercial` - so a site created without an explicit category reads back as
|
|
14
|
-
* commercial there even when it is a residential estate. The customer-site
|
|
15
|
-
* copy has no default: it is either the category somebody chose or nothing.
|
|
16
|
-
*
|
|
17
|
-
* An empty category means "not published yet" or "never set", and every
|
|
18
|
-
* caller must behave as it did before this existed - never assume commercial
|
|
19
|
-
* from silence.
|
|
20
|
-
*/
|
|
21
|
-
const BUSINESS_SITE_CATEGORIES: string[] = ["commercial", "industrial"];
|
|
22
|
-
|
|
23
|
-
export default function useSiteCategory() {
|
|
24
|
-
const siteCategory = useState<string>("current-site-category", () => "");
|
|
25
|
-
|
|
26
|
-
function setSiteCategory(value?: string | null) {
|
|
27
|
-
siteCategory.value = typeof value === "string" ? value : "";
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
/**
|
|
31
|
-
* The categories whose units are LET TO A BUSINESS rather than lived in.
|
|
32
|
-
*
|
|
33
|
-
* These are the sites where a unit has an owner, an occupier and often a
|
|
34
|
-
* person in charge who is neither, so they are the sites that ask for a
|
|
35
|
-
* tenant's standing and print it back (see `OCCUPANCY_ROLE_OPTIONS`).
|
|
36
|
-
*
|
|
37
|
-
* The category never changes what the APPLICATION is called: the rail says
|
|
38
|
-
* Property Management on every site it serves.
|
|
39
|
-
*/
|
|
40
|
-
const isBusinessSite = computed(() =>
|
|
41
|
-
BUSINESS_SITE_CATEGORIES.includes(siteCategory.value),
|
|
42
|
-
);
|
|
43
|
-
|
|
44
|
-
return { siteCategory, isBusinessSite, setSiteCategory };
|
|
45
|
-
}
|