feat: webAddress

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

@@ -50,6 +50,17 @@
 				<img src="@/assets/images/sketch-loading.gif" alt="loading" />
 			</div>
 		</template>
+		<template v-else-if="type === 'url'">
+			<div class="url-list flex">
+				<div class="url-item" v-for="item in urlList" :key="item">
+					<div class="url-title" @click="handleClickUrl(item)">
+						{{ item }}
+						<img src="@/assets/images/link-outer.png" class="link-outer" />
+					</div>
+					<div class="url-link">{{ item }}</div>
+				</div>
+			</div>
+		</template>
 		<div v-else class="reportBorder">
 			<div class="report">
 				<!-- <div v-if="false" class="report-content-null">
@@ -75,11 +86,6 @@
 						</div>
 					</div>
 				</template>
-				<template v-else>
-					<div class="url-list">
-						<div class="url-item" v-for="item in urlList" :key="item"></div>
-					</div>
-				</template>
 			</div>
 		</div>
 	</div>
@@ -99,9 +105,6 @@
 	import { VueMarkdown } from '@crazydos/vue-markdown'
 	import type { CustomAttrs } from '@crazydos/vue-markdown'
 	import rehypeRaw from 'rehype-raw'
-	import { useWebsiteTitle } from '@/utils/useWebTitle'
-
-	const { titles, loading, fetchAll } = useWebsiteTitle()
 
 	const { t } = useI18n()
 	const emits = defineEmits(['deleteSketch'])
@@ -111,7 +114,7 @@
 
 	const props = withDefaults(
 		defineProps<{
-			type: 'sketch' | 'report'
+			type: 'sketch' | 'report' | 'url'
 			sketchList: Array<string>
 		}>(),
 		{
@@ -138,26 +141,23 @@
 	const urlList = ref([])
 	const reportType = ref<'report' | 'urls'>('report')
 	const setSessionId = (id: string) => {
-		console.log('setSessionId-----', id)
 		reportType.value = 'report'
 		sessionId.value = id
 	}
 	const setUrls = (list: string[]) => {
-		console.log('setUrls-----', list)
 		reportType.value = 'urls'
-		urlList.value = [
-			'https://furnitureindustrynews.substack.com/p/what-2026-really-looks-like-for-furniture',
-			'https://furnitureindustrynews.substack.com/p/what-2026-really-looks-like-for-furniture',
-			'https://furnitureindustrynews.substack.com/p/what-2026-really-looks-like-for-furniture'
-		]
-		fetchAll(list)
+		urlList.value = list
+		// urlList.value = [
+		// 	'https://furnitureindustrynews.substack.com/p/what-2026-really-looks-like-for-furniture',
+		// 	'https://furnitureindustrynews.substack.com/p/what-2026-really-looks-like-for-furniture',
+		// 	'https://furnitureindustrynews.substack.com/p/what-2026-really-looks-like-for-furniture'
+		// ]
 	}
 	watch(
 		() => sessionId.value,
 		(newVal) => {
 			if (newVal) {
-				markdownContent.value = localStorage.getItem(`reportsContent_${newVal}`)
-				console.log(`报告key值:reportsContent_${newVal}`, markdownContent.value)
+				markdownContent.value = sessionStorage.getItem(`reportsContent_${newVal}`)
 			}
 		}
 	)
@@ -226,6 +226,11 @@
 	const handleLoadingSketch = () => {
 		showLoading.value = true
 	}
+
+	const handleClickUrl = (item: string) => {
+		window.open(item, '_blank')
+	}
+
 	// watch(
 	// 	() => props.sketchList,
 	// 	(val) => {
@@ -301,6 +306,38 @@
 				}
 			}
 		}
+		.url-list {
+			flex: 1;
+			flex-wrap: wrap;
+			column-gap: 4rem;
+			row-gap: 3rem;
+			.url-item {
+				width: 24rem;
+				height: 28.7rem;
+				word-break: break-all;
+				background: url('@/assets/images/web-card.png') no-repeat;
+				background-size: 100% 100%;
+				padding: 5rem 1.5rem;
+				.url-title {
+					cursor: pointer;
+					font-family: 'Medium';
+					font-size: 1.6rem;
+					color: #232323;
+					padding-bottom: 0.6rem;
+					.link-outer {
+						width: 1.2rem;
+						height: 1.2rem;
+					}
+				}
+				.url-link {
+					font-family: 'Medium';
+					font-style: italic;
+					font-size: 1.2rem;
+					color: #7c7c7c;
+					user-select: text;
+				}
+			}
+		}
 		.reportBorder {
 			position: relative;
 			display: flex;