vbatts/homebox
1
0
Fork 0
forked from mirrors/homebox
Code Pull requests Activity

labels create and get

Browse source
This commit is contained in:
Hayden 2022-09-01 17:52:40 -08:00
parent f956ec8eb2
commit 8ece3bd7bf
24 changed files with 850 additions and 132 deletions
Download patch file Download diff file Expand all files Collapse all files

57
frontend/pages/home.vue
View file

@ -1,5 +1,4 @@
<script setup lang="ts">
import { type Location } from '~~/lib/api/classes/locations';
definePageMeta({
layout: 'home',
});
@ -8,32 +7,44 @@
});
const api = useUserApi();
const locations = ref<Location[]>([]);
onMounted(async () => {
const { data: locations } = useAsyncData('locations', async () => {
const { data } = await api.locations.getAll();
if (data) {
locations.value = data.items;
}
return data.items;
});
const { data: labels } = useAsyncData('labels', async () => {
const { data } = await api.labels.getAll();
return data.items;
});
</script>
<template>
<BaseContainer>
<BaseSectionHeader class="mb-5"> Storage Locations </BaseSectionHeader>
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
<NuxtLink
:to="`/location/${l.id}`"
class="card bg-primary text-primary-content hover:-translate-y-1 focus:-translate-y-1 transition duration-300"
v-for="l in locations"
>
<div class="card-body p-4">
<h2 class="flex items-center gap-2">
<Icon name="heroicons-map-pin" class="h-5 w-5 text-white" height="25" />
{{ l.name }}
<!-- <span class="badge badge-accent badge-lg ml-auto text-accent-content text-lg">0</span> -->
</h2>
</div>
</NuxtLink>
</div>
<BaseContainer class="space-y-16">
<section>
<BaseSectionHeader class="mb-5"> Storage Locations </BaseSectionHeader>
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
<NuxtLink
:to="`/location/${l.id}`"
class="card bg-primary text-primary-content hover:-translate-y-1 focus:-translate-y-1 transition duration-300"
v-for="l in locations"
>
<div class="card-body p-4">
<h2 class="flex items-center gap-2">
<Icon name="heroicons-map-pin" class="h-5 w-5 text-white" height="25" />
{{ l.name }}
<!-- <span class="badge badge-accent badge-lg ml-auto text-accent-content text-lg">0</span> -->
</h2>
</div>
</NuxtLink>
</div>
</section>
<section>
<BaseSectionHeader class="mb-5"> Labels </BaseSectionHeader>
<div class="flex gap-2">
<LabelChip v-for="label in labels" :label="label" />
</div>
</section>
</BaseContainer>
</template>

6
frontend/pages/index.vue
View file

@ -105,7 +105,11 @@
<template>
<div>
<header class="sm:px-6 py-2 lg:p-14 sm:py-6">
<h2 class="mt-1 text-4xl font-bold tracking-tight text-base-content sm:text-5xl lg:text-6xl">Homebox</h2>
<h2 class="mt-1 text-4xl font-bold tracking-tight text-base-content sm:text-5xl lg:text-6xl flex">
HomeB
<AppLogo class="w-12 -mb-4" style="padding-left: 3px; padding-right: 2px" />
x
</h2>
<p class="ml-1 text-lg text-base-content/50">Track, Organize, and Manage your Shit.</p>
</header>
<div class="grid p-6 sm:place-items-center min-h-[50vh]">

22
frontend/pages/location/[id].vue
View file

@ -12,9 +12,18 @@
const preferences = useLocationViewPreferences();
const location = ref<Location | null>(null);
const locationId = computed<string>(() => route.params.id as string);
const { data: location } = useAsyncData(locationId.value, async () => {
const { data, error } = await api.locations.get(locationId.value);
if (error) {
toast.error('Failed to load location');
navigateTo('/home');
return;
}
return data;
});
function maybeTimeAgo(date?: string): string {
if (!date) {
return '??';
@ -41,17 +50,6 @@
return dt;
});
onMounted(async () => {
const { data, error } = await api.locations.get(locationId.value);
if (error) {
toast.error('Failed to load location');
navigateTo('/home');
return;
}
location.value = data;
});
const { reveal } = useConfirm();
async function confirmDelete() {