<template>
    <cs-centered-alert
        v-if="! controller.isBooted"
        :height="app.height"
        :width="app.width"
        message="Se încarcă..."
    >
        <v-progress-circular
            indeterminate
            color="orange darken-1"
        >
        </v-progress-circular>
    </cs-centered-alert>

    <v-card
        v-else
        tile
        flat
        :width="app.width"
        :height="app.height"
    >
        <v-card
            tile
            flat
            :width="app.width"
            :height="app.height"
            :disabled="controller.curspreviewmenu.visible ||
                controller.desasociereclientmenu.visible ||
                controller.desasociereusermenu.visible"
        >
            <v-card-title class="pa-0 primary--text text--darken-3">
                {{ __('Acces curs :name', {name: curs.name}) }} 
            </v-card-title>

            <v-breadcrumbs 
                :items="controller.breadcrumbs" 
                class="pa-0"
            >
                <template v-slot:divider>
                    <v-icon>mdi-dots-vertical</v-icon>
                </template>
            </v-breadcrumbs>
            
            <v-card
                tile
                flat
                :width="app.width"
                :height="app.height - 54"
                class="d-flex"
            >
                <v-sheet
                    :width="leftSideWidth"
                    :height="app.height - 54"
                >
                    <curs-acces-curs-details 
                        :app="app"
                        :curs="curs"
                        :width="leftSideWidth"
                        :height="app.height - 54"
                    />
                </v-sheet>

                <v-sheet
                    :width="app.width - leftSideWidth"
                    :height="app.height - 54"
                >
                    <curs-access-customers 
                        :app="app"
                        :curs="curs"
                        :width="app.width - leftSideWidth"
                        :height="app.height - 54"
                    />
                </v-sheet>

            </v-card>
        </v-card>

        <curs-preview-menu 
            :app="app"
            :menu="controller.curspreviewmenu"
        />

        <desasociere-client-menu 
            :app="app"
            :menu="controller.desasociereclientmenu"
        />

        <desasociere-user-menu 
            :app="app"
            :menu="controller.desasociereusermenu"
        />

    </v-card>
</template>

<script>
    export default {
        props: {
            app: {require: true},
            leftSideWidth: {default: 320},
        },

        computed: {
            controller() {
                return this.app.classes.Accescurs;
            },

            curs() {
                return this.app.dataSession.Cursuri.curs;
            }
        },

        methods: {

            LoadResources() {
                this.app.AddClassesByContext(require.context('./../../Classes', true, /\.class.js$/i));
                this.app.AddDataProvidersByContext(require.context('./../../DataSessions', true, /\.dataprovider.js$/i));
                this.app.AddDatatablesByContext(require.context('./../../Datatables', true, /\.datatable.js$/i));
                this.app.AddFormProvidersByContext(require.context('./../../FormProviders', true, /\.formprovider.js$/i));                
                this.app.AddFormsByContext(require.context('./../../Forms', true, /\.form.js$/i));
                this.app.AddFilterFormsByContext(require.context('./../../Filterforms', true, /\.filterform.js$/i));
                this.app.AddMenusByContext(require.context('./../../Toolbars', true, /\.toolbar.js$/i));
                this.app.AddMenusByContext(require.context('./../../Menus', true, /\.menu.js$/i));
                this.app.AddMenusByContext(require.context('./../../Breadcrumbs', true, /\.breadcrumbs.js$/i));
                this.app.AddRequestsByContext(require.context('./../../Requests', true, /\.request.js$/i));
            },

            InitDatatable() {},

            InitForms() {},

            InitFiltering() {},

            LoadData() {
                this.app.dataSession.Cursuri.GetById(this.app.payload.curs_id);
                this.app.dataSession.Cursuriatasate.GetByCursId(this.app.payload.curs_id);
                this.app.dataSession.Customercursuriuser.GetByCursId(this.app.payload.curs_id);
            }
        },

        components: {
            CsCenteredAlert: require('@CsVueComp/sheets/CsCenteredAlert').default,
        },
        
        mixins: [
            require('VUEMIX/Index/IndexPage'),
        ],

        name: 'Index',
    }
</script>