add item creation page

This commit is contained in:
j3d1 2024-08-31 00:21:01 +02:00
parent f01d513803
commit 0af1f40b07
4 changed files with 155 additions and 5 deletions

View file

@ -7,8 +7,14 @@
<div class="card">
<div class="card-header">
<h5 class="card-title">{{ user }}'s Inventory</h5>
<button v-if="layout === 'grid'" @click="layout = 'table'" class="btn">
<b-icon-list></b-icon-list>
</button>
<button v-else @click="layout = 'grid'" class="btn">
<b-icon-grid></b-icon-grid>
</button>
</div>
<table class="table table-striped">
<table class="table table-striped" v-if="layout === 'table'">
<thead>
<tr>
<th style="width:40%;">Name</th>
@ -22,7 +28,9 @@
<td>
<router-link :to="`/inventory/${item.id}`">{{ item.name }}</router-link>
</td>
<td class="d-none d-md-table-cell">{{ item.availability_policy }}</td>
<td class="d-none d-md-table-cell">
<span class="badge bg-secondary text-white">{{ item.availability_policy }}</span>
</td>
<td class="d-none d-md-table-cell">{{ item.owned_quantity }}</td>
<td class="table-action">
<router-link :to="`/inventory/${item.id}/edit`">
@ -35,6 +43,36 @@
</tr>
</tbody>
</table>
<div class="card-body" v-else>
<div class="row">
<div class="col-12 col-md-6 col-lg-4 col-xl-3" v-for="item in inventory_items"
:key="item.id">
<div class="card">
<img :src="item.image" class="card-img-top" :alt="item.image || '...'">
<div class="card-body">
<h5 class="card-title mb-0">{{ item.name }}</h5>
<div class="card-text text-black-50">
<span class="badge bg-secondary text-white">{{ item.availability_policy }}</span>
<span class="float-right">{{ item.owned_quantity }}</span>
</div>
<div class="btn-group">
<!--router-link :to="`/inventory/${item.id}`"
class="btn btn-primary btn-sm">
View
</router-link>
<button class="btn btn-danger btn-sm"
@click="deleteInventoryItem(item.id)">Delete
</button>
<router-link :to="`/inventory/${item.id}/edit`"
class="btn btn-primary btn-sm">Edit
</router-link-->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="card">
<button class="btn" @click="fetchInventoryItems">Refresh</button>
@ -54,6 +92,11 @@ import BaseLayout from "@/components/BaseLayout.vue";
export default {
name: "Inventory",
data() {
return {
layout: "grid",
}
},
components: {
BaseLayout,
...BIcons