# Collection Table

A table for showing a collection of items.

## Attributes
- **cols**: required. an array of column objects with properties:
  - **class**: optional. A css class to set on all cells in the column
  - **format**: optional. A function to use to format the column's value. Will receive the value as its first argument
  - **headerClass**: optional. A css class to set on the column's header
  - **key**: required. The key used to identify the column and get the value from each item
  - **title**: optional. The title to show in the column's header
  - **yield**: optional. `true` if the table should yield back to the parent context to render the column's cells
- **emptyMsg**: optional. The message to show when items is empty. Defaults to `No Items`
- **errorMsg**: optional. The message to show when there is an error loading items. Defaults to `Error Loading Items`
- **hasError**: optional. `true` if there was an error loading items, `false` otherwise. Defaults to `false`
- **isLoading**: optional. `true` if items are being loaded, `false` otherwise. Defaults to `false`
- **itemKey**: optional. The [key to set on Ember's each](http://emberjs.com/api/classes/Ember.Templates.helpers.html#method_each) on the `items` array. Defaults to `@identity`
- **items**: optional. The array of items to show in the table. Defaults to `null`
- **loadingMsg**: optional. The message to show while items are loading. Defaults to `Loading Items`
- **onSortChanged**: optional. The action to call when the sort column or sort direction change. Will receive the col object as its first arg and the sortDir as its second arg. Defaults to `null`
- **sortByKey**: optional. The col.key currently being sorted by. If not set, it is assumed changing sort is not supported. Defaults to `null`
- **sortDir**: optional. The current sort direction. Only `desc` and `asc` are allowed. Defaults to `desc`
- **task**: optional. An ember-concurrency task. If provided, `items` will be pulled from `task.lastSuccessful.value`, `isLoading` will be pulled from `task.isRunning`, and `hasError` will be pulled from `task.last.error`

## Examples
### Block Usage
```mustache
{{#collection-table class='full-width' itemKey='id'
    task=itemsTask
    onSortChanged=(action 'onSortChanged')
    sortByKey=sortByKey
    sortDir=sortDir
    cols=(array
      (hash key='isSelected' yield=true)
      (hash title='Device ID' key='deviceId' yield=true class='device-id-col')
      (hash title='Case ID' key='caseId')
      (hash title='Name' key='name' format=orTwoDashes)
      (hash title='Org' key='org')
      (hash title='Consumer Device' key='isConsumerDevice')
      (hash title='Latest Vehicle' key='lastestVehicle.display')
      (hash title='Meta' key='meta' format=orTwoDashes)
      (hash title='Created At' key='createdAt' format=formatDate)
      (hash title='Updated At' key='updatedAt' format=formatDate))
    as |item col|}}

  {{#if (eq col.key 'isSelected')}}
    <input type='checkbox'
      checked={{contains item selectedItems}}
      onChange={{action (action 'toggleSelection' item) value='target.checked'}}>
  {{else if (eq col.key 'deviceId')}}
    {{link-to item.deviceId}}
  {{/if}}

{{/collection-table}}
```

### Non-block Usage
```mustache
{{collection-table class='full-width' itemKey='id'
  task=itemsTask
  onSortChanged=(action 'onSortChanged')
  sortByKey=sortByKey
  sortDir=sortDir
  cols=(array
    (hash title='Device ID' key='deviceId' class='device-id-col')
    (hash title='Case ID' key='caseId')
    (hash title='Name' key='name' format=orTwoDashes)
    (hash title='Org' key='org')
    (hash title='Consumer Device' key='isConsumerDevice')
    (hash title='Latest Vehicle' key='lastestVehicle.display')
    (hash title='Meta' key='meta' format=orTwoDashes)
    (hash title='Created At' key='createdAt' format=formatDate)
    (hash title='Updated At' key='updatedAt' format=formatDate))}}
```