Removed useless component
This commit is contained in:
@@ -1,49 +0,0 @@
|
||||
<script lang="ts" setup>
|
||||
import type { LeimDate } from '@/models/Date'
|
||||
import { useCalendar } from '@/stores/calendar'
|
||||
import type { CalendarEvent } from '@/stores/events'
|
||||
|
||||
defineProps<{
|
||||
events: CalendarEvent[]
|
||||
}>()
|
||||
|
||||
const emit = defineEmits(['jumpedToDate'])
|
||||
|
||||
const { jumpToDate } = useCalendar()
|
||||
|
||||
function handleJumpToDate(date: LeimDate) {
|
||||
jumpToDate(date)
|
||||
emit('jumpedToDate')
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<ul class="grid gap-3">
|
||||
<li v-for="e in events" :key="e.title">
|
||||
<button
|
||||
class="block w-full text-left p-2 rounded-sm"
|
||||
:class="{
|
||||
'bg-slate-600 hover:bg-slate-700': !e.category,
|
||||
'bg-green-700 hover:bg-green-800': e.category === 'birth',
|
||||
'bg-stone-600 hover:bg-stone-800': e.category === 'death',
|
||||
'bg-red-600 hover:bg-red-800': e.category === 'catastrophe',
|
||||
'bg-pink-600 hover:bg-pink-800': e.category === 'natural-disaster',
|
||||
'bg-blue-600 hover:bg-blue-800': e.category === 'legal',
|
||||
'bg-amber-700 hover:bg-amber-800': e.category === 'player'
|
||||
}"
|
||||
@click="handleJumpToDate(e.date)"
|
||||
>
|
||||
<div>
|
||||
{{ e.title }}
|
||||
</div>
|
||||
|
||||
<div v-if="e.description" class="text-sm">
|
||||
<hr class="my-2 border-white opacity-25" />
|
||||
<span class="opacity-75">
|
||||
{{ e.description }}
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
@@ -5,7 +5,7 @@ import { Dialog, DialogContent, DialogTrigger } from '@/components/ui/dialog'
|
||||
import { Input } from '@/components/ui/input'
|
||||
import { PhMagnifyingGlass } from '@phosphor-icons/vue'
|
||||
import { useCalendarEvents } from '@/stores/events'
|
||||
import CalendarEventList from './CalendarEventList.vue'
|
||||
import CalendarMenuSearchResults from './CalendarMenuSearchResults.vue'
|
||||
import { useMagicKeys, whenever } from '@vueuse/core'
|
||||
|
||||
const { allEvents } = useCalendarEvents()
|
||||
@@ -73,6 +73,7 @@ whenever(keys.control_period, () => {
|
||||
placeholder="Rechercher un évènement, un personnage…"
|
||||
class="pl-10 py-6 text-lg"
|
||||
v-model:model-value="searchQuery"
|
||||
autocomplete="off"
|
||||
/>
|
||||
<span class="absolute start-1 inset-y-0 flex items-center justify-center px-2 opacity-50">
|
||||
<PhMagnifyingGlass size="20" />
|
||||
@@ -81,7 +82,7 @@ whenever(keys.control_period, () => {
|
||||
|
||||
<div v-if="displaySearch && searchResults.length > 0" class="overflow-y-auto">
|
||||
<hr class="mb-4" />
|
||||
<CalendarEventList :events="searchResults" @jumped-to-date="closeDialog()" />
|
||||
<CalendarMenuSearchResults :events="searchResults" @jumped-to-date="closeDialog()" />
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
@@ -1,9 +1,49 @@
|
||||
<script lang="ts" setup></script>
|
||||
<script lang="ts" setup>
|
||||
import type { LeimDate } from '@/models/Date'
|
||||
import { useCalendar } from '@/stores/calendar'
|
||||
import type { CalendarEvent } from '@/stores/events'
|
||||
|
||||
defineProps<{
|
||||
events: CalendarEvent[]
|
||||
}>()
|
||||
|
||||
const emit = defineEmits(['jumpedToDate'])
|
||||
|
||||
const { jumpToDate } = useCalendar()
|
||||
|
||||
function handleJumpToDate(date: LeimDate) {
|
||||
jumpToDate(date)
|
||||
emit('jumpedToDate')
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<ul>
|
||||
<li>
|
||||
<button>Yes</button>
|
||||
<ul class="grid gap-3">
|
||||
<li v-for="e in events" :key="e.title">
|
||||
<button
|
||||
class="block w-full text-left p-2 rounded-sm"
|
||||
:class="{
|
||||
'bg-slate-600 hover:bg-slate-700': !e.category,
|
||||
'bg-green-700 hover:bg-green-800': e.category === 'birth',
|
||||
'bg-stone-600 hover:bg-stone-800': e.category === 'death',
|
||||
'bg-red-600 hover:bg-red-800': e.category === 'catastrophe',
|
||||
'bg-pink-600 hover:bg-pink-800': e.category === 'natural-disaster',
|
||||
'bg-blue-600 hover:bg-blue-800': e.category === 'legal',
|
||||
'bg-amber-700 hover:bg-amber-800': e.category === 'player'
|
||||
}"
|
||||
@click="handleJumpToDate(e.date)"
|
||||
>
|
||||
<div>
|
||||
{{ e.title }}
|
||||
</div>
|
||||
|
||||
<div v-if="e.description" class="text-sm">
|
||||
<hr class="my-2 border-white opacity-25" />
|
||||
<span class="opacity-75">
|
||||
{{ e.description }}
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user