47 lines
1.2 KiB
Vue
47 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import typeUser from "@/data/dummy/keuangan.type_user.json";
|
|
import role_menu from "@/data/dummy/keuangan.role_menu.json";
|
|
import menu from "@/data/dummy/keuangan.menu.json";
|
|
//misal id = 683d57b2bccc67d467a9e10f
|
|
// const id=ref('683d57b2bccc67d467a9e10f')
|
|
// const { data:role_menu } = await useFetch(`/api/role_menu/${id.value}`)
|
|
|
|
const props = defineProps({
|
|
data: {
|
|
type: Array,
|
|
},
|
|
columns: {
|
|
type: Array,
|
|
}
|
|
})
|
|
const updateData = (id) => {
|
|
console.log("update data:", id);
|
|
};
|
|
|
|
const deleteData = (id) => {
|
|
console.log("delete data:", id);
|
|
};
|
|
|
|
</script>
|
|
<template>
|
|
<!-- {{ data() }} -->
|
|
<!-- {{props.columns}} -->
|
|
<v-table density="compact">
|
|
<thead>
|
|
<tr>
|
|
<th class="text-left" v-for="(col,index) in columns" :key="index">{{col.label}}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="(item,index) in data" :key="index">
|
|
<td v-for="(col,colIndex) in columns" :key="colIndex">{{item[col.key]}}
|
|
<template v-if="col.key == 'actions'">
|
|
<v-btn class="mx-2" @click="updateData(item)">ubah</v-btn>
|
|
<v-btn @click="deleteData(item)">hapus</v-btn>
|
|
</template>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</v-table>
|
|
</template>
|