<template>
    <v-menu
        v-model="menu.visible"
        :position-x="menu.x"
        :position-y="menu.y"
        absolute
        offset-y
        :close-on-content-click="false"
        :close-on-click="false"
    >
        <v-card tile flat :width="width">

            <v-card-title class="green darken-3 white--text text-body-1 py-2">
                <span v-if="activeRegistru">
                    {{ __('Setare nivel de acces. Registrul :number - :date', {number: activeRegistru.number, date: ToDate(activeRegistru.date)}) }}
                </span>
            </v-card-title>

            <v-divider></v-divider>

            <v-card-text v-if="!! activeRegistru"> 

                <registru-access-tree 
                    :app="app"
                    :departamente="departamente"
                    :accounts="accounts"
                    v-model="selected"
                />

            </v-card-text>

            <v-divider></v-divider>

            <v-card-actions>
                 <cs-btn 
                    caption="Salvează"
                    icon="mdi-content-save"
                    color="green darken-3"
                    outlined
                    tooltip="Confirmă salvarea"
                    :loading="false"
                    :disabled="false"
                    @click="OnClickSave"
                />

                <v-spacer></v-spacer>
                
                <cs-btn 
                    caption="Renunță"
                    icon="mdi-close"
                    outlined
                    @click="OnClickCancel"
                />
            </v-card-actions>
        </v-card>
    </v-menu>
</template>

<script>
    export default {
        props: {
            app: {required: true},
            menu: {required: true},
            width: {default: 600},
            height: {default: null},
        },

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

        computed: {
            controller() {
                return this.app.classes.Customerregistru;
            },

            activeRegistru() {
                return this.controller.activeRegistru;
            },

            departamente() {
                return this.app.dataSession.Departamente.items;
            },

            accounts() {
                return this.app.dataSession.Accounts.items;
            },

            toSelected() {
                let r = {};

                _.each(this.selected, item => {
                    let parts = item.split('#');
                    let user_id = parts[0], departament_id = parts[1];

                    if(! _.has(r, user_id))
                    {
                        r[user_id] = [];
                    }

                    r[user_id].push(departament_id);
                })
                return r;
            },

        },

        watch: {
            'menu.visible': function(visible) {
                if( visible )
                {
                    this.app.dataSession.Registreusers.GetByCustomerRegistruId(this.activeRegistru.id);
                    let i = setInterval(() => {
                        if(! this.app.dataSession.Registreusers.processing )
                        {
                            clearInterval(i);
                            this.selected = [];
                            _.each(this.app.dataSession.Registreusers.items, item => {
                                _.each(item.departamente, el => {
                                    this.selected.push(item.user_id + '#' + el);
                                })
                            })
                        }
                    }, 350);
                }
                else
                {
                    
                }
            }
        },

        methods: {
            OnClickSave() {
 
                this.app.requests.Registrusaveaccess.ResetData().SetData({
                    customer_registru_id: this.activeRegistru.id,
                    customer_id: this.activeRegistru.customer_id,
                    register_id: this.activeRegistru.register_id,
                    selected: this.toSelected,
                    
                }).Request([
                    response => {
                        this.OnClickCancel();
                    }
                ]);

                
            },

            OnClickCancel() {
                this.selected = [];
                this.menu.visible = false;
            }
        },

        components: {
            CsBtn: require('@CsVueComp/buttons/CsBtn').default,
        },

        name: 'CustomerRegisterAccessMenu'
    }
</script>