This blog article will describe how the users view user route is created in Open Event Frontend, which allows the admin to view a user whenever view action button in the user table is clicked.
The primary end point of Open Event API with which we are concerned with for fetching the the users details is
GET /v1/users/{user_id}
The complete user information on the view route is displayed, which includes the name, email, details about the user. All these are the attributes of the model user. Thus the model for the route is defined as follows:
model(params) { return this.store.findRecord('user', params.session_id);
The view route is located at app/admin/users/<user_id> and the parent route, app/users has another sub route within it called list. The list route shows all, active, deleted users. This list has a column of action buttons.
This list can only be accessed by the admin. Whenever the view button in the Actions column is clicked the admin gets redirected to the view users route.
actions: { moveToUserDetails(id) { this.transitionToRoute('admin.users.view', id); } }
The user profile form is:
{{widgets/forms/image-upload imageUrl=user.avatarUrl needsCropper=true label=(t ‘User Image’) id=’user_image’ icon=’photo’ hint=(t ‘Select User Image’) maxSizeInKb=10000 aspectRatio=(array 1 1) helpText=(t ‘We recommend using at least a 1000x1000px (1:1 ratio) image’)}} {{input type=’text’ id=’name’ value=user.firstName}} {{input type=’text’ id=’last_name’ value=user.lastName}} {{widgets/forms/rich-text-editor id=’details’ value=user.details}} |
The view route shows the following information about the user: Name, Family name, Email, Image of the user, Details of the user. Thus the admin can view all the users registered in the application.
Resources
- Official Ember Model docs: https://github.com/ebryn/ember-model
- Ember JS- route: https://guides.emberjs.com/release/routing/defining-your-routes
- Open Event API Docs: https://open-event-api.herokuapp.com/
- ember JS- Conditionally rendering Templates: https://guides.emberjs.com/v1.12.0/templates/rendering-with-helpers
You must log in to post a comment.