<template>
    <v-card
        tile
        flat
        :height="app.height"
        :width="app.width"
        class="mx-auto overflow-x-auto overflow-y-hidden"
    >  
        <v-card-title class="pa-1">
            <image-icon 
                :src="app.url + 'imgs/blue-icons/task.png'"
            />
            {{ __('Taskuri:name', {name: customer.name})}}

            <v-spacer></v-spacer>

            <cs-btn
                icon="mdi-arrow-left"
                :caption="app.width > 800 ? 'Dashboard' : null"
                :tooltip="__('Înapoi la dashboard<br/>:name', {name: customer.name})"
                text
                :click="BackToDashboard"
            />

            <cs-btn
                v-if="app.platform == 'admin'"
                icon="mdi-arrow-left"
                :caption="app.width > 800 ? 'Lista clienților' : null"
                tooltip="Înapoi la lista clienților"
                text
                :click="Back"
            />
        </v-card-title>

        <v-sheet
            :width="app.width"
            :height="app.height - 44"
        >
        CustomerTasksPage          
        </v-sheet>
    </v-card>   
</template>

<script>
    /**
     * title + subtitle = 40 + 22 = 62
     */
    const Redirect = require('@CsFunc/global/Redirect');

    export default {
        props: {
            app: {required: true},
            customer: {required: true},
        },

        methods: {
            Back() {
                /**
                 * asta-i pagina cu lista clientilor
                 * exista numai pe admin
                 */
                if(this.app.platform == 'admin')
                {
                    let url = this.app.url + 'admin/clienti';
                    return Redirect(url);
                }
            },

            BackToDashboard() {
                let url = this.app.url + 'customer-dashboard/' + this.customer.id;
                return Redirect(url);
            }
        },

        components: {
            ImageIcon: require('@CsVueComp/helpers/images/ImageIcon').default,
            CsBtn: require('@CsVueComp/buttons/CsBtn').default,
        },

        name: 'CustomerTasksPage',
    }

</script>