76 lines
4.5 KiB
Vue
76 lines
4.5 KiB
Vue
<script setup lang="ts">
|
|
import { HomebrewBuilder } from '~/shared/feature.util';
|
|
|
|
|
|
definePageMeta({
|
|
guestsGoesTo: '/user/login',
|
|
});
|
|
|
|
const container = useTemplateRef('container');
|
|
|
|
onMounted(() => {
|
|
queueMicrotask(() => {
|
|
if(container.value)
|
|
{
|
|
const builder = new HomebrewBuilder(container.value);
|
|
}
|
|
});
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<Head>
|
|
<Title>d[any] - Edition de données</Title>
|
|
</Head>
|
|
<div ref="container" class="flex flex-1 max-w-full flex-col gap-8 justify-start items-center px-8 w-full"></div>
|
|
<!-- <TabsRoot class="flex flex-1 max-w-full flex-col gap-8 justify-start items-center px-8 w-full" default-value="features">
|
|
<TabsList class="flex flex-row gap-4 self-center relative px-4">
|
|
<TabsIndicator class="absolute left-0 h-[3px] bottom-0 w-[--radix-tabs-indicator-size] translate-x-[--radix-tabs-indicator-position] transition-[width,transform] duration-300 bg-accent-blue"></TabsIndicator>
|
|
<TabsTrigger value="peoples" class="px-2 py-1 border-b border-transparent hover:border-accent-blue">Peuples ({{ config.peoples.length }})</TabsTrigger>
|
|
<TabsTrigger value="training" class="px-2 py-1 border-b border-transparent hover:border-accent-blue">Entrainement</TabsTrigger>
|
|
<TabsTrigger value="abilities" class="px-2 py-1 border-b border-transparent hover:border-accent-blue">Compétences ({{ Object.keys(config.abilities).length }})</TabsTrigger>
|
|
<TabsTrigger value="aspects" class="px-2 py-1 border-b border-transparent hover:border-accent-blue">Aspects ({{ config.aspects.length }})</TabsTrigger>
|
|
<TabsTrigger value="spells" class="px-2 py-1 border-b border-transparent hover:border-accent-blue">Sorts ({{ config.spells.length }})</TabsTrigger>
|
|
<TabsTrigger value="features" class="px-2 py-1 border-b border-transparent hover:border-accent-blue">Features ({{ Object.keys(config.features).length }})</TabsTrigger>
|
|
<Tooltip message="Copier le JSON" side="right"><Button icon @click="copy" class="p-2"><Icon icon="radix-icons:clipboard-copy" /></Button></Tooltip>
|
|
</TabsList>
|
|
<div class="flex flex-row outline-none max-w-full w-full relative overflow-hidden">
|
|
<div class="flex flex-1 outline-none max-w-full overflow-hidden">
|
|
<TabsContent value="peoples" class="outline-none flex gap-4 flex-col overflow-hidden">
|
|
<div class=""></div>
|
|
</TabsContent>
|
|
<TabsContent value="training" class="outline-none flex gap-4 flex-col overflow-hidden">
|
|
<div class="">
|
|
|
|
</div>
|
|
</TabsContent>
|
|
<TabsContent value="abilities" class="outline-none flex gap-4 flex-col overflow-hidden">
|
|
<div class=""></div>
|
|
</TabsContent>
|
|
<TabsContent value="aspects" class="outline-none flex gap-4 flex-col overflow-hidden">
|
|
<div class=""></div>
|
|
</TabsContent>
|
|
<TabsContent value="spells" class="outline-none flex gap-4 flex-col overflow-hidden">
|
|
<div class=""></div>
|
|
</TabsContent>
|
|
<TabsContent value="features" class="outline-none flex gap-4 flex-col overflow-hidden">
|
|
<div class="flex flex-col w-full gap-2 justify-end items-end relative">
|
|
<Button icon @click="createFeature"><Icon icon="radix-icons:plus" class="w-6 h-6" /></Button>
|
|
</div>
|
|
<div class="flex flex-col gap-2 overflow-x-hidden pe-2">
|
|
<div class="flex flex-row gap-2 w-full border-b border-light-35 dark:border-dark-35 pb-2" v-for="feature of config.features">
|
|
<div class="w-full flex flex-row px-4 gap-8 items-center">
|
|
<span class="font-mono">{{ feature.id }}</span>
|
|
<span class="truncate">{{ feature.description }}</span>
|
|
</div>
|
|
<div class="flex flex-row gap-2 items-center">
|
|
<Button icon @click="editFeature(feature.id)"><Icon icon="radix-icons:pencil-1" /></Button>
|
|
<Button icon @click="deleteFeature(feature.id)"><Icon icon="radix-icons:trash" /></Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</TabsContent>
|
|
</div>
|
|
</div>
|
|
</TabsRoot> -->
|
|
</template> |