2019-11-13 21:02:44 +00:00
|
|
|
<template>
|
2023-11-27 00:14:52 +00:00
|
|
|
<div id="app">
|
2024-01-07 20:42:23 +00:00
|
|
|
<AddItemModal v-if="addItemModalOpen && isLoggedIn" @close="closeAddItemModal()" isModal="true"/>
|
|
|
|
<AddTicketModal v-if="addTicketModalOpen && isLoggedIn" @close="closeAddTicketModal()" isModal="true"/>
|
2023-12-28 21:49:55 +00:00
|
|
|
<AddBoxModal v-if="showAddBoxModal && isLoggedIn" @close="closeAddBoxModal()" isModal="true"/>
|
2024-01-07 20:42:23 +00:00
|
|
|
<Navbar v-if="isLoggedIn" @addItemClicked="openAddItemModal()" @addTicketClicked="openAddTicketModal()"/>
|
2023-11-27 00:14:52 +00:00
|
|
|
<router-view/>
|
2024-01-07 20:42:23 +00:00
|
|
|
<div aria-live="polite" aria-atomic="true" v-if="isLoggedIn"
|
2023-11-27 00:14:52 +00:00
|
|
|
class="d-flex justify-content-end align-items-start fixed-top mx-1 my-5 py-3"
|
|
|
|
style="min-height: 200px; z-index: 100000; pointer-events: none">
|
2024-01-07 20:42:23 +00:00
|
|
|
<Toast v-for="(toast , index) in toasts" :key="index" :title="toast.title" :message="toast.message"
|
2023-11-27 00:14:52 +00:00
|
|
|
:color="toast.color"
|
|
|
|
@close="removeToast(toast.key)" style="pointer-events: auto"/>
|
|
|
|
</div>
|
2019-11-13 22:21:19 +00:00
|
|
|
</div>
|
2019-11-13 21:02:44 +00:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2019-11-14 02:59:17 +00:00
|
|
|
import Navbar from '@/components/Navbar';
|
2019-12-27 01:39:56 +00:00
|
|
|
import AddItemModal from '@/components/AddItemModal';
|
2019-12-27 01:06:04 +00:00
|
|
|
import Toast from './components/Toast';
|
2024-01-07 20:42:23 +00:00
|
|
|
import {mapState, mapMutations, mapActions, mapGetters} from 'vuex';
|
|
|
|
import AddTicketModal from "@/components/AddTicketModal.vue";
|
2023-12-28 21:49:55 +00:00
|
|
|
import AddBoxModal from "@/components/AddBoxModal.vue";
|
2019-11-14 03:37:35 +00:00
|
|
|
|
2019-11-13 21:02:44 +00:00
|
|
|
export default {
|
2023-11-27 00:14:52 +00:00
|
|
|
name: 'app',
|
2023-12-28 21:49:55 +00:00
|
|
|
components: {AddBoxModal, Toast, Navbar, AddItemModal, AddTicketModal},
|
2024-01-07 20:42:23 +00:00
|
|
|
computed: {
|
2023-12-28 21:49:55 +00:00
|
|
|
...mapState(['loadedItems', 'layout', 'toasts', 'showAddBoxModal']),
|
2024-01-07 20:42:23 +00:00
|
|
|
...mapGetters(['isLoggedIn']),
|
|
|
|
},
|
2023-11-27 00:14:52 +00:00
|
|
|
data: () => ({
|
2024-01-07 20:42:23 +00:00
|
|
|
addItemModalOpen: false,
|
2024-01-20 00:18:00 +00:00
|
|
|
addTicketModalOpen: false
|
2023-11-27 00:14:52 +00:00
|
|
|
}),
|
|
|
|
methods: {
|
2023-12-28 21:49:55 +00:00
|
|
|
...mapMutations(['removeToast', 'createToast', 'closeAddBoxModal', 'openAddBoxModal']),
|
2024-01-26 00:03:00 +00:00
|
|
|
...mapActions(['loadEvents']),
|
2024-01-07 20:42:23 +00:00
|
|
|
openAddItemModal() {
|
|
|
|
this.addItemModalOpen = true;
|
|
|
|
},
|
|
|
|
openAddTicketModal() {
|
|
|
|
this.addTicketModalOpen = true;
|
|
|
|
},
|
|
|
|
closeAddItemModal() {
|
|
|
|
this.addItemModalOpen = false;
|
2023-11-27 00:14:52 +00:00
|
|
|
},
|
2024-01-07 20:42:23 +00:00
|
|
|
closeAddTicketModal() {
|
|
|
|
this.addTicketModalOpen = false;
|
2024-01-20 00:18:00 +00:00
|
|
|
}
|
2019-12-20 22:43:10 +00:00
|
|
|
},
|
2023-11-27 00:14:52 +00:00
|
|
|
created: function () {
|
2024-01-22 18:20:27 +00:00
|
|
|
document.title = document.location.hostname;
|
2019-12-20 22:43:10 +00:00
|
|
|
}
|
2019-11-13 21:21:47 +00:00
|
|
|
};
|
2019-11-13 21:02:44 +00:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<style>
|
2023-11-22 20:57:14 +00:00
|
|
|
body, html, #app {
|
2023-11-27 00:14:52 +00:00
|
|
|
background: #000;
|
2023-11-22 20:57:14 +00:00
|
|
|
}
|
2019-11-13 21:02:44 +00:00
|
|
|
</style>
|
2019-12-01 21:00:06 +00:00
|
|
|
|