It is use VueTable2, so it emit vuetable:row-clicked when the row is clicked.
data-table :apiUrl="apiUrl"
:tableFields="tableFields"
:itemsPerPage="itemsPerPage"
:sortFunctions="sortFunctions"
:apiMode="apiMode"
:paginationPath="paginationPath"
@vuetable:row-clicked="onRowClicked"></data-table>
methods: {
onRowClicked: (action, data) => {
console.log('actions: on-click', data.name)
}
}
<template>
<div class="custom-actions">
<button class="ui basic button" @click="itemAction('view-item', rowData, rowIndex)"><i class="zoom icon"></i></button>
<button class="ui basic button" @click="itemAction('edit-item', rowData, rowIndex)"><i class="edit icon"></i></button>
<button class="ui basic button" @click="itemAction('delete-item', rowData, rowIndex)"><i class="delete icon"></i></button>
</div>
</template>
<script>
export default {
props: {
rowData: {
type: Object,
required: true
},
rowIndex: {
type: Number
}
},
methods: {
itemAction (action, data, index) {
console.log('custom-actions: ' + action, data.name, index)
}
}
}
</script>