Skip to content

Commit 7347220

Browse files
mrsaicharan1mrsaicharan1
committed
Shifted to tabbed design & integrated ember-table for due
1 parent b9dada5 commit 7347220

File tree

8 files changed

+123
-35
lines changed

8 files changed

+123
-35
lines changed

‎app/controllers/account/billing-info/invoices.js‎

Lines changed: 62 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,27 @@
11
import Controller from '@ember/controller';
22
import { filterBy } from '@ember/object/computed';
33
import { computed } from '@ember/object';
4+
import EmberTableMixin from 'open-event-frontend/mixins/ember-table';
5+
6+
export default class extends Controller.extend(EmberTableMixin) {
7+
// queryParams = ['page', 'per_page'];
8+
// page = 1;
9+
// per_page = 10;
10+
// search = null;
11+
// sort_dir = null;
12+
// sort_by = null;
13+
@filterBy('model.eventInvoices', 'status', 'due')
14+
dueInvoices;
415

5-
export default class extends Controller {
6-
queryParams = ['page', 'per_page'];
7-
page = 1;
8-
per_page = 10;
9-
search = null;
10-
sort_dir = null;
11-
sort_by = null;
12-
dueInvoices = filterBy('model.eventInvoices', 'status', 'due');
13-
paidInvoices = filterBy('model.eventInvoices', 'status', 'paid');
16+
@filterBy('model.eventInvoices', 'status', 'paid')
17+
paidInvoices;
1418

1519
@computed()
16-
get columns() {
20+
get dueInvoiceColumns() {
1721
return [
1822
{
1923
name: 'Invoice ID',
20-
valuePath: 'id'
24+
valuePath: 'invoiceId'
2125
},
2226
{
2327
name: 'Event Name',
@@ -34,9 +38,54 @@ export default class extends Controller {
3438
{
3539
name: 'View Invoice',
3640
valuePath: 'invoiceLink'
37-
},
41+
}
42+
43+
];
44+
}
3845

46+
@computed('dueInvoices')
47+
get dueInvoiceRows() {
48+
const rows = [];
49+
this.dueInvoices.forEach(row => {
50+
rows.pushObject({
51+
invoiceId : row.identifier,
52+
eventName : row.event.name,
53+
dateIssued : row.createdAt,
54+
amount : row.amount,
55+
invoiceLink : row.invoicePdfUrl
56+
});
57+
});
58+
return rows;
59+
}
60+
61+
@computed('paidInvoices')
62+
get paidInvoiceRows() {
63+
const rows = [];
64+
this.paidInvoices.forEach(row => {
65+
rows.pushObject({
66+
invoiceId : row.identifier,
67+
eventName : row.event.name,
68+
dateIssued : row.createdAt,
69+
amount : row.amount,
70+
datePaid : row.completedAt,
71+
invoiceLink : row.invoicePdfUrl
72+
});
73+
});
74+
return rows;
75+
}
3976

40-
]
77+
@computed('upcomingInvoices')
78+
get upcomingInvoiceRows() {
79+
const rows = [];
80+
this.upcomingInvoices.forEach(row => {
81+
rows.pushObject({
82+
invoiceId : row.identifier,
83+
eventName : row.event.name,
84+
dateIssued : row.createdAt,
85+
amount : row.amount,
86+
invoiceLink : row.invoicePdfUrl
87+
});
88+
});
89+
return rows;
4190
}
4291
}

‎app/models/event-invoice.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ export default ModelBase.extend({
2626
expYear : attr('number'),
2727
amount : attr('number'),
2828
completedAt : attr('moment'),
29+
invoicePdfUrl : attr('string'),
2930

3031
/** relationships
3132
*

‎app/router.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,9 @@ router.map(function() {
115115
this.route('danger-zone');
116116
this.route('billing-info', function() {
117117
this.route('payment-info');
118-
this.route('invoices');
118+
this.route('invoices', function() {
119+
this.route('list', { path: '/:invoice_status' } );
120+
});
119121
});
120122
});
121123
this.route('explore');
@@ -209,6 +211,7 @@ router.map(function() {
209211
this.route('pending', { path: '/:order_id/pending' });
210212
});
211213
this.route('verify');
214+
212215
});
213216

214217
export default router;

‎app/routes/app/templates/account/billing-info/invoices/list.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import Route from '@ember/routing/route';
2+
3+
export default class extends Route {
4+
5+
}

‎app/templates/account/billing-info/invoices.hbs‎

Lines changed: 23 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,24 @@
11
<div class="ui grid stackable">
2-
3-
4-
<div class="sixteen wide column">
5-
{{!-- <h2 class="ui header column">{{t 'Due Invoices'}}</h2> --}}
6-
{{tables/default columns=columns
7-
rows=rows
8-
currentPage=page
9-
pageSize=per_page
10-
searchQuery=search
11-
sortBy=sort_by
12-
sortDir=sort_dir
13-
metaData=model.data.meta
14-
filterOptions=filterOptions
15-
widthConstraint="eq-container"
16-
resizeMode="fluid"
17-
fillMode="equal-column"
18-
}}
19-
</div>
2+
<div class="row">
3+
<div class="eight wide column">
4+
{{#tabbed-navigation isNonPointing=true}}
5+
{{#link-to 'account.billing-info.invoices.list' 'Due' class='item'}}
6+
{{t 'Due'}}
7+
{{/link-to}}
8+
{{#link-to 'account.billing-info.invoices.list' 'Paid' class='item'}}
9+
{{t 'Paid'}}
10+
{{/link-to}}
11+
{{#link-to 'account.billing-info.invoices.list' 'Upcoming' class='item'}}
12+
{{t 'Upcoming'}}
13+
{{/link-to}}
14+
{{/tabbed-navigation}}
15+
</div>
16+
</div>
17+
<div class="row">
18+
{{outlet}}
19+
</div>
20+
</div>
21+
2022
{{!-- <table class="ui stackable structured celled compact table">
2123
<thead>
2224
<tr>
@@ -55,7 +57,7 @@
5557

5658

5759

58-
60+
{{!--
5961
6062
<div class="ui hidden divider"></div>
6163
<div class="sixteen wide column">
@@ -77,7 +79,7 @@
7779
<td>{{paidInvoice.identifier}}</td>
7880
<td>{{paidInvoice.event.name}}</td>
7981
<td>{{paidInvoice.createdAt}}</td>
80-
<td>{{dueInvoice.amount}}</td>
82+
<td>{{paidInvoice.amount}}</td>
8183
<td><button class="ui button primary">{{t 'View Invoice'}}</button></td>
8284
<td>{{paidInvoice.completedAt}}</td>
8385
</tr>
@@ -112,4 +114,4 @@
112114
</table>
113115
</div>
114116
<div class="ui hidden divider"></div>
115-
</div>
117+
</div> --}}

‎app/templates/account/billing-info/invoices/list.hbs‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<div class="sixteen wide column">
2+
{{!-- <h2 class="ui header column">{{t 'Due Invoices'}}</h2> --}}
3+
{{tables/default columns=dueInvoiceColumns
4+
rows=dueInvoiceRows
5+
currentPage=page
6+
pageSize=per_page
7+
searchQuery=search
8+
sortBy=sort_by
9+
sortDir=sort_dir
10+
metaData=model.data.meta
11+
filterOptions=filterOptions
12+
widthConstraint="eq-container"
13+
resizeMode="fluid"
14+
fillMode="equal-column"
15+
}}
16+
</div>

‎app/templates/app/templates/account/billing-info/invoices/list.hbs‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{{outlet}}

‎tests/unit/routes/app/templates/account/billing-info/invoices/list-test.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { module, test } from 'qunit';
2+
import { setupTest } from 'ember-qunit';
3+
4+
module('Unit | Route | app/templates/account/billing-info/invoices/list', function(hooks) {
5+
setupTest(hooks);
6+
7+
test('it exists', function(assert) {
8+
let route = this.owner.lookup('route:app/templates/account/billing-info/invoices/list');
9+
assert.ok(route);
10+
});
11+
});

0 commit comments

Comments
 (0)