config update, Almost fully styled details page

This commit is contained in:
2023-08-21 14:52:24 +02:00
parent 6743ed778e
commit e2440485d9
8 changed files with 40 additions and 18 deletions

View File

@@ -38,7 +38,7 @@ if ( prod ) {
} );
} );
} else {
localStorage.setItem( 'url', 'http://localhost:8081' );
localStorage.setItem( 'url', 'http://localhost:8080' );
userStore.setUserAuth( true );
userStore.setAdminAuth( true );
localStorage.setItem( 'name', 'libreevent' );

View File

@@ -91,7 +91,7 @@
methods: {
setActiveTicket ( id ) {
sessionStorage.setItem( 'selectedTicket', id );
sessionStorage.setItem( 'ticketData', JSON.stringify( { 'description': this.events[ id ][ 'description' ], 'name': this.events[ id ][ 'name' ], 'locationName': this.events[ id ][ 'locationName' ] } ) );
sessionStorage.setItem( 'ticketData', JSON.stringify( { 'description': this.events[ id ][ 'description' ], 'name': this.events[ id ][ 'name' ], 'locationName': this.events[ id ][ 'locationName' ], 'date': this.events[ id ][ 'date' ] } ) );
sessionStorage.setItem( 'hasSeatplan', this.events[ id ][ 'hasSeatplan' ] );
},
loadEvents () {

View File

@@ -9,11 +9,18 @@
<template>
<div class="details">
<div class="top-container" :style="`background: url( ${ event.banner } ); background-repeat: no-repeat; background-size: cover;`">
<div class="top-container" :style="`background-image: url( ${ event.banner } ); background-repeat: no-repeat; background-size: cover;`">
<img :src="event.logo" alt="Event Logo" class="event-logo">
<h1 class="eventTitle">{{ event.name }}</h1>
<router-link to="/tickets" class="back-button"><span class="material-symbols-outlined" style="font-size: 100%;">arrow_back</span></router-link>
</div>
<p>{{ event.description }}</p>
<div class="main">
<p>{{ event.description }}</p>
</div>
<aside>
<p>{{ event.location }}</p>
<p>{{ new Date( event.date ).toLocaleString() }}</p>
</aside>
<router-link to="/tickets/order">Order tickets</router-link>
</div>
</template>
@@ -38,6 +45,13 @@
margin: 0;
}
.event-logo {
position: absolute;
left: 10px;
top: calc( 87px + 2.5vh );
height: 40vh;
}
.back-button {
color: white;
background-color: rgb(31, 31, 31);
@@ -63,11 +77,11 @@
this.$router.push( '/tickets' );
}
this.eventID = sessionStorage.getItem( 'selectedTicket' );
this.event[ 'banner' ] = localStorage.getItem( 'url' ) + '/eventAssets/' + this.eventID + '-banner.jpg';
this.event[ 'logo' ] = localStorage.getItem( 'url' ) + '/eventAssets/' + this.eventID + '-logo.jpg';
this.event[ 'banner' ] = localStorage.getItem( 'url' ) + '/otherAssets/logo.png';
this.event[ 'banner' ] = localStorage.getItem( 'url' ) + '/eventAssets/' + this.eventID + 'Banner.jpg';
this.event[ 'logo' ] = localStorage.getItem( 'url' ) + '/eventAssets/' + this.eventID + 'Logo.jpg';
const eventData = JSON.parse( sessionStorage.getItem( 'ticketData' ) );
this.event.name = eventData[ 'name' ];
this.event.date = eventData[ 'date' ];
this.event.description = eventData[ 'description' ];
this.event.location = eventData[ 'locationName' ];
},

View File

@@ -45,7 +45,7 @@
},
created () {
// TODO: Also get all orders of user (using join functions)
fetch( '/user/details' ).then( res => {
fetch( localStorage.getItem( 'url' ) + '/user/details' ).then( res => {
if ( res.status === 200 ) {
res.json().then( data => {
if ( data.status ) {
@@ -62,11 +62,13 @@
this.$router.push( '/login' );
}
} );
} else if ( res.status === 403 ) {
} else if ( res.status === 403 || res.status === 404 || res.status === 500 ) {
this.userStore.setUserAuth( false );
this.userStore.setUser2fa( false );
this.$router.push( '/login' );
}
} ).catch( err => {
console.warn( '[ AccountView ] Loading failed with the following message: ' + err );
} );
if ( this.userStore.getUserTwoFACompliant ) {
this.userStore.setUser2fa( false );

View File

@@ -10,6 +10,6 @@ export default defineConfig( {
},
},
server: {
'port': 8080
'port': 8081
}
} );

View File

@@ -14,6 +14,6 @@ export default defineConfig( {
},
},
server: {
'port': 8080
'port': 8081
}
})