<template>
    <v-sheet tile>

        <template v-if="action != 'delete'">


            <v-row dense>
                <v-col cols="6">
                    <cs-text-box 
                        ref="First"
                        :control="controls.last_name"
                        :errors="errorsManager.ByField('user.last_name')"

                        v-model="activeRecord.user.last_name"
                        
                        @focus="errorsManager.ResetField('user.last_name')"
                        @blur="errorsManager.Validate('user.last_name')"
                    />
                </v-col>

                <v-col cols="6">
                    <cs-text-box 
                        :control="controls.first_name"
                        :errors="errorsManager.ByField('user.first_name')"

                        v-model="activeRecord.user.first_name"
                        
                        @focus="errorsManager.ResetField('user.first_name')"
                        @blur="errorsManager.Validate('user.first_name')"
                    />
                </v-col>

                <v-col cols="7">
                    <cs-text-box 
                        :control="controls.email"
                        :errors="errorsManager.ByField('user.email')"

                        v-model="activeRecord.user.email"
                        
                        @focus="errorsManager.ResetField('user.email')"
                        @blur="errorsManager.Validate('user.email')"
                    />
                </v-col>

                <v-col cols="5">
                    <cs-text-box 
                        :control="controls.phone"
                        :errors="errorsManager.ByField('phone')"

                        v-model="activeRecord.user.phone"
                        
                        @focus="errorsManager.ResetField('phone')"
                        @blur="errorsManager.Validate('phone')"
                    />
                </v-col>

                <v-col cols="6">
                    <role-autocomplete-selector 
                        type="b2b"
                        :errors="errorsManager.ByField('role_id')"
                        @focus="errorsManager.ResetField('role_id')"
                        @blur="errorsManager.Validate('role_id')"
                        v-model="activeRecord.role_id"
                    />
                </v-col>

                <v-col cols="6">
                    <departament-autocomplete-selector 
                        :customer_id="activeRecord.customer_id"
                        :disabled="! activeRecord.customer_id"
                        :errors="errorsManager.ByField('department_id')"
                        :departmentForm="departmentForm"
                        
                        :app="app"

                        @focus="errorsManager.ResetField('department_id')"
                        @blur="errorsManager.Validate('department_id')"
                        v-model="activeRecord.department_id"
                    />
                </v-col>
                

                <v-col cols="12">
                    <v-sheet class="mx-2">
                        <newsletter-control 
                            v-model="activeRecord"
                        />
                    </v-sheet>
                </v-col>
            </v-row>

        </template>

        <cs-info-alert 
            v-else-if="true"
            color="red"
            icon="mdi-alert"
            :message="__('Sunteți sigur că doriți ștergerea contractului :name?', {
                name: 'xxx'
            })"
        />

        <cs-info-alert 
            v-else
            color="red"
            icon="mdi-alert"
            :message="__('Departamentul :name nu se poate șterge. Conține conturi asociate.', {
                name: activeRecord.departament
            })"
        />
    </v-sheet>
</template>

<script>
    export default {

        props: {
            controls: {default: () => ({})},
            activeRecord: {required: true},
            errorsManager: {required: true},
            action: {required: true},
            currentAction: {required: true},

            departmentForm: {default: null},
            usersForm: {default: null},
            userType: {default: null},
            app: {default: null},
        },

        methods: {
            Focus() {
                
                // this.$refs.First.Focus();
            }
        },

        mounted() {
            if(this.action != 'delete')
            {
                setTimeout( () => {
                    this.Focus();
                }, 150);
            }    
        },

        created() {
        },

        components: {
            CsTextBox: require('@CsVueComp/controls/texts/CsTextBox').default, 
            CsInfoAlert: require('@CsVueComp/sheets/CsInfoAlert').default,
        },

        name: 'AccountInput',
    }
</script>