diff --git a/addon/styles/_convenience-helpers.sass b/addon/styles/_convenience-helpers.sass index 83b6b04..ff2e915 100644 --- a/addon/styles/_convenience-helpers.sass +++ b/addon/styles/_convenience-helpers.sass @@ -26,7 +26,7 @@ // This helper is used on semantic-ui tables having pre elements. Due to whitespace settings the table width is pushing the table from the screen // https://github.com/Semantic-Org/Semantic-UI/issues/1341 -.force-wrap +.ui.table pre, .force-wrap white-space: pre-wrap word-wrap: break-word diff --git a/app/components/table-filters/boolean-checkboxes.coffee b/app/components/table-filters/boolean-checkboxes.coffee new file mode 100644 index 0000000..69238dc --- /dev/null +++ b/app/components/table-filters/boolean-checkboxes.coffee @@ -0,0 +1,24 @@ +import Ember from 'ember' + +export default Ember.Component.extend + tagName: 'th' + classNames: ['filter', 'filter-boolean-checkboxes'] + classNameBindings: ['has_active_filter_value:active-filter', 'key'] + apply_filters: -> + eager_filter: true # filter on enter + has_active_filter_value: Ember.computed 'selected', -> Number.isFinite(parseInt(@get('selected'))) + selected_is_true: Ember.computed 'selected', -> parseInt(@get('selected')) is 1 + options: [] + selected: null + + init: -> + @_super() + Ember.defineProperty @, 'selected', Ember.computed.alias("filters.#{@get('key')}") + + actions: + set_filter: (value) -> + @set 'selected', value + @get('apply_filters')(@) if @get('eager_filter') + clear_filter: -> + @set 'selected', '' + @get('apply_filters')(@) if @get('eager_filter') diff --git a/app/templates/components/table-filters.hbs b/app/templates/components/table-filters.hbs index 0e6cddc..f5f2c78 100644 --- a/app/templates/components/table-filters.hbs +++ b/app/templates/components/table-filters.hbs @@ -6,6 +6,7 @@ dropdown-select=(component "table-filters/dropdown-select" apply_filters=(action 'apply_filters') filters=filters) dropdown-select-multiple=(component "table-filters/dropdown-select-multiple" apply_filters=(action 'apply_filters') filters=filters) option-buttons=(component "table-filters/option-buttons" apply_filters=(action 'apply_filters') filters=filters) + boolean-checkboxes=(component "table-filters/boolean-checkboxes" apply_filters=(action 'apply_filters') filters=filters) select-multiple=(component "table-filters/select-multiple" apply_filters=(action 'apply_filters') filters=filters) actions=(component 'table-filters/actions' apply_filters=(action 'apply_filters') clear_filters=(action 'clear_filters') filter_calls=filter_calls) )}} diff --git a/app/templates/components/table-filters/boolean-checkboxes.emblem b/app/templates/components/table-filters/boolean-checkboxes.emblem new file mode 100644 index 0000000..bfccbf2 --- /dev/null +++ b/app/templates/components/table-filters/boolean-checkboxes.emblem @@ -0,0 +1,12 @@ +if has_active_filter_value + if selected_is_true + i.large.orange.check.square.outline.icon + i.pointable.grey.square.outline.icon{action 'set_filter' 0} + else + i.pointable.grey.check.square.outline.icon{action 'set_filter' 1} + i.large.orange.square.outline.icon + '   + i.close.icon{action 'clear_filter'} +else + i.pointable.check.square.outline.icon{action 'set_filter' 1} + i.pointable.square.outline.icon{action 'set_filter' 0} diff --git a/app/templates/components/validated-select.emblem b/app/templates/components/validated-select.emblem index 9dab1f7..1765875 100644 --- a/app/templates/components/validated-select.emblem +++ b/app/templates/components/validated-select.emblem @@ -17,6 +17,7 @@ x-select value=(get changeset attribute) on-change=(action "hasChanged") disable else xs.option value=option = option + if (get changeset.error attribute) each (get (get changeset.error attribute) 'validation') as |error| .ui.pointing.red.basic.label= error diff --git a/tests/dummy/app/routes/table-filters/test1.coffee b/tests/dummy/app/routes/table-filters/test1.coffee index d678fd0..85fed2b 100644 --- a/tests/dummy/app/routes/table-filters/test1.coffee +++ b/tests/dummy/app/routes/table-filters/test1.coffee @@ -6,6 +6,7 @@ export default_filter = Ember.Object.create target_week: '' target_date_gteq: moment() target_date_lteq: null + my_boolean: '' s: 'name asc' export default Ember.Route.extend diff --git a/tests/dummy/app/templates/table-filters/test1.emblem b/tests/dummy/app/templates/table-filters/test1.emblem index 671d30f..db896df 100644 --- a/tests/dummy/app/templates/table-filters/test1.emblem +++ b/tests/dummy/app/templates/table-filters/test1.emblem @@ -15,6 +15,7 @@ table.ui.celled.striped.compact.table.sortable th number-range th dropdown-select th dropdown-select objects + th boolean-checkboxes table-filters content=model filters=filters as |filter| = filter.input key='name' = filter.option-buttons key='number_of_migration_windows' options=option_buttons_options @@ -36,6 +37,7 @@ table.ui.celled.striped.compact.table.sortable = filter.number-range key='age' inclusive=true = filter.dropdown-select key='location_planning_scenario_classification' options=scenario_classification_options = filter.dropdown-select key='location_planning_scenario_classification' options=scenario_classification_objects labelPath='grumpy' + = filter.boolean-checkboxes key='my_boolean' tbody