<template>
    <v-card tile flat class="pa-2" :disabled="disabled">

        <template v-if="! disabled">
            <v-alert dense class="" type="info" outlined rounded="lg">
                <span class="text-caption">
                    {{ __('Aici se setează ce registre va vedea clientul pe dashboard-ul lui') }}
                </span>
            </v-alert>

            <v-checkbox
                dense
                hide-details
                v-for="(registru, index) in registre"
                :key="'registru-' + index"
                :value="registru.id"
                v-model="selected"
                @change="Save"
            >
                <template #label>
                    <span class="text-body-2">
                        {{ __(registru.name) }}
                    </span>
                </template>
            </v-checkbox>
        </template>
    </v-card>
</template>

<script>
    export default {
        props: {
            app: {required: true},
            customer: {required: true},
            registre: { default: () => []},
            registreasociate:  { default: () => []},
            disabled: {default: false},
        },

        data: () => ({
            selected: [],
            t: null,
        }),

        watch: {
            registreasociate: {
                deep: true,
                handler: function() {
                    this.selected = _.map(this.registreasociate, item => item.register_id);
                },
            }
        },

        methods: {
            Save() {

                if(this.t)
                {
                    clearTimeout(this.t);
                }

                this.t = setTimeout(() => {
                    this.app.requests.Saveasociereregistre.ResetData().SetData({
                        customer_id: this.customer.id,
                        registre: this.selected,
                    }).Request([
                        response => {
                            this.app.dataSession.Registreasociate.GetByCustomerId(this.app.payload.customer_id);
                        }
                    ]);
                }, 100);
            }
        },

        mounted() {
            this.selected = _.map(this.registreasociate, item => item.register_id);
        },

        name: 'CustomerRegistreAsociate',
    }
</script>