<template>
    <v-card
        tile
        flat
        width="520"
        id="customer-save-form"
    >
        <v-card-text class="pa-1">
            <cs-info-alert 
                message="Datele sunt corecte. Vreau crearea clientului."
            />
        </v-card-text>

        <v-card-actions class="pa-1 px-0">

            <v-sheet class="mr-3">
                <cs-btn 
                    outlined
                    position="bottom"
                    icon="mdi-chevron-left"
                    caption="Logo"
                    tooltip="Încărcarea logo-ului"

                    :click="OnClickBack"
                />
            </v-sheet>
            
            <cs-btn 
                outlined
                position="bottom"
                :icon="form.TriggerIcon()"
                :color="form.TriggerColor()"
                caption="Creează"
                tooltip="Confirmă crearea clientului"
    
                :disabled="false"

                :click="() => form.formprovider.Trigger()"
            />
        </v-card-actions>
    </v-card>
</template>

<script>
    import JQApply from '@Cs/jquery/Apply';
    
    export default {
        props: {
            app: {required: true},
        },

        computed: {
            form() {
                return this.app.forms.Customers;
            },

            stepper() {
                return this.app.menus.Insertcustomerstepper;
            },

            activeStep() {
                return this.stepper.activeStep;
            },
        },

        watch: {
            activeStep: function(newValue, oldValue) {
                if(newValue == 4)
                {
                    this.ScrollBottom();
                }
            }
        },

        methods: {
            OnClickBack() {
                this.stepper.activeStep--;
            },

            ScrollBottom() {
                setTimeout( () => {
                    JQApply('customer-save-form', [
                        j => {
                            JQApply('insert-customer-stepper', [
                                jq => {
                                    setTimeout( () => {
                                        jq.scrollTop(jq.height())
                                    }, 1000)
                                }
                            ]);
                        }
                    ]);
                }, 250)
            }
        },

        created() {
        },

        components: {
            CsBtn: require('@CsVueComp/buttons/CsBtn').default,
            CsInfoAlert: require('@CsVueComp/sheets/CsInfoAlert').default,
        },

        mixins: [
            require('@CsVueMix/Forminput/Forminput')
        ],

        name: 'CustomerSaveForm',
    }
</script>