<template>
    <v-sheet class="transparent text-caption text-center" width="100%">

        <v-tooltip bottom color="bg-dark-blue">
            <template #activator="{ on: onTooltip }">
                <v-chip small outlined :color="color" v-on="{...onTooltip}" @click="OnClick">
                    <v-icon :color="color" small>
                        {{icon}}
                    </v-icon>
                </v-chip>
            </template>

            <span class="text-caption">
                {{ 
                    __(tooltip, {customer: customer, user: createdby}) 
                }}
            </span>
        </v-tooltip>

    </v-sheet>
</template>

<script>
    export default {
        props: {
            app: {required: true},
            column: {required: true},

            createdby: {default: null},
            customer: {default: null},
            created_at: {default: null},

            allow_upload_row_files: {default: true},
            
            fakeData: {default: false},

            icons: {default: () => ({
                'new': 'mdi-file-outline',
                'edited': 'mdi-file-edit-outline',
                'approved': 'mdi-file-check-outline',
                'na': 'mdi-file-cancel-outline',
            })},

            colors: {default: () => ({
                'new': 'blue',
                'edited': 'orange',
                'approved': 'black',
                'na': 'red',
            })},
        },

        computed: {

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

            status() {
                return this.column.text;
            },

            icon() {
                return this.icons[this.status];
            },

            color() {
                return this.colors[this.status];
            },

            tooltip() {

                let tooltips = {
                    new: 'adăugat de către :customer | :user',
                    edited: 'editat de către :customer | :user',
                    approved: 'aprobat de către :customer | :user',
                    na: 'trecut în N/A  de către :customer | :user',
                }

                if( _.has(tooltips, this.status))
                {
                    return tooltips[this.status];
                }

                return 'adăugat de către :customer | :user';

            }
        },

        methods: {
            OnClick(e) {
                if( ! this.fakeData )
                {
                    this.controller.changerowstare.visible = false;

                    this.$nextTick( () => {

                        this.controller.changerowstare.visible = true;
                        this.controller.changerowstare.x = e.clientX;
                        this.controller.changerowstare.y = e.clientY;
                        this.controller.changerowstare.row_id = this.column.row_id;
                        this.controller.changerowstare.status = this.column.text;

                    });
                }
            }
        },

        name: 'RegistruTableBodyColumnStare'
    }
</script>