templates/CRM/Contact/Page/Dashlet.tpl

   1 {*
   2  +--------------------------------------------------------------------+
   3  | Copyright CiviCRM LLC. All rights reserved.                        |
   4  |                                                                    |
   5  | This work is published under the GNU AGPLv3 license with some      |
   6  | permitted exceptions and without any warranty. For full license    |
   7  | and copyright information, see https://civicrm.org/licensing       |
   8  +--------------------------------------------------------------------+
   9 *}
  10     <div class="crm-submit-buttons">{crmButton p="civicrm/dashboard" q="reset=1" icon="check"}{ts}Done{/ts}{/crmButton}</div>
  11     <div id="help" style="padding: 1em;">
  12         {ts}Available dashboard elements - dashlets - are displayed in the dark gray top bar. Drag and drop dashlets onto the left or right columns below to add them to your dashboard. Changes are automatically saved. Click 'Done' to return to the normal dashboard view.{/ts}
  13         {help id="id-dash_configure" file="CRM/Contact/Page/Dashboard.hlp" admin=$admin}
  14     </div><br/>
  15     <div class="dashlets-header">{ts}Available Dashlets{/ts}</div>
  16     <div id="available-dashlets" class="dash-column">
  17         {foreach from=$availableDashlets item=row key=dashID}
  18       <div class="portlet">
  19         <div class="portlet-header" id="{$dashID}">{$row.label}{if $admin and !$row.is_reserved}&nbsp;<a class="crm-i fa-times delete-dashlet"></a>{/if}</div>
  20       </div>
  21         {/foreach}
  22     </div>
  23     <br/>
  24     <div class="clear"></div>
  25     <div id="dashlets-header-col-0" class="dashlets-header">{ts}Left Column{/ts}</div>
  26     <div id="dashlets-header-col-1" class="dashlets-header">{ts}Right Column{/ts}</div>
  27     <div id="existing-dashlets-col-0" class="dash-column">
  28         {foreach from=$contactDashlets.0 item=row key=dashID}
  29       <div class="portlet">
  30         <div class="portlet-header" id="{$dashID}">{$row.label}{if $admin and !$row.is_reserved}&nbsp;<a class="crm-i fa-times delete-dashlet"></a>{/if}</div>
  31       </div>
  32         {/foreach}
  33     </div>
  34
  35     <div id="existing-dashlets-col-1" class="dash-column">
  36         {foreach from=$contactDashlets.1 item=row key=dashID}
  37       <div class="portlet">
  38         <div class="portlet-header" id="{$dashID}">{$row.label}{if $admin and !$row.is_reserved}&nbsp;<a class="crm-i fa-times delete-dashlet"></a>{/if}</div>
  39       </div>
  40         {/foreach}
  41     </div>
  42
  43     <div class="clear"></div>
  44
  45 {literal}
  46 <script type="text/javascript">
  47   CRM.$(function($) {
  48       var currentReSortEvent;
  49     $(".dash-column").sortable({
  50       connectWith: '.dash-column',
  51       update: saveSorting
  52     });
  53
  54     $(".portlet").addClass("ui-widget ui-widget-content ui-helper-clearfix ui-corner-all")
  55       .find(".portlet-header")
  56         .addClass("ui-widget-header ui-corner-all")
  57         .end()
  58       .find(".portlet-content");
  59
  60     $(".dash-column").disableSelection();
  61
  62     function saveSorting(e, ui) {
  63             // this is to prevent double post call
  64         if (!currentReSortEvent || e.originalEvent != currentReSortEvent) {
  65                 currentReSortEvent = e.originalEvent;
  66
  67                 // Build a list of params to post to the server.
  68                 var params = {};
  69
  70                 // post each columns
  71                 dashletColumns = Array();
  72
  73                 // build post params
  74                 $('div[id^=existing-dashlets-col-]').each( function( i ) {
  75                     $(this).find('.portlet-header').each( function( j ) {
  76                         var elementID = this.id;
  77                         var idState = elementID.split('-');
  78                         params['columns[' + i + '][' + idState[0] + ']'] = idState[1];
  79                     });
  80                 });
  81
  82                 // post to server
  83                 var postUrl = {/literal}"{crmURL p='civicrm/ajax/dashboard' h=0 }"{literal};
  84                 params['op'] = 'save_columns';
  85                 params['key'] = {/literal}"{crmKey name='civicrm/ajax/dashboard'}"{literal};
  86                 CRM.status({}, $.post(postUrl, params));
  87             }
  88         }
  89
  90         $('.delete-dashlet').click( function( ) {
  91           var $dashlet = $(this).closest('.portlet-header');
  92           CRM.confirm({
  93             title: {/literal}'{ts escape="js"}Remove Permanently?{/ts}'{literal},
  94             message: {/literal}'{ts escape="js"}Do you want to remove this dashlet as an "Available Dashlet", AND delete it from all user dashboards?{/ts}'{literal}
  95           })
  96             .on('crmConfirm:yes', function() {
  97               var dashletID = $dashlet.attr('id');
  98               var idState = dashletID.split('-');
  99
 100               // Build a list of params to post to the server.
 101               var params = {dashlet_id: idState[0]};
 102
 103               // delete dashlet
 104               var postUrl = {/literal}"{crmURL p='civicrm/ajax/dashboard' h=0 }"{literal};
 105               params['op'] = 'delete_dashlet';
 106               params['key'] = {/literal}"{crmKey name='civicrm/ajax/dashboard'}"{literal};
 107               CRM.status({}, $.post(postUrl, params));
 108               $dashlet.parent().fadeOut('fast', function() {
 109                 $(this).remove();
 110               });
 111             });
 112         });
 113   });
 114 </script>
 115 {/literal}