import { appApi } from 'src/boot/axios'; import { ref, computed } from 'vue'; import type { Member, Members } from 'src/vueLib/models/member'; import { useNotify } from 'src/vueLib/general/useNotify'; import { i18n } from 'boot/lang'; import { useResponsibleTable } from '../responsible/ResponsibleTable'; export const databaseName = ref('members.dba'); export function useMemberTable() { const members = ref([]); const { responsibles, updateResponsibles } = useResponsibleTable(); const pagination = ref({ sortBy: 'firstName', descending: false, page: 1, rowsPerPage: 20, }); //add enabling of each columns const enabledColumns = ref>({ cake: true, firstName: true, lastName: true, birthday: true, age: true, address: false, town: true, zip: true, phone: true, email: true, group: true, responsiblePerson: true, firstVisit: true, lastVisit: true, option: true, }); const columns = computed(() => [ { name: 'cake', align: 'center' as const, label: '', field: 'cake', icon: 'cake' }, { name: 'firstName', align: 'left' as const, label: i18n.global.t('prename'), field: 'firstName', sortable: true, }, { name: 'lastName', align: 'left' as const, label: i18n.global.t('lastName'), field: 'lastName', sortable: true, }, { name: 'birthday', align: 'left' as const, label: i18n.global.t('birthday'), field: 'birthday', sortable: true, }, { name: 'age', align: 'left' as const, label: i18n.global.t('age'), field: 'age', sortable: true, }, { name: 'address', align: 'left' as const, label: i18n.global.t('address'), field: 'address', sortable: true, }, { name: 'town', align: 'left' as const, label: i18n.global.t('town'), field: 'town', sortable: true, }, { name: 'zip', align: 'left' as const, label: i18n.global.t('zipCode'), field: 'zip', sortable: true, }, { name: 'phone', align: 'left' as const, label: i18n.global.t('phone'), field: 'phone', sortable: true, }, { name: 'email', align: 'left' as const, label: i18n.global.t('email'), field: 'email', sortable: true, }, { name: 'group', align: 'left' as const, label: i18n.global.t('group'), field: 'group', sortable: true, }, { name: 'responsiblePerson', align: 'left' as const, label: i18n.global.t('responsible'), field: 'responsiblePerson', sortable: true, }, { name: 'firstVisit', align: 'left' as const, label: i18n.global.t('firstVisit'), field: 'firstVisit', sortable: true, }, { name: 'lastVisit', align: 'left' as const, label: i18n.global.t('lastVisit'), field: 'lastVisit', sortable: true, }, { name: 'option', align: 'center' as const, label: '', field: 'option', icon: 'option' }, ].filter((c) => enabledColumns.value[c.name]), ); const { NotifyResponse } = useNotify(); const loading = ref(false); function calculateAge(birthDateString: string) { if (birthDateString === undefined) return 0; const [day, month, year] = birthDateString.split('.').map(Number); // for format "1.2.2000" if (year === undefined || month === undefined || day === undefined) return 0; const birthDate = new Date(year, month - 1, day); // month is 0-based const today = new Date(); let age = today.getFullYear() - birthDate.getFullYear(); // Check if birthday has occurred yet this year const hasBirthdayPassed = today.getMonth() > birthDate.getMonth() || (today.getMonth() === birthDate.getMonth() && today.getDate() >= birthDate.getDate()); if (!hasBirthdayPassed) { age--; } return age; } //isThreeDaysBeforeAnnualDate check if upcoming date is less than 3 days from now function isXDaysBeforeAnnualDate(dateString: string, before: number) { if (dateString === undefined) return; const [day, month] = dateString.split('.').map(Number); const today = new Date(); today.setHours(0, 0, 0); const annualDate = new Date(today.getFullYear(), month ? month - 1 : 0, day); annualDate.setHours(0, 0, 1); const xDaysBefore = new Date(annualDate); xDaysBefore.setDate(annualDate.getDate() - before); return today >= xDaysBefore && today <= annualDate; } function getRowClass(row: Member) { if (!row.birthday) return ''; if (isXDaysBeforeAnnualDate(row.birthday, 1)) { return 'bg-red-2 text-red-10'; } else if (isXDaysBeforeAnnualDate(row.birthday, 4)) { return 'bg-green-2 text-green-10'; } else if (isXDaysBeforeAnnualDate(row.birthday, 8)) { return 'bg-amber-2 text-amber-10'; } return ''; } //updates member list from database async function updateMembers() { loading.value = true; await updateResponsibles().catch((err) => NotifyResponse(err, 'error')); appApi .get('members') .then((resp) => { if (resp.data === null) { members.value = []; return; } members.value = resp.data as Members; if (members.value === null) { members.value = []; return; } members.value.forEach((member) => { if (!responsibles.value.some((r) => r.id === member.responsiblePerson?.id)) { delete member.responsiblePerson; } if (member.birthday !== undefined) { member.age = String(calculateAge(member.birthday)); } }); }) .catch((err) => { NotifyResponse(err, 'error'); }) .finally(() => { loading.value = false; }); } function disableColumns(...columns: string[]) { columns.forEach((col) => { if (col in enabledColumns.value) { enabledColumns.value[col] = false; } }); } return { members, responsibles, pagination, columns, loading, getRowClass, updateMembers, isXDaysBeforeAnnualDate, disableColumns, }; }