JavaScript任務(wù)表的15種實用功能
譯文【51CTO.com快譯】如今,JavaScript任務(wù)表(schedulers)已能夠為開發(fā)者們提供幾十種實用的功能。而且,其中一些功能已經(jīng)成為了大家在開發(fā)基于Web的任務(wù)應(yīng)用時,所不可缺少的組成部分。
例如,我們很難想象一個無法在按天、按周、按月和按年的視圖間進行切換的任務(wù)應(yīng)用會是什么樣子。當然,也有一些不太明顯但非常實用的功能有待用戶去進一步發(fā)掘。在本文中,我們?yōu)殚_發(fā)者準備了三種類型的JavaScript計劃任務(wù)表、共計15種非常實用的功能。
Kendo UI任務(wù)表是Kendo UI庫(http://www.telerik.com/kendo-ui)的一部分,它提供幾十種全功能的部件。Kendo UI能夠支持目前主流的JavaScript庫,并能與jQuery、Angular、React和Vue協(xié)作進行使用。
1.模板
通過Kendo任務(wù)表,您能夠使用各種模板來自定義事件的外觀。您完全可以使用簡單的一段模板語法,去取代在復雜編程上所花費的精力。
2.橫向和縱向的分組
橫向和縱向的分組功能,能夠幫助您將各項任務(wù)資源按照水平和垂直方向進行排列與顯示。
3.限制
通過使用各種限制,您能夠更好地控制不同的任務(wù)資源。例如,該功能可以允許您禁用對于某個特定事件的拖動和大小的調(diào)整。另外,您可以通過設(shè)置規(guī)則,來允許或禁止創(chuàng)建和修改各種事件。
4.多選
您可以通過配置選擇功能,如:使用Ctrl + 某個鍵,以允許用戶一次性選擇多個事件。同時,通過在日歷的網(wǎng)格上進行拖曳操作,您還可以任意移動多個選定的任務(wù)。
5.時間軸視圖
Kendo UI任務(wù)表的時間軸視圖,允許您在選定的時間跨度內(nèi),按照時間順序顯示一系列安排好的時間檔期。同時,您也可以使用時間軸,向最終用戶提供整體任務(wù)意圖的全貌??梢哉f,時間軸視圖為那些需要可視化、和監(jiān)控進展的當前任務(wù)或項目,提供了一個***的解決方案。
DHTMLX任務(wù)表是一種類似Google的JavaScript事件日歷組件,它具有豐富的視圖和功能特征。同時,它為用戶提供了一個整潔的用戶界面(UI)和可定制的外觀。
1.重復性事件
DHTMLX任務(wù)表允許您創(chuàng)建各種重復性事件。這些事件可以根據(jù)用戶的選擇,按照每天、每周、每月或每年進行重復。其彈出式編輯窗口可幫助您創(chuàng)建新的事件、并設(shè)置包括復發(fā)頻率在內(nèi)的所有必要的參數(shù)。如果您想安排某個Scrum的每日會議,該功能將十分有用。
2.地圖視圖
該任務(wù)表支持Google地圖的整合。使用此功能,您可以在日歷上將某個事件與特定位置相關(guān)聯(lián)。在創(chuàng)建新的事件時,用戶既可以簡單指定一個位置,又可以精確地在地圖上選擇某個理想的位置。如果您的任務(wù)與旅行相關(guān),那么該功能將非常實用。
3.皮膚定制
您可以調(diào)整DHTMLX任務(wù)表的外觀,以匹配自己的應(yīng)用程序風格??尚薷牡脑匕ǎ侯伾⑽谋?、尺寸、每周***天的特征、以及任務(wù)表的所有其他方面。各種樣式文件都被包含在DHTMLX任務(wù)表之中。基于這些文件,您也可以為某個單獨的外觀、或應(yīng)用的整體觀感,去自定義并創(chuàng)建屬于自己的皮膚。
4.多資源視圖
DHTMLX任務(wù)表提供了一個基于組的視圖,它允許開發(fā)者通過多個日歷,來呈現(xiàn)多種資源,如不同團隊成員、或辦公室的不同房間等。同時,對于不同的資源,日歷可以按照不同的列進行排列,這樣您就可以在同一頁面上方便地查看到它們。
5.微型日歷
為了幫助用戶瀏覽各種可用的事件,您可以在任務(wù)表上添加一個微型日歷。該微型日歷既可以顯示在任務(wù)表的左側(cè),又能被配置為彈出窗口的形式出現(xiàn)在屏幕上。籍此,用戶能夠方便地選定某個日期,并且可以快速地查看到各種指定的事件。
DevExtreme HTML5 JavaScript任務(wù)表
DevExtreme任務(wù)表是一種全功能的HTML5 JavaScript事件日歷。
1.日程視圖
其日程視圖允許用戶在列表中,查看所有即將發(fā)生的事件。這種視圖會按照日期進行分組,以顯示各種所有的預約好的日程安排。
2.當前時間指示器
該任務(wù)表允許您開啟當前的時間指示功能。您可以選擇當前時間指示的詳細程度。例如,您既可以使用一個具體的橫向標桿,也可以使用某個時間段的陰影塊,或兩者都用上來同步指示當前的時間。另外,您還可以定義該任務(wù)表刷新當前時間指示器位置的頻率。
3.時區(qū)支持
DevExtreme任務(wù)表允許您使用不同的時區(qū),來顯示日程安排。您可以通過向用戶提供可見的時區(qū)選擇項,讓他們在自己喜好的時區(qū)日歷中查看各種日程安排。
4.右鍵菜單集成
如果需要,您可以為任務(wù)表添加個性化定制的右鍵菜單內(nèi)容。
5.自適應(yīng)安排
您可以限制某個日期單元格中能夠顯示的任務(wù)數(shù)量。對于那些無法直接顯示在單元格中的任務(wù),您可以將其放入“安排收集器(appointment collector)”,并以“更多(more)”的方式讓用戶二次點擊查看。
原文標題:15 Useful Features of JavaScript Schedulers,作者:Ivan Petrenko
【51CTO譯稿,合作站點轉(zhuǎn)載請注明原文譯者和出處為51CTO.com】