function init_components_dashboard(input){ var data = $.extend({ column: 8, line: 8, onMove: 'dashboard_widget_move', onRemove: 'dashboard_widget_delete', onResize: 'dashboard_widget_resize', onConfigure: 'dashboard_widget_configure', onConfigureForm : 'dashboard_widget_configure_form', onRefresh: 'dashboard_widget_refresh', onAdd: 'dashboard_widget_add' },{ column: input.attr('data-column'), line: input.attr('data-line'), scope: input.attr('data-scope'), uid: input.attr('data-uid'), id: input.attr('data-id'), }); component = input.data('component'); if(!component){ component = new Dashboard({ element : input, columnNumber : data.column, lineNumber : data.line }); input.data('component',component); if(data.onRefresh){ setInterval(function(){ $.action({ action : data.onRefresh, scope: data.scope, uid: data.uid }, function(response){ for(var k in response.rows){ var widget = $.extend(component.widgets[response.rows[k].id],response.rows[k]); component.widgets[widget.id] = widget; component.renderContent(widget.id); } }); },1000); } } if(data.scope){ $.action({ action: 'dashboard_widget_search', scope: data.scope, uid: data.uid },function(response){ component.addWidgets(response.widgets); }); } /*component.addWidgets([{ width : 1, height: 1, row: 3, column: 5, id: 1, icon : 'far fa-user', headerBackground : 'rgb(0, 123, 255)', label : 'Hello monde', content : '

Wazup ?

' }, { width : 3, height: 3, row: 0, column: 1, id: 2, removable : false, resizeable : false, draggable : false, label : 'ByBy', content : '

Wazup 2 ?

' }]);*/ component.on('placeholder-click',function(placeholder){ $.action({ action : data.onAdd, scope : data.scope, uid : data.uid, row : placeholder.row, column : placeholder.column },function(widget){ component.addWidgets([widget]); }); }).on('move',function(widget){ console.log('Widget has moved', widget); $.action({ action : data.onMove, widget : widget }); }).on('resize',function(widget){ console.log('Widget has resized', widget); $.action({ action: data.onResize, widget: widget }); }).on('delete',function(widget){ if(!confirm('Êtes-vous sûr de vouloir supprimer ce widget?')) return true; console.log('Widget has removed', widget); $.action({ action : data.onRemove, widget : widget }); }).on('configure',function(id){ $.action({ action : 'dashboard_widget_by_id', id : id },function(response){ var widget = $.extend(component.widgets[response.item.id],response.item); $('#dashboard-configure-menu li').off('click').click(function(){ var li = $(this); var menu = li.attr('data-menu'); li.addClass('active').parent().find('>li').removeClass('active'); switch(menu){ case "model": $('#dashboard-configure-content').html($('#configure-model').html()); init_components('#dashboard-configure-content'); var modelList = $('#widget-models'); modelList.fill({ action : 'dashboard_model_search', },function(response){ $('li',modelList).removeClass('active'); $('li[data-model="'+widget.model+'"]',modelList).addClass('active'); $('li',modelList).click(function(){ $('#widget-models li').removeClass('active'); $(this).addClass('active'); $.action({ action : data.onConfigure, type : menu, id : widget.id, model : $(this).attr('data-model') },function(response){ }); }); }); break; case "properties": $('#dashboard-configure-content').html($('#properties-model').html()); $('#dashboard-properties-form').load('action.php',{action:data.onConfigureForm,id : widget.id},function(){ init_components(); }); $('#dashboard-properties-save').click(function(){ var bundle ={ action : data.onConfigure, type : menu, id : widget.id, meta : $('#dashboard-properties-form').toJson() }; $.action(bundle,function(){ $.message('success','sauvegardé'); }); }); break; case "style": $('#dashboard-configure-content').html($('#configure-style').html()); var form = {}; form['widget-header-background'] = widget.headerBackground ; form['widget-body-background'] = widget.bodyBackground; form['widget-body-color'] = widget.bodyColor ; form['widget-header-icon-color'] = widget.iconColor; form['widget-header-title-color'] = widget.titleColor; form['widget-header-icon'] = widget.icon; $('#configure-style-table').fromJson(form).off('change').change(function(){ var form = $('#configure-style-table').toJson(); widget.headerBackground = form['widget-header-background']; widget.bodyBackground = form['widget-body-background']; widget.bodyColor= form['widget-body-color']; widget.iconColor = form['widget-header-icon-color']; widget.titleColor = form['widget-header-title-color']; widget.icon = form['widget-header-icon']; var customiser = $('.dashboard-widget-customizer'); $('.dashboard-widget-header',customiser).css('backgroundColor',widget.headerBackground+'!important'); $('.widget-header-title',customiser).css('color',widget.titleColor+'!important'); $('.dashboard-widget-content',customiser).css({ backgroundColor : widget.bodyBackground+'!important', color : widget.bodyColor+'!important' }); $('.widget-header-icon i',customiser).css('color',widget.iconColor+'!important'); $('.widget-header-icon i',customiser).attr('class',widget.icon); component.widgets[widget.id] = widget; component.renderContent(widget.id); $.action({ action : data.onConfigure, id : widget.id, type : menu, headerBackground : widget.headerBackground, bodyBackground : widget.bodyBackground, bodyColor : widget.bodyColor, iconColor : widget.iconColor, titleColor : widget.titleColor, icon : widget.icon }); }); init_components('#dashboard-configure-content'); break; } }); $('#dashboard-configure-menu li[data-menu="model"]').click(); }); }); }