Completion of APIs except for user progress

pages/account/profile.vue

@@ -2,13 +2,13 @@
   <div class="flex justify-between flex-col text-[#383E43]">
     <div class="relative">
       <img
-      v-if="authUser.avatarMedia"
-        :src="authUser?.avatarMedia"
+        v-if="profileImage"
+        :src="profileImage"
         class="w-[40.256vw] md:w-[8.177vw] h-[40.256vw] md:h-[8.177vw] rounded-[50%]"
         alt="profile"
       />
       <img
-      v-else
+        v-else
         src="/public/images/alt.png"
         class="w-[40.256vw] md:w-[8.177vw] h-[40.256vw] md:h-[8.177vw] rounded-[50%]"
         alt="profile"
@@ -79,7 +79,7 @@
           />
         </svg>
       </label>
-      <input type="file" id="file-upload" @change="changePhoto"/>
+      <input type="file" id="file-upload" @change="changePhoto" />
     </div>
     <FormKit
       type="form"
@@ -97,7 +97,7 @@
           <input
             type="text"
             name="name"
-            :value="authUser?.phone"
+            :value="data?.phone"
             readonly
             class="bg-[#F5F5F5] h-[13.59vw] md:h-[2.969vw] w-full md:w-[19.01vw] rounded-[2.564vw] md:rounded-[0.521vw] px-[1vw]"
           />
@@ -108,7 +108,7 @@
           >
           <FormKit
             name="name"
-            :value="authUser?.name"
+            :value="data?.name"
             type="text"
             input-class="bg-[#F5F5F5] h-[13.59vw] md:h-[2.969vw] w-full md:w-[19.01vw] rounded-[2.564vw] md:rounded-[0.521vw] px-[1vw]"
           />
@@ -119,7 +119,7 @@
           >
           <FormKit
             name="userName"
-            :value="authUser?.userName"
+            :value="data?.userName"
             type="text"
             input-class="bg-[#F5F5F5] h-[13.59vw] md:h-[2.969vw] w-full md:w-[19.01vw] rounded-[2.564vw] md:rounded-[0.521vw] px-[1vw]"
           />
@@ -130,7 +130,7 @@
           >
           <FormKit
             name="email"
-            :value="authUser?.email"
+            :value="data?.email"
             type="text"
             input-class="bg-[#F5F5F5] h-[13.59vw] md:h-[2.969vw] w-full md:w-[19.01vw] rounded-[2.564vw] md:rounded-[0.521vw] px-[1vw]"
           />
@@ -147,51 +147,67 @@
       </div>
     </FormKit>
   </div>
+  
+
 </template>
 
 
 <script setup>
+const profileName = useState('profileName')
+const profileImage = useState('profileImage')
 import { useToast } from "vue-toastification";
 const toast = useToast();
 const { authUser } = useAuth();
 const loading = ref(false);
-const name = ref("avater");
+const {data, refresh} = await useFetch('/api/auth/me')
+
 const edit = async (formData) => {
+
+  if (formData.name !== authUser.value.name) {
+    profileName.value = formData.name
+  }
+
   try {
     loading.value = true;
     await $fetch("/api/user/update", {
       method: "PUT",
       body: formData,
     });
-    location.reload();
+    toast.success('اطلاعات با موفقیت ویرایش شد')
+    refresh()
+  //  location.reload();
   } catch (error) {
     toast.error(error);
   } finally {
     loading.value = false;
   }
 };
+//const token = getCookie(event, 'token');
 async function changePhoto(val) {
- 
   const formData = new FormData();
-  formData.append('file', val.target.files[0]);
-  formData.append('directoryName', name.value);
- 
-  try {
-   const dataa = await $fetch("/api/uploader", {
-      method: "POST",
-      body: formData
-    });
-    console.log('dataa',dataa);
-  } catch (error) {
-    console.log('error client', error.data.data.message);
-  }
-  //        console.log('ss', formData);
+  formData.append("directoryName", "test");
+  formData.append("file", val.target.files[0]);
 
-//  const data = await useFetch("api/uploader", {
-//     method: 'POST',
-//     body: formData
-//   });
+  const data = await useFetch("/api/uploader", {
+    method: "POST",
+    body: formData,
+  });
+
+  if (data.data.value.url) {
+    console.log('done');
+    await $fetch("/api/user/update", {
+        method: "PUT",
+        body: {
+          avatarMedia: data.data.value.url
+        },
+      });
+      profileImage.value = data.data.value.url
+      toast.success('تصویر پروفایل تغییر کرد')
+ 
+  }
 }
+
+
 </script>
 
 <style scoped>