feat: add utils/date.ts and stores api/user/me
All checks were successful
Build and Deploy Frontend Management to Dev Server / Build Frontend Management Docker Image (push) Successful in 56s
Build and Deploy Frontend Management to Dev Server / Deploy E-learning Frontend Management to Dev Server (push) Successful in 4s
Build and Deploy Frontend Management to Dev Server / Notify Deployment Status (push) Successful in 1s

This commit is contained in:
Missez 2026-03-06 17:33:01 +07:00
parent ea442d7815
commit ae32cfebe4
17 changed files with 199 additions and 275 deletions

View file

@ -301,7 +301,7 @@
<script setup lang="ts">
import { useQuasar } from 'quasar';
import { userService, type UserProfileResponse } from '~/services/user.service';
import { userService } from '~/services/user.service';
import { authService } from '~/services/auth.service';
definePageMeta({
@ -368,20 +368,8 @@ const getRoleLabel = (role: string) => {
return labels[role] || role;
};
const formatDate = (date: string, includeTime = true) => {
const options: Intl.DateTimeFormatOptions = {
day: 'numeric',
month: 'short',
year: '2-digit'
};
if (includeTime) {
options.hour = '2-digit';
options.minute = '2-digit';
}
return new Date(date).toLocaleDateString('th-TH', options);
};
// Use formatting utilities from utils/date.ts
// Format functions are auto-imported
// Avatar upload
const avatarInputRef = ref<HTMLInputElement | null>(null);
@ -425,8 +413,8 @@ const handleAvatarUpload = async (event: Event) => {
try {
const response = await userService.uploadAvatar(file);
// Re-fetch profile to get presigned URL from backend
await fetchProfile();
// Force refresh profile cache and update local state
await fetchProfile(true);
$q.notify({
type: 'positive',
@ -457,8 +445,8 @@ const handleUpdateProfile = async () => {
phone: editForm.value.phone || null
});
// Refresh profile data from API
await fetchProfile();
// Force refresh profile cache and update local state
await fetchProfile(true);
$q.notify({
type: 'positive',
@ -546,25 +534,29 @@ watch(showEditModal, (newVal) => {
}
});
// Fetch profile from API
const fetchProfile = async () => {
// Helper to map fullProfile to local profile state
const mapProfileData = (data: typeof authStore.fullProfile) => {
if (!data) return;
profile.value = {
fullName: `${data.profile.first_name} ${data.profile.last_name}`,
email: data.email,
emailVerified: !!data.email_verified_at,
username: data.username,
phone: data.profile.phone || '',
role: data.role.code,
roleName: data.role.name.th,
avatar: '',
avatarUrl: data.profile.avatar_url,
createdAt: data.created_at
};
};
// Fetch profile uses auth store cache, force=true to refresh
const fetchProfile = async (force = false) => {
loading.value = true;
try {
const data = await userService.getProfile();
// Map API response to profile
profile.value = {
fullName: `${data.profile.first_name} ${data.profile.last_name}`,
email: data.email,
emailVerified: !!data.email_verified_at,
username: data.username,
phone: data.profile.phone || '',
role: data.role.code,
roleName: data.role.name.th,
avatar: '',
avatarUrl: data.profile.avatar_url,
createdAt: data.created_at
};
await authStore.fetchUserProfile(force);
mapProfileData(authStore.fullProfile);
} catch (error) {
$q.notify({
type: 'negative',
@ -576,7 +568,7 @@ const fetchProfile = async () => {
}
};
// Load profile on mount
// Load profile on mount (uses cache if available)
onMounted(() => {
fetchProfile();
});