Joururi/leim-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changed quote styles

Browse Source
This commit is contained in:
Alexis
2024-08-25 14:14:40 +02:00
parent 07e97873ef
commit 5a47cb3563
180 changed files with 949 additions and 948 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
components/calendar/Calendar.vue
View File

@@ -1,15 +1,15 @@
<script lang="ts" setup>
import { useCalendar } from '@/stores/CalendarStore'
import { computed, type Component, type ComputedRef } from 'vue'
import { useCalendar } from "@/stores/CalendarStore"
import { computed, type Component, type ComputedRef } from "vue"
// import { PhMagnifyingGlass } from '@phosphor-icons/vue'
import MonthlyLayout from './state/monthly/Layout.vue'
import CenturyLayout from './state/centennially/Layout.vue'
import DecadeLayout from './state/decennially/Layout.vue'
import YearLayout from './state/yearly/Layout.vue'
import MonthlyLayout from "./state/monthly/Layout.vue"
import CenturyLayout from "./state/centennially/Layout.vue"
import DecadeLayout from "./state/decennially/Layout.vue"
import YearLayout from "./state/yearly/Layout.vue"
import type { Calendar } from '~/models/CalendarConfig'
import type { Category } from '~/models/Category'
import type { Calendar } from "~/models/CalendarConfig"
import type { Category } from "~/models/Category"
const props = defineProps<{
calendarData: Calendar,
@@ -25,16 +25,16 @@ const { currentConfig, jumpToDate, selectedDate } = useCalendar()
const currentViewComponent: ComputedRef<Component> = computed<Component>(() => {
switch (currentConfig.viewType) {
case 'month':
case "month":
return MonthlyLayout
case 'year':
case "year":
return YearLayout
case 'decade':
case "decade":
return DecadeLayout
case 'century':
case "century":
default:
return CenturyLayout
}

6
components/calendar/CalendarCurrentDate.vue
View File

@@ -1,8 +1,8 @@
<script lang="ts" setup>
import { storeToRefs } from 'pinia'
import { computed } from 'vue'
import { storeToRefs } from "pinia"
import { computed } from "vue"
import { PhMapPin } from '@phosphor-icons/vue'
import { PhMapPin } from "@phosphor-icons/vue"
const { defaultDate, getFormattedDateTitle, getRelativeString } = useCalendar()
const { selectedDate } = storeToRefs(useCalendar())

10
components/calendar/CalendarEvent.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils'
import type { RPGDate } from '@/models/Date'
import type { CalendarEvent } from '~/models/CalendarEvent'
import { cn } from "@/lib/utils"
import type { RPGDate } from "@/models/Date"
import type { CalendarEvent } from "~/models/CalendarEvent"
const props = defineProps<{
event: CalendarEvent
@@ -39,12 +39,12 @@ function handleClosePopover() {
onMounted(() => {
// Listen for keydown events
window.addEventListener('keydown', (e: KeyboardEvent) => {
window.addEventListener("keydown", (e: KeyboardEvent) => {
// If the popover isn't opened, this is not the event we're trying to delete, so return
if (!isPopoverDetailsOpen.value) return
// If the key isn't the delete one, return
if (e.key !== 'Delete') return
if (e.key !== "Delete") return
handleDelete()
})

16
components/calendar/CalendarEventDetails.vue
View File

@@ -1,8 +1,8 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils'
import type { RPGDate } from '@/models/Date'
import type { CalendarEvent } from '@/models/CalendarEvent'
import { useCalendar } from '@/stores/CalendarStore'
import { cn } from "@/lib/utils"
import type { RPGDate } from "@/models/Date"
import type { CalendarEvent } from "@/models/CalendarEvent"
import { useCalendar } from "@/stores/CalendarStore"
import {
PhHourglassMedium,
@@ -12,7 +12,7 @@ import {
PhMapPinArea,
PhDotsThreeOutlineVertical,
PhEye
} from '@phosphor-icons/vue'
} from "@phosphor-icons/vue"
const { defaultDate, getFormattedDateTitle, jumpToDate, getRelativeString, revealEditEventModal, revealDeleteEventModal } = useCalendar()
const { lastActiveEvent } = storeToRefs(useCalendar())
@@ -27,16 +27,16 @@ const props = defineProps<{
// Ref for the popover
const eventDetails = ref<HTMLElement>()
const emit = defineEmits(['query:close-popover'])
const emit = defineEmits(["query:close-popover"])
const dateDifference: string = getRelativeString(defaultDate, props.event.startDate)
const dateDuration: string | null = props.event.endDate
? getRelativeString(props.event.startDate, props.event.endDate, 'compact')
? getRelativeString(props.event.startDate, props.event.endDate, "compact")
: null
function handleJumpToDate(date: RPGDate) {
jumpToDate(date)
emit('query:close-popover')
emit("query:close-popover")
}
/**

4
components/calendar/CalendarMenu.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { useCalendar } from '@/stores/CalendarStore'
import { useCalendar } from "@/stores/CalendarStore"
import { PhMagnifyingGlass } from '@phosphor-icons/vue'
import { PhMagnifyingGlass } from "@phosphor-icons/vue"
const { revealAdvancedSearch } = useCalendar()
</script>

78
components/calendar/CalendarMenuNav.vue
View File

@@ -1,13 +1,13 @@
<script lang="ts" setup>
import { computed, type ComputedRef } from 'vue'
import { useCalendar } from '@/stores/CalendarStore'
import { computed, type ComputedRef } from "vue"
import { useCalendar } from "@/stores/CalendarStore"
import {
PhCaretDoubleLeft,
PhCaretDoubleRight,
PhCaretLeft,
PhCaretRight
} from '@phosphor-icons/vue'
} from "@phosphor-icons/vue"
interface DirectionLabels {
pastFar: string
@@ -21,56 +21,56 @@ const { currentConfig, decrementViewMonth, incrementViewMonth, decrementViewYear
const activeDirectionLabels: ComputedRef<DirectionLabels> = computed(() => {
switch (currentConfig.viewType) {
case 'month':
case "month":
return {
pastFar: 'Année précédente',
pastNear: 'Mois précédent',
futureNear: 'Mois suivant',
futureFar: 'Année suivante'
pastFar: "Année précédente",
pastNear: "Mois précédent",
futureNear: "Mois suivant",
futureFar: "Année suivante"
}
case 'year':
case "year":
return {
pastFar: 'Décennie précédente',
pastNear: 'Année précédente',
futureNear: 'Année suivante',
futureFar: 'Décennie suivante'
pastFar: "Décennie précédente",
pastNear: "Année précédente",
futureNear: "Année suivante",
futureFar: "Décennie suivante"
}
case 'decade':
case "decade":
return {
pastFar: 'Siècle précédent',
pastNear: 'Décennie précédente',
futureNear: 'Décennie suivante',
futureFar: 'Siècle suivant'
pastFar: "Siècle précédent",
pastNear: "Décennie précédente",
futureNear: "Décennie suivante",
futureFar: "Siècle suivant"
}
case 'century':
case "century":
default:
return {
pastFar: 'Millénaire précédent',
pastNear: 'Siècle précédent',
futureNear: 'Siècle suivant',
futureFar: 'Millénaire suivant'
pastFar: "Millénaire précédent",
pastNear: "Siècle précédent",
futureNear: "Siècle suivant",
futureFar: "Millénaire suivant"
}
}
})
function toPastFar(): void {
switch (currentConfig.viewType) {
case 'month':
case "month":
decrementViewYear()
break
case 'year':
case "year":
decrementViewYear(10)
break
case 'decade':
case "decade":
decrementViewYear(100)
break
case 'century':
case "century":
default:
decrementViewYear(1000)
break
@@ -79,19 +79,19 @@ function toPastFar(): void {
function toPastNear(): void {
switch (currentConfig.viewType) {
case 'month':
case "month":
decrementViewMonth()
break
case 'year':
case "year":
decrementViewYear()
break
case 'decade':
case "decade":
decrementViewYear(10)
break
case 'century':
case "century":
default:
decrementViewYear(100)
break
@@ -100,19 +100,19 @@ function toPastNear(): void {
function toFutureNear(): void {
switch (currentConfig.viewType) {
case 'month':
case "month":
incrementViewMonth()
break
case 'year':
case "year":
incrementViewYear()
break
case 'decade':
case "decade":
incrementViewYear(10)
break
case 'century':
case "century":
default:
incrementViewYear(100)
break
@@ -121,19 +121,19 @@ function toFutureNear(): void {
function toFutureFar(): void {
switch (currentConfig.viewType) {
case 'month':
case "month":
incrementViewYear()
break
case 'year':
case "year":
incrementViewYear(10)
break
case 'decade':
case "decade":
incrementViewYear(100)
break
case 'century':
case "century":
default:
incrementViewYear(1000)
break

18
components/calendar/CalendarMenuSubnav.vue
View File

@@ -1,22 +1,22 @@
<script lang="ts" setup>
import { type RPGDate } from '@/models/Date'
import { type RPGDate } from "@/models/Date"
import { PhArrowLineLeft, PhArrowLineRight } from '@phosphor-icons/vue'
import { PhArrowLineLeft, PhArrowLineRight } from "@phosphor-icons/vue"
const { currentDate, currentConfig, jumpToDate, getRelativeEventFromDate } = useCalendar()
function handleGotoPreviousEventPage(position: 'next' | 'prev' = 'next') {
function handleGotoPreviousEventPage(position: "next" | "prev" = "next") {
let fromDate: RPGDate
// To modify, obviously
const daysPerMonth = 32
const monthsPerYear = 10
const toDay = position === 'next' ? daysPerMonth : 1
const toMonth = position === 'next' ? monthsPerYear : 0
const toDay = position === "next" ? daysPerMonth : 1
const toMonth = position === "next" ? monthsPerYear : 0
switch (currentConfig.viewType) {
case 'month':
case "month":
fromDate = {
day: toDay,
month: currentDate.currentMonth,
@@ -24,7 +24,7 @@ function handleGotoPreviousEventPage(position: 'next' | 'prev' = 'next') {
}
break
case 'year':
case "year":
fromDate = {
day: toDay,
month: toMonth,
@@ -32,7 +32,7 @@ function handleGotoPreviousEventPage(position: 'next' | 'prev' = 'next') {
}
break
case 'decade':
case "decade":
fromDate = {
day: toDay,
month: currentDate.currentMonth,
@@ -40,7 +40,7 @@ function handleGotoPreviousEventPage(position: 'next' | 'prev' = 'next') {
}
break
case 'century':
case "century":
default:
fromDate = {
day: toDay,

4
components/calendar/CalendarMenuToday.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { storeToRefs } from 'pinia'
import { computed } from 'vue'
import { storeToRefs } from "pinia"
import { computed } from "vue"
const { defaultDate, areDatesIdentical, jumpToDefaultDate, getFormattedDateTitle } = useCalendar()
const { selectedDate } = storeToRefs(useCalendar())

6
components/calendar/CalendarSwitch.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import { useCalendar } from '@/stores/CalendarStore'
import { PhCalendarBlank } from '@phosphor-icons/vue'
import { computed } from 'vue'
import { useCalendar } from "@/stores/CalendarStore"
import { PhCalendarBlank } from "@phosphor-icons/vue"
import { computed } from "vue"
const { currentConfig, viewTypeOptions, getViewTypeTitle, setViewType } = useCalendar()

2
components/calendar/SearchMode.ts
View File

@@ -1,3 +1,3 @@
export const searchUnifier = new RegExp(/[^a-zA-Z0-9\-'']/g)
export type SearchMode = 'characters' | 'events' | undefined
export type SearchMode = "characters" | "events" | undefined

10
components/calendar/dialog/Create.vue
View File

@@ -1,22 +1,22 @@
<script lang="ts" setup>
import { PhX } from '@phosphor-icons/vue';
import type { World } from '~/models/World';
import { PhX } from "@phosphor-icons/vue";
import type { World } from "~/models/World";
defineProps<{
world: World,
modalState?: boolean
}>()
const calendarSkeletonName = ref<string>('')
const calendarSkeletonName = ref<string>("")
function onChangedName(newName: string) {
calendarSkeletonName.value = newName
}
const emit = defineEmits(['on-close'])
const emit = defineEmits(["on-close"])
function handleClose() {
emit('on-close')
emit("on-close")
}
</script>

10
components/calendar/dialog/Delete.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { PhCircleNotch } from '@phosphor-icons/vue';
import type { Calendar } from '~/models/CalendarConfig';
import { PhCircleNotch } from "@phosphor-icons/vue";
import type { Calendar } from "~/models/CalendarConfig";
const props = defineProps<{
modalState: boolean,
@@ -9,7 +9,7 @@ const props = defineProps<{
const isLoading = ref<boolean>(false)
const emit = defineEmits(['on-close'])
const emit = defineEmits(["on-close"])
async function handleAction(): Promise<void> {
if (isLoading.value) return
@@ -18,7 +18,7 @@ async function handleAction(): Promise<void> {
isLoading.value = true
try {
await $fetch(`/api/calendars/${props.calendar.id}`, { method: 'DELETE' })
await $fetch(`/api/calendars/${props.calendar.id}`, { method: "DELETE" })
// isDeleteEventModalOpen.value = false
} catch (err) {
@@ -37,7 +37,7 @@ async function handleAction(): Promise<void> {
*/
function handleClosing() {
if (!isLoading.value) {
emit('on-close')
emit("on-close")
}
}
</script>

22
components/calendar/form/Create.vue
View File

@@ -1,16 +1,16 @@
<script lang="ts" setup>
import type { Calendar } from '~/models/CalendarConfig';
import { PhAlarm, PhCalendarDots, PhCircleNotch, PhWrench } from '@phosphor-icons/vue';
import type { Calendar } from "~/models/CalendarConfig";
import { PhAlarm, PhCalendarDots, PhCircleNotch, PhWrench } from "@phosphor-icons/vue";
const defaultSkeleton: Calendar = { name: '', today: { day: 1, month: 0, year: 0 }, months: [], events: []}
const defaultSkeleton: Calendar = { name: "", today: { day: 1, month: 0, year: 0 }, months: [], events: []}
const calendarSkeleton = ref<Calendar>({ ...defaultSkeleton })
onMounted(() => {
calendarSkeleton.value = { ...defaultSkeleton }
})
type FormTabs = 'global' | 'months' | 'today'
const activeTab = ref<FormTabs>('global')
type FormTabs = "global" | "months" | "today"
const activeTab = ref<FormTabs>("global")
/**
* === Current date ===
@@ -40,9 +40,9 @@ const isCreatingCalendar = ref<boolean>(false)
async function handleSubmit() {
try {
isCreatingCalendar.value = true
await $fetch(`/api/calendars/create`, { method: 'POST', body: {...calendarSkeleton.value, worldId: 1 } })
await $fetch("/api/calendars/create", { method: "POST", body: {...calendarSkeleton.value, worldId: 1 } })
emit('on-close')
emit("on-close")
} catch (err) {
console.log(err)
} finally {
@@ -55,18 +55,18 @@ async function handleSubmit() {
*/
const emit = defineEmits<{
// eslint-disable-next-line no-unused-vars
(e: 'on-changed-name', calendarName: string): void
(e: "on-changed-name", calendarName: string): void
// eslint-disable-next-line no-unused-vars
(e: 'on-close'): void
(e: "on-close"): void
}>()
/** Hook to emit a debounced event for the changed skeleton name */
const handleNameChange = useDebounceFn(() => {
emit('on-changed-name', calendarSkeleton.value.name)
emit("on-changed-name", calendarSkeleton.value.name)
}, 400)
function handleFormCancel() {
emit('on-close')
emit("on-close")
}
</script>

4
components/calendar/form/CreateEvent.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import type { RPGDate } from '~/models/Date';
import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhTag } from '@phosphor-icons/vue'
import type { RPGDate } from "~/models/Date";
import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhTag } from "@phosphor-icons/vue"
const { eventSkeleton, operationInProgress } = storeToRefs(useCalendar())
const { resetSkeleton, submitSkeleton, cancelLatestRequest } = useCalendar()

2
components/calendar/form/DeleteEvent.vue
View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { PhCircleNotch } from '@phosphor-icons/vue';
import { PhCircleNotch } from "@phosphor-icons/vue";
const { resetSkeleton, deleteEventFromSkeleton, cancelLatestRequest } = useCalendar()
const { isDeleteEventModalOpen, eventSkeleton, lastActiveEvent } = storeToRefs(useCalendar())

4
components/calendar/form/UpdateEvent.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhPencilSimpleLine, PhTag } from '@phosphor-icons/vue'
import { VisuallyHidden } from 'radix-vue'
import { PhAlarm, PhCircleNotch, PhEye, PhEyeClosed, PhMapPinArea, PhPencilSimpleLine, PhTag } from "@phosphor-icons/vue"
import { VisuallyHidden } from "radix-vue"
const { resetSkeleton, updateEventFromSkeleton, cancelLatestRequest } = useCalendar()
const { eventSkeleton, lastActiveEvent, isEditEventModalOpen } = storeToRefs(useCalendar())

8
components/calendar/input/EventCategories.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { Category } from '~/models/Category';
import type { Category } from "~/models/Category";
import { PhCaretDown, PhCheck } from '@phosphor-icons/vue';
import { PhCaretDown, PhCheck } from "@phosphor-icons/vue";
const isPopoverOpen = ref<boolean>(false)
@@ -18,10 +18,10 @@ watch(modelBuffer.value, () => {
const { categories: availableCategories } = useCalendar()
const searchTerm = ref<string>('')
const searchTerm = ref<string>("")
const filteredCategories = computed(() =>
searchTerm.value === ''
searchTerm.value === ""
? availableCategories
: availableCategories.filter((category) => {
return category.name.toLowerCase().includes(searchTerm.value.toLowerCase())

8
components/calendar/input/EventCategory.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { PhCaretDown } from '@phosphor-icons/vue';
import type { Category } from '~/models/Category';
import { PhCaretDown } from "@phosphor-icons/vue";
import type { Category } from "~/models/Category";
const isPopoverOpen = ref<boolean>(false)
@@ -12,14 +12,14 @@ const model = defineModel<Category>()
const { categories: availableCategories } = useCalendar()
const searchTerm = ref<string>('')
const searchTerm = ref<string>("")
function handleCatSelect() {
isPopoverOpen.value = false
}
const filteredCategories = computed(() =>
searchTerm.value === ''
searchTerm.value === ""
? availableCategories
: availableCategories.filter((category) => {
return category.name.toLowerCase().includes(searchTerm.value.toLowerCase())

14
components/calendar/input/MonthList.vue
View File

@@ -1,10 +1,10 @@
<script lang="ts" setup>
import { cn } from '~/lib/utils';
import { cn } from "~/lib/utils";
import { useSortable } from '@vueuse/integrations/useSortable';
import type { CalendarMonth } from '~/models/CalendarMonth';
import { useSortable } from "@vueuse/integrations/useSortable";
import type { CalendarMonth } from "~/models/CalendarMonth";
import { PhList, PhPlus, PhTrash } from '@phosphor-icons/vue';
import { PhList, PhPlus, PhTrash } from "@phosphor-icons/vue";
const model = defineModel<CalendarMonth[]>({ required: true })
@@ -14,7 +14,7 @@ const model = defineModel<CalendarMonth[]>({ required: true })
const monthName: Ref<string | undefined> = ref<string>()
const monthNameRef = ref<HTMLInputElement>()
const { focused: monthNameFocused } = useFocus(monthNameRef)
const validMonthNameDatatypes = ['string']
const validMonthNameDatatypes = ["string"]
const monthNameIsTaken = computed(() => model.value.find(m => m.name === monthName.value))
const validMonthName = computed(() => validMonthNameDatatypes.includes(typeof monthName.value) && !monthNameIsTaken.value)
@@ -23,7 +23,7 @@ const validMonthName = computed(() => validMonthNameDatatypes.includes(typeof mo
*/
const monthDays: Ref<number | undefined> = ref<number>()
const monthDaysRef = ref<HTMLInputElement>()
const validMonthDaysDatatypes = ['number']
const validMonthDaysDatatypes = ["number"]
const validMonthDays = computed(() => validMonthDaysDatatypes.includes(typeof monthDays.value) && monthDays.value && monthDays.value >= 12)
const validNewMonth = computed(() => validMonthDays.value && validMonthName.value)
@@ -44,7 +44,7 @@ function addMonthToModel(): void {
model.value.push(monthToInsert)
// Reset form state
monthName.value = ''
monthName.value = ""
monthNameFocused.value = true
}

8
components/calendar/input/RPGDate.vue
View File

@@ -1,9 +1,9 @@
<script lang="ts" setup>
import type { RPGDate } from '~/models/Date';
import type { RPGDate } from "~/models/Date";
import {
PhXCircle
} from '@phosphor-icons/vue'
} from "@phosphor-icons/vue"
const model = defineModel<RPGDate | null>()
@@ -27,7 +27,7 @@ const inputPlaceholder = computed<string>(() => {
return props.placeholder
}
return ''
return ""
})
const initialDateValue = props.initialDate ? { ...props.initialDate } : null
@@ -37,7 +37,7 @@ const monthTitle = computed<string>(() => {
return getMonthName(model.value.month)
}
return ''
return ""
})
const hasValue = computed<boolean>(() => !!model.value)

6
components/calendar/input/TodaySelect.vue
View File

@@ -1,8 +1,8 @@
<script lang="ts" setup>
import type { CalendarMonth } from '~/models/CalendarMonth';
import type { RPGDate } from '~/models/Date';
import type { CalendarMonth } from "~/models/CalendarMonth";
import type { RPGDate } from "~/models/Date";
import { PhCalendarBlank } from '@phosphor-icons/vue';
import { PhCalendarBlank } from "@phosphor-icons/vue";
const model = defineModel<RPGDate>({ required: true })

54
components/calendar/search/CalendarSearch.vue
View File

@@ -2,46 +2,46 @@
import {
isCharacter,
type Character,
} from '@/models/Characters'
import type { RPGDateOrder } from '@/models/Date'
} from "@/models/Characters"
import type { RPGDateOrder } from "@/models/Date"
import {
isCalendarEvent,
type CalendarEvent,
} from '~/models/CalendarEvent'
import { capitalize } from '@/utils/Strings'
import { useMagicKeys, useScroll, useStorage, whenever } from '@vueuse/core'
import { computed, ref, watch } from 'vue'
import { searchUnifier, type SearchMode } from '../SearchMode'
} from "~/models/CalendarEvent"
import { capitalize } from "@/utils/Strings"
import { useMagicKeys, useScroll, useStorage, whenever } from "@vueuse/core"
import { computed, ref, watch } from "vue"
import { searchUnifier, type SearchMode } from "../SearchMode"
import { PhClockClockwise, PhClockCounterClockwise, PhMagnifyingGlass } from '@phosphor-icons/vue'
import { PhClockClockwise, PhClockCounterClockwise, PhMagnifyingGlass } from "@phosphor-icons/vue"
import {
ComboboxAnchor,
ComboboxInput,
ComboboxPortal,
ComboboxRoot,
VisuallyHidden
} from 'radix-vue'
} from "radix-vue"
import SearchList from './lists/SearchList.vue'
import type { Category } from '~/models/Category'
import SearchList from "./lists/SearchList.vue"
import type { Category } from "~/models/Category"
const { isAdvancedSearchOpen, allEvents } = storeToRefs(useCalendar())
const { characters } = storeToRefs(useCharacters())
const searchQuery = ref<string>('')
const searchQuery = ref<string>("")
// const searchEnough = computed<boolean>(() => searchQuery.value.length >= 2)
const selectedEntity = useStorage('se', 'events' as SearchMode)
const selectedEntity = useStorage("se", "events" as SearchMode)
// Order
const selectedOrder = ref<RPGDateOrder>('asc')
const selectedOrder = ref<RPGDateOrder>("asc")
function setOrderAsc() {
selectedOrder.value = 'asc'
selectedOrder.value = "asc"
resetPage()
}
function setOrderDesc() {
selectedOrder.value = 'desc'
selectedOrder.value = "desc"
resetPage()
}
@@ -65,9 +65,9 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
// Assign data to loop over and filter
// They are assigned this way for readability
if (selectedEntity.value === 'events') {
if (selectedEntity.value === "events") {
dataToFilter = allEvents.value
} else if (selectedEntity.value === 'characters') {
} else if (selectedEntity.value === "characters") {
dataToFilter = characters.value
} else {
dataToFilter = [...allEvents.value, ...characters.value]
@@ -80,15 +80,15 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
// Filter calendar events
if (isCalendarEvent(item)) {
const queryString = new String(searchQuery.value)
.replace(searchUnifier, '')
.replace(searchUnifier, "")
.toLocaleLowerCase()
const hitTitle = item.title
.replace(searchUnifier, '')
.replace(searchUnifier, "")
.toLocaleLowerCase()
.includes(queryString)
const hitDesc = item.description
?.replace(searchUnifier, '')
?.replace(searchUnifier, "")
.toLocaleLowerCase()
.includes(queryString)
@@ -118,11 +118,11 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
// Filter characters
if (isCharacter(item)) {
const queryString = new String(searchQuery.value)
.replace(searchUnifier, '')
.replace(searchUnifier, "")
.toLocaleLowerCase()
const hitTitle = item.name
.replace(searchUnifier, '')
.replace(searchUnifier, "")
.toLocaleLowerCase()
.includes(queryString)
@@ -157,7 +157,7 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
* Removes the search query, resets the pagination and removes all selected categories
*/
function resetSearch() {
searchQuery.value = ''
searchQuery.value = ""
resetPage()
selectedCategories.value = []
}
@@ -205,7 +205,7 @@ const currentCategories = computed(() => {
const selectedCategories = ref<(Category)[]>([])
const categoryFilterOpened = ref<boolean>(false)
const searchCategory = ref<string>('')
const searchCategory = ref<string>("")
const filteredCategories = computed(() =>
currentCategories.value.filter((i) => !selectedCategories.value.includes(i))
@@ -217,8 +217,8 @@ const filteredCategories = computed(() =>
* @param e Radix Change Event
*/
function handleCategorySelect(e: (Category)) {
if (typeof e === 'string') {
searchCategory.value = ''
if (typeof e === "string") {
searchCategory.value = ""
selectedCategories.value.push(e)
}

14
components/calendar/search/lists/CharacterCallout.vue
View File

@@ -1,18 +1,18 @@
<script lang="ts" setup>
import type { Character } from '@/models/Characters'
import type { RPGDate } from '@/models/Date'
import { useCalendar } from '@/stores/CalendarStore'
import type { Character } from "@/models/Characters"
import type { RPGDate } from "@/models/Date"
import { useCalendar } from "@/stores/CalendarStore"
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'
import { Button } from '@/components/ui/button'
import { PhArrowSquareOut, PhPlant, PhSkull } from '@phosphor-icons/vue'
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
import { Button } from "@/components/ui/button"
import { PhArrowSquareOut, PhPlant, PhSkull } from "@phosphor-icons/vue"
const props = defineProps<{
character: Character
}>()
defineEmits<{
(e: 'query:date-jump', payload: RPGDate): void
(e: "query:date-jump", payload: RPGDate): void
}>()
const { getFormattedDateTitle } = useCalendar()

12
components/calendar/search/lists/EventCallout.vue
View File

@@ -1,23 +1,23 @@
<script lang="ts" setup>
import { cn } from '@/lib/utils'
import type { RPGDate } from '@/models/Date'
import type { CalendarEvent } from '@/models/CalendarEvent'
import { cn } from "@/lib/utils"
import type { RPGDate } from "@/models/Date"
import type { CalendarEvent } from "@/models/CalendarEvent"
import { PhArrowSquareOut, PhHourglassMedium, PhAlarm, PhMapPinArea, PhEye } from '@phosphor-icons/vue'
import { PhArrowSquareOut, PhHourglassMedium, PhAlarm, PhMapPinArea, PhEye } from "@phosphor-icons/vue"
const props = defineProps<{
event: CalendarEvent
}>()
defineEmits<{
(e: 'query:date-jump', payload: RPGDate): void
(e: "query:date-jump", payload: RPGDate): void
}>()
const { getRelativeString, defaultDate, getFormattedDateTitle } = useCalendar()
const dateDifference: string = getRelativeString(defaultDate, props.event.startDate)
const dateDuration: string | null = props.event.endDate
? getRelativeString(props.event.startDate, props.event.endDate, 'compact')
? getRelativeString(props.event.startDate, props.event.endDate, "compact")
: null
</script>

20
components/calendar/search/lists/SearchList.vue
View File

@@ -1,13 +1,13 @@
<script lang="ts" setup>
import { isCharacter, type Character } from '@/models/Characters'
import type { RPGDate, RPGDateOrder } from '@/models/Date'
import { useCalendar } from '@/stores/CalendarStore'
import { computed } from 'vue'
import { isCalendarEvent, type CalendarEvent } from '~/models/CalendarEvent'
import type { SearchMode } from '../../SearchMode'
import { isCharacter, type Character } from "@/models/Characters"
import type { RPGDate, RPGDateOrder } from "@/models/Date"
import { useCalendar } from "@/stores/CalendarStore"
import { computed } from "vue"
import { isCalendarEvent, type CalendarEvent } from "~/models/CalendarEvent"
import type { SearchMode } from "../../SearchMode"
import CharacterCallout from './CharacterCallout.vue'
import EventCallout from './EventCallout.vue'
import CharacterCallout from "./CharacterCallout.vue"
import EventCallout from "./EventCallout.vue"
const props = defineProps<{
results: (Character | CalendarEvent)[]
@@ -18,7 +18,7 @@ const props = defineProps<{
limit?: number
}>()
const emit = defineEmits(['jumpedToDate'])
const emit = defineEmits(["jumpedToDate"])
const { jumpToDate, compareDates } = useCalendar()
@@ -26,7 +26,7 @@ function handleJumpToDate(date?: RPGDate) {
if (!date) return
jumpToDate(date)
emit('jumpedToDate')
emit("jumpedToDate")
}
// Initial sorting of the results

12
components/calendar/state/monthly/DayTile.vue
View File

@@ -1,11 +1,11 @@
<script lang="ts" setup>
import type { RPGDate } from '@/models/Date'
import type { CalendarEvent } from '@/models/CalendarEvent'
import { useElementBounding } from '@vueuse/core'
import { storeToRefs } from 'pinia'
import { computed, ref, type ComputedRef } from 'vue'
import type { RPGDate } from "@/models/Date"
import type { CalendarEvent } from "@/models/CalendarEvent"
import { useElementBounding } from "@vueuse/core"
import { storeToRefs } from "pinia"
import { computed, ref, type ComputedRef } from "vue"
import CalendarEventButton from '../../CalendarEvent.vue'
import CalendarEventButton from "../../CalendarEvent.vue"
const props = defineProps<{
date: RPGDate

4
components/calendar/state/monthly/Layout.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { useCalendar } from '@/stores/CalendarStore'
import { useThrottleFn } from '@vueuse/core'
import { useCalendar } from "@/stores/CalendarStore"
import { useThrottleFn } from "@vueuse/core"
const { currentDate, decrementViewMonth, incrementViewMonth } = useCalendar()
const { currentMonthData } = storeToRefs(useCalendar())

6
components/calendar/state/yearly/DayTile.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { RPGDate } from '@/models/Date'
import { storeToRefs } from 'pinia'
import { computed, type ComputedRef } from 'vue'
import type { RPGDate } from "@/models/Date"
import { storeToRefs } from "pinia"
import { computed, type ComputedRef } from "vue"
const { currentDate, defaultDate, selectDate, areDatesIdentical } = useCalendar()
const { selectedDate, currentEvents } = storeToRefs(useCalendar())

4
components/calendar/state/yearly/Layout.vue
View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import { useCalendar } from '@/stores/CalendarStore'
import { useThrottleFn } from '@vueuse/core'
import { useCalendar } from "@/stores/CalendarStore"
import { useThrottleFn } from "@vueuse/core"
const { decrementViewYear, incrementViewYear } = useCalendar()
const { sortedMonths: months } = storeToRefs(useCalendar())

2
components/calendar/state/yearly/MonthTile.vue
View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import type { CalendarMonth } from '~/models/CalendarMonth';
import type { CalendarMonth } from "~/models/CalendarMonth";
defineProps<{
month: CalendarMonth