Skip to content

Commit 3502065

Browse files
uds5501niranjan94
uds5501
authored and
niranjan94
committed
feat: Add new wizard step - attendee form (#2961)
* add new wizard step : ticket-buyer-form as step 2 * intermediate order form showing option * add final touches * using ES6 getters and updated filenames * handle error cases using try-catch * improve error handling and correct the imported mixin * fix eslint errors and typos
1 parent 8f3511c commit 3502065

File tree

11 files changed

+231
-3
lines changed

11 files changed

+231
-3
lines changed

‎app/components/forms/wizard/attendee-step.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import Component from '@ember/component';
2+
import FormMixin from 'open-event-frontend/mixins/form';
3+
4+
export default Component.extend(FormMixin, {
5+
actions: {
6+
saveDraft() {
7+
this.onValid(() => {
8+
this.set('data.event.state', 'draft');
9+
this.sendAction('save', this.data);
10+
});
11+
},
12+
move(direction) {
13+
this.onValid(() => {
14+
this.sendAction('move', direction, this.data);
15+
});
16+
},
17+
publish() {
18+
this.onValid(() => {
19+
this.set('data.event.state', 'published');
20+
this.sendAction('save', this.data);
21+
});
22+
}
23+
}
24+
});

‎app/controllers/create.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default Controller.extend(EventWizardMixin, {
1212
},
1313
move() {
1414
this.saveEventDataAndRedirectTo(
15-
'events.view.edit.sponsors',
15+
'events.view.edit.attendee',
1616
['tickets', 'socialLinks', 'copyright', 'tax', 'stripeAuthorization']
1717
);
1818
}

‎app/controllers/events/view/edit/attendee.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import Controller from '@ember/controller';
2+
import EventWizardMixin from 'open-event-frontend/mixins/event-wizard';
3+
4+
export default Controller.extend(EventWizardMixin, {
5+
async saveForms(data) {
6+
for (const customForm of data.customForms ? data.customForms.toArray() : []) {
7+
await customForm.save();
8+
}
9+
return data;
10+
},
11+
actions: {
12+
async save(data) {
13+
try {
14+
await this.saveForms(data);
15+
this.saveEventDataAndRedirectTo(
16+
'events.view.index',
17+
[]
18+
);
19+
} catch (error) {
20+
this.notify.error(this.l10n.t(error.message));
21+
}
22+
},
23+
async move(direction, data) {
24+
try {
25+
await this.saveForms(data);
26+
this.saveEventDataAndRedirectTo(
27+
direction === 'forwards' ? 'events.view.edit.sponsors' : 'events.view.edit.basic-details',
28+
[]
29+
);
30+
} catch (error) {
31+
this.notify.error(this.l10n.t(error.message));
32+
}
33+
}
34+
}
35+
});

‎app/controllers/events/view/edit/basic-details.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export default Controller.extend(EventWizardMixin, {
1111
},
1212
move() {
1313
this.saveEventDataAndRedirectTo(
14-
'events.view.edit.sponsors',
14+
'events.view.edit.attendee',
1515
['tickets', 'socialLinks', 'copyright', 'tax', 'stripeAuthorization']
1616
);
1717
}

‎app/controllers/events/view/edit/sponsors.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default Controller.extend(EventWizardMixin, {
1212
},
1313
move(direction) {
1414
this.saveEventDataAndRedirectTo(
15-
direction === 'forwards' ? 'events.view.edit.sessions-speakers' : 'events.view.edit.basic-details',
15+
direction === 'forwards' ? 'events.view.edit.sessions-speakers' : 'events.view.edit.attendee',
1616
['sponsors']
1717
);
1818
}

‎app/mixins/event-wizard.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,12 @@ export default Mixin.create(MutableArray, CustomFormMixin, {
1919
icon : 'info icon',
2020
route : 'events.view.edit.basic-details'
2121
},
22+
{
23+
title : this.l10n.t('Attendee Form'),
24+
description : this.l10n.t('Know your audience'),
25+
icon : 'list icon',
26+
route : 'events.view.edit.attendee'
27+
},
2228
{
2329
title : this.l10n.t('Sponsors'),
2430
description : this.l10n.t('Advertise your sponsors'),

‎app/models/event.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ export default ModelBase.extend(CustomPrimaryKeyMixin, {
4747

4848
isMapShown : attr('boolean', { defaultValue: true }),
4949
isSponsorsEnabled : attr('boolean', { defaultValue: false }),
50+
isTicketFormEnabled : attr('boolean', { defaultValue: false }),
5051
isTicketingEnabled : attr('boolean', { defaultValue: true }),
5152
isSessionsSpeakersEnabled : attr('boolean', { defaultValue: false }),
5253
isFeatured : attr('boolean', { defaultValue: false }),

‎app/router.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,7 @@ router.map(function() {
6868
this.route('basic-details');
6969
this.route('sponsors');
7070
this.route('sessions-speakers');
71+
this.route('attendee');
7172
});
7273
this.route('export');
7374
this.route('sessions', function() {

‎app/routes/events/view/edit/attendee.js

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import Route from '@ember/routing/route';
2+
import CustomFormMixin from 'open-event-frontend/mixins/event-wizard';
3+
import { A } from '@ember/array';
4+
export default Route.extend(CustomFormMixin, {
5+
6+
titleToken() {
7+
return this.l10n.t('Attendee Form');
8+
},
9+
10+
async model() {
11+
let filterOptions = [{
12+
name : 'form',
13+
op : 'eq',
14+
val : 'attendee'
15+
}];
16+
17+
let data = {
18+
event: this.modelFor('events.view')
19+
};
20+
data.customForms = await data.event.query('customForms', {
21+
filter : filterOptions,
22+
sort : 'id',
23+
'page[size]' : 50
24+
});
25+
26+
return data;
27+
},
28+
afterModel(data) {
29+
/**
30+
* Create the additional custom forms if only the compulsory forms exist.
31+
*/
32+
if (data.customForms.length === 3) {
33+
let customForms = A();
34+
for (const customForm of data.customForms ? data.customForms.toArray() : []) {
35+
customForms.pushObject(customForm);
36+
}
37+
38+
const createdCustomForms = this.getCustomAttendeeForm(data.event);
39+
40+
for (const customForm of createdCustomForms ? createdCustomForms : []) {
41+
customForms.pushObject(customForm);
42+
}
43+
44+
data.customForms = customForms;
45+
}
46+
}
47+
});

‎app/templates/components/forms/wizard/attendee-step.hbs

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
<form class="ui form {{if isLoading 'loading'}}" autocomplete="off" {{action 'move' 'forwards' on='submit' preventDefault=true}}>
2+
3+
<div class="ui centered grid">
4+
<div class="column">
5+
<div class="ui {{if data.event.isTicketFormEnabled 'basic'}} segment">
6+
<div class="center aligned text">
7+
<div class=" field">
8+
<div class="ui slider checkbox">
9+
{{input type='checkbox' checked=data.event.isTicketFormEnabled}}
10+
<label class="weight-300" style="font-size: large">
11+
{{if data.event.isTicketFormEnabled (t 'Turn off') (t 'Turn on')}}
12+
{{t 'Ticket Form'}}
13+
</label>
14+
</div>
15+
</div>
16+
</div>
17+
</div>
18+
</div>
19+
</div>
20+
21+
{{#if data.event.isTicketFormEnabled}}
22+
<div class="ui hidden divider"></div>
23+
<h3 class="ui dividing header">
24+
<i class="checkmark box icon"></i>
25+
<div class="content">
26+
{{t 'Information to Collect'}}
27+
</div>
28+
</h3>
29+
<div class="ui two column stackable grid">
30+
<div class="column">
31+
<table class="ui selectable celled table">
32+
<thead>
33+
<tr>
34+
{{#if device.isMobile}}
35+
<th class="center aligned">
36+
{{t 'Options'}}
37+
</th>
38+
{{else}}
39+
<th class="right aligned">
40+
{{t 'Option'}}
41+
</th>
42+
<th class="center aligned">
43+
{{t 'Include'}}
44+
</th>
45+
<th class="center aligned">
46+
{{t 'Require'}}
47+
</th>
48+
{{/if}}
49+
</tr>
50+
</thead>
51+
<tbody>
52+
{{#each data.customForms as |field|}}
53+
<tr class="{{if field.isIncluded 'positive'}}">
54+
<td class="{{if device.isMobile 'center' 'right'}} aligned">
55+
<label class="{{if field.isFixed 'required'}}">
56+
{{field.name}}
57+
</label>
58+
</td>
59+
<td class="center aligned">
60+
{{ui-checkbox class='slider'
61+
checked=field.isIncluded
62+
disabled=field.isFixed
63+
onChange=(action (mut field.isIncluded))
64+
label=(if device.isMobile (t 'Include'))}}
65+
</td>
66+
<td class="center aligned">
67+
{{ui-checkbox class='slider'
68+
checked=field.isRequired
69+
disabled=field.isFixed
70+
onChange=(action (mut field.isRequired))
71+
label=(if device.isMobile (t 'Require'))}}
72+
</td>
73+
</tr>
74+
{{/each}}
75+
</tbody>
76+
</table>
77+
</div>
78+
</div>
79+
<h3 class="ui dividing header">
80+
<i class="options box icon"></i>
81+
<div class="content">
82+
{{t 'Registration Options'}}
83+
</div>
84+
</h3>
85+
<div class="field">
86+
<label>{{t 'REGISTRATION TIME LIMIT'}}</label>
87+
<div class="{{unless device.isMobile 'two wide'}} field">
88+
{{input type='number' id='orderExpiryTime' value=data.event.orderExpiryTime min="1" max="60" step="1"}}
89+
</div>
90+
</div>
91+
{{/if}}
92+
<div class="spacer-50"></div>
93+
<div class="{{if device.isMobile 'mini four' 'right floated large'}} ui fields buttons">
94+
<button class="ui three field left labeled icon button {{if isLoading 'disabled'}}" type="button" {{action 'move' 'backwards'}}>
95+
{{t 'Previous'}}
96+
<i class="left chevron icon"></i>
97+
</button>
98+
<button class="ui three field right labeled icon button {{if isLoading 'disabled'}}" type="button" {{action 'move' 'forwards'}}>
99+
{{t 'Forward'}}
100+
<i class="right chevron icon"></i>
101+
</button>
102+
<button class="blue ui three field right labeled icon button {{if isLoading 'disabled'}}" type="button" {{action 'saveDraft'}}>
103+
{{t 'Save draft'}}
104+
<i class="save icon"></i>
105+
</button>
106+
{{#if data.event.locationName}}
107+
<button class="green ui three field right labeled icon button {{if isLoading 'disabled'}}" type="button" {{action 'publish'}}>
108+
{{t 'Publish'}}
109+
<i class="check icon"></i>
110+
</button>
111+
{{/if}}
112+
</div>
113+
</form>

0 commit comments

Comments
 (0)