complete progress section

components/ProgressCard.vue

@@ -17,11 +17,11 @@
         <div
           class="w-full flex flex-col justify-center space-y-[1.042vw] md:space-y-[1.25vw]"
         >
-          <nuxt-link :to="`${props.item?.id}`"
-            class="mb-[15vw] md:mb-[2.5vw] text-[14px] md:text-[0.833vw] text-[#383E43] ] mt-[4vw] md:mt-[1.042vw] ms-[3vw] md:ms-[0.625vw]"
+        <p @click="change"
+            class="cursor-pointer mb-[15vw] md:mb-[2.5vw] text-[14px] md:text-[0.833vw] text-[#383E43] ] mt-[4vw] md:mt-[1.042vw] ms-[3vw] md:ms-[0.625vw]"
           >
         {{ props.item?.name }}
-      </nuxt-link>
+     </p>
 
           <div
             class="flex flex-col justify-between items-center py-[3vw] md:py-[0.7vw] mx-[3vw] md:mx-[0.833vw] border-t"
@@ -43,8 +43,14 @@
       </div>
 </template>
 <script setup>
-const props = defineProps(['item']);
 
+const props = defineProps(['item']);
+const router = useRouter()
+const route = useRoute()
+console.log(props);
+const change = () =>{
+  router.replace(`/${props.item.id}`)
+}
 </script>
 
 <style scoped>