import { GroupService } from './../../../../services/api/group.service' ; import { LinkedDashboardProps } from '@eda/components/eda-panels/eda-blank-panel/link-dashboards/link-dashboard-props' ; import { TableConfig } from './panel-charts/chart-configuration-models/table-config' ; import { PanelChartComponent } from './panel-charts/panel-chart.component' ; import { Component , Input , OnInit , ViewChild , Output , EventEmitter } from '@angular/core' ; import { FormBuilder , FormGroup , Validators } from '@angular/forms' ; import { CdkDragDrop , moveItemInArray , transferArrayItem , CdkDrag } from '@angular/cdk/drag-drop' ; import { Column , EdaPanel , InjectEdaPanel } from '@eda/models/model.index' ; import { DashboardService , ChartUtilsService , AlertService , SpinnerService , FileUtiles , EdaChartType , FilterType , QueryBuilderService , OrdenationType } from '@eda/services/service.index' ; import { EdaPageDialogComponent , EdaDialogController , EdaContextMenu , EdaDialogCloseEvent } from '@eda/shared/components/shared-components.index' ; import { EdaChartComponent } from '@eda/components/component.index' ; import { PanelChart } from './panel-charts/panel-chart' ; import * as _ from 'lodash' ; import { ChartConfig } from './panel-charts/chart-configuration-models/chart-config' ; import { ChartJsConfig } from './panel-charts/chart-configuration-models/chart-js-config' ; import { EdaInputText } from '@eda/shared/components/eda-input/eda-input-text' ; /** Panel utils  */ import { PanelOptions } from './panel-utils/panel-menu-options' ; import { TableUtils } from './panel-utils/tables-utils' ; import { QueryUtils } from './panel-utils/query-utils' ; import { EbpUtils } from './panel-utils/ebp-utils' ; import { ChartsConfigUtils } from './panel-utils/charts-config-utils' ; import { PanelInteractionUtils } from './panel-utils/panel-interaction-utils' ; @ Component ( { selector : 'eda-blank-panel' , templateUrl : './eda-blank-panel.component.html' , styleUrls : [ ] } ) export class EdaBlankPanelComponent implements OnInit { @ ViewChild ( 'pdialog' , { static : false } ) pdialog : EdaPageDialogComponent ; @ ViewChild ( 'edaChart' , { static : false } ) edaChart : EdaChartComponent ; @ ViewChild ( PanelChartComponent , { static : false } ) panelChart : PanelChartComponent ; @ ViewChild ( 'panelChartComponentPreview' , { static : false } ) panelChartPreview : PanelChartComponent ; @ ViewChild ( 'op' , { static : false } ) op : any ; @ Input ( ) panel : EdaPanel ; @ Input ( ) inject : InjectEdaPanel ; @ Output ( ) remove : EventEmitter < any > = new EventEmitter ( ) ; /** propietats que s'injecten al dialog amb les propietats específiques de cada gràfic. */ public configController : EdaDialogController ; public filterController : EdaDialogController ; public chartController : EdaDialogController ; public tableController : EdaDialogController ; public alertController : EdaDialogController ; public cumsumAlertController : EdaDialogController ; public mapController : EdaDialogController ; public kpiController : EdaDialogController ; public sankeyController : EdaDialogController ; public treeMapController : EdaDialogController ; public funnelController : EdaDialogController ; public linkDashboardController : EdaDialogController ; public scatterPlotController : EdaDialogController ; public knobController : EdaDialogController ; public sunburstController : EdaDialogController ; public contextMenu : EdaContextMenu ; public lodash : any = _ ; public inputs : any = { } ; /**Dashbard emitter */ /** Page variables */ public title : string = 'Blank Panel' ; public display_v = { page_dialog : false , saved_panel : false , btnSave : false , aggreg_dialog : false , calendar : false , between : false , filterValue : true , filterButton : true , minispinner : false , responsive : false , chart : '' , disablePreview : true , disableQueryInfo : true , notSaved : false , minispinnerSQL : false } ; public index : number ; public description : string ; public chartForm : FormGroup ; public userSelectedTable : string ; /**Strings */ public editQuery : string = $localize `:@@EditQuery:EDITAR CONSULTA` ; public editSQLQuery : string = $localize `:@@EditSQLQuery:EDITAR CONSULTA SQL` ; public limitRowsInfo : string = $localize `:@@limitRowsInfo:Establece un Top n para la consulta` ; public draggFields : string = $localize `:@@dragFields:Arrastre aquí los atributos que quiera ver en su panel` ; public draggFilters : string = $localize `:@@draggFilters:Arrastre aquí los atributos sobre los que quiera filtrar` ; public ptooltipSQLmode : string = $localize `:@@sqlTooltip:Al cambiar de modo perderás la configuración de la consulta actual` ; public ptooltipViewQuery : string = $localize `:@@ptooltipViewQuery:Ver consulta SQL` ; /** Query Variables */ public tables : any [ ] = [ ] ; public tablesToShow : any [ ] = [ ] ; public columns : any [ ] = [ ] ; public aggregationsTypes : any [ ] = [ ] ; public filtredColumns : Column [ ] = [ ] ; public ordenationTypes : OrdenationType [ ] ; public currentQuery : any [ ] = [ ] ; public currentSQLQuery : string = '' ; public queryLimit : number ; public modeSQL : boolean ; public sqlOriginTables : { } [ ] ; public sqlOriginTable : any ; /** Chart Variables */ public chartTypes : EdaChartType [ ] ; public chartData : any [ ] = [ ] ; public chartLabels : string [ ] = [ ] ; public graficos : any = { } ; public filterTypes : FilterType [ ] ; public selectedFilters : any [ ] = [ ] ; public globalFilters : any [ ] = [ ] ; public filterValue : any = { } ; public color : any = { r : 255 , g : 0 , b : 0.3 } ; public panelDeepCopy : any = { } ; public colorsDeepCopy : any = { } ; public queryFromServer : string = '' ; /**panel chart component configuration */ public panelChartConfig : PanelChart = new PanelChart ( ) ; constructor ( public queryBuilder , public fileUtiles , private formBuilder , public dashboardService , public chartUtils , public alertService , public spinnerService , public groupService ) { this . initializeBlankPanelUtils ( ) ; this . initializeInputs ( ) ; } ngOnInit ( ) { this . index = 0 ; this . modeSQL = false ; this . setTablesData ( ) ; /**If panel comes from server */ if ( this . panel . content ) { const query = this . panel . content . query ; if ( query . query . modeSQL ) { this . modeSQL = true ; this . currentSQLQuery = query . query . SQLexpression ; this . sqlOriginTable = this . tables . filter ( t => t . table_name === query . query . fields [ 0 ] . table_id ) . map ( table => { return { label : table . display_name . default , value : table . table_name } ; } ) [ 0 ] ; } this . loadChartsData ( this . panel . content ) ; } this . dashboardService . notSaved . subscribe ( ( data ) => this . display_v . notSaved = data , ( err ) => this . alertService . addError ( err ) ) ; this . contextMenu = new EdaContextMenu ( { header : $localize `:@@panelOptions0:OPCIONES DEL PANEL` , contextMenuItems : PanelOptions . generateMenu ( this ) } ) ; } getEditMode ( ) { const user = sessionStorage . getItem ( 'user' ) ; const userName = JSON . parse ( user ) . name ; return ( userName !== 'edaanonim' && ! this . inject . isObserver ) ; } private initializeBlankPanelUtils ( ) { this . chartForm = this . formBuilder . group ( { chart : [ null , Validators . required ] } ) ; this . chartTypes = this . chartUtils . chartTypes ; this . filterTypes = this . chartUtils . filterTypes ; this . ordenationTypes = this . chartUtils . ordenationTypes ; } private initializeInputs ( ) { this . inputs = { findTable : new EdaInputText ( { name : 'find_table' , divClass : 'p-input-icon-left input-icons' , inputClass : 'input-field' , icon : 'fa fa-search' , onKeyUp : ( event ) => this . onTableInputKey ( event ) } ) , findColumn : new EdaInputText ( { name : 'find_column' , divClass : 'p-input-icon-left input-icons' , inputClass : 'input-field' , icon : 'fa fa-search' , onKeyUp : ( event ) => this . onColumnInputKey ( event ) } ) } ; } param localFilters param globalFilters return mergeFilters ( localFilters , globalFilters ) { const out = localFilters . filter ( f => f . isGlobal === false ) ; globalFilters . forEach ( f => out . push ( f ) ) ; return out ; } public setTablesData = ( ) => { const tables = TableUtils . getTablesData ( this . inject . dataSource . model . tables , this . inject . applyToAllfilter ) ; this . tables = _ . cloneDeep ( tables . allTables ) ; this . tablesToShow = _ . cloneDeep ( tables . tablesToShow ) ; this . sqlOriginTables = _ . cloneDeep ( tables . sqlOriginTables ) ; } ; /**
     * reLoad tables from model (called from dashboard component)
     */ public reloadTablesData ( ) { this . setTablesData ( ) ; } param panelContent async loadChartsData ( panelContent ) { if ( this . panel . content ) { this . display_v . minispinner = true ; try { const response = await QueryUtils . switchAndRun ( this , panelContent . query ) ; this . chartLabels = this . chartUtils . uniqueLabels ( response [ 0 ] ) ; this . chartData = response [ 1 ] ; this . buildGlobalconfiguration ( panelContent ) ; } catch ( err ) { this . alertService . addError ( err ) ; this . display_v . minispinner = false ; } } } param panelContent buildGlobalconfiguration ( panelContent ) { if ( ! panelContent . query . query . modeSQL ) { panelContent . query . query . fields . forEach ( element => { PanelInteractionUtils . loadColumns ( this , this . tables . find ( t => t . table_name === element . table_id ) ) ; PanelInteractionUtils . moveItem ( this , this . columns . find ( c => c . column_name === element . column_name ) ) ; } ) ; } this . queryLimit = panelContent . query . query . queryLimit ; PanelInteractionUtils . handleFilters ( this , panelContent . query . query ) ; PanelInteractionUtils . handleFilterColumns ( this , panelContent . query . query . filters , panelContent . query . query . fields ) ; PanelInteractionUtils . handleCurrentQuery ( this ) ; this . chartForm . patchValue ( { chart : this . chartUtils . chartTypes . find ( o => o . subValue === panelContent . edaChart ) } ) ; PanelInteractionUtils . verifyData ( this ) ; const config = ChartsConfigUtils . recoverConfig ( panelContent . chart , panelContent . query . output . config ) ; this . changeChartType ( panelContent . chart , panelContent . edaChart , config ) ; this . display_v . saved_panel = true ; this . display_v . minispinner = false ; } /**
     * Updates panel content with actual state
     */ public savePanel ( ) { this . panel . title = this . pdialog . getTitle ( ) ; if ( ! _ . isEmpty ( this . graficos ) || this . modeSQL ) { this . display_v . saved_panel = true ; const query = this . initObjectQuery ( this . modeSQL ) ; const chart = this . chartForm . value . chart . value ? this . chartForm . value . chart . value : this . chartForm . value . chart ; const edaChart = this . panelChart . props . edaChart ; this . panel . content = { query , chart , edaChart } ; /**This is to repaint on panel redimension */ if ( [ 'parallelSets' , 'kpi' , 'treeMap' , 'scatterPlot' , 'knob' , 'funnel' , 'sunburst' ] . includes ( chart ) ) { this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , chart , edaChart , this . panelChartConfig . config ) ; } } else { this . display_v . saved_panel = false ; } this . display_v . page_dialog = false ; this . dashboardService . _notSaved . next ( true ) ; } public initObjectQuery ( modeSQL ) { if ( modeSQL ) { return QueryUtils . initSqlQuery ( this ) ; } else { return QueryUtils . initEdaQuery ( this ) ; } } /**
     * Reloads panels chart when runQuery() is called with globalFilters
     */ public reloadContent ( ) { const content = this . panel . content ; const output = this . panel . content . query . output ; PanelInteractionUtils . verifyData ( this ) ; const config = output . styles ? new ChartConfig ( output . styles ) : new ChartConfig ( output . config ) ; this . changeChartType ( content . chart , content . edaChart , config ) ; this . chartForm . patchValue ( { chart : this . chartUtils . chartTypes . find ( o => o . subValue === content . edaChart ) } ) ; } param query param chartLabels param chartData param type param layout private renderChart ( query , chartLabels , chartData , type , subType , config ) { const chartConfig = config || new ChartConfig ( ChartsConfigUtils . setVoidChartConfig ( type ) ) ; this . panelChartConfig = new PanelChart ( { query : query , data : { labels : chartLabels , values : chartData } , chartType : type , config : chartConfig , edaChart : subType , maps : this . inject . dataSource . model . maps , size : { x : this . panel . w , y : this . panel . h } , linkedDashboardProps : this . panel . linkedDashboardProps , } ) ; } /**
     * Updates chart configuration properties
     */ public setChartProperties ( ) { const config = this . panelChart . getCurrentConfig ( ) ; if ( config && [ 'bar' , 'line' , 'horizontalBar' , 'polarArea' , 'doughnut' ] . includes ( config . chartType ) && config . chartType === this . graficos . chartType ) { this . graficos = this . panelChart . getCurrentConfig ( ) ; } } param type param content public changeChartType ( type , subType , config ? ) { this . graficos = { } ; let allow = _ . find ( this . chartTypes , c => c . value === type ) ; this . display_v . chart = type ; this . graficos . chartType = type ; this . graficos . edaChart = subType ; this . graficos . addTrend = config && config . getConfig ( ) ? config . getConfig ( ) [ 'addTrend' ] : false ; if ( ! _ . isEqual ( this . display_v . chart , 'no_data' ) && ! allow . ngIf && ! allow . tooManyData ) { this . panelChart . destroyComponent ( ) ; const _config = config || new ChartConfig ( ChartsConfigUtils . setVoidChartConfig ( type ) ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , type , subType , _config ) ; } } return public getChartStyles ( chart ) { if ( this . panel . content && this . panel . content . chart === chart ) { return new ChartConfig ( this . panel . content . query . output . config ) ; } else { return null ; } } /**
     *
     */ public onTableInputKey ( event ) { this . setTablesData ( ) ; if ( event . target . value ) { this . tablesToShow = this . tablesToShow . filter ( table => table . display_name . default . toLowerCase ( ) . includes ( event . target . value . toLowerCase ( ) ) ) ; } } public onColumnInputKey ( event ) { if ( ! _ . isNil ( this . userSelectedTable ) ) { PanelInteractionUtils . loadColumns ( this , this . tablesToShow . filter ( table => table . table_name === this . userSelectedTable ) [ 0 ] ) ; if ( event . target . value ) { this . columns = this . columns . filter ( col => col . display_name . default . toLowerCase ( ) . includes ( event . target . value . toLowerCase ( ) ) ) ; } } } param event public drop ( event ) { if ( event . previousContainer === event . container ) { moveItemInArray ( event . container . data , event . previousIndex , event . currentIndex ) ; } else { transferArrayItem ( event . previousContainer . data , event . container . data , event . previousIndex , event . currentIndex ) ; } } public isAllowed = ( drag ? , drop ? ) => false ; param column param isFilter public openColumnDialog ( column , isFilter ? ) { this . disableBtnSave ( ) ; const p = { selectedColumn : _ . cloneDeep ( column ) , currentQuery : this . currentQuery , inject : this . inject , panel : this . panel , table : this . findTable ( column . table_id ) , filters : this . selectedFilters } ; if ( ! isFilter ) { this . configController = new EdaDialogController ( { params : p , close : ( event , response ) => { if ( response . length > 0 ) { response . forEach ( f => { if ( _ . isNil ( this . selectedFilters . find ( o => o . filter_id === f . filter_id ) ) ) { this . selectedFilters . push ( f ) ; } if ( f . removed ) { this . selectedFilters = _ . filter ( this . selectedFilters , o => o . filter_id !== f . filter_id ) ; } } ) ; } this . configController = undefined ; } } ) ; } else { this . filterController = new EdaDialogController ( { params : p , close : ( event , response ) => { if ( response . length > 0 ) { response . forEach ( f => { if ( _ . isNil ( this . selectedFilters . find ( o => o . filter_id === f . filter_id ) ) ) { this . selectedFilters . push ( f ) ; } if ( f . removed ) { this . selectedFilters = _ . filter ( this . selectedFilters , o => o . filter_id !== f . filter_id ) ; } } ) ; } this . filterController = undefined ; } } ) ; } } param t private findTable ( t ) { return this . tables . find ( table => table . table_name === t ) . display_name . default ; } param filter public setGlobalFilter ( filter ) { if ( filter . filter_elements [ 0 ] . value1 . length === 0 ) { let filters = this . globalFilters ; this . globalFilters = filters . filter ( f => f . filter_id !== filter . filter_id ) ; } else { let filters = this . globalFilters ; this . globalFilters = filters . filter ( f => f . filter_id !== filter . filter_id ) ; this . globalFilters . push ( filter ) ; } } public disableBtnSave = ( ) => this . display_v . btnSave = true ; public ableBtnSave = ( ) => this . display_v . btnSave = false ; onTopChange ( ) { this . display_v . btnSave = true ; } public openEditarConsulta ( ) { this . display_v . page_dialog = true ; this . ableBtnSave ( ) ; PanelInteractionUtils . verifyData ( this ) ; } /**
     * Reset state when panel edition is cancelled
     */ public closeEditarConsulta ( ) { this . display_v . saved_panel = false ; this . columns = [ ] ; this . currentQuery = [ ] ; if ( this . panelDeepCopy . query ) { this . panelDeepCopy . query . query . filters = this . mergeFilters ( this . panelDeepCopy . query . query . filters , this . globalFilters ) ; this . filtredColumns = [ ] ; this . currentSQLQuery = this . panelDeepCopy . query . query . SQLexpression ; this . modeSQL = this . panelDeepCopy . query . query . modeSQL ; } this . loadChartsData ( this . panelDeepCopy ) ; this . userSelectedTable = undefined ; this . tablesToShow = this . tables ; this . display_v . chart = '' ; this . display_v . page_dialog = false ; } param event param properties public onCloseChartProperties ( event , properties ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { if ( properties ) { this . graficos = { } ; this . graficos = _ . cloneDeep ( properties ) ; this . panel . content . query . output . config = { colors : this . graficos . chartColors , chartType : this . graficos . chartType } ; const layout = new ChartConfig ( new ChartJsConfig ( this . graficos . chartColors , this . graficos . chartType , this . graficos . addTrend , this . graficos . addComparative ) ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , layout ) ; } this . dashboardService . _notSaved . next ( true ) ; } this . chartController = undefined ; } public onCloseTableProperties ( event , properties ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { if ( properties ) { this . panel . content . query . output . config = properties ; const config = new ChartConfig ( properties ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; } this . dashboardService . _notSaved . next ( true ) ; } this . tableController = undefined ; } public onCloseMapProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . content . query . output . config . color = response . color ; this . panel . content . query . output . config . logarithmicScale = response . logarithmicScale ; this . panel . content . query . output . config . legendPosition = response . legendPosition ; const config = new ChartConfig ( this . panel . content . query . output . config ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; this . dashboardService . _notSaved . next ( true ) ; } this . mapController = undefined ; } public onCloseSankeyProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . content . query . output . config . colors = response . colors ; const config = new ChartConfig ( this . panel . content . query . output . config ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; this . dashboardService . _notSaved . next ( true ) ; } this . sankeyController = undefined ; } public onCloseTreeMapProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . content . query . output . config . colors = response . colors ; const config = new ChartConfig ( this . panel . content . query . output . config ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; this . dashboardService . _notSaved . next ( true ) ; } this . treeMapController = undefined ; } public onCloseFunnelProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . content . query . output . config . colors = response . colors ; const config = new ChartConfig ( this . panel . content . query . output . config ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; this . dashboardService . _notSaved . next ( true ) ; } this . funnelController = undefined ; } public onCloseScatterProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . content . query . output . config . colors = response . colors ; const config = new ChartConfig ( this . panel . content . query . output . config ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; this . dashboardService . _notSaved . next ( true ) ; } this . scatterPlotController = undefined ; } public onCloseSunburstProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . content . query . output . config . colors = response . colors ; const config = new ChartConfig ( this . panel . content . query . output . config ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; this . dashboardService . _notSaved . next ( true ) ; } this . sunburstController = undefined ; } public onCloseKnobProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . content . query . output . config = response ; const config = new ChartConfig ( this . panel . content . query . output . config ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; this . dashboardService . _notSaved . next ( true ) ; } this . knobController = undefined ; } public onCloseLinkDashboardProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . linkedDashboard = response ? true : false ; this . panel . linkedDashboardProps = response ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , ChartsConfigUtils . setConfig ( this ) ) ; this . dashboardService . _notSaved . next ( true ) ; } this . linkDashboardController = undefined ; } public onCloseKpiProperties ( event , response ) { if ( ! _ . isEqual ( event , EdaDialogCloseEvent . NONE ) ) { this . panel . content . query . output . config . alertLimits = response . alerts ; this . panel . content . query . output . config . sufix = response . sufix ; const config = new ChartConfig ( this . panel . content . query . output . config ) ; this . renderChart ( this . currentQuery , this . chartLabels , this . chartData , this . graficos . chartType , this . graficos . edaChart , config ) ; this . dashboardService . _notSaved . next ( true ) ; } this . kpiController = undefined ; } public handleTabChange ( event ) { this . index = event . index ; if ( this . index === 1 ) { const content = this . panel . content ; /**Reload  to render, needs timeOut for whatever reason :/  */ if ( content && ( content . chart === 'coordinatesMap' || content . chart === 'geoJsonMap' || content . chart === 'parallelSets' || content . chart === 'treeMap' || content . chart === 'scatterPlot' || content . chart === 'funnel' || content . chart === 'knob' || content . chart === 'sunburst' ) ) { setTimeout ( ( ) => { const config = ChartsConfigUtils . recoverConfig ( content . chart , content . query . output . config ) ; this . changeChartType ( content . chart , content . edaChart , config ) ; } ) ; } } } public onResize ( event ) { this . display_v . responsive = event . currentTarget . innerWidth <= 1440 ; } /** Run query From dashboard component */ public runQueryFromDashboard = ( globalFilters ) => QueryUtils . runQuery ( this , globalFilters ) ; /**
    * Runs actual query when execute button is pressed to check for heavy queries
    */ public runManualQuery = ( ) => QueryUtils . runManualQuery ( this ) ; public moveItem = ( column ) => PanelInteractionUtils . moveItem ( this , column ) ; public searchRelations = ( c ) => PanelInteractionUtils . searchRelations ( this , c ) ; public loadColumns = ( table ) => PanelInteractionUtils . loadColumns ( this , table ) ; public removeColumn = ( c , list ? ) => PanelInteractionUtils . removeColumn ( this , c , list ) ; public getOptionDescription = ( value ) : string => EbpUtils . getOptionDescription ( value ) ; public getOptionIcon = ( value ) : string => EbpUtils . getOptionIcon ( value ) ; public chartType = ( type ) : number => EbpUtils . chartType ( type ) ; public getTooManyDataDescription = ( ) : string => $localize `:@@tooManyValuestext:Hay demasiados valores para este gráfico. Agrega o filtra los datos para poder visualizarlos mejor.` ; public getChartType ( ) { if ( this . panel . content ) { return this . panel . content . chart ; } else return null ; } public switchAndBuildQuery ( ) { if ( ! this . modeSQL ) return QueryUtils . initEdaQuery ( this ) ; else return QueryUtils . initSqlQuery ( this ) ; } public removePanel ( ) { this . remove . emit ( this . panel . id ) ; } public showDescription ( event ) { this . description = event . description . default ; } public async getQuery ( $event ) { this . display_v . minispinnerSQL = true ; this . queryFromServer = null ; this . op . toggle ( $event ) ; const query = QueryUtils . initEdaQuery ( this ) ; let serverQuery = await QueryUtils . getQueryFromServer ( this , query ) ; let whereIndex = serverQuery . lastIndexOf ( 'where 1 = 1' ) ; const TO_REPLACE_SIZE = 16 ; if ( whereIndex >= 0 ) { serverQuery = serverQuery . substring ( 0 , whereIndex - 1 ) + '\nwhere ' + serverQuery . substring ( whereIndex + TO_REPLACE_SIZE , serverQuery . length ) ; } let length = serverQuery . length ; for ( let i = 0 ; i < length ; i ++ ) { if ( serverQuery [ i ] === '\n' ) { serverQuery = serverQuery . slice ( 0 , i ) + " " + serverQuery . slice ( i ) ; length ++ ; i ++ ; } } this . display_v . minispinnerSQL = false ; this . queryFromServer = serverQuery ; } public migrateQuery ( ) { this . currentSQLQuery = this . queryFromServer ; this . queryFromServer = '' ; this . currentQuery = [ ] ; this . modeSQL = true ; } public async changeQueryMode ( ) { this . currentSQLQuery = '' ; this . currentQuery = [ ] ; this . display_v . btnSave = true ; } public accopen ( e ) { } /** This funciton return the display name for a given table. Its used for the query resumen      */ public getNiceTableName ( table ) { return this . tables . find ( t => t . table_name === table ) . display_name . default ; } }