<template>
    <v-autocomplete
        dense
        :hide-details="false"
        class="mt-0"
        :items="items"
        outlined
        :label="__('Client')"
        clearable
        :no-data-text="__('Nu sunt clienți în listă')"
        :loading="false"
        :disabled="false"
        :error-messages="errors"
        @focus="$emit('focus')"
        @blur="$emit('blur')"
        v-model="localValue"
    >
    </v-autocomplete>
</template>

<script>

    export default {

        props: {
            value: {required: true},
            errors: {default: null},
            customers: {required: true},
        },
    
        computed: {

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

            localValue: {

                get: function() {
                    return this.value;
                },

                set: function(value) {
                    this.$emit('input', value);
                }
            },



        },



        name: 'CustomerSelector',
    }
</script>