obsidian-visualiser/pages/homebrew/[id]/edit.client.vue

57 lines
2.2 KiB
Vue

<script setup lang="ts">
import { unifySlug } from '~/shared/general.util';
import type { Feature } from '~/types/character';
definePageMeta({
guestsGoesTo: '/user/login',
rights: ['admin', 'editor'],
});
const id = unifySlug(useRouter().currentRoute.value.params.id);
const { add } = useToast();
const homebrew = ref<Feature>({
id: id === 'new' ? -1 : parseInt(id, 10),
list: [],
});
if(id !== 'new')
{
const _homebrew = await useRequestFetch()(`/api/homebrew/${id}`);
if(!_homebrew) throw new Error('Donnée de personnalisation introuvable');
homebrew.value = Object.assign(homebrew.value, _homebrew);
}
function save(force: boolean)
{
}
</script>
<template>
<Head>
<Title>d[any] - Edition de {{ homebrew.name || 'nouvelle personnalisation' }}</Title>
</Head>
<div class="flex flex-col gap-8 align-center">
<div class="flex flex-row gap-4 align-center justify-center">
<div class="flex flex-row gap-4 align-center justify-center">
<Label class="flex items-center justify-between flex-row gap-2">
<span class="pb-1 mx-2 md:p-0">Titre</span>
<input class="caret-light-50 dark:caret-dark-50 text-light-100 dark:text-dark-100 placeholder:text-light-50 dark:placeholder:text-dark-50
bg-light-20 dark:bg-dark-20 outline-none px-3 py-1 focus:shadow-raw transition-[box-shadow] focus:shadow-light-40 dark:focus:shadow-dark-40
border border-light-35 dark:border-dark-35 hover:border-light-50 dark:hover:border-dark-50 data-[disabled]:bg-light-20 dark:data-[disabled]:bg-dark-20 data-[disabled]:border-light-20 dark:data-[disabled]:border-dark-20"
type="text" v-model="homebrew.name">
</Label>
</div>
<div class="self-center">
<Tooltip side="right" message="Ctrl+S"><Button @click="() => save(true)">Enregistrer</Button></Tooltip>
</div>
</div>
<div class="flex flex-1 flex-col min-w-[800px] w-[75vw] max-w-[1200px]">
<div class="m-2 overflow-auto">
</div>
</div>
</div>
</template>