feat: 图片引用

src/views/home/components/Input.vue

@@ -2,15 +2,17 @@
 	<div class="assist-input-wrapper flex flex-col" :class="{ agent: isAgentMode }">
 		<div class="animate-container flex-1 flex flex-col">
 			<div class="scroll-content flex-col">
-				<div v-if="uploadedImages.length > 0" class="image-preview-list flex wrap">
+				<div
+					v-if="uploadedImages.length > 0 || quoteList.length > 0"
+					class="image-preview-list flex wrap"
+				>
 					<div
-						v-for="(image, index) in uploadedImages"
+						v-for="(image, index) in [...uploadedImages, ...quoteList]"
 						:key="index"
 						class="image-preview-item"
 					>
 						<img
-							:src="image.url"
-							:alt="image.name"
+							:src="image.url || image"
 							class="preview-image"
 							@click="previewImage(image.url)"
 						/>
@@ -211,7 +213,8 @@
 
 		<div
 			v-if="!isAgentMode"
-			class="report-btn flex space-between align-center"
+			class="report-btn flex space-between align-center outer"
+			:class="{ 'is-cn': isCn }"
 			@click="toogltReportTag"
 		>
 			<SvgIcon class="light-icon" color="#FFDB56" name="light" size="16" />
@@ -222,7 +225,7 @@
 </template>
 
 <script setup lang="ts">
-	import { computed, ref, watch, nextTick, onMounted } from 'vue'
+	import { computed, ref, watch, nextTick, onMounted, onUnmounted } from 'vue'
 	import { areaList } from '@/utils/area'
 	import { useI18n } from 'vue-i18n'
 	import { useRouter } from 'vue-router'
@@ -254,11 +257,16 @@
 
 	const emits = defineEmits(['send', 'pause'])
 
-	const { t } = useI18n()
+	const { t, locale } = useI18n()
+
+	const isCn = computed(() => {
+		return locale.value === 'CHINESE_SIMPLIFIED'
+	})
 
 	// 图片上传相关
 	const fileInputRef = ref<HTMLInputElement | null>(null)
 	const uploadedImages = ref<Array<{ url: string; name: string }>>([])
+	const quoteList = ref<Array<string>>([])
 
 	// 触发文件上传
 	const triggerFileUpload = () => {
@@ -684,7 +692,8 @@
 		const payload = {
 			text: inputValue.value.trim(),
 			images: imageUrlList,
-			tempImages: uploadedImages.value
+			tempImages: uploadedImages.value,
+			quoteList: quoteList.value
 		}
 		if (reportTags.value.length > 0) {
 			payload.useReport = true
@@ -692,6 +701,7 @@
 		emits('send', payload)
 		// 发送后清空图片列表
 		uploadedImages.value = []
+		quoteList.value = []
 		// 发送后清空输入框
 		if (editorRef.value) {
 			editorRef.value.innerHTML = ''
@@ -707,6 +717,7 @@
 
 	// 初始化编辑器高度
 	onMounted(() => {
+		MyEvent.add('quote', handleQuote)
 		nextTick(() => {
 			autoResizeEditor()
 		})
@@ -803,6 +814,12 @@
 		previewUrl.value = url
 	}
 
+	const handleQuote = (url: string) => {
+		quoteList.value.push(url)
+	}
+	onUnmounted(() => {
+		MyEvent.remove('quote', handleQuote)
+	})
 	// 暴露方法给父组件
 	defineExpose({
 		addReportTag
@@ -821,6 +838,10 @@
 		background-color: #fff;
 		border: 1.1px solid #f6f4ef1a;
 		cursor: pointer;
+		&.outer.is-cn {
+			justify-content: center;
+			column-gap: 3rem;
+		}
 
 		.c-svg {
 			width: 1.5rem;
@@ -1378,7 +1399,7 @@
 		.agent-modal {
 			// width: 14.6rem;
 			// height: 8.5rem;
-			
+
 			row-gap: 1.2rem;
 			font-family: 'Medium';
 			font-weight: 500;