update

components/product-page/course-details/Course-information.vue

@@ -1,5 +1,5 @@
 <template>
-    <div
+  <div
     class="mt-[5vw] md:mt-[1vw] rounded-[0.781vw] bg-[#F8F8F8] pinkShadow p-[4vw] md:p-[1.3vw] space-y-[6vw] md:space-y-[0.4vw] thin"
   >
     <h2
@@ -40,9 +40,7 @@
     <div
       class="flexBox w-full flex-col text-[3.59vw] md:text-[0.938vw] text-[#878787]"
     >
-      <div
-        class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between"
-      >
+      <div class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between">
         <p class="flex items-center gap-[0.8vw]">
           <svg
             class="h-[4.872vw] md:h-[1.25vw] w-[4.872vw] md:w-[1.25vw]"
@@ -74,11 +72,11 @@
           </svg>
           تعداد ویدیو ها
         </p>
-        <p class="text-[#383E43] font-semibold">{{props.props.countOfVideos}}</p>
+        <p class="text-[#383E43] font-semibold">
+          {{ props.props[0].countOfVideos }}
+        </p>
       </div>
-      <div
-        class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between"
-      >
+      <div class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between">
         <p class="flex items-center gap-[0.8vw]">
           <svg
             class="h-[4.872vw] md:h-[1.25vw] w-[4.872vw] md:w-[1.25vw]"
@@ -114,11 +112,11 @@
 
           حجم فایل ها
         </p>
-        <p class="text-[#383E43] font-semibold">{{props.props.totalFileSize}}</p>
+        <p class="text-[#383E43] font-semibold">
+          {{ props.props[0].totalFileSize }}
+        </p>
       </div>
-      <div
-        class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between"
-      >
+      <div class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between">
         <p class="flex items-center gap-[0.8vw]">
           <svg
             class="h-[4.872vw] md:h-[1.25vw] w-[4.872vw] md:w-[1.25vw]"
@@ -150,11 +148,9 @@
           </svg>
           سطح دوره
         </p>
-        <p class="text-[#383E43] font-semibold">{{props.props.level}}</p>
+        <p class="text-[#383E43] font-semibold">{{ props.props[0].level }}</p>
       </div>
-      <div
-        class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between"
-      >
+      <div class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between">
         <p class="flex items-center gap-[0.8vw]">
           <svg
             class="h-[4.872vw] md:h-[1.25vw] w-[4.872vw] md:w-[1.25vw]"
@@ -201,29 +197,31 @@
 
           زبان
         </p>
-        <p class="text-[#383E43] font-semibold">{{props.props.language}}</p>
+        <p class="text-[#383E43] font-semibold">{{ props.props[0].language }}</p>
       </div>
-      <div
-        class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between"
-      >
+      <div class="py-[3vw] md:py-[0.9vw] w-full border-b flex justify-between">
         <p class="flex items-center gap-[0.8vw] ps-[2vw]">سطح رضایت</p>
-        <p class="text-[#383E43] font-semibold">{{props.props.satisfactionLevel}}</p>
+        <p class="text-[#383E43] font-semibold">
+          {{ props.props[0].satisfactionLevel }}
+        </p>
       </div>
 
-      <h2 v-if="props.props.price > 0"
+      <h2
+        v-if="props.props[0].price > 0"
         class="my-[5vw] md:my-[1.25vw] text-[4.544vw] md:text-[1.502vw] text-[#383E43] font-semibold flex items-center justify-end w-full gap-[0.5vw]"
       >
-        {{numberFormat(props.props.price)}}
+        {{ numberFormat(props.props[0].price) }}
         <p class="text-[2.836vw] md:text-[0.741vw]">تومان</p>
       </h2>
-      <h2 v-else
+      <h2
+        v-else
         class="my-[5vw] md:my-[1.25vw] text-[4.544vw] md:text-[1.502vw] text-[#383E43] font-semibold flex items-center justify-end w-full gap-[0.5vw]"
       >
-       رایگان
+        رایگان
       </h2>
       <button
         class="greenButton h-[11.795vw] md:h-auto w-full flexBox text-[4.038vw] md:text-[1.055vw] rounded-[2.564vw] md:rounded-[0.521vw]"
-        @click="paidStatus = true"
+        @click="paymentHandler(props.props[0]._id)"
       >
         <svg
           class="h-[5.641vw] md:h-[1.458vw] w-[5.641vw] md:w-[1.458vw]"
@@ -253,13 +251,36 @@
             stroke-linejoin="round"
           />
         </svg>
-        شرکت در دوره
+      {{ props.props[1] ? 'مشاهده دوره' : 'شرکت در دوره' }}
       </button>
     </div>
-  </div> 
+  </div>
 </template>
 
 
 <script setup>
-const props = defineProps(['props'])
+import { useToast } from "vue-toastification";
+const props = defineProps(["props"], ["access"]);
+const toast = useToast()
+const paymentHandler = (id) => {
+
+    const data = useFetch("/api/user/registerCourse", {
+      method: "POST",
+      body: {
+        courseId: id,
+        code: "",
+      },
+    });
+    
+    if (data.data.value?.status === 406 || data.data.value?.status === 500) {
+      toast.error(data.data.value.message
+
+      )
+    } else {
+toast.success('ثبت نام انجام شد')
+
+    }
+ 
+
+};
 </script>