From 15217c640ab7514081149ae151a47d9c715a6e4e Mon Sep 17 00:00:00 2001 From: Janis Hutz Date: Wed, 26 Jul 2023 16:45:15 +0200 Subject: [PATCH] working occupied seats --- src/server/backend/api/getHandler.js | 1 - src/server/backend/api/postHandler.js | 8 +-- src/server/backend/userAPIRoutes.js | 2 +- .../seatplanComponents/seats/rectangular.vue | 14 +++-- .../seatplan/userApp/userWindow.vue | 52 +++++++++++-------- 5 files changed, 44 insertions(+), 33 deletions(-) diff --git a/src/server/backend/api/getHandler.js b/src/server/backend/api/getHandler.js index 85689c1..6a2c646 100644 --- a/src/server/backend/api/getHandler.js +++ b/src/server/backend/api/getHandler.js @@ -30,7 +30,6 @@ class GETHandler { if ( query.event ) { db.getJSONDataSimple( 'booked', query.event ).then( data => { db.getDataSimple( 'temp', 'user_id', session.id ).then( dat => { - console.log( dat ); resolve( { 'booked': data ?? {}, 'user': dat[ 0 ] ? JSON.parse( dat[ 0 ].data )[ query.event ] ?? {} : {} } ); } ); } ).catch( error => { diff --git a/src/server/backend/api/postHandler.js b/src/server/backend/api/postHandler.js index d8bf2d3..fd4e4c4 100644 --- a/src/server/backend/api/postHandler.js +++ b/src/server/backend/api/postHandler.js @@ -11,7 +11,7 @@ const db = require( '../db/db.js' ); class POSTHandler { constructor () { - this.allSelectedSeats = { 'TestEvent2': [ 'secAr1s1' ] }; + this.allSelectedSeats = { 'TestEvent2': [ { 'id': 'secAr1s1', 'component': 1 } ] }; } // Add lang in the future @@ -31,7 +31,7 @@ class POSTHandler { if ( this.allSelectedSeats[ data.eventID ].includes( data.id ) ) { reject( { 'code': 409, 'message': 'Seat already selected' } ); } else { - this.allSelectedSeats[ data.eventID ].push( data.id ); + this.allSelectedSeats[ data.eventID ].push( { 'id': data.id, 'component': data.component } ); transmit[ data.eventID ][ data.id ] = data; db.writeDataSimple( 'temp', 'user_id', session.id, { 'user_id': session.id, 'data': JSON.stringify( transmit ), 'timestamp': new Date().toString() } ).then( () => { resolve( 'ok' ); @@ -69,8 +69,8 @@ class POSTHandler { } ); } - getReservedSeats () { - return this.allSelectedSeats; + getReservedSeats ( event ) { + return this.allSelectedSeats[ event ]; } } diff --git a/src/server/backend/userAPIRoutes.js b/src/server/backend/userAPIRoutes.js index 9a5fa41..c05af2a 100644 --- a/src/server/backend/userAPIRoutes.js +++ b/src/server/backend/userAPIRoutes.js @@ -21,7 +21,7 @@ module.exports = ( app ) => { getHandler.handleCall( req.params.call, req.query, req.session ).then( data => { if ( req.params.call === 'getReservedSeats' ) { let dat = data; - dat[ 'reserved' ] = postHandler.getReservedSeats(); + dat[ 'reserved' ] = postHandler.getReservedSeats( req.query.event ); res.send( dat ); } else { res.send( data ); diff --git a/src/webapp/main/src/components/seatplan/userApp/seatplanComponents/seats/rectangular.vue b/src/webapp/main/src/components/seatplan/userApp/seatplanComponents/seats/rectangular.vue index d6e6d50..2237d47 100644 --- a/src/webapp/main/src/components/seatplan/userApp/seatplanComponents/seats/rectangular.vue +++ b/src/webapp/main/src/components/seatplan/userApp/seatplanComponents/seats/rectangular.vue @@ -59,6 +59,10 @@ export default { id: { type: Number, "default": 1, + }, + unavailable: { + type: Object, + "default": {} } }, data () { @@ -94,9 +98,9 @@ export default { this.seats[ row ][ n ][ 'style' ] += `color: ${ this.data.categoryInfo.color.fg ? this.data.categoryInfo.color.fg : 'black' }; background-color: ${ this.data.categoryInfo.color.bg ? this.data.categoryInfo.color.bg : 'rgba( 0, 0, 0, 0 )' }`; } - if ( this.data.unavailableSeats ) { - if ( this.data.unavailableSeats[ this.seats[ row ][ n ][ 'id' ] ] ) { - this.seats[ row ][ n ][ 'status' ] = this.data.unavailableSeats[ this.seats[ row ][ n ][ 'id' ] ]; + if ( this.unavailable[ this.id ] ) { + if ( this.unavailable[ this.id ][ this.seats[ row ][ n ][ 'id' ] ] ) { + this.seats[ row ][ n ][ 'status' ] = this.unavailable[ this.id ][ this.seats[ row ][ n ][ 'id' ] ]; } } } @@ -127,6 +131,7 @@ export default { }, watch: { scaleFactor() { + console.log( 'scaleFactor' ); this.setScaleFactor(); }, h() { @@ -138,7 +143,8 @@ export default { origin() { this.calculateChairs(); }, - data () { + unavailable() { + console.log( 'updating' ); this.calculateChairs(); } }, diff --git a/src/webapp/main/src/components/seatplan/userApp/userWindow.vue b/src/webapp/main/src/components/seatplan/userApp/userWindow.vue index e50c477..0aa1cc5 100644 --- a/src/webapp/main/src/components/seatplan/userApp/userWindow.vue +++ b/src/webapp/main/src/components/seatplan/userApp/userWindow.vue @@ -17,17 +17,17 @@ @@ -90,6 +90,7 @@ generalSettings: { 'namingScheme': 'numeric' }, selectedSeat: {}, cart: {}, + unavailableSeats: {}, } }, methods: { @@ -151,7 +152,7 @@ } for ( let element in this.draggables ) { - this.draggables[ element ][ 'data' ] = { 'sector': this.draggables[ element ][ 'sector' ], 'unavailableSeats': {}, 'categoryInfo': { 'pricing': categoryDetails[ this.draggables[ element ][ 'category' ] ] } }; + this.draggables[ element ][ 'data' ] = { 'sector': this.draggables[ element ][ 'sector' ], 'categoryInfo': { 'pricing': categoryDetails[ this.draggables[ element ][ 'category' ] ] } }; } this.seatChecks(); @@ -162,27 +163,38 @@ }, 1 ); }, seatChecks () { - // TODO: Check if all seats are available - // Method: Server sends all user selected seats + all selected seats. If seat is in both - // then selected, if just in all selected, taken, else available. let self = this; let allSeatsAvailable = true; fetch( localStorage.getItem( 'url' ) + '/getAPI/getReservedSeats?event=' + this.event.name ).then( res => { if ( res.status === 200 ) { + let unavailableSeats = {}; res.json().then( data => { + for ( let seat in data.booked ) { + if ( !unavailableSeats[ data.booked[ seat ].component ] ) { + unavailableSeats[ data.booked[ seat ].component ]; + } + unavailableSeats[ data.booked[ seat ].component ][ data.booked[ seat ].id ] = 'nav'; + } + + for ( let seat in data.reserved ) { + if ( !unavailableSeats[ data.reserved[ seat ].component ] ) { + unavailableSeats[ data.reserved[ seat ].component ] = {}; + } + unavailableSeats[ data.reserved[ seat ].component ][ data.reserved[ seat ].id ] = 'nav'; + } + + for ( let seat in data.user ) { + if ( !unavailableSeats[ data.user[ seat ].component ] ) { + unavailableSeats[ data.reserved[ seat ].component ] = {}; + } + unavailableSeats[ data.user[ seat ].component ][ data.user[ seat ].id ] = 'sel'; + } + let tickets = {}; if ( this.cart[ this.event.name ] ) { tickets = this.cart[ this.event.name ][ 'tickets' ]; } - if ( Object.keys( data.booked ).length > 0 && Object.keys( data.reserved ).length > 0 ) { - for ( let ticket in data.booked ) { - this.draggables[ data.booked[ ticket ].component ][ 'data' ][ 'unavailableSeats' ][ ticket ] = 'nav'; - } - for ( let ticket in data.reserved ) { - this.draggables[ data.reserved[ ticket ] ][ 'data' ][ 'unavailableSeats' ][ ticket ] = 'nav'; - } - } if ( data.user ) { for ( let element in tickets ) { @@ -199,10 +211,8 @@ delete this.cart[ this.event.name ]; allSeatsAvailable = false; } - - for ( let ticket in tickets ) { - this.draggables[ tickets[ ticket ].comp ][ 'data' ][ 'unavailableSeats' ][ ticket ] = 'sel'; - } + + this.unavailableSeats = unavailableSeats; if ( !allSeatsAvailable ) { setTimeout( () => { @@ -210,10 +220,6 @@ }, 500 ); localStorage.setItem( 'cart', JSON.stringify( this.cart ) ); } - - sessionStorage.setItem( 'seatplan', JSON.stringify( this.scaleDown( this.draggables ) ) ); - - // this.loadSeatplan(); } ); } else { console.error( 'unable to load' );