75 lines
1.8 KiB
Vue
75 lines
1.8 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import { useRoute, useFetch, createError } from "nuxt/app";
|
||
|
|
import { Ref } from "vue";
|
||
|
|
|
||
|
|
import PagedList from "~/components/pagedList.vue";
|
||
|
|
import { client as clientType } from "~/utils/types/database";
|
||
|
|
|
||
|
|
const route = useRoute();
|
||
|
|
const id = route.params.id;
|
||
|
|
|
||
|
|
const clientRequest = await useFetch(`/api/clients/${id}`);
|
||
|
|
if (clientRequest.error.value) throw createError(clientRequest.error.value?.data ?? "");
|
||
|
|
const client = clientRequest.data as Ref<clientType>;
|
||
|
|
console.log(client);
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<VRow>
|
||
|
|
<VCol cols="12">
|
||
|
|
<div
|
||
|
|
class="text-h4"
|
||
|
|
:class="client.name === null ? ['font-italic'] : []"
|
||
|
|
>
|
||
|
|
{{ client.name ?? "[none]" }}
|
||
|
|
</div>
|
||
|
|
</VCol>
|
||
|
|
</VRow>
|
||
|
|
<VRow>
|
||
|
|
<VCol md="4" cols="12">
|
||
|
|
<VCard>
|
||
|
|
<VList>
|
||
|
|
<VListItem
|
||
|
|
v-if="client.address"
|
||
|
|
prepend-icon="mdi-map-marker"
|
||
|
|
>
|
||
|
|
<VListItemTitle class="text-wrap">
|
||
|
|
{{ client.address }}
|
||
|
|
</VListItemTitle>
|
||
|
|
</VListItem>
|
||
|
|
<VListItem
|
||
|
|
v-if="client.email"
|
||
|
|
prepend-icon="mdi-email"
|
||
|
|
>
|
||
|
|
<VListItemTitle class="text-wrap">
|
||
|
|
{{ client.email }}
|
||
|
|
</VListItemTitle>
|
||
|
|
</VListItem>
|
||
|
|
<VListItem
|
||
|
|
v-if="client.phone"
|
||
|
|
prepend-icon="mdi-phone"
|
||
|
|
>
|
||
|
|
<VListItemTitle class="text-wrap">
|
||
|
|
{{ client.phone }}
|
||
|
|
</VListItemTitle>
|
||
|
|
</VListItem>
|
||
|
|
</VList>
|
||
|
|
</VCard>
|
||
|
|
</VCol>
|
||
|
|
<VCol cols="12" md="8">
|
||
|
|
<PagedList
|
||
|
|
:records="[{a: 'owo'}, {a: 'uwu'}, {a: 'qwq'}]"
|
||
|
|
record-key="a"
|
||
|
|
>
|
||
|
|
<template #text="i">
|
||
|
|
{{ i }}
|
||
|
|
</template>
|
||
|
|
<template #title="i">
|
||
|
|
{{ i }}
|
||
|
|
</template>
|
||
|
|
</PagedList>
|
||
|
|
</VCol>
|
||
|
|
</VRow>
|
||
|
|
</template>
|