<template>
    <v-card 
        tile 
        flat 
        width="480"
    >
        <v-card-text class="pa-1">

            <v-row dense>
                <v-col cols="12">
                    <type-selector
                        ref="FirstControl" 
                        :app="app"
                        :cursuritypes="cursuritypes"
                        :selectorErrors="errorsManager.ByField('type')"
                        v-model="activeRecord.type"
                        @focus="errorsManager.ResetField('type')"
                        @blur="errorsManager.Validate('type')"
                    />
                </v-col>
            </v-row>

            <v-row dense>
                
            </v-row>
        </v-card-text>

        <v-card-actions class="pa-1 px-0 mt-4">
            <stepper-btn-prev 
                :stepper="stepper"
            />

            <cs-btn 
                outlined
                position="bottom"
                :icon="form.TriggerIcon()"
                :color="form.TriggerColor()"
                :caption="form.TriggerCaption()"
                :tooltip="form.TriggerTooltip()"
    
                :loading="form.processing"
                :disabled="form.actionButtonDisabled"

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

<script>
    /**
     *  formprovider.oldRecord.file - fisierul vechi
     */
    export default {
        props: {
            app: {required: true},
        },

        watch: {

            'stepper.activeStep': function(step) {
                if(step == 3)
                {
                    this.$refs.FirstControl.Focus();
                }
            },
            
            'activeRecord.type': function(type) {

                if(! type)
                {
                    this.activeRecord.file = null;
                    this.activeRecord.url = null;
                }
                else
                {
                    if( type == 'fisier')
                    {
                        this.activeRecord.url = null;
                    }
                    else
                    {
                        this.activeRecord.file = null;
                    }
                }
            },
        },

        components: {
            CsTextBox: require('@CsVueComp/controls/texts/CsTextBox').default,
            
            TypeSelector: require('@MyDpoComp/Entities/CursType/Controls/Selector/TypeSelector').default,
            CsBtn: require('@CsVueComp/buttons/CsBtn').default,
        },

        mixins: [
            require('@MyDpoMix/Entities/Curs/Curs.mixin'),
            require('@CsVueMix/Forminput/Forminput')
        ],

        name: 'CursContentForm',
    }
</script>