feat: 完善视频学习进度缓存

完善新手导航和三大创作模块的视频完成缓存、未完成提示与学习进度计算，确保进度按实际学习资源完成情况更新。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/components/PracticeRatingModal/index.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { computed } from 'vue'
+import { computed, onBeforeUnmount, ref } from 'vue'
 import { ImgButton } from '@/components/Button'
 import { Overlay } from '@/components/Overlay'
 import { StarRating } from '@/components/Rating'
@@ -23,11 +23,37 @@ const props = withDefaults(defineProps<Props>(), {
 
 const emit = defineEmits<{
   (e: 'close'): void
+  (e: 'update:items', items: PracticeRatingItem[]): void
+  (e: 'save', items: PracticeRatingItem[]): void
 }>()
 
 const hasTips = computed<boolean>(() =>
   Boolean(props.topTip || props.bottomTip),
 )
+
+const showSuccess = ref<boolean>(false)
+let successTimer: number | undefined
+
+const handleScoreChange = (index: number, score: number): void => {
+  const nextItems = props.items.map((item, itemIndex) =>
+    itemIndex === index ? { ...item, score } : item,
+  )
+  emit('update:items', nextItems)
+}
+
+const handleSave = (): void => {
+  emit('save', props.items)
+  showSuccess.value = true
+  window.clearTimeout(successTimer)
+  successTimer = window.setTimeout(() => {
+    showSuccess.value = false
+    emit('close')
+  }, 1500)
+}
+
+onBeforeUnmount(() => {
+  window.clearTimeout(successTimer)
+})
 </script>
 
 <template>
@@ -36,7 +62,7 @@ const hasTips = computed<boolean>(() =>
     :clickable="false"
   >
     <div
-      class="w-[1795px] h-[987px] bg-no-repeat bg-cover p-10 pt-[100px]"
+      class="relative w-[1795px] h-[987px] bg-no-repeat bg-cover p-10 pt-[100px]"
       :style="{ backgroundImage: getBackgroundImage(backgroundImage) }"
     >
       <ImgButton
@@ -45,6 +71,13 @@ const hasTips = computed<boolean>(() =>
         @click="emit('close')"
       />
 
+      <div
+        v-if="showSuccess"
+        class="absolute left-1/2 top-1/2 z-[100] -translate-x-1/2 -translate-y-1/2 rounded-2xl bg-black/70 px-16 py-8 text-5xl font-bold text-white"
+      >
+        提交成功
+      </div>
+
       <div class="relative h-full overflow-y-scroll px-8">
         <div class="pl-10 space-y-10 mt-10">
           <p
@@ -71,6 +104,7 @@ const hasTips = computed<boolean>(() =>
               class="absolute -bottom-5 right-10"
               :score="item.score"
               size="lg"
+              @change="handleScoreChange(index, $event)"
             />
           </div>
           <p
@@ -85,7 +119,7 @@ const hasTips = computed<boolean>(() =>
           >
             <ImgButton
               :image="saveButtonImage"
-              @click="emit('close')"
+              @click="handleSave"
             />
           </div>
         </div>