Skip to content

Instantly share code, notes, and snippets.

@johnhamelink
Last active August 29, 2015 14:26
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save johnhamelink/31eee55b505ec0d5f0a5 to your computer and use it in GitHub Desktop.
Save johnhamelink/31eee55b505ec0d5f0a5 to your computer and use it in GitHub Desktop.
import Ember from 'ember';
export default Ember.Component.extend({
tagName: 'th',
downArrow: '▼',
upArrow: '▲',
actions: {
sortBy(model, sortProperty, order) {
// Remove all selected classes from all the header links
this.$().closest('table').find('th>a').removeClass('selected');
// Add the selected class to our link
this.$('a.'+order).addClass('selected');
// Run the sort.
this.sendAction('action', model, sortProperty, order);
}
}
});
import Ember from 'ember';
export default Ember.Controller.extend({
queryParams: ['deal_ids', 'date_from', 'date_to'],
actions: {
sortBy(model, property, order) {
console.log(model, property, order);
// generate an array with 'property:order'
let attrDirection = [`${property}:${order}`];
// Set the model sorting property to the
this.set(`computedProperties`, attrDirection);
Ember.computed.sort('model', `computedProperties`);
}
}
});
<div class="row full-width">
<div class="large-12 columns">
<table>
<tr>
{{sortable-header model='' title='Link' sortProperty='link' action='sortBy'}}
{{sortable-header model='' title='IMP' sortProperty='impressions' action='sortBy'}}
{{sortable-header model='' title='CLI' sortProperty='click' action='sortBy'}}
{{sortable-header model='' title='REG' sortProperty='registrations' action='sortBy'}}
{{sortable-header model='' title='FTD' sortProperty='ftd' action='sortBy'}}
{{sortable-header model='' title='CLI/REG%' sortProperty='clicksVsRegistrations' action='sortBy'}}
{{sortable-header model='' title='REG/FTD%' sortProperty='registrationsVsFTD' action='sortBy'}}
{{sortable-header model='' title='CLI/FTD%' sortProperty='ftdVsClicks' action='sortBy'}}
{{sortable-header model='' title='EARNINGS' sortProperty='earnings' action='sortBy'}}
{{sortable-header model='' title='EPCLI' sortProperty='earningsPerClick' action='sortBy'}}
</tr>
{{#each model as |report|}}
<tr>
<td>{{report.link.name}}</td>
<td>{{humanize-number report.impressions}}</td>
<td>{{humanize-number report.click}}</td>
<td>{{humanize-number report.registrations}}</td>
<td>{{humanize-number report.ftd}}</td>
<td>{{report.clicksVsRegistrations}}%</td>
<td>{{report.registrationsVsFTD}}%</td>
<td>{{report.ftdVsClicks}}%</td>
<td>&pound;{{report.earnings}}</td>
<td>&pound;{{report.earningsPerClick}}</td>
</tr>
{{/each}}
</table>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment