How to Build an Organizational Tree

An organizational tree is a tree-like structure where each department is represented by a different form. This document will introduce how to build an organizational tree.

1. Create an Organizational Tree Form

1. After creating a new form, click the "Edit" button in the top-left corner to enter the form information editing page. Select the checkbox "Is it master data?" and choose the master data type as "Organization".
2. Create a text field with the ID name to display the organization's name. (Required field)
3. Create an ACL or SELECT field with the ID parent to select the parent organization. (Required field)
4. Add any additional personalized fields you need.

2. Create Organizational Tree Data

1. Create a Page for each organizational level form and add it to the menu.
2. In the Try-Run page, add data for each organizational form, starting from the highest level of the organization.

3. Create an Organizational Tree Page

1. Create a new Page (you can create it under any PBC with any page number), enter JSON mode, and add the following configuration. Save the page and add it to the application menu.

   {
     "fields": [
       {
         "component": "OrgTree",
         "style": {
           "width": "100%",
           "height": "100%"
         }
       }
     ]
   }

2. Create a new Page named role-members-schema under the same PBC (cannot cross PBCs, cannot change the page number). Configure the role member selection interface. The ACL column configuration for selecting personnel may vary across different projects. Example:

   {
     "fields": [
       {
         "id": "roleMembers",
         "component": "ACL",
         "componentProps": {
           "idListUrl": "/user-management/api/user/ids",
           "dataUrl": "/user-management/api/user/lite/list-by-ids",
           "useOriginValue": true,
           "mapping": {
             "value": "id",
             "label": "nickName"
           },
           "multiple": true,
           "unit": "people",
           "columnDefs": [
             {
               "colId": "nickName",
               "field": "nickName",
               "headerName": "Name"
             },
             {
               "colId": "username",
               "field": "username",
               "headerName": "Account"
             },
             {
               "colId": "gender",
               "field": "gender",
               "headerName": "Gender"
             }
           ]
         }
       }
     ]
   }

Note: The data submission format must at least conform to { "roleMembers": [{ "id": number, ...other fields }, ...] }.

---

Example

1. Create Forms for Organizational Levels such as Corporation, Finance Department, Branch Company, Factory, Workshop, and Machine

Note: The root organization can only have one record (if the corporation is the root node, then there can only be one corporation record).

First, create a form for the corporation.

Then, create forms for the corporation's finance department, branch company, factory,

2. Create a Page for Each Organizational Level Form and Add It to the Menu

3. Add Data in the Try-Run Page

1. Add data for the corporation form.

2. Add data for the corporation's finance department form.

3. Add data for the branch company form.

4. Add data for the remaining organizational levels in sequence.

5. Add roles on the organizational tree page.

6. Add members to the roles on the organizational tree page.