Working with Data

Loading Data

User Manager expects a common URL for loading and saving data:

view:"usermanager", url:"remote/data"

More information on routes and parameters is located in the Working with Server article.

If you do not have a backend server or require non-standard logic, you can customize the Backend service.

Data Structure

Users

User Manager expects JSON data where each element of the array (user) is an object with the following fields:

  • avatar (string) - URL to user avatar;
  • details (string) - notes about user;
  • email (string) - user email;
  • id (number) - user ID;
  • name (string) - user name;
  • registered (string) - date of user registration (ISO format);
  • status (number) - user current status with the following values possible:
    • 0 - user is not active;
    • 1 - user is active;
  • visited (string) - user last visited date (ISO format).

User data example

[
  {
    avatar: "remote/assets/image.jpg",
    details: "CEO of the Best CO.",
    email: "dvor.august@gmail.com",
    id: 97,
    name: "August Dvorak",
    registered: "2020-05-31T17:40:48Z",
    status: 0,
    visited: "2020-05-31T17:40:48Z"
  },
  // other user objects
]

Roles

User Manager expects JSON data where each element of the array (role) is an object with the following fields:

  • id (number) - role ID;
  • name (string) - role name;
  • color (string) - role color (hex code);
  • details (string) - notes about role.

Role data example

[
  {
    id:1,
    name: "Admin",
    color: "#00a037",
    details: "Some details"}
  },
  // other role objects
]

Rules

User Manager expects JSON data where each element of the array (rule) is an object with the following fields:

  • id (number) - rule ID;
  • long (string) - full rule description;
  • short (string) - short rule description.

Rule data example

[
  {
    id: 1,
    long: "Can see user details and access levels",
    short: "CanSeeUsers"
  },
  // other rule objects
]

Data Services

User Manager has the following services for data:

1. Local

  • stores data on the client side in Data Collections
  • provides methods for getting users, roles and rules
  • provides methods for getting meta data
const local = $$("um").getService("local");
local.users(); // get a collection of users

2. Operations

  • provides methods for adding/updating/removing users, roles and rules
const ops = $$("um").getService("operations");
ops.updateRole(id, obj); // update a specified role

3. Prompt

  • provides methods for setting and manipulating prompts
const prompt = $$("um").getService("prompt");
prompt.config(text); // set text for the prompt

4. Progress

  • provides methods for manipulating progress bar
const prog = $$("um").getService("progress");
prog.start();

5. Backend

  • provides methods for issuing requests to the backend to fetch data and save the changes back
const back = $$("um").getService("backend");
back.rules().then((data) => console.log(data));

Study the models folder in the source code for method signatures.

Data Operations

Getting Local Data

All the users, roles and rules are stored in DataCollections. To access a collection call one of the self-named methods - users, roles or rules of the Local service respectively. Any of them takes the only parameter:

  • now (boolean) - if true, we assume that the collection data are available on the client.
const data = $$("um").getService("local");
 
// getting the 'users' collection
const collection = data.users();

If you're not sure whether a collection is loaded you can request it asynchronously. Data will be loaded in process:

data.roles(true).then(collection => {/* custom logic */});

Additionally, you can serialize the data collection to get an array of elements:

const rules = data.rules(true)
.then(collection => {
    collection.serialize(); // array of rules
});

Related sample:  User Manager: Data Operations

Getting Metadata

Getting the categories relations

When loaded the records do not contain any information on how users, roles and rules are related to one another. It is done for safety reasons.

To access these relations call the meta method of the Local service. It takes the only parameter:

  • now (boolean) - if true, we assume that the data are available on the client.
const data = $$("um").getService("local");
data.meta(true);

The method returns an object with the following structure:

{
  "RoleRule":[[3,1]],
  "UserRole":[[4,3]], // a user with ID 4 has a role with ID 3
  "UserRule":[[2,6]]
}

Getting the last actions performed

To access the list of the last actions performed by the users call the logsMeta method. It takes the only parameter:

  • now (boolean) - if true, we assume that the data are available on the client.
const data = $$("um").getService("local");
data.meta(true);

The method returns an object with the names of the actions and the categories they were performed in:

{
  "1":{"name":"User login","target":"user"},
  "2":{"name":"Role added","target":"role"},
  "3":{"name":"Role data changed","target":"role"}
}
Back to top