VDS 組件

VDS 代表 Vtiger 設計系統,它定義了 VTAP 平台提供的核心 HTML 組件。 VDS 提供的組件是可重用的 UI 塊。

您可以使用組件來構建和定制您的應用程序。 它們可以在任何地方使用 - 自定義頁面、小部件、彈出窗口或其他自定義組件內。

以下是 VTAP 提供的組件列表:

vds文本

使用:用於輸入框。 允許用戶輸入信息。

句法:

屬性詳情:

名稱 為輸入元素設置任何名稱
禁用 真/假,使其禁用
佔位符 顯示輸入的任何提示
輸入類型 任何有效的 HTML 輸入類型,如電子郵件、數字等(閱讀下文了解詳細信息。)
強制性 使該字段成為必填項 
v型模型 這是 vue(反應式)數據綁定,它可以用來設置或讀取值。

除了文本,VDS 還支持其他輸入類型。 例如: 

  • vds-電子郵件
  • vds 號碼
  • vds-百分比
  • vds-十進制
  • vds電話
  • vds-日期
  • vds時間
  • vds-url

所有這些組件都是不同的輸入類型。 它們具有 vds-text 類型的屬性,但帶有自己的輸入類型驗證。 

Vds下拉

用途: 顯示帶有給定項目列表的下拉列表

語法:

支持的屬性:

方案 下拉項數組
多種 true/false,顯示多選下拉菜單
空選項 如果你想首先顯示一個空選項
禁用 真假
強制性 真假

vds所有者

用途: 它是一個交互式組件,將用戶和組顯示為下拉列表。 它將與 CRM 中任何模塊中的分配給字段相同。

語法:

支持的屬性:

只有用戶 如果您只想在下拉列表中看到用戶
只有團體 如果您只想在下拉列表中查看組

vds複選框

用途: 顯示複選框輸入

語法:

vds開關

用途: 顯示切換

語法:

vds-日期選擇器

用途: 顯示任何日期字段的日期選擇器。

語法:

支持的屬性:

日期格式 要顯示的日期格式,如 DD-MM-YYYY、MM-DD-YYYY、YYYY-MM-DD

vds-日期範圍-選擇器

用途: 顯示日期選擇器以選擇日期範圍

語法:

支持的屬性:

日期格式 要顯示的日期格式,如 DD-MM-YYYY、MM-DD-YYYY、YYYY-MM-DD

vds-時間選擇器

用途: 顯示時間選擇器

語法:

支持的屬性:

格式 12或24小時制 

VDS-RTE

用途: 要顯示 CKEditor,您在富文本編輯器字段中看到的字段 UI 

語法:

vds評級

用途: 顯示評級星域。 它將最多顯示 5 顆星。

語法:

支持的屬性:

範圍 1 到 5 之間的值

vds-iframe

用途: 顯示具有給定 HTML 內容的 iframe

語法:

vds進度

用途: 顯示進度百分比

語法:

支持的屬性:

顏色百分比
自定義顏色代碼 默認情況下進度將顯示為藍色,您可以傳遞任何有效的顏色名稱
 
 
 

VTAP 客戶用例

 
 

我們的一位客戶使用不同的應用程序來跟踪他們的項目和進度。 

他們想開始使用 Vtiger 項目,但用戶界面是使用 Vtiger 項目的一大障礙。 該界面沒有像客戶希望的那樣在一個項目的單個屏幕上提供里程碑和任務的全部詳細信息。

為了克服這個障礙,我們提出了以下解決方案。

他們可以使用我們的低代碼平台 Module Designer 來設計一個分為 3 部分的頁面。 

第一部分將顯示項目列表,下一部分將顯示鏈接到所選項目的里程碑,第三部分將顯示鏈接到所選項目和里程碑的任務。 它看起來類似於 Outlook 郵箱,在右側顯示電子郵件及其內容。 在這種情況下,它的 3 級在末尾顯示任務詳細信息。

要構建此功能,我們將構建一個自定義列表頁面,可以使用 'LIST_ADD_VIEWTYPE' 成分。 看 点击這裡 舉個例子 

然後 VTAP.API.Get 函數將用於獲取項目、項目里程碑和任務數據。 它們將顯示在單獨的列中,但仍會連接在一起。 您可以從復制代碼 点击這裡 看到它的實際效果。

 

我們的一位客戶使用不同的應用程序來跟踪他們的項目和進度。 

他們想開始使用 Vtiger 項目,但用戶界面是使用 Vtiger 項目的一大障礙。 該界面沒有像客戶希望的那樣在一個項目的單個屏幕上提供里程碑和任務的全部詳細信息。

為了克服這個障礙,我們提出了以下解決方案。

他們可以使用我們的低代碼平台 Module Designer 來設計一個分為 3 部分的頁面。 

第一部分將顯示項目列表,下一部分將顯示鏈接到所選項目的里程碑,第三部分將顯示鏈接到所選項目和里程碑的任務。 它看起來類似於 Outlook 郵箱,在右側顯示電子郵件及其內容。 在這種情況下,它的 3 級在末尾顯示任務詳細信息。

要構建此功能,我們將構建一個自定義列表頁面,可以使用 'LIST_ADD_VIEWTYPE' 成分。 看 点击這裡 舉個例子 

然後 VTAP.API.Get 函數將用於獲取項目、項目里程碑和任務數據。 它們將顯示在單獨的列中,但仍會連接在一起。 您可以從復制代碼 点击這裡 看到它的實際效果。

 
 

Vtiger 應用程序 

 

我們喜歡的工具

 
 

Elasticsearch 是一個很棒的開源項目,如果您對數據科學感興趣,可以參與其中。 它可以實時分析、搜索和存儲大量數據。 Elasticsearch 幫助其用戶以多種不同方式使用數據。

 

Elasticsearch 是一個很棒的開源項目,如果您對數據科學感興趣,可以參與其中。 它可以實時分析、搜索和存儲大量數據。 Elasticsearch 幫助其用戶以多種不同方式使用數據。

 
 

即將公開資訊

 
 

App Designer 

Vtiger 的 App Designer 將讓您構建可能依賴或不依賴 CRM 的自定義應用程序。 它將使您能夠靈活地在任何您精通的 JavaScript 框架中編寫應用程序。

借助強大的 VTAP JavaScript API,您還可以連接到 CRM 並從中推送/拉取數據,從而輕鬆構建自定義應用程序。

 

App Designer 

Vtiger 的 App Designer 將讓您構建可能依賴或不依賴 CRM 的自定義應用程序。 它將使您能夠靈活地在任何您精通的 JavaScript 框架中編寫應用程序。

借助強大的 VTAP JavaScript API,您還可以連接到 CRM 並從中推送/拉取數據,從而輕鬆構建自定義應用程序。

 
 

註冊以接收最新更新!