- Nuxt 3 CSR (ssr:false), @nuxtjs/tailwindcss, dev proxy to backend - useAuth composable: CSRF cookie, XSRF token, login/logout/fetchUser - auth middleware: redirects to /login if no session - Login page, client list with search + create modal - Client detail with editable name, dynamic notes (JSON), history feed - History form with type select, inline edit/delete per entry - Print layout at /clients/:id/print (calls window.print on mount) - TypeScript interfaces: User, Client, HistoryEntry, PaginatedResponse - German UI labels throughout Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
48 lines
1.4 KiB
TypeScript
48 lines
1.4 KiB
TypeScript
import type { HistoryEntry } from '~/types'
|
|
|
|
export const useHistory = (clientId: number) => {
|
|
const entries = ref<HistoryEntry[]>([])
|
|
|
|
const getXsrfToken = (): string => {
|
|
const match = document.cookie.match(/XSRF-TOKEN=([^;]+)/)
|
|
return match ? decodeURIComponent(match[1]) : ''
|
|
}
|
|
|
|
const fetchEntries = async (): Promise<void> => {
|
|
const response = await $fetch<{ data: HistoryEntry[] }>(`/api/clients/${clientId}/history`, {
|
|
credentials: 'include',
|
|
})
|
|
entries.value = response.data
|
|
}
|
|
|
|
const addEntry = async (payload: { type: string; body: string }): Promise<void> => {
|
|
await $fetch(`/api/clients/${clientId}/history`, {
|
|
method: 'POST',
|
|
body: payload,
|
|
credentials: 'include',
|
|
headers: { 'X-XSRF-TOKEN': getXsrfToken() },
|
|
})
|
|
await fetchEntries()
|
|
}
|
|
|
|
const updateEntry = async (id: number, body: string): Promise<void> => {
|
|
await $fetch(`/api/history/${id}`, {
|
|
method: 'PUT',
|
|
body: { body },
|
|
credentials: 'include',
|
|
headers: { 'X-XSRF-TOKEN': getXsrfToken() },
|
|
})
|
|
await fetchEntries()
|
|
}
|
|
|
|
const deleteEntry = async (id: number): Promise<void> => {
|
|
await $fetch(`/api/history/${id}`, {
|
|
method: 'DELETE',
|
|
credentials: 'include',
|
|
headers: { 'X-XSRF-TOKEN': getXsrfToken() },
|
|
})
|
|
entries.value = entries.value.filter(e => e.id !== id)
|
|
}
|
|
|
|
return { entries, fetchEntries, addEntry, updateEntry, deleteEntry }
|
|
}
|