Vue Attract: Sort/filterable table based on Vue
Initial commit implementing sortable and filterable tables for attract using Vue.
This commit is contained in:
40
src/scripts/js/es6/common/vuecomponents/assetstable/Table.js
Normal file
40
src/scripts/js/es6/common/vuecomponents/assetstable/Table.js
Normal file
@@ -0,0 +1,40 @@
|
||||
let PillarTable = pillar.vuecomponents.table.PillarTable;
|
||||
import {AssetColumnFactory} from './columns/AssetColumnFactory'
|
||||
import {AssetRowsSource} from './rows/AssetRowsSource'
|
||||
import {RowFilter} from '../attracttable/filter/RowFilter'
|
||||
|
||||
const TEMPLATE =`
|
||||
<div class="pillar-table-actions">
|
||||
<button class="action"
|
||||
v-if="canAddAsset"
|
||||
@click="createNewAsset"
|
||||
>
|
||||
<i class="pi-plus">New Asset</i>
|
||||
</button>
|
||||
</div>
|
||||
`;
|
||||
|
||||
let TableActions = {
|
||||
template: TEMPLATE,
|
||||
computed: {
|
||||
canAddAsset() {
|
||||
let projectId = ProjectUtils.projectId();
|
||||
return attract.auth.AttractAuth.canUserCreateAsset(projectId);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
createNewAsset() {
|
||||
asset_create(ProjectUtils.projectUrl());
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
Vue.component('attract-assets-table', {
|
||||
extends: PillarTable,
|
||||
columnFactory: AssetColumnFactory,
|
||||
rowsSource: AssetRowsSource,
|
||||
components: {
|
||||
'pillar-table-actions': TableActions,
|
||||
'pillar-table-row-filter': RowFilter,
|
||||
}
|
||||
});
|
Reference in New Issue
Block a user