如何使用低代碼開發平臺快速建立一個應用 | 實例演示

​BrApps企業級低代碼開發平臺基於拖拽式的開發方式，提供豐富的服務組件來知足企業數字化應用的設計、構建、集成、部署和管理，賦能各團隊來幫助他們構建全場景的數字化應用。

本文會以一個應用建立實例爲你們介紹使用BrApps開發應用的具體流程，將實際演示如何簡單建立一個產品管理系統。

主要過程包括如下步驟：

• 建立應用服務
• 建立應用
  1. 建立業務對象
  2. 建立選項集
  3. 建立應用頁面
  4.建立應用菜單
• 發佈應用

該系統主要業務功能包括：產品管理，分類管理，子分類管理和標籤管理，整個系統的邏輯圖如圖1所示。

所有詳細的操做，可至官網觀看。

建立一個應用服務

在開始應用設計前，須要先建立一個低代碼應用服務以及對應的項目。

• 在組織層項目列表頁面右上方，點擊「建立低代碼服務」按鈕（服務編碼建議與本組織有關，避免與其餘服務重複。）
• 填寫應用服務信息後，選擇「建立新項目」，同步填寫建立對應項目。

*注：初次試用低代碼開發功能必須建立新的項目，不可以使用系統內默認建立項目「公司內銷平臺」。

建立應用

應用包含基礎頁面和頁面內容（業務對象和選項集），在設計頁面前，須要先補充頁面所須要的數據內容，隨後經過添加組件來組成頁面框架，經過建立UIflow來完善邏輯。

01 建立業務對象

第一步：建立單個業務對象

• 在業務對象頁面，點擊「建立業務對象」按鈕
• 分別建立名爲「產品」、「分類」、「子分類"、"標籤"、"產品標籤"的5個業務對象

第二步：添加業務對象屬性

點擊某個業務對象下方的「+」按鈕，添加屬性，並對該屬性進行設置，包括是否存儲、必填、是否可搜索、組件，此處以業務對象標籤爲例進行說明。

• 點擊業務對象標籤下方的加號，添加屬性，依次輸入如下內容：

  • 名稱：名稱
  • 編碼：NAME
  • 組件選擇「文本」，最大長度爲60，並選擇單行文本
• 點擊建立按鈕便可

* 依次添加產品、分類、子分類、標籤、產品標籤5個業務對象的屬性，具體須要添加的屬性參照圖1所示。

第三步 建立關聯值列表

點擊業務對象「標籤」上的編輯按鈕，進入該業務對象詳情設置界面

• 點擊關聯值列表上方的「建立關聯值列表」按鈕，建立名爲「選擇分類」的關聯值列表
• 點擊名稱，進入關聯值列表編輯界面，在頁面設計中，從左側「字段」工具欄中將「名稱」和「建立時間」兩個字段拖入列表中；在「關聯值列表屬性」中勾選可搜索>高級搜索；在高級搜索默認字段中拖入「名稱」字段

* 其餘業務對象的關聯值列表建立詳情請參照視頻。

02 建立選項集

第一步 建立選項集

• 在選項集頁面，點擊「建立選項集」按鈕
• 建立產品選項集，添加選項「國內」和「國外」

第二步 將選項集與業務對象關聯

• 進入業務對象頁面，選擇業務對象「產品」，點擊添加屬性「產地」
• 屬性組件設置爲「單選」，選項集選擇「產品」

03 建立應用頁面

此處文字僅展現「標籤管理」頁面的建立，其餘頁面的建立詳情請查看視頻。

第一步 建立頁面

從菜單欄進入頁面界面，點擊「建立頁面」按鈕，依次輸入如下信息：

• 名稱：標籤管理
• 編號：tag_manage
• 標題：標籤管理

第二步 添加Section

建立頁面會同時建立一個默認section，點擊導航欄的「默認section」，進入該section頁面設計界面。（或者點擊右側頁面導航欄標籤管理頁面名稱後的「+」按鈕，選擇「添加section」）

第三步 添加數據源

點擊頁面上方的「數據源」，切換到默認section數據源界面，點擊「+」按鈕，選擇添加數據源「標籤」。

第四步 添加頁面組件

切換到默認section頁面設計界面

• 用鼠標從左側工做欄的組件列表中拖入「列表」組件，併爲該組件添加數據源「標籤」，此時導航欄「默認section」下會新建一個「表格組件」

第五步 編輯組件視圖

點擊導航中「默認section」下的「表格組件」，編輯該組件視圖

• 在右側工具欄設置組件的視圖屬性，分別選擇

  • 可搜索>可高級搜索
  • 可編輯
  • 可行內編輯

• 編輯組件中涉及的字段，可從右側工具欄的字段列表中，直接拖動字段：

  • 在搜索（高級搜索）下的默認字段中，拖入字段「名稱（更新人）」
  • 在列表字段中，「拖入名稱（更新人）」、「建立時間（建立人）」
  • 在列表按鈕中經過勾選快速建立「添加」、「刪除」、「保存」、「查詢」四個按鈕
  • 在列表行內按鈕中快速建立「刪除」按鈕

第六步 添加UIflow

1. 點擊右側頁面導航欄標籤管理頁面名稱後的「+」按鈕，選擇「添加UIflow」，輸入如下信息：

• 名稱：建立新的標籤
• 編碼：create_new_tag

2. 點擊UIflow名稱進入流程設計界面

• 從左側流程組件中，直接拖動「新增」組件至流程線上，點擊該組件，在工具欄中設置屬性

  • 目標屬性：名稱-NAME
  • 固定值爲：test123
  • 數據源爲「標籤」
  • 添加初始值
  • 節點說明爲：建立新的標籤
  • 返回值（輸出變量名稱）爲：tag

• 從左側流程組件中拖動「提交」組件至流程線上（位於新增組件後方），在右側工具欄進行屬性設置

  • 數據源爲：標籤
  • 節點說明爲：提交新建的標籤

• 從左側流程組件中拖動「搜索」組件至流程線上（位於提交組件後方），在右側工具欄進行屬性設置

  • 數據源爲：標籤
  • 節點說明爲：從新查詢數據

第七步 頁面流關聯按鈕

爲按鈕設置對應的頁面流

• 進入表格組件設計頁面，點擊添加自定義列表按鈕

  • 按鈕文字爲：頁面流建立標籤
  • 選擇按鈕圖標
  • 邏輯類型設置爲：UIflow，並選擇關聯同頁面下建立的UIflow「建立新的標籤」
  • 彈出確認選擇「是」
  • 提示信息輸入：肯定建立一個新的標籤嗎
  • 確認按鈕文字爲：肯定
  • 取消按鈕文字爲：取消

04 建立應用菜單

從菜單欄進入菜單管理界面，點擊「+」按鈕，建立名爲產品管理的應用菜單

• 點擊產品管理後的「+」按鈕，建立菜單欄「產品」
• 點擊「產品」後的「+」按鈕，建立一級菜單導航，分別爲「產品」「分類」「標籤」
• 點擊導航，在左側導航屬性中設該導航所跳轉的頁面，好比標籤跳轉頁面爲「標籤管理」

應用發佈

第一步 應用檢查

點擊頁面右上方的檢查按鈕，檢查應用設計流程邏輯等是否存在問題。

第二步 設置用戶角色

進入服務配置，點擊「用戶角色」，設置應用服務的用戶，包括用戶名、郵箱、密碼、角色名稱。

第三步 建立發佈配置

進入服務配置，點擊「發佈配置」，點擊頁面上方的「建立試用發佈配置」按鈕，便可建立一個部署應用所需的試用發佈配置。

*注：每一個註冊的組織僅可建立一個試用發佈配置

第四步 應用發佈

1. 點擊頁面右上方的「發佈」按鈕，在預約義配置中選擇建立的試用發佈配置，點擊發布，服務將進入到發佈狀態（發佈過程大概1分鐘）。
2. 應用發佈成功後，發佈狀態處會顯示相應的地址，點擊進入後使用設置的用戶角色登陸，便可瀏覽所建立的應用狀態。

註冊試用

歡迎至官網註冊試用體驗低代碼應用開發，後續開發教程逐漸完善中，感謝你們的反饋和支持！