diff --git a/pages/aiChat/simple_chat.vue b/pages/aiChat/simple_chat.vue index 0885cc4..f765442 100644 --- a/pages/aiChat/simple_chat.vue +++ b/pages/aiChat/simple_chat.vue @@ -94,6 +94,16 @@ {{ sending ? '发送中...' : '发送' }} + + + + + + + × + + + @@ -113,6 +123,11 @@ const md = new MarkdownIt({ // DOMPurify安全配置 DOMPurify.addHook('afterSanitizeAttributes', node => { if (node.tagName === 'A') node.setAttribute('rel', 'noopener noreferrer'); + if (node.tagName === 'IMG') { + node.setAttribute('style', 'max-width: 100%; height: auto; cursor: pointer;'); + node.setAttribute('class', 'markdown-image'); + node.setAttribute('data-preview', 'true'); + } }); export default { @@ -146,7 +161,11 @@ export default { earliestMessageId: null, // 引用信息展示控制 - showSingleReference: {} + showSingleReference: {}, + + // 图片预览相关 + showImagePreview: false, + previewImageUrl: '' }; }, @@ -175,7 +194,43 @@ export default { } }, + mounted() { + // 添加图片点击事件监听 + this.$nextTick(() => { + this.addImageClickListeners(); + }); + }, + + updated() { + // 每次更新后重新添加图片点击事件监听 + this.$nextTick(() => { + this.addImageClickListeners(); + }); + }, + methods: { + /** + * 添加图片点击事件监听 + */ + addImageClickListeners() { + const images = document.querySelectorAll('.markdown-image[data-preview="true"]'); + images.forEach(img => { + // 移除之前的事件监听器(如果有的话) + img.removeEventListener('click', this.handleImageClick); + // 添加新的事件监听器 + img.addEventListener('click', this.handleImageClick); + }); + }, + + /** + * 处理图片点击事件 + */ + handleImageClick(event) { + const imageUrl = event.target.src; + if (imageUrl) { + this.openImagePreview(imageUrl); + } + }, /** * 初始化聊天 - 获取历史记录 */ @@ -637,6 +692,22 @@ export default { this.$set(this.showSingleReference[msgIdx], refIdx, !current); }, + /** + * 打开图片预览 + */ + openImagePreview(imageUrl) { + this.previewImageUrl = imageUrl; + this.showImagePreview = true; + }, + + /** + * 关闭图片预览 + */ + closeImagePreview() { + this.showImagePreview = false; + this.previewImageUrl = ''; + }, + /** * 显示提示 */ @@ -647,6 +718,12 @@ export default { }; + + \ No newline at end of file diff --git a/pages/index/index.vue b/pages/index/index.vue index 58daa2a..1f73480 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -37,7 +37,7 @@ - AI + @@ -408,17 +408,18 @@ bottom: 120rpx; right: 40rpx; z-index: 999; - width: 100rpx; - height: 100rpx; + width: 120rpx; + height: 120rpx; border-radius: 50%; - background-color: #409eff; + background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #fff; display: flex; justify-content: center; align-items: center; cursor: pointer; - box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); - transition: transform 0.2s; + box-shadow: 0 8px 20px rgba(102, 126, 234, 0.4); + transition: all 0.3s ease; + border: 3px solid rgba(255, 255, 255, 0.2); } .ai-hover-content { @@ -429,12 +430,18 @@ height: 100%; } - .ai-hover-text { - font-size: 36rpx; - font-weight: bold; + .ai-hover-icon { + width: 80rpx; + height: 80rpx; + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2)); } .ai-hover:active { transform: scale(0.95); } + + .ai-hover:hover { + transform: scale(1.05); + box-shadow: 0 12px 25px rgba(102, 126, 234, 0.6); + } \ No newline at end of file diff --git a/static/iconAI.png b/static/iconAI.png new file mode 100644 index 0000000..53b047c Binary files /dev/null and b/static/iconAI.png differ