<template>
    <v-hover v-slot="{ hover }">
        <v-card outlined rounded="md" 
            :class="{   
                'primary darken-4': hover || isActive,
            }"
        >
            <v-sheet class="pa-1" :class="{
                'primary lighten-4': isActive
            }" @click="OnClickOpen">
                <v-sheet class="d-flex justify-space-between align-center transparent overflow-hidden">
                    <div class="font-weight-medium text-body-2">
                        {{ item.number }} - {{ ToDate(item.date )}}
                    </div>
                    <v-sheet v-if="hover" class="transparent d-flex">
                        
                        <cs-btn 
                            v-if="false"
                            icon="mdi-folder-edit-outline"
                            tooltip="Deschide registrul"
                            :small="false"
                            color="green darken-2"
                            :xsmall="true"
                            @click="OnClickOpen"
                        />

                        <cs-btn 
                            v-if="app.Can('customer-registre.registre.update')"
                            icon="mdi-pencil"
                            tooltip="Editează"
                            :small="false"
                            color="blue"
                            :xsmall="true"
                            @click="OnClickUpdate"
                        />

                        <cs-btn 
                            v-if="app.Can('customer-registre.registre.copy')"
                            icon="mdi-content-copy"
                            tooltip="Copiază la alt client"
                            :small="false"
                            color="blue"
                            :xsmall="true"
                            @click="OnClickCopy"
                        />

                        <cs-btn 
                            v-if="app.Can('customer-registre.registre.export')"
                            icon="mdi-download"
                            tooltip="Exportă in format excel"
                            :small="false"
                            color="purple lighten-2"
                            :xsmall="true"
                            @click="OnClickExport"
                        />

                        <cs-btn 
                            v-if="app.Can('customer-registre.registre.delete')"
                            icon="mdi-delete"
                            tooltip="Șterge registrul"
                            :small="false"
                            color="red"
                            :xsmall="true"
                            @click="OnClickDelete"
                        />
                    </v-sheet>
                </v-sheet>

                <v-sheet class="transparent overflow-hidden text-truncate" width="100%">
                    <div class="text-caption">
                        {{ __('Responsabil') }}: <span class="font-weight-medium">{{item.responsabil_nume}}</span>
                    </div>

                    <div class="text-caption">
                        {{ __('Funcție') }}: <span class="font-weight-medium">{{item.responsabil_functie}}</span>
                    </div>

                    <div class="text-caption">
                        {{ __('Departament') }}: <span class="font-weight-medium">{{item.department ? item.department.departament : '-'}}</span>
                    </div>

                    <v-sheet class="d-flex justify-space-between align-center transparent text-caption" v-if="app.platform == 'admin' || $env == 'local'">
                        <div>
                            {{ __('Status') }}
                        </div>

                        <v-chip :color="item.status == 'public' ? 'green' : 'red'" outlined small>
                            <v-icon small>
                                mdi-{{item.status == 'public' ? 'check' : 'lock'}}
                            </v-icon>
                        </v-chip>
                    </v-sheet>
                </v-sheet>
            </v-sheet>
        </v-card>
    </v-hover>
</template>

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

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

            isActive() {
                return !! this.controller.activeRegistru && (this.controller.activeRegistru.id == this.item.id)
            }
        },

        methods: {

            OnClickCopy(e) {

                this.OnClickOpen();

                this.controller.registrucopy.visible = false;

                this.$nextTick( () => {
                    this.controller.registrucopy.visible = true;
                    this.controller.registrucopy.x = e.clientX;
                    this.controller.registrucopy.y = e.clientY;
                    this.controller.registrucopy.registru = {...this.item};
                });
            },

            OnClickExport(e) {
                this.OnClickOpen();

                this.controller.downloadmenu.visible = false;

                this.$nextTick( () => {
                    this.controller.downloadmenu.visible = true;
                    this.controller.downloadmenu.x = e.clientX;
                    this.controller.downloadmenu.y = e.clientY;
                });
            },

            OnClickUpdate() {
                this.OnClickOpen();

                this.app.forms.Registrelemele.menu.visible = false;
                
                this.$nextTick( () => {
                    this.app.forms.Registrelemele.menu.visible = true;
                    this.app.forms.Registrelemele.menu.x = e.clientX;
                    this.app.forms.Registrelemele.menu.y = e.clientY;
                    this.app.forms.Registrelemele.Show(null, 'update', this.item);
                });
            },

            OnClickDelete() {

                this.OnClickOpen();
     
                this.app.forms.Registrelemele.menu.visible = false;
                
                this.$nextTick( () => {
                    this.app.forms.Registrelemele.menu.visible = true;
                    this.app.forms.Registrelemele.menu.x = e.clientX;
                    this.app.forms.Registrelemele.menu.y = e.clientY;
                    this.app.forms.Registrelemele.Show(null, 'delete', this.item);
                });
            },

            OnClickOpen() {
                this.app.classes.Customerregistru.selectedrows = [];
                this.app.classes.Customerregistru.activeRegistru = this.item;
            }
        },

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

        name: 'CustomerRegistersList',
    }
</script>