91手机视频,韩国理论在线观看,国产精品精品精品

DHTMLX To Do List 1.0 亮點(diǎn)功能：高級(jí)任務(wù)分配、內(nèi)聯(lián)編輯、便捷的鍵盤導(dǎo)航

原創(chuàng)|產(chǎn)品更新|編輯：何家巧|2022-09-19 14:51:46.263|閱讀 180 次

概述：本次我們主要介紹 DHTMLX 新出的小部件 To Do List 1.0 的亮點(diǎn)功能，其中包括便捷的任務(wù)管理，指定日期和參與者，以及便捷的鍵盤導(dǎo)航。此外，我們將闡述如何將To Do List與DHTMLX Gantt整合在一起，以及有哪些方法可以定制其外觀。

# 界面/圖表報(bào)表/文檔/IDE等千款熱門軟控件火熱銷售中 >>

前言：DHTMLX Gantt 是一款用于跨瀏覽器和跨平臺(tái)應(yīng)用程序的交互式 JavaScript/HTML5 甘特圖，擁有最完整的甘特圖庫，涵蓋項(xiàng)目管理應(yīng)用程序的所有需求。

點(diǎn)擊獲DhtmlxGantt官方正式版

本次我們主要介紹 DHTMLX To Do List 1.0 的主要功能，包括便捷的任務(wù)管理，指定日期和參與者，以及便捷的鍵盤導(dǎo)航。此外，我們將表明如何將To Do List與DHTMLX Gantt整合在一起，以及有哪些方法可以定制其外觀。

管理項(xiàng)目和任務(wù)
DHTMLX To Do List 由兩個(gè)獨(dú)立的部分組成。第一個(gè)是工具欄，可以添加新項(xiàng)目并使用組合控件在它們之間切換。用戶可以通過單擊上下文菜單中的相應(yīng)命令來重命名當(dāng)前活動(dòng)的項(xiàng)目或?qū)⑵鋭h除。

第二部分是一個(gè)列表，用戶可以在其中創(chuàng)建無限數(shù)量的帶有子任務(wù)的任務(wù)。默認(rèn)情況下，用戶可以通過雙擊來編輯任務(wù)內(nèi)容。他們可以在上下文菜單的幫助下折疊或展開任務(wù)、縮進(jìn)或取消縮進(jìn)、將其移動(dòng)到另一個(gè)項(xiàng)目或從列表中永久刪除任務(wù)。To Do List 文檔描述了如何從 UI 管理任務(wù)，并包括通過 API 可用的任務(wù)操作列表。

您可以選擇兩種標(biāo)記任務(wù)完成的模式。第一個(gè)是默認(rèn)或自動(dòng)模式，如果用戶檢查其所有子任務(wù)，則允許自動(dòng)完成父任務(wù)。

此外，您可以選擇第二種或手動(dòng)模式檢查/取消檢查任務(wù)，使用戶能夠自己完成所有任務(wù)。

使用標(biāo)簽

DHTMLX To Do List 最方便的功能之一是能夠使用主題標(biāo)簽。它可以幫助用戶對任務(wù)進(jìn)行分類并減少搜索必要任務(wù)所需的時(shí)間。
要添加標(biāo)簽，用戶必須輸入帶有所需內(nèi)容的#，然后按 Enter。此外，該小部件會(huì)顯示所有已創(chuàng)建標(biāo)簽的列表，避免在輸入時(shí)出錯(cuò)。標(biāo)簽在所有待辦事項(xiàng)列表項(xiàng)目中都可用，可用于過濾任務(wù)。為此，用戶需要單擊標(biāo)簽或在搜索欄中輸入標(biāo)簽。

設(shè)置截止日期

第一個(gè) To Do List 版本具有為任務(wù)設(shè)置截止日期的功能。默認(rèn)情況下，截止日期為綠色，當(dāng)任務(wù)過期時(shí)會(huì)變?yōu)榧t色。您可以通過禁用taskShape屬性的date參數(shù)中的validate設(shè)置來禁用日期驗(yàn)證功能并將其內(nèi)容變?yōu)榛疑?/span>

此外，您可以配置待辦事項(xiàng)列表以自定義格式顯示日期。DHTMLX 小部件以“%d %M %Y”格式顯示日期。您可以通過taskShape屬性在日期設(shè)置中指定相應(yīng)的字符來添加日期的名稱或?qū)⒃路蒿@示為數(shù)字。請參閱文檔中設(shè)置日期格式的完整字符列表。

分配參與者

使用 DHTMLX 待辦事項(xiàng)列表，用戶可以將參與者分配給那些需要特定團(tuán)隊(duì)成員注意的任務(wù)。因此，他們需要打開一個(gè)任務(wù)菜單并從“分配給”菜單項(xiàng)的下拉列表中選擇一個(gè)或多個(gè)參與者。也可以通過assignUser()和unassignUser()方法在團(tuán)隊(duì)成員之間分配任務(wù)：

// 將用戶分配到任務(wù)
列表。assignUser ( {
    id : "3" ,
    userId : "user_1"
} ) ;

// 從任務(wù)
列表中取消分配用戶。unassignUser ( {
    id : "2" ,
    userId : "user_1"
} ) ;

您可以通過用戶配置屬性指定參與者列表。可以添加團(tuán)隊(duì)成員的描述和圖像，或者如果圖像未上傳，則可以設(shè)置顏色。

const users = [
    { id ： “user_1” ，標(biāo)簽： “Don Smith” ，頭像： “../avatar_61.jpg” } ，
    { id ： “user_2” ，標(biāo)簽： “Nadia Chasey” ，頭像： “../ avatar_63.jpg" } ,
    { id : "user_3" , label : "Mike Young" , avatar : "../avatar_03.jpg" } ,
    {身份證： “user_4” ，標(biāo)簽： “Elvira Webb” ，頭像： “../avatar_33.jpg” }
] ；
const list = new ToDo ( "#root" , { users } ) ;

便捷的鍵盤導(dǎo)航

從它的第一個(gè)版本開始，DHTMLX To Do List 提供了便捷的鍵盤導(dǎo)航。它涵蓋了所有必要的命令，例如復(fù)制、復(fù)制和粘貼任務(wù)。此外，用戶還可以添加或刪除任務(wù)，展開或折疊任務(wù)列表，以及向上或向下移動(dòng)選定的任務(wù)。

與 DHTMLX 甘特圖集成

To Do List 可以與其他 DHTMLX 小部件（例如調(diào)度程序事件日歷、看板和套件 UI 庫）順利配合。因此，您可以為任何行業(yè)構(gòu)建功能豐富的項(xiàng)目和任務(wù)管理應(yīng)用程序。這是將 DHTMLX 待辦事項(xiàng)與我們的甘特圖庫同步的示例。

易于配置和可定制的外觀

就像任何 DHTMLX 小部件一樣，我們的To Do List 庫借助其直觀的 API支持靈活的配置。例如，您可以通過隱藏內(nèi)置控件或添加自定義元素（例如按鈕或您的公司徽標(biāo)）來修改工具欄結(jié)構(gòu)，使用工具欄的項(xiàng)目配置屬性：
列表視圖也是可配置的。默認(rèn)情況下，每個(gè)父任務(wù)將任務(wù)完成進(jìn)度顯示為已完成子任務(wù)與子任務(wù)總數(shù)之間的比率。但是，您可以通過更新taskShape屬性中的計(jì)數(shù)器設(shè)置來顯示已完成子任務(wù)的百分比。您只需將type屬性的默認(rèn)“數(shù)字”值更改為 counter 參數(shù)中的“百分比” ：

const list = new ToDo ( "#root" , {
    tasks ,
    users ,
    projects ,
    taskShape : {
        counter : {
            type : "percentage" // 默認(rèn)為 "number "
        }
    }
) ;

DHTMLX To Do List 允許您通過使用預(yù)定義的 CSS 變量來修改其外觀。它們包括基本顏色、字體、圖標(biāo)、復(fù)選框外觀等。您可以在文檔中找到 CSS 變量的完整列表。