<template>
    <v-autocomplete
        dense
        outlined
        clearable
        :items="items"
        :label="__('Departament')"
        :error-messages="errors"
        :disabled="disabled"
        
        @focus="$emit('focus')"
        @blur="$emit('blur')"

        v-model="account.department_id"
    >
    </v-autocomplete>
</template>

<script>
    export default {
        model: { 
            prop: "account", 
            event: "input",
            
        }, 

        props: {
            account: {required: true},
            departamente: {default: () => []},
            errors: {default: null},
            disabled: {default: false},
        },

        computed: {
            items() {
                let r = _.map(this.departamente, item => ({
                    text: item.departament,
                    value: item.id,
                }));
                return _.orderBy(r, [item => item.text], ['asc']);
            }
        },

        name: 'AccountDepartmentControl',
    }
</script>