diff --git a/app/components/ccdb-filter.js b/app/components/ccdb-filter.js new file mode 100644 index 0000000..a6b3c20 --- /dev/null +++ b/app/components/ccdb-filter.js @@ -0,0 +1,5 @@ +import Ember from 'ember'; + +const { Component } = Ember; + +export default Component.extend({ }); diff --git a/app/components/collection/list-container.js b/app/components/collection/list-container.js index e26790e..e9cb377 100644 --- a/app/components/collection/list-container.js +++ b/app/components/collection/list-container.js @@ -8,9 +8,10 @@ export default Component.extend({ columns: [ { label: 'Project', valuePath: 'project.name', }, + { label: 'Region', valuePath: 'studyLocation.site.region.name', }, + { label: 'Site', valuePath: 'studyLocation.site.name', }, { label: 'Study Location', valuePath: 'studyLocation.code', }, - { label: 'Method', valuePath: 'collectionMethod.code', }, - { label: 'Type', valuePath: 'collectionType.name', }, + { label: 'Method', valuePath: 'collectionMethod.name', }, { label: '# of Traps', valuePath: 'numberOfTraps', }, { label: 'Start', valuePath: 'startDateTime', }, { label: 'End', valuePath: 'endDateTime', }, diff --git a/app/controllers/collections/index.js b/app/controllers/collections/index.js index 7a022f4..48482d2 100644 --- a/app/controllers/collections/index.js +++ b/app/controllers/collections/index.js @@ -1,10 +1,36 @@ import Ember from 'ember'; -const { Controller } = Ember; +const { Controller, computed, get, set } = Ember; + export default Controller.extend({ - queryParams: ['page'], + queryParams: ['page', 'project', 'region', 'site', 'study_location', + 'collection_method', 'number_of_traps', 'collection_start_date', + 'collection_end_date'], page: 1, + project: [], + region: [], + site: [], + study_location: [], + collection_method: [], + number_of_traps: '', + collection_start_date: '', + collection_end_date: '', + + options: computed('projectOptions', 'regionOptions', 'siteOptions', + 'studyLocationOptions', 'collectionMethodOptions', function() { + return { + projects: this.get('projectOptions'), + regions: this.get('regionOptions'), + sites: this.get('siteOptions'), + studyLocations: this.get('studyLocationOptions'), + collectionMethods: this.get('collectionMethodOptions'), + }; + }), + + _coerceId(model) { + return +get(model, 'id'); + }, actions: { changePage(page) { @@ -16,5 +42,30 @@ export default Controller.extend({ createCollection() { this.transitionToRoute('collections.create'); }, + changeFilter(filter) { + // Need to reset the page so that things don't get weird + set(this, 'page', 1); + + const filterModelFields = ['project', 'region', 'site', 'study_location', + 'collection_method']; + + filterModelFields.forEach((field) => { + let fields = get(filter, field); + fields = fields.map(this._coerceId); + set(this, field, fields); + }); + + set(this, 'number_of_traps', get(filter, 'number_of_traps')); + + ['collection_start_date', 'collection_end_date'].forEach((field) => { + let value = get(filter, field); + if (value) { + value = value.toJSON().split('T')[0]; + } else { + value = ''; + } + set(this, field, value); + }); + }, }, }); diff --git a/app/models/region.js b/app/models/region.js new file mode 100644 index 0000000..3530700 --- /dev/null +++ b/app/models/region.js @@ -0,0 +1,11 @@ +import DS from 'ember-data'; + +const { Model, attr, hasMany } = DS; + +export default Model.extend({ + name: attr('string'), + code: attr('string'), + sortOrder: attr('number'), + + site: hasMany('site'), +}); diff --git a/app/models/site.js b/app/models/site.js new file mode 100644 index 0000000..04402e7 --- /dev/null +++ b/app/models/site.js @@ -0,0 +1,13 @@ +import DS from 'ember-data'; + +const { Model, attr, hasMany, belongsTo } = DS; + +export default Model.extend({ + name: attr('string'), + code: attr('string'), + description: attr('string'), + sortOrder: attr('number'), + + region: belongsTo('region'), + studyLocation: hasMany('study-location'), +}); diff --git a/app/models/study-location.js b/app/models/study-location.js index 7568218..28969aa 100644 --- a/app/models/study-location.js +++ b/app/models/study-location.js @@ -1,6 +1,6 @@ import DS from 'ember-data'; -const { Model, attr } = DS; +const { Model, attr, belongsTo } = DS; export default Model.extend({ name: attr('string'), @@ -10,4 +10,6 @@ export default Model.extend({ collectingLocation: attr('string'), description: attr('string'), sortOrder: attr('number'), + + site: belongsTo('site'), }); diff --git a/app/routes/collections/index.js b/app/routes/collections/index.js index 08d7b8d..ab1eee6 100644 --- a/app/routes/collections/index.js +++ b/app/routes/collections/index.js @@ -1,14 +1,72 @@ import Ember from 'ember'; -const { Route } = Ember; +const { Route, RSVP } = Ember; export default Route.extend({ queryParams: { + // qps are snake_case for the django api page: { refreshModel: true }, + project: { refreshModel: true }, + region: { refreshModel: true }, + site: { refreshModel: true }, + study_location: { refreshModel: true }, + collection_method: { refreshModel: true }, + number_of_traps: { refreshModel: true }, + collection_start_date: { refreshModel: true }, + collection_end_date: { refreshModel: true }, }, model(params) { - const include = {include: 'project,study-location,collection-method,collection-type'}; - return this.get('store').query('collection', Object.assign(params, include)); + const store = this.get('store'); + const opts = { + include: 'project,study-location,study-location.site,site,collection-method', + }; + + return RSVP.hash({ + projectOptions: store.findAll('project'), + regionOptions: store.findAll('region'), + siteOptions: store.findAll('site'), + studyLocationOptions: store.findAll('study-location'), + collectionMethodOptions: store.findAll('collection-method'), + model: store.query('collection', Object.assign(params, opts)), + }); + }, + + setupController(controller, models) { + this._super(...arguments); + controller.setProperties(models); + + const store = this.get('store'); + + let project = controller.get('project'); + project = project.map(id => store.peekRecord('project', id)); + + let region = controller.get('region'); + region = region.map(id => store.peekRecord('region', id)); + + let site = controller.get('site'); + site = site.map(id => store.peekRecord('site', id)); + + let studyLocation = controller.get('study_location'); + studyLocation = studyLocation.map(id => store.peekRecord('study-location', id)); + + let collectionMethod = controller.get('collection_method'); + collectionMethod = collectionMethod.map(id => store.peekRecord('collection-method', id)); + + const numberOfTraps = controller.get('number_of_traps'); + const collectionStartDate = controller.get('collection_start_date'); + const collectionEndDate = controller.get('collection_end_date'); + + let filter = { + project, + region, + site, + study_location: studyLocation, + collection_method: collectionMethod, + number_of_traps: numberOfTraps, + collection_start_date: collectionStartDate, + collection_end_date: collectionEndDate, + } + controller.set('filters', filter); }, }); diff --git a/app/styles/app.css b/app/styles/app.css index 680bff1..1a2d097 100644 --- a/app/styles/app.css +++ b/app/styles/app.css @@ -50,6 +50,10 @@ border-top-right-radius: 0; } +.top-buffer { + margin-top: 20px; +} + /* Sidebar */ .sidebar { position: fixed; diff --git a/app/templates/collections/index.hbs b/app/templates/collections/index.hbs index 07d407b..ca47c63 100644 --- a/app/templates/collections/index.hbs +++ b/app/templates/collections/index.hbs @@ -1,6 +1,9 @@ {{ collection/list-container model=model + filters=filters + options=options + changeFilter=(action 'changeFilter') changePage=(action 'changePage') onRowClick=(action 'rowClick') createCollection=(action 'createCollection') diff --git a/app/templates/components/ccdb-filter.hbs b/app/templates/components/ccdb-filter.hbs new file mode 100644 index 0000000..889d9ee --- /dev/null +++ b/app/templates/components/ccdb-filter.hbs @@ -0,0 +1 @@ +{{yield}} diff --git a/app/templates/components/collection/list-container.hbs b/app/templates/components/collection/list-container.hbs index 872a0c8..6b7c9c9 100644 --- a/app/templates/components/collection/list-container.hbs +++ b/app/templates/components/collection/list-container.hbs @@ -4,6 +4,119 @@ label='New Collection' onClick=(action createCollection) }} + +
+ +{{#ccdb-filter + filters=filters + options=options +}} +
+
+
+ + {{#power-select-multiple + options=options.projects + selected=filters.project + onchange=(action (mut filters.project)) + searchField='name' + as |project| + }} + {{project.name}} + {{/power-select-multiple}} +
+
+ + {{#power-select-multiple + options=options.regions + selected=filters.region + onchange=(action (mut filters.region)) + searchField='name' + as |region| + }} + {{region.name}} + {{/power-select-multiple}} +
+
+ + {{#power-select-multiple + options=options.sites + selected=filters.site + onchange=(action (mut filters.site)) + searchField='name' + as |site| + }} + {{site.name}} + {{/power-select-multiple}} +
+
+ + {{#power-select-multiple + options=options.studyLocations + selected=filters.study_location + onchange=(action (mut filters.study_location)) + searchField='code' + as |studyLocation| + }} + {{studyLocation.code}} + {{/power-select-multiple}} +
+
+ +
+
+ + {{#power-select-multiple + options=options.collectionMethods + selected=filters.collection_method + onchange=(action (mut filters.collection_method)) + searchField='name' + as |collectionMethod| + }} + {{collectionMethod.name}} + {{/power-select-multiple}} +
+
+ + {{input type="text" class="form-control" value=filters.number_of_traps}} +
+
+ + {{ + pikaday-input + onSelection=(action (mut filters.collection_start_date)) + value=filters.collection_start_date + useUTC=true + format='YYYY-MM-DD' + class='form-control' + }} +
+
+ + {{ + pikaday-input + onSelection=(action (mut filters.collection_end_date)) + value=filters.collection_end_date + useUTC=true + format='YYYY-MM-DD' + class='form-control' + }} +
+
+ +
+
+ {{ + action-button + isSuccess=true + label='Search' + onClick=(action changeFilter filters) + }} +
+
+
+{{/ccdb-filter}} + {{ ccdb-table model=model diff --git a/package.json b/package.json index b0dcd2d..b8c6c29 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "ember-cli-htmlbars": "^2.0.1", "ember-cli-htmlbars-inline-precompile": "^0.4.3", "ember-cli-inject-live-reload": "^1.4.1", + "ember-cli-moment-shim": "^3.5.0", "ember-cli-qunit": "^4.0.0", "ember-cli-shims": "^1.1.0", "ember-cli-sri": "^2.1.0", @@ -40,6 +41,7 @@ "ember-light-table": "^1.10.0", "ember-load-initializers": "^1.0.0", "ember-moment": "7.3.1", + "ember-pikaday": "^2.2.3", "ember-power-select": "^1.8.5", "ember-power-select-with-create": "0.4.3", "ember-resolver": "^4.0.0", diff --git a/tests/unit/models/region-test.js b/tests/unit/models/region-test.js new file mode 100644 index 0000000..e9468e8 --- /dev/null +++ b/tests/unit/models/region-test.js @@ -0,0 +1,12 @@ +import { moduleForModel, test } from 'ember-qunit'; + +moduleForModel('region', 'Unit | Model | region', { + // Specify the other units that are required for this test. + needs: [] +}); + +test('it exists', function(assert) { + let model = this.subject(); + // let store = this.store(); + assert.ok(!!model); +}); diff --git a/tests/unit/models/site-test.js b/tests/unit/models/site-test.js new file mode 100644 index 0000000..c75a2ee --- /dev/null +++ b/tests/unit/models/site-test.js @@ -0,0 +1,12 @@ +import { moduleForModel, test } from 'ember-qunit'; + +moduleForModel('site', 'Unit | Model | site', { + // Specify the other units that are required for this test. + needs: [] +}); + +test('it exists', function(assert) { + let model = this.subject(); + // let store = this.store(); + assert.ok(!!model); +});