如何修改dashlets以自動刷新？

Question

是否有一種簡單的方法來修改一個Dashlet以自動重新加載它週期性的？

我特別想到「我的任務」dashlet - 我們正在使用匯總的審閱工作流程，因此任務可能隨時隨地創建並被聲明。

用戶不斷點擊已經被聲明的任務 - 或者必須記住繼續重新加載他們的儀表板頁面可能令人沮喪。我更喜歡Dashlet在定時的時間間隔刷新，所以它總是比較合理的。

Answer 1

爲了做到這一點，您需要爲文件components/dashlets/my-tasks.get.js中的客戶端類Alfresco.dashlet.MyTasks（docs,source）添加新的功能。首先，您需要在指定爲YAHOO.lang.augmentObject() call中的第二個參數的原型擴展中添加一個新方法，例如

 ... 
     }, // end of last OOTB function - add a comment here 

     // begin changes 
     reloadData: function MyTasks_onReady() 
     { 
     this.widgets.alfrescoDataTable.loadDataTable(
      this.options.filters[this.widgets.filterMenuButton.value] 
     ); 
     } 
     // end changes 
    }); 
})(); 

這不是理想的開發環境，可以在Web應用程序共享直接修改JS文件，儘管你也需要更新相應的-min.js文件。

一旦你做到了這一點，確認其工作運行下面一行在瀏覽器的JavaScript控制檯

Alfresco.util.ComponentManager.findFirst("Alfresco.dashlet.MyTasks").reloadData(); 

如果這樣的作品，那麼你就可以將你的新方法，標題欄動作（請參閱我的DevCon presentation瞭解更多背景信息），在dashlet網頁腳本中。該方法取決於您使用的是v4.2還是以前的版本，但是如果是後者，則需要將一些代碼添加到Dashlet的Freemarker文件my-tasks.get.html.ftl（在WEB-INF/classes/alfresco/site-webscripts/org/alfresco/components/dashlets下）。

在該文件中，你應該看到一個<script>標籤內一些JavaScript代碼，這將設置一些實用工具類客戶端類的一個實例，並且其可以替換爲以下內容，添加你自定義標題欄操作。

(function() 
{ 
    var dashlet = new Alfresco.dashlet.MyTasks("${jsid}").setOptions(
    { 
     hiddenTaskTypes: [<#list hiddenTaskTypes as type>"${type}"<#if type_has_next>, </#if></#list>], 
     maxItems: ${maxItems!"50"}, 
     filters: 
     {<#list filters as filter> 
     "${filter.type?js_string}": "${filter.parameters?js_string}"<#if filter_has_next>,</#if> 
     </#list>} 
    }).setMessages(${messages}); 
    new Alfresco.widget.DashletResizer("${id}", "${instance.object.id}"); 
    var refreshDashletEvent = new YAHOO.util.CustomEvent("onDashletRefresh"); 
    refreshDashletEvent.subscribe(dashlet.reloadData, dashlet, true); 
    new Alfresco.widget.DashletTitleBarActions("${args.htmlid}").setOptions(
    { 
     actions: 
     [ 
     { 
      cssClass: "refresh", 
      eventOnClick: refreshDashletEvent, 
      tooltip: "${msg("dashlet.refresh.tooltip")?js_string}" 
     }, 
     { 
      cssClass: "help", 
      bubbleOnClick: 
      { 
       message: "${msg("dashlet.help")?js_string}" 
      }, 
      tooltip: "${msg("dashlet.help.tooltip")?js_string}" 
     } 
     ] 
    }); 
})(); 

您將需要添加一些樣式指定的類名，在dashlet的CSS文件my-tasks.css，如以下

.my-tasks .titleBarActions .refresh 
{ 
    display: none; 
    background-image: url('refresh-icon.png'); 
} 

圖標文件（here is one你可以重新使用）必須與CSS文件位於同一目錄中。

最後，您需要定義用於標題欄動作的工具提示的標籤dashlet.refresh.tooltop。您可以在Dashlet網頁腳本的.properties文件中執行此操作。

對於一個類似的例子，請查看我的Train Times dashlet的源代碼，它具有刷新標題欄操作。

在某些方面，定義自己的dashlets實際上比擴展Alfresco提供的dash更容易，但是如果您可以選擇使用4.2.x，則新方法允許您擴展現有組件，而無需重複任何代碼，這顯然使升級更容易。