feat: add ProfileEditForm component for user profile editing, including avatar management, personal details, and email verification.

Frontend-Learner/components/profile/ProfileEditForm.vue

@@ -182,8 +182,10 @@ const handleFileUpload = (event: Event) => {
             <div>
                 <label class="text-xs font-bold text-slate-500 dark:text-slate-400 ml-1 uppercase">{{ $t('profile.phone') }}</label>
                 <q-input
-                v-model="modelValue.phone"
+                :model-value="modelValue.phone"
+                @update:model-value="(val) => modelValue.phone = String(val || '').replace(/\D/g, '').slice(0, 10)"
                 outlined dense rounded
+                maxlength="10"
                 class="premium-q-input"
                 :rules="phoneRules"
                 hide-bottom-space