@extends('layouts.main')

@section("content")
    <page-content :event="eventListener"></page-content>
@endsection
@section("components_declarations")

    <template id="page-content">
        <v-content>
            <v-container fluid fill-height>
                <v-layout justify-center>
                    <v-flex>

                        <template>
                            <v-card flat>
                                <v-toolbar
                                    color="grey"
                                    class="lighten-2"
                                    light
                                    flat
                                >
                                    <v-toolbar-title >Up coming</v-toolbar-title>


                                </v-toolbar>
                                <v-card-text justify-center>
                                    <h1 class="text-xs-center">{!! $reason ?? "Content will be available soon" !!}</h1>
                                </v-card-text>

                            </v-card>
                        </template>
                    </v-flex>
                </v-layout>
            </v-container>

        </v-content>
    </template>
    <script>

        const PageContent = {
            template: "#page-content",
            components: {},
            data: () => ({
                loading: true,
                course:{},
            }),
            props: {
                source: String,
                context: Object,
                item: {},

                event: {
                    type: Function,
                    default: function (event, data) {
                    }
                },

            },
            computed: {
            },
            watch: {
            },
            mounted() {
            },
            methods: {
            },
        }
    </script>
@endsection
@section("components_instances")
    PageContent
@endsection