定制简历浏览器记录缓存加IndexDB存储工具封装，修复同一个页面的不同协议切换问题

src/components/tools/AgreementPreviewDialog.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, watch } from 'vue'
+import { ref, watch, nextTick } from 'vue'
 import { fetchAgreement } from '@/api/common'
 // @ts-ignore
 import markdownit from 'markdown-it'
@@ -48,19 +48,32 @@ const agreementName = ref('')
 const contentHtml = ref('')
 /** 加载状态 */
 const loading = ref(false)
-/** 是否已加载过（避免重复请求） */
-const loaded = ref(false)
+/** 已加载过的协议缓存（key: code, value: { name, html }） */
+const cache = new Map<string, { name: string; html: string }>()
 
 /** 加载协议内容 */
 async function loadAgreement() {
-  if (loaded.value) return
+  const code = props.code
+  if (!code) return
+
+  // 有缓存直接使用
+  const cached = cache.get(code)
+  if (cached) {
+    agreementName.value = cached.name
+    contentHtml.value = cached.html
+    return
+  }
+
   loading.value = true
+  contentHtml.value = ''
   try {
-    const res = await fetchAgreement(props.code)
+    const res = await fetchAgreement(code)
     if (res.data?.content) {
-      agreementName.value = res.data.agreementName || '协议内容'
-      contentHtml.value = md.render(res.data.content)
-      loaded.value = true
+      const name = res.data.agreementName || '协议内容'
+      const html = md.render(res.data.content)
+      agreementName.value = name
+      contentHtml.value = html
+      cache.set(code, { name, html })
     } else {
       contentHtml.value = '<p>暂无协议内容</p>'
     }
@@ -71,20 +84,13 @@ async function loadAgreement() {
   }
 }
 
-/** 监听弹窗打开 — 触发加载 */
+/** 监听弹窗打开 — 触发加载（使用 nextTick 确保 code 已更新） */
 watch(() => props.modelValue, (val) => {
   if (val) {
-    loadAgreement()
+    nextTick(() => loadAgreement())
     document.body.style.overflow = 'hidden'
   } else {
     document.body.style.overflow = ''
   }
 })
-
-/** 监听 code 变化 — 重置已加载状态 */
-watch(() => props.code, () => {
-  loaded.value = false
-  contentHtml.value = ''
-  agreementName.value = ''
-})
 </script>