feat: register public page saves to localstorage (#48)

* feat: register public page saves to localstorage

previsously it fetched all tickets without much information. now it
saves the full scanned ticket after it was scanned, so it can be checked
by some1 without a login

* add last scan

* short id

* prettier

static/js/register.js

@@ -6,17 +6,13 @@ window.PageEventsRegister = {
       ticketsTable: {
         columns: [
           {name: 'name', align: 'left', label: 'Name', field: 'name'},
+          {name: 'email', align: 'left', label: 'Email', field: 'email'},
           {
-            name: 'registered',
+            name: 'id',
             align: 'left',
-            label: 'Registered',
-            field: 'registered'
-          },
-          {
-            name: 'paid',
-            align: 'left',
-            label: 'Paid',
-            field: 'paid'
+            label: 'ID',
+            field: 'id',
+            format: val => this.shortId(val)
           }
         ],
         pagination: {
@@ -26,12 +22,20 @@ window.PageEventsRegister = {
       sendCamera: {
         show: false,
         camera: 'auto'
-      }
+      },
+      lastScan: null
     }
   },
   methods: {
-    hoverEmail(tmp) {
-      this.tickets.data.emailtemp = tmp
+    storageKey() {
+      return `events_scanned_${this.eventId}`
+    },
+    loadScannedTickets() {
+      this.tickets = Quasar.LocalStorage.getItem(this.storageKey()) || []
+    },
+    saveScannedTicket(ticket) {
+      this.tickets.unshift(ticket)
+      Quasar.LocalStorage.set(this.storageKey(), this.tickets)
     },
     closeCamera() {
       this.sendCamera.show = false
@@ -39,30 +43,32 @@ window.PageEventsRegister = {
     showCamera() {
       this.sendCamera.show = true
     },
+    shortId(id) {
+      return id ? `${id.slice(0, 6)}...${id.slice(-4)}` : ''
+    },
     decodeQR(res) {
       this.sendCamera.show = false
       const value = res[0].rawValue.split('//')[1]
       LNbits.api
         .request('PUT', `/events/api/v1/tickets/register/${value}`)
-        .then(() => {
-          Quasar.Notify.create({
-            type: 'positive',
-            message: 'Registered!'
-          })
-        })
-        .catch(LNbits.utils.notifyApiError)
-    },
-    getEventTickets() {
-      LNbits.api
-        .request('GET', `/events/api/v1/events/${this.eventId}/tickets`)
         .then(response => {
-          this.tickets = response.data
+          this.saveScannedTicket(response.data)
+          this.lastScan = {success: true, ticket: response.data}
+          Quasar.Notify.create({type: 'positive', message: 'Registered!'})
+        })
+        .catch(error => {
+          this.lastScan = {
+            success: false,
+            ticketId: value,
+            error:
+              error.response?.data?.detail || error.message || 'Unknown error'
+          }
+          LNbits.utils.notifyApiError(error)
         })
-        .catch(LNbits.utils.notifyApiError)
     }
   },
   created() {
     this.eventId = this.$route.params.id
-    this.getEventTickets()
+    this.loadScannedTickets()
   }
 }

static/js/register.vue

@@ -16,6 +16,28 @@
         </q-card-section>
       </q-card>
 
+      <q-card
+        v-if="lastScan"
+        :class="lastScan.success ? 'bg-positive' : 'bg-negative'"
+      >
+        <q-card-section class="text-white">
+          <div v-if="lastScan.success">
+            <div class="text-h6 q-mb-sm">Registered</div>
+            <div><strong>Name:</strong> {{ lastScan.ticket.name }}</div>
+            <div><strong>Email:</strong> {{ lastScan.ticket.email }}</div>
+            <div><strong>Paid:</strong> {{ lastScan.ticket.paid }}</div>
+            <div><strong>ID:</strong> {{ shortId(lastScan.ticket.id) }}</div>
+          </div>
+          <div v-else>
+            <div class="text-h6 q-mb-sm">Failed</div>
+            <div>
+              <strong>Ticket ID:</strong> {{ shortId(lastScan.ticketId) }}
+            </div>
+            <div><strong>Error:</strong> {{ lastScan.error }}</div>
+          </div>
+        </q-card-section>
+      </q-card>
+
       <q-card>
         <q-card-section>
           <q-table

views_api.py

@@ -30,7 +30,6 @@ from .crud import (
     delete_event_tickets,
     delete_ticket,
     get_event,
-    get_event_tickets,
     get_events,
     get_ticket,
     get_tickets,
@@ -164,14 +163,6 @@ async def api_form_delete(
     await delete_event_tickets(event_id)
 
 
-@events_api_router.get(
-    "/{event_id}/tickets",
-    response_model=list[PublicTicket],
-)
-async def api_event_tickets(event_id: str) -> list[Ticket]:
-    return await get_event_tickets(event_id)
-
-
 @tickets_api_router.get("")
 async def api_tickets(
     all_wallets: bool = Query(False),
@@ -323,7 +314,7 @@ async def api_ticket_delete(
     await delete_ticket(ticket_id)
 
 
-@tickets_api_router.put("/register/{ticket_id}", response_model=PublicTicket)
+@tickets_api_router.put("/register/{ticket_id}")
 async def api_event_register_ticket(ticket_id) -> Ticket:
     ticket = await get_ticket(ticket_id)