<template>
    <tr style='border:0' class="connection_node" :active="connection.selected" node_type="connection"  @click="getSchema">
        <td style="width: 20px;cursor: pointer; border:0">
            <i class="fa fa-link" style="font-size: 14px; "></i>
        </td>
        <td  style="cursor: pointer;width: 100%; border:0">
            {{getValueAttribute(connection.attributes, 'connection_name')}}
        </td>
    </tr>
    <ItemSchema :showViews="showViews" v-for='(schema, indexSchema) of schemaList' :key="indexSchema" :name='schema.text' :idConnection="idConnection" :schema='schema' :tableName='tableName' :object='object' @getColumns='getColumns' @selectedSchema='selectedSchema' @getSource="getSource" v-if="connection.selected"></ItemSchema>
</template>
<script lang="ts">
import { Attribute } from '@/domain/models/Attribute.interface';
import { Connection } from '@/domain/models/connections/Connection';
import { jsonUtilities } from '@/infrastructure/utilities/jsonUtilities'
import { ConnectionService } from '@/domain/services/Connection.service'
import ItemSchema  from '@/lib-components/component/ConnectionExplorerComponent/ItemSchema.vue';

export default{
    name : 'ItemConnection',
    emits : ['selectItemConnection', 'getColumns', 'selectedSchema', 'getSource', 'getSchemaList'],
    props:{
        connection: { type: Connection, default: null },
        idConnection: { type: String, default: '' },
        schema: { type: String, default: '' },
        object: { type: String, default: '' },
        tableName: { type: String, default: '' },
        showViews: { type: Boolean, default: true },
    },
    components: {
        ItemSchema
    },
    data : () => {
        return {
            connectionService : {} as ConnectionService,
            schemaList : [],
            showDatabaseObjects : false,
            active : false,
            columnList : [],
            source : '',
            showSpinner: false,
        }
    },
    methods: {
        async getSchema(){
            this.active =  true;
            this.connection.selected = true;
            this.$emit("selectItemConnection", this.connection.id);
            if((jsonUtilities.getJsonArrayEntrybyValue<Attribute>(this.connection.attributes, 'connection_type')).value === 'Database'){
                let schemaList = (await this.connectionService.getDatabaseSchemaList(this.connection.id)).schemas;
                if(schemaList != null){
                        this.schemaList = schemaList.map((item : String) : any => ({
                        text : item,
                        selected : false
                    }));
                }
                this.$emit('getSchemaList', this.schemaList);
            }
            else{
                let schema = 'UNO';
                let tableName = this.getValueAttribute(this.connection.attributes, 'connection_name').toUpperCase();
                this.columnList = (await this.connectionService.getColumnNormalizedList(this.connection.id, 'delimited-file', schema, 'tables', tableName)).columns;
                this.$emit("selectedSchema",schema);
                this.$emit("getColumns", this.columnList);
                this.$emit("getSource",tableName);
            }
        },
        getSource(source : String){
            this.source =  source;
            this.$emit("getSource",source);
        },
        selectedSchema(name : String){
            for(let indexItem = 0; indexItem < this.schemaList.length; indexItem++){
                this.schemaList[indexItem].selected = (this.schemaList[indexItem].text == name);
            }
            this.$emit("selectedSchema",name);
        },
        getColumns(columnList : []){
            this.columnList = columnList;
            this.$emit("getColumns", this.columnList);
        },
        getValueAttribute(attribute : Attribute, prop : String){
            return jsonUtilities.getJsonArrayEntrybyValue<Attribute>(attribute, prop).value;
        },
    },
    watch: {
        connection: {
            handler: function() {
                if( this.connection.selected === true){
                    this.connectionService.getDatabaseSchemaList(this.connection.id).then((response: any) => {
                        let schemaList = response.schemas;
                        if(schemaList != null){
                            this.schemaList = schemaList.map((item : String) : any => ({
                            text : item,
                            selected : (item === this.schema)
                        }));
                        this.showSpinner = false;
                        this.$emit("update:showSpinner", this.showSpinner);
                    }
                    });
                }
            },
            deep: true
        }
    },
    async mounted(){
        this.connectionService = new ConnectionService();
        if( this.connection.selected === true)
        {
            this.connectionService.getDatabaseSchemaList(this.connection.id).then((response: any) => {
                let schemaList = response.schemas;
                if(schemaList != null){
                    this.schemaList = schemaList.map((item : String) : any => ({
                    text : item,
                    selected : (item === this.schema)
                }));
                this.showSpinner = false;
                this.$emit("update:showSpinner", this.showSpinner);
            }
            });
        }
    },
}
</script>
<style scoped>
td{
    border:0;
}
</style>
