下载功能

src/components/ai/image/ImageToImage.vue

@@ -175,8 +175,6 @@ import ImageUpload from '@/components/ImageUpload/index.vue';
 import { getModelIdByType } from '@/api/teachers.js'
 import { ModelTypeEnum } from '@/api/teachers.js'
 
-// 图片
-import list_img03 from "@/assets/programming/list_img03.png";
 
 
 // 存储上传的图片
@@ -186,7 +184,6 @@ const imageUploadRef = ref(null);
 
 // 当前选中的风格
 const selectedStyle = ref('');
-// 已移除dropdownVisible，使用el-select的v-model
 
 
 
@@ -339,18 +336,7 @@ import {
 } from '@element-plus/icons-vue'
 
 
-const imageAllList = ref([
-  {
-    type: 'user',
-    content: '请帮我生成一张类似的图片',
-    imageUrl: list_img03
-  },
-  {
-    type: 'ai',
-    content: '已为您生成图片：',
-    imageList: [list_img03]
-  }
-]) // 对话的消息列表
+const imageAllList = ref([]) // 对话的消息列表
 // 图片轮询相关的参数（正在生成中的）
 const inProgressImageMap = ref({}) // 监听的 image 映射，一般是生成中（需要轮询），key 为 image 编号，value 为 image
 const inProgressTimer = ref() // 生成中的 image 定时器，轮询生成进展

src/components/ai/image/TextToImage.vue

@@ -384,6 +384,35 @@ const inProgressTimerFun = () => {
     clearInterval(inProgressTimer.value)
   }
 }
+
+// 图片下载功能
+const download = (activeIndex) => {
+  // 从document中找到图片预览器
+  const imgPreview = document.querySelector('.el-image-viewer__wrapper');
+  if (!imgPreview) return;
+  
+  // 获取所有预览图片
+  const imgElements = imgPreview.querySelectorAll('.el-image-viewer__img');
+  if (!imgElements || imgElements.length === 0) return;
+  
+  // 确定要下载的图片URL，根据传入的 activeIndex 获取对应图片的URL
+  let imgUrl;
+  if (imgElements[activeIndex]) {
+    imgUrl = imgElements[activeIndex].src;
+  } else {
+    imgUrl = imgElements[0].src;
+  }
+  
+  // 创建下载链接并触发下载
+  const link = document.createElement('a');
+  link.download = `image_${new Date().getTime()}.png`;
+  link.href = imgUrl;
+  
+  // 触发下载
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+}
 </script>
 
 <style scoped lang="scss">