Skip to content

Commit 9d05db6

Browse files
abhinavk96abhinavk96
committed
feat: Ember table for admin/sessions
1 parent 16cd7ca commit 9d05db6

File tree

9 files changed

+155
-124
lines changed

9 files changed

+155
-124
lines changed

‎app/controllers/admin/events/list.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -101,9 +101,9 @@ export default class extends Controller.extend(EmberTableControllerMixin) {
101101
}
102102

103103
@action
104-
moveToDetails(id) {
105-
this.transitionToRoute('events.view', id);
106-
}
104+
moveToDetails(id) {
105+
this.transitionToRoute('events.view', id);
106+
}
107107

108108
@action
109109
editEvent(id) {

‎app/controllers/admin/sessions/list.js

Lines changed: 84 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,71 +1,87 @@
11
import Controller from '@ember/controller';
2-
export default Controller.extend({
3-
columns: [
4-
{
5-
propertyName : 'event.name',
6-
title : 'Event Name',
7-
disableSorting : true
8-
},
9-
{
10-
propertyName : 'title',
11-
title : 'Title'
12-
},
13-
{
14-
propertyName : 'status',
15-
template : 'components/ui-table/cell/events/view/sessions/cell-session-state',
16-
title : 'State',
17-
disableSorting : true
18-
},
19-
{
20-
propertyName : 'speakers',
21-
template : 'components/ui-table/cell/cell-speakers',
22-
title : 'Speakers',
23-
disableSorting : true
24-
},
25-
{
26-
propertyName : 'submittedAt',
27-
template : 'components/ui-table/cell/cell-simple-date',
28-
dateFormat : 'MMMM DD, YYYY - hh:mm A',
29-
title : 'Submitted At'
30-
},
31-
{
32-
propertyName : 'startsAt',
33-
template : 'components/ui-table/cell/cell-simple-date',
34-
dateFormat : 'MMMM DD, YYYY - hh:mm A',
35-
title : 'Starts At'
36-
},
37-
{
38-
propertyName : 'endsAt',
39-
template : 'components/ui-table/cell/cell-simple-date',
40-
dateFormat : 'MMMM DD, YYYY - hh:mm A',
41-
title : 'Ends At'
42-
},
43-
{
44-
template : 'components/ui-table/cell/cell-simple-buttons',
45-
title : 'Actions',
46-
disableSorting : true,
47-
disableFiltering : true
48-
}
49-
],
50-
actions: {
51-
deleteSession(session) {
52-
this.set('isLoading', true);
53-
session.destroyRecord()
54-
.then(() => {
55-
this.notify.success(this.l10n.t('Session has been deleted successfully.'));
56-
})
57-
.catch(() => {
58-
this.notify.error(this.l10n.t('An unexpected error has occurred.'));
59-
})
60-
.finally(() => {
61-
this.set('isLoading', false);
62-
});
63-
},
64-
editSession(session_id, event_id) {
65-
this.transitionToRoute('events.view.sessions.edit', event_id, session_id);
66-
},
67-
viewSession(id) {
68-
this.transitionToRoute('my-sessions.view', id);
2+
import { computed, action } from '@ember/object';
3+
import EmberTableControllerMixin from 'open-event-frontend/mixins/ember-table-controller';
4+
5+
export default class extends Controller.extend(EmberTableControllerMixin) {
6+
@computed()
7+
get columns() {
8+
return [
9+
{
10+
name : 'Event Name',
11+
valuePath : 'event.name'
12+
},
13+
{
14+
name : 'Title',
15+
valuePath : 'title'
16+
},
17+
{
18+
name : 'State',
19+
valuePath : 'status',
20+
cellComponent : 'ui-table/cell/events/view/sessions/cell-session-state'
21+
},
22+
{
23+
name : 'Speakers',
24+
valuePath : 'speakers',
25+
cellComponent : 'ui-table/cell/cell-speakers'
26+
},
27+
{
28+
name : 'Submitted At',
29+
valuePath : 'submittedAt',
30+
cellComponent : 'ui-table/cell/cell-simple-date',
31+
options : {
32+
dateFormat: 'MMMM DD, YYYY - hh:mm A'
33+
}
34+
},
35+
{
36+
name : 'Starts At',
37+
valuePath : 'startsAt',
38+
cellComponent : 'ui-table/cell/cell-simple-date',
39+
options : {
40+
dateFormat: 'MMMM DD, YYYY - hh:mm A'
41+
}
42+
},
43+
{
44+
name : 'Ends At',
45+
valuePath : 'endsAt',
46+
cellComponent : 'ui-table/cell/cell-simple-date',
47+
options : {
48+
dateFormat: 'MMMM DD, YYYY - hh:mm A'
49+
}
50+
},
51+
{
52+
name : 'Actions',
53+
cellComponent : 'ui-table/cell/cell-simple-buttons',
54+
valuePath : 'id',
55+
extraValuePaths : ['event'],
56+
actions : {
57+
deleteSession : this.deleteSession.bind(this),
58+
editSession : this.editSession.bind(this),
59+
viewSession : this.viewSession.bind(this)
60+
}
61+
}
62+
];
63+
}
64+
@action
65+
async deleteSession(session_id) {
66+
this.set('isLoading', true);
67+
try {
68+
let session = this.store.peekRecord('session', session_id, { backgroundReload: false });
69+
await session.destroyRecord();
70+
this.notify.success(this.l10n.t('Session has been deleted successfully.'));
71+
} catch (e) {
72+
console.warn(e);
73+
this.notify.error(this.l10n.t('An unexpected error has occurred.'));
6974
}
75+
this.set('isLoading', false);
76+
}
77+
78+
@action
79+
editSession(session_id, event_id) {
80+
this.transitionToRoute('events.view.sessions.edit', event_id, session_id);
81+
}
82+
83+
@action
84+
viewSession(id) {
85+
this.transitionToRoute('my-sessions.view', id);
7086
}
71-
});
87+
}

‎app/routes/admin/sessions/list.js

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import Route from '@ember/routing/route';
2+
import EmberTableRouteMixin from 'open-event-frontend/mixins/ember-table-route';
23

3-
export default Route.extend({
4+
export default class extends Route.extend(EmberTableRouteMixin) {
45
titleToken() {
56
switch (this.get('params.sessions_state')) {
67
case 'confirmed':
@@ -16,9 +17,10 @@ export default Route.extend({
1617
default:
1718
return this.l10n.t('Session');
1819
}
19-
},
20-
model(params) {
20+
}
21+
async model(params) {
2122
this.set('params', params);
23+
const searchField = 'title';
2224
let filterOptions = [];
2325
if (params.sessions_state === 'pending') {
2426
filterOptions = [
@@ -163,11 +165,16 @@ export default Route.extend({
163165
}
164166
];
165167
}
166-
return this.store.query('session', {
167-
get_trashed : true,
168-
include : 'event,speakers',
169-
filter : filterOptions,
170-
'page[size]' : 10
171-
});
168+
filterOptions = this.applySearchFilters(filterOptions, params, searchField);
169+
let queryString = {
170+
get_trashed : true,
171+
include : 'event,speakers',
172+
filter : filterOptions,
173+
'page[size]' : params.per_page || 10,
174+
'page[number]' : params.page || 1
175+
};
176+
queryString = this.applySortFilters(queryString, params);
177+
178+
return this.asArray(this.store.query('session', queryString));
172179
}
173-
});
180+
}

‎app/routes/events/view/sessions/list.js

Lines changed: 19 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import Route from '@ember/routing/route';
2-
3-
export default Route.extend({
2+
import { action } from '@ember/object';
3+
import EmberTableRouteMixin from 'open-event-frontend/mixins/ember-table-route';
4+
export default class extends Route.extend(EmberTableRouteMixin) {
45
titleToken() {
56
switch (this.get('params.session_status')) {
67
case 'pending':
@@ -14,9 +15,11 @@ export default Route.extend({
1415
default:
1516
return this.l10n.t('Session');
1617
}
17-
},
18+
}
19+
1820
async model(params) {
1921
this.set('params', params);
22+
const searchField = 'name';
2023
let filterOptions = [];
2124
if (params.session_status === 'pending') {
2225
filterOptions = [
@@ -53,29 +56,25 @@ export default Route.extend({
5356
} else {
5457
filterOptions = [];
5558
}
56-
57-
let queryObject = {
58-
include : 'speakers,feedbacks',
59-
filter : filterOptions,
60-
'page[size]' : 10
59+
filterOptions = this.applySearchFilters(filterOptions, params, searchField);
60+
let queryString = {
61+
include : 'speakers,feedbacks',
62+
filter : filterOptions,
63+
'page[size]' : params.per_page || 10,
64+
'page[number]' : params.page || 1
6165
};
66+
queryString = this.applySortFilters(queryString, params);
6267

6368
let store = this.modelFor('events.view');
6469

65-
let data = await store.query('sessions', queryObject);
66-
6770
return {
68-
data,
69-
store,
70-
query : queryObject,
71-
objectType : 'sessions'
71+
data: await store.query('sessions', queryString)
7272
};
73-
},
73+
}
7474

75-
actions: {
76-
refreshRoute() {
77-
this.refresh();
78-
}
75+
@action
76+
refreshRoute() {
77+
this.refresh();
7978
}
8079

81-
});
80+
}

‎app/templates/admin/sessions/list.hbs

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,15 @@
11
<div class="sixteen wide column">
2-
{{events/events-table columns=columns data=model
3-
useNumericPagination=true
4-
showGlobalFilter=true
5-
showPageSize=true
6-
deleteSession=(action 'deleteSession')
7-
editSession=(action 'editSession')
8-
viewSession=(action 'viewSession')
9-
customGlobalFilter='title'
2+
{{tables/default columns=columns
3+
rows=model.data
4+
currentPage=page
5+
pageSize=per_page
6+
searchQuery=search
7+
sortBy=sort_by
8+
sortDir=sort_dir
9+
metaData=model.meta
10+
filterOptions=filterOptions
11+
widthConstraint="eq-container"
12+
resizeMode="fluid"
13+
fillMode="equal-column"
1014
}}
1115
</div>

‎app/templates/components/ui-table/cell/cell-simple-buttons.hbs

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<div class="ui {{if device.isMobile 'horizontal' 'vertical'}} compact basic buttons">
2-
{{#ui-popup content=(t 'View Session') class='ui icon button' click=(action viewSession record.id) position='left center'}}
3-
<i class="unhide icon"></i>
2+
{{#ui-popup content=(t 'View Session') class='ui icon button' click=(action props.actions.viewSession record) position='left center'}}
3+
<i class="unhide icon"></i>
44
{{/ui-popup}}
5-
{{#ui-popup content=(t 'Edit Session') class='ui icon button' click=(action editSession record.id record.event.id) position='left center'}}
5+
{{#ui-popup content=(t 'Edit Session') class='ui icon button' click=(action props.actions.editSession record extraRecords.event.id) position='left center'}}
66
<i class="edit icon"></i>
77
{{/ui-popup}}
8-
{{#ui-popup content=(t 'Delete Session') click=(action (confirm (t 'Are you sure you would like to delete this Session?') (action deleteSession record))) class='ui icon button' position='left center'}}
8+
{{#ui-popup content=(t 'Delete Session') click=(action (confirm (t 'Are you sure you would like to delete this Session?') (action props.actions.deleteSession record))) class='ui icon button' position='left center'}}
99
<i class="trash outline icon"></i>
1010
{{/ui-popup}}
1111
</div>

‎app/templates/components/ui-table/cell/cell-speakers.hbs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<div class="ui list">
2-
{{#each record.speakers as |speaker|}}
2+
{{#each record as |speaker|}}
33
<div class="item">
44
{{speaker.name}}
55
</div>

‎app/templates/components/ui-table/cell/events/view/sessions/cell-session-state.hbs

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
<span>
2-
{{#if (eq record.status "accepted")}}
2+
{{#if (eq record "accepted")}}
33
<div class="ui yellow label">{{t 'Accepted'}}</div>
4-
{{else if (eq record.status "confirmed")}}
4+
{{else if (eq record "confirmed")}}
55
<div class="ui green label">{{t 'Confirmed'}}</div>
6-
{{else if (eq record.status "pending")}}
6+
{{else if (eq record "pending")}}
77
<div class="ui yellow label">{{t 'Pending'}}</div>
8-
{{else if (eq record.status "rejected")}}
8+
{{else if (eq record "rejected")}}
99
<div class="ui red label">{{t 'Rejected'}}</div>
10-
{{else if (eq record.status "deleted")}}
10+
{{else if (eq record "deleted")}}
1111
<div class="ui red label">{{t 'Deleted'}}</div>
1212
{{/if}}
1313
</span>

‎tests/integration/components/ui-table/cell/cell-simple-buttons-test.js

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,17 @@ import { render } from '@ember/test-helpers';
55

66
module('Integration | Component | ui table/cell/cell simple buttons', function(hooks) {
77
setupIntegrationTest(hooks);
8-
8+
const props = {
9+
actions: {
10+
deleteSession : () => {},
11+
editSession : () => {},
12+
viewSession : () => {}
13+
}
14+
};
915
test('it renders', async function(assert) {
10-
this.set('deleteSession', () => {});
11-
this.set('editSession', () => {});
12-
this.set('viewSession', () => {});
13-
await render(hbs`{{ui-table/cell/cell-simple-buttons deleteSession=(action deleteSession) editSession=(action editSession) viewSession=(action viewSession)}}`);
16+
17+
this.set('props', props);
18+
await render(hbs`{{ui-table/cell/cell-simple-buttons props=props}}`);
1419
assert.ok(this.element.innerHTML.trim().includes(''));
1520
});
1621
});

0 commit comments

Comments
 (0)