feat: 报告初步显示

src/views/home/agent/components/Preview.vue

@@ -57,14 +57,21 @@
 				</div>
 				<div v-else class="report-content">
 					<div class="downBtnBox">
-						<div class="downBtn">
+						<div class="downBtn" @click="handleDownloadMd">
 							<div class="icon">
 								<SvgIcon name="reportDown" size="16"></SvgIcon>
 							</div>
 							<span>{{ $t('agent.Download') }}</span>
 						</div>
 					</div>
-					<div class="content"></div>
+					<div class="content">
+						<VueMarkdown
+							:custom-attrs="customAttrs"
+							:markdown="markdownContent"
+							:rehype-plugins="[rehypeRaw]"
+						>
+						</VueMarkdown>
+					</div>
 				</div>
 			</div>
 		</div>
@@ -82,6 +89,10 @@
 	const projectStore = useProjectStore()
 	import MyEvent from '@/utils/myEvent'
 	import { useI18n } from 'vue-i18n'
+	import { VueMarkdown } from '@crazydos/vue-markdown'
+	import type { CustomAttrs } from '@crazydos/vue-markdown'
+	import rehypeRaw from 'rehype-raw'
+
 	const { t } = useI18n()
 	const emits = defineEmits(['deleteSketch'])
 
@@ -99,6 +110,36 @@
 		}
 	)
 
+	const customAttrs: CustomAttrs = {
+		img: {
+			style: 'max-width: 100%;display:block;'
+		},
+		a: (node, combinedAttrs) => {
+			if (typeof node.properties.href === 'string') {
+				return { target: '_blank', rel: 'noopener noreferrer' }
+			} else {
+				return {}
+			}
+		}
+	}
+
+	const sessionId = ref('')
+	const markdownContent = ref('')
+const setSessionId = (id: string) => {
+		
+		sessionId.value = id
+	}
+	watch(
+		() => sessionId.value,
+		(newVal) => {
+			if (newVal) {
+				markdownContent.value = localStorage.getItem(`reportsContent_${newVal}`)
+				console.log('markdownContent-----', markdownContent.value);
+				
+			}
+		}
+	)
+
 	// 图片加载完成时触发
 	const handleImageLoad = (index: number) => {
 		loadedStatus[index] = true
@@ -147,6 +188,20 @@
 		})
 	}
 
+	const handleDownloadMd = () => {
+		if (!markdownContent.value) return
+
+		const blob = new Blob([markdownContent.value], { type: 'text/markdown' })
+		const url = URL.createObjectURL(blob)
+		const link = document.createElement('a')
+		link.href = url
+		link.download = `report-${Date.now()}.md`
+		document.body.appendChild(link)
+		link.click()
+		document.body.removeChild(link)
+		URL.revokeObjectURL(url)
+	}
+
 	const showLoading = ref(false)
 	const handleLoadingSketch = () => {
 		showLoading.value = true
@@ -166,6 +221,10 @@
 	onUnmounted(() => {
 		MyEvent.remove('loading-sketch', handleLoadingSketch)
 	})
+
+	defineExpose({
+		setSessionId
+	})
 </script>
 
 <style lang="less" scoped>