1.0.3 • Published 6 years ago
shapla-data-table-status v1.0.3
shapla-data-table-status
A simple status list component to show status of data table.
Table of contents
Installation
npm install --save shapla-data-table-statusUsage
Add the component:
import statusList from 'shapla-data-table-status';
export default {
name: 'Hello',
components: {
statusList
},
methods: {
handleClickEvent(status) {
//this.$emit('change', status);
}
}
} <status-list :statuses="statuses"></status-list>Props
| Property | Type | Required | Default | Description |
|---|---|---|---|---|
type | String | no | horizontal | set vertical to see vertical design |
statuses | Array | no | [] | Pass an Array of Objects. See statuses data object |
statuses data object
| Property | Type | Required | Default | Description |
|---|---|---|---|---|
key | String | yes | | |
label | String | yes | | |
active | Boolean | yes | true, status will be highlighted. | |
count | Number | yes | |
<!-- template -->
<status-list :statuses="statuses"></status-list>
<status-list :statuses="statuses" type="vertical"></status-list>
<!-- method -->
methods: {
handleClickEvent(status) {
this.$emit('change', status);
}
}