feat: initialize Nuxt.js frontend application with Docker setup, global styling, and authentication pages.

frontend_management/pages/login.vue

@@ -140,6 +140,15 @@ onMounted(() => {
       navigateTo('/instructor');
     }
   }
+  
+  // Load remembered email
+  if (typeof window !== 'undefined') {
+    const savedEmail = localStorage.getItem('rememberedEmail');
+    if (savedEmail) {
+      email.value = savedEmail;
+      rememberMe.value = true;
+    }
+  }
 });
 
 // Login form
@@ -159,6 +168,13 @@ const handleLogin = async () => {
   try {
     const response = await authStore.login(email.value, password.value);
     
+    // Handle Remember Me
+    if (rememberMe.value) {
+      localStorage.setItem('rememberedEmail', email.value);
+    } else {
+      localStorage.removeItem('rememberedEmail');
+    }
+    
     $q.notify({
       type: 'positive',
       message: response.message || 'เข้าสู่ระบบสำเร็จ',

frontend_management/pages/register.vue

@@ -98,13 +98,13 @@
             <!-- Prefix & Name -->
             <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-4">
               <q-select
-                v-model="form.prefix"
+                v-model="selectedPrefix"
                 :options="prefixOptions"
                 label="คำนำหน้า *"
                 outlined
                 emit-value
                 map-options
-                :rules="[val => !!val.th || 'กรุณาเลือกคำนำหน้า']"
+                :rules="[val => !!val || 'กรุณาเลือกคำนำหน้า']"
                 hide-bottom-space
                 lazy-rules="ondemand"
               />
@@ -183,6 +183,7 @@ const router = useRouter();
 const loading = ref(false);
 const showPassword = ref(false);
 const confirmPassword = ref('');
+const selectedPrefix = ref<string | null>(null);
 
 // Form
 const form = ref<RegisterInstructorRequest>({
@@ -191,23 +192,41 @@ const form = ref<RegisterInstructorRequest>({
   password: '',
   first_name: '',
   last_name: '',
-  prefix: { en: '', th: '' },
+  prefix: { th: '', en: '' }, // We construct this on submit
   phone: ''
 });
 
 // Prefix options
+const prefixMap: Record<string, { th: string; en: string }> = {
+  'mr': { th: 'นาย', en: 'Mr.' },
+  'mrs': { th: 'นาง', en: 'Mrs.' },
+  'ms': { th: 'นางสาว', en: 'Ms.' },
+  'dr': { th: 'ดร.', en: 'Dr.' },
+  'asst_prof': { th: 'ผศ.', en: 'Asst.Prof.' },
+  'assoc_prof': { th: 'รศ.', en: 'Assoc.Prof.' },
+  'prof': { th: 'ศ.', en: 'Prof.' }
+};
+
 const prefixOptions = [
-  { label: 'นาย / Mr.', value: { th: 'นาย', en: 'Mr.' } },
-  { label: 'นาง / Mrs.', value: { th: 'นาง', en: 'Mrs.' } },
-  { label: 'นางสาว / Ms.', value: { th: 'นางสาว', en: 'Ms.' } },
-  { label: 'ดร. / Dr.', value: { th: 'ดร.', en: 'Dr.' } },
-  { label: 'ผศ. / Asst.Prof.', value: { th: 'ผศ.', en: 'Asst.Prof.' } },
-  { label: 'รศ. / Assoc.Prof.', value: { th: 'รศ.', en: 'Assoc.Prof.' } },
-  { label: 'ศ. / Prof.', value: { th: 'ศ.', en: 'Prof.' } }
+  { label: 'นาย / Mr.', value: 'mr' },
+  { label: 'นาง / Mrs.', value: 'mrs' },
+  { label: 'นางสาว / Ms.', value: 'ms' },
+  { label: 'ดร. / Dr.', value: 'dr' },
+  { label: 'ผศ. / Asst.Prof.', value: 'asst_prof' },
+  { label: 'รศ. / Assoc.Prof.', value: 'assoc_prof' },
+  { label: 'ศ. / Prof.', value: 'prof' }
 ];
 
 // Methods
 const handleRegister = async () => {
+  if (!selectedPrefix.value) {
+     $q.notify({ type: 'warning', message: 'กรุณาเลือกคำนำหน้า', position: 'top' });
+     return;
+  }
+  
+  // Map selected prefix string back to object
+  form.value.prefix = prefixMap[selectedPrefix.value];
+
   loading.value = true;
   try {
     await authService.registerInstructor(form.value);