App.vue

<template>
    <div id="app">
        <vue-toastr ref="toastr"></vue-toastr>

        <span style="position: absolute; top: -15px; left: 0;">
            <img id="inner__logo"
                 src="~@/assets/images/inner_logo.png"
                 alt="ADC Logo" style="margin-top: 10px;">
        </span>
        <span style="position: absolute; top: 12px; right: 10px;">
                <button class="button is-danger is-small"
                        v-if="current_user.id"
                        @click="logout">
                    Logout
                </button>
            </span>

        <header class="columns is-vcentered">
            <span class="column" style="margin-top: -16px;">
                <span style="margin-left: 80px;"
                      v-if="!current_user.id">
                    Aerospace Disassembly Consortium
                </span>
                <span style="margin-left: 80px;"
                      v-if="current_user.id">
                  {{current_user.name}} -- {{current_user.locale}}
                </span>
            </span>
            <span class="column has-text-right is-hidden-touch"
                  style="margin-right: 80px;">
                {{today_display}}
            </span>
        </header>
        <main>
            <div class="ipad__screen">
                <router-view></router-view>
            </div>
        </main>

        <footer class="has-text-centered">
            <footer-navigation></footer-navigation>
        </footer>
    </div>
</template>

<script>
    import {mapActions, mapGetters, mapMutations} from 'vuex';

    export default {
        data() {
            return {};
        },
        components: {},
        created() {
            this.init_store()
                .then((rsp) => {
                    console.log('store loaded')
                })
                .catch((err) => {
                toastr.error('Authentication token not found or invalid. Please log in.', 'ERROR');
                this.$router.push('/login');
                return false;
            });
            setInterval(() => {
                this.checkValidToken();
            }, 900000);
        },
        props: [],
        computed: {
            current_user() {
                return (this.$store.state.current_user ? this.$store.state.current_user : {});
            },
            single_task() {
                if (this.tasks && this.tasks.length > 0 && this.$route.params.id) {
                    return this.tasks.filter((t) => {
                        return (t.id === parseInt(this.$route.params.id));
                    });
                } // end if
                return [];
            },
            tasks() {
                return this.$store.state.tasks;
            },
            token() {
                return (localStorage.getItem('token') ? localStorage.getItem('token') : null);
            }
        },
        methods: {
            checkValidToken() {
                this.$store.dispatch('check_token')
                    .then((rsp) => {
                        //SET token_valid on Store to true
                    })
                    .catch((err) => {
                        toastr.error('Authentication token not found or invalid. Please log in.', 'ERROR');
                        this.$router.push('/login');
                        return false;
                    });
            },
            init_store() {
                if(!this.token) {
                    toastr.error('Authentication token missing. Please log in.', 'ERROR');
                    this.$router.push('/login');
                    return false;
                } // end if

                this.$store.dispatch('init_store')
                    .then(() => {
                        //
                    });
            },
            logout() {
                this.$store.dispatch('logout')
                    .then(() => {
                        this.$router.push('login');
                    });
            }
        },
        mounted() {}
    };
</script>

<style></style>