diff --git a/app/components/add-reimbursement/component.js b/app/components/add-reimbursement/component.js index 78a6446..fdbf91a 100644 --- a/app/components/add-reimbursement/component.js +++ b/app/components/add-reimbursement/component.js @@ -33,6 +33,26 @@ export default class AddReimbursementComponent extends Component { return this.isValidTotal ? 'valid' : ''; } + get totalEUR () { + const expenses = this.expenses.filterBy('currency', 'EUR'); + if (expenses.length > 0) { + return expenses.mapBy('amount') + .reduce((summation, current) => summation + current); + } else { + return 0; + } + } + + get totalUSD () { + const expenses = this.expenses.filterBy('currency', 'USD'); + if (expenses.length > 0) { + return expenses.mapBy('amount') + .reduce((summation, current) => summation + current); + } else { + return 0; + } + } + get submitButtonEnabled () { return this.isValidTotal && (this.expenses.length > 0); diff --git a/app/components/add-reimbursement/template.hbs b/app/components/add-reimbursement/template.hbs index 4964fc3..e6270fc 100644 --- a/app/components/add-reimbursement/template.hbs +++ b/app/components/add-reimbursement/template.hbs @@ -13,17 +13,37 @@

- +
+ + + +

Expense items

{{#if this.expenses}} diff --git a/app/styles/_forms.scss b/app/styles/_forms.scss index 696c530..35cfc90 100644 --- a/app/styles/_forms.scss +++ b/app/styles/_forms.scss @@ -53,6 +53,14 @@ section#signup { grid-template-columns: 1fr 1fr; grid-gap: 2rem; + &.thirds { + grid-template-columns: 1fr 1fr 1fr; + } + + &.total-amounts { + grid-template-columns: 2fr 1fr 1fr; + } + label { } } diff --git a/tests/helpers/create-component.js b/tests/helpers/create-component.js new file mode 100644 index 0000000..8f16dad --- /dev/null +++ b/tests/helpers/create-component.js @@ -0,0 +1,8 @@ +import { getContext } from '@ember/test-helpers'; + +export default function createComponent(lookupPath, named = {}) { + let { owner } = getContext(); + let componentManager = owner.lookup('component-manager:glimmer'); + let { class: componentClass } = owner.factoryFor(lookupPath); + return componentManager.createComponent(componentClass, { named }); +} diff --git a/tests/integration/components/add-reimbursement/component-test.js b/tests/integration/components/add-reimbursement/component-test.js index 082af77..a35da24 100644 --- a/tests/integration/components/add-reimbursement/component-test.js +++ b/tests/integration/components/add-reimbursement/component-test.js @@ -6,10 +6,8 @@ import { hbs } from 'ember-cli-htmlbars'; module('Integration | Component | add-reimbursement', function(hooks) { setupRenderingTest(hooks); - // test('it renders', async function(assert) { - // Set any properties with this.set('myProperty', 'value'); - // Handle any actions with this.set('myAction', function(val) { ... }); - // await render(hbs``); - // assert.equal(this.element.textContent.trim(), ''); - // }); + test('it works', async function(assert) { + await render(hbs``); + assert.ok(true); + }); }); diff --git a/tests/unit/components/add-reimbursement-test.js b/tests/unit/components/add-reimbursement-test.js new file mode 100644 index 0000000..dad0289 --- /dev/null +++ b/tests/unit/components/add-reimbursement-test.js @@ -0,0 +1,42 @@ +import { module, test } from 'qunit'; +import { setupTest } from 'ember-qunit'; +import createComponent from 'kredits-web/tests/helpers/create-component'; + +const expenses = [ + { + title: "Server rent", + description: "Dedicated server: andromeda.kosmos.org, April 2020", + currency: "EUR", + amount: 39.00, + date: "2020-05-06", + url: "https://wiki.kosmos.org/Infrastructure#Hetzner", + tags: ["infrastructure", "server", "hetzner"] + }, + { + title: "Server rent", + description: "Dedicated server: centaurus.kosmos.org, April 2020", + currency: "EUR", + amount: 32.00, + date: "2020-05-06", + url: "https://wiki.kosmos.org/Infrastructure#Hetzner", + tags: ["infrastructure", "server", "hetzner"] + }, + { + title: "Domain name kosmos.org", + currency: "USD", + amount: 59.00, + date: "2020-05-07", + tags: ["domain"] + } +]; + +module('Unit | Component | add-reimbursement', function(hooks) { + setupTest(hooks); + + test('total sums of expenses in EUR and USD', function(assert) { + let component = createComponent('component:add-reimbursement'); + component.expenses = expenses; + assert.equal(component.totalEUR, '71'); + assert.equal(component.totalUSD, '59'); + }); +});