Blitblank
3d219b8cf7
All checks were successful
Build and Deploy Frontend / build-and-deploy (push) Successful in 7s
45 lines
1.0 KiB
Vue
45 lines
1.0 KiB
Vue
|
|
<script setup lang="ts">
|
|
|
|
import { onMounted } from "vue"
|
|
import { useRoute, useRouter } from "vue-router";
|
|
import { useItemsStore } from "../stores/ItemsStore.ts"
|
|
import * as authApi from "../api/AuthApi";
|
|
|
|
const store = useItemsStore()
|
|
const router = useRouter();
|
|
|
|
onMounted(() => {
|
|
store.fetchItems()
|
|
})
|
|
|
|
function logout() {
|
|
authApi.logout();
|
|
router.push("/login");
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<h1>Items</h1>
|
|
|
|
<router-link to="/item/new">Create Item</router-link>
|
|
|
|
<table>
|
|
<tr v-for="item in store.items" :key="item.id">
|
|
<td>{{ item.name }}</td>
|
|
<td>
|
|
|
|
<router-link :to="`/item/${item.id}`" custom v-slot="{ navigate }">
|
|
<button @click="navigate" role="link">Edit</button>
|
|
</router-link>
|
|
|
|
<button @click="store.removeItem(item.id)">Delete</button>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<button @click="logout()">Logout</button>
|
|
</div>
|
|
</template>
|