feat: 图片广场优化

Yi.Ai.Vue3/src/api/aiImage/index.ts

@@ -1,4 +1,3 @@
-import { get, post } from '@/utils/request';
 import type {
   GenerateImageRequest,
   ImageModel,
@@ -7,6 +6,7 @@ import type {
   TaskListResponse,
   TaskStatusResponse,
 } from './types';
+import { del, get, post } from '@/utils/request';
 
 export function generateImage(data: GenerateImageRequest) {
   return post<string>('/ai-image/generate', data).json();
@@ -30,4 +30,9 @@ export function publishImage(data: PublishImageRequest) {
 
 export function getImageModels() {
   return post<ImageModel[]>('/ai-image/model').json();
-}
+}
+
+export function deleteMyTasks(taskIds: string[]) {
+  // return del<void>(`/ai-image/my-tasks/${taskIds}`).json();
+  return del<void>('/ai-image/my-tasks', { json: taskIds }).json();
+}

Yi.Ai.Vue3/src/pages/chat/image/components/ImageGenerator.vue

@@ -47,6 +47,7 @@ const currentTaskId = ref('');
 const currentTask = ref<TaskStatusResponse | null>(null);
 const showViewer = ref(false);
 let pollTimer: any = null;
+let debounceTimer: any = null;
 
 const canGenerate = computed(() => {
   return selectedModelId.value && prompt.value && !generating.value;
@@ -142,6 +143,18 @@ async function handleGenerate() {
   if (!canGenerate.value)
     return;
 
+  // Clear existing debounce timer
+  if (debounceTimer) {
+    clearTimeout(debounceTimer);
+  }
+
+  // Set debounce timer
+  debounceTimer = setTimeout(async () => {
+    await executeGenerate();
+  }, 300);
+}
+
+async function executeGenerate() {
   generating.value = true;
   // Reset current task display immediately
   currentTask.value = {
@@ -360,7 +373,7 @@ onUnmounted(() => {
           配置
         </h2>
 
-        <el-form label-position="top" class="space-y-2">
+        <el-form label-position="top" class="space-y-1">
           <!-- Token -->
           <el-form-item label="API密钥 (可选)">
             <el-select
@@ -417,7 +430,7 @@ onUnmounted(() => {
             <el-input
               v-model="prompt"
               type="textarea"
-              :autosize="{ minRows: 8, maxRows: 15 }"
+              :autosize="{ minRows: 4, maxRows: 15 }"
               placeholder="描述你想要生成的画面，例如：一只在太空中飞行的赛博朋克风格的猫..."
               maxlength="2000"
               show-word-limit
@@ -456,7 +469,7 @@ onUnmounted(() => {
         </el-form>
       </div>
 
-      <div class="mt-auto pt-4">
+      <div class="mt-auto pt-1">
         <el-button
           type="primary"
           class="w-full h-12 text-lg shadow-lg shadow-blue-500/30 transition-all hover:shadow-blue-500/50"
@@ -511,6 +524,10 @@ onUnmounted(() => {
             <p class="text-gray-400 text-sm mt-2">
               请稍候，这可能需要几秒钟
             </p>
+
+            <p class="text-gray-400 text-sm mt-2">
+              您可以离开或者继续创建下一个任务，稍后到“我的图库”中查看任务进度
+            </p>
           </div>
 
           <!-- Fail State -->
@@ -531,7 +548,7 @@ onUnmounted(() => {
                 circle
                 :icon="CopyDocument"
                 title="复制错误信息"
-                @click="copyError(currentTask.errorInfo || '')"
+                @click.stop="copyError(currentTask.errorInfo || '')"
               />
             </div>
             <el-button class="mt-6" icon="Refresh" @click="handleGenerate">

Yi.Ai.Vue3/src/pages/chat/image/components/ImagePlaza.vue

@@ -26,7 +26,7 @@ const emit = defineEmits(['use-prompt', 'use-reference']);
 
 const taskList = ref<TaskItem[]>([]);
 const pageIndex = ref(1);
-const pageSize = ref(20);
+const pageSize = ref(10);
 const loading = ref(false);
 const noMore = ref(false);
 const dialogVisible = ref(false);
@@ -42,6 +42,7 @@ function checkMobile() {
 onMounted(() => {
   checkMobile();
   window.addEventListener('resize', checkMobile);
+  loadMore();
 });
 
 onUnmounted(() => {
@@ -60,6 +61,8 @@ const searchForm = reactive({
   Prompt: '',
   Categories: '',
   UserName: '',
+  OrderByColumn: '',
+  IsAscending: true,
 });
 const dateRange = ref<[string, string] | null>(null);
 
@@ -74,7 +77,7 @@ async function loadMore() {
   loading.value = true;
   try {
     const params: TaskListRequest = {
-      SkipCount: (pageIndex.value - 1) * pageSize.value,
+      SkipCount: pageIndex.value,
       MaxResultCount: pageSize.value,
       TaskStatus: 'Success',
       Prompt: searchForm.Prompt || undefined,
@@ -82,6 +85,8 @@ async function loadMore() {
       UserName: searchForm.UserName || undefined,
       StartTime: dateRange.value ? dateRange.value[0] : undefined,
       EndTime: dateRange.value ? dateRange.value[1] : undefined,
+      OrderByColumn: searchForm.OrderByColumn || undefined,
+      IsAscending: searchForm.IsAscending,
     };
 
     const res = await getImagePlaza(params);
@@ -91,10 +96,6 @@ async function loadMore() {
     const items = data.items || [];
     const total = data.total || 0;
 
-    if (items.length < pageSize.value) {
-      noMore.value = true;
-    }
-
     if (pageIndex.value === 1) {
       taskList.value = items;
     }
@@ -104,16 +105,13 @@ async function loadMore() {
       taskList.value.push(...newItems);
     }
 
-    // Check if we reached total
+    // Check if we should stop loading more
-    if (taskList.value.length >= total) {
+    if (items.length === 0 || items.length < pageSize.value || taskList.value.length >= total) {
       noMore.value = true;
     }
-
-    if (items.length > 0) {
-      pageIndex.value++;
-    }
     else {
-      noMore.value = true;
+      // Increment pageIndex for next load only if there's more data
+      pageIndex.value++;
     }
   }
   catch (error) {
@@ -223,7 +221,7 @@ watch(dateRange, () => {
 </script>
 
 <template>
-  <div class="h-full flex flex-col md:flex-row bg-gray-50">
+  <div class="h-full flex flex-col md:flex-row bg-gray-50 overflow-hidden">
     <!-- Mobile Filter Button -->
     <div class="md:hidden p-4 bg-white border-b border-gray-200 flex items-center justify-between">
       <h2 class="text-lg font-bold text-gray-800">
@@ -298,6 +296,28 @@ watch(dateRange, () => {
               class="w-full"
             />
           </el-form-item>
+
+          <el-form-item v-if="false" label="排序方式">
+            <el-select
+              v-model="searchForm.OrderByColumn"
+              placeholder="默认排序"
+              class="w-full"
+              clearable
+            >
+              <el-option label="创建时间" value="CreationTime" />
+            </el-select>
+          </el-form-item>
+
+          <el-form-item v-if="searchForm.OrderByColumn" label="排序方向">
+            <el-radio-group v-model="searchForm.IsAscending">
+              <el-radio :value="true">
+                升序
+              </el-radio>
+              <el-radio :value="false">
+                降序
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
         </el-form>
       </div>
 
@@ -308,12 +328,18 @@ watch(dateRange, () => {
           </el-icon>
           搜索
         </el-button>
-        <el-button class="w-full refresh-btn " @click="handleReset">
+        <el-button class="w-full refresh-btn" @click="handleReset">
           <el-icon class="mr-1">
             <Refresh />
           </el-icon>
           重置
         </el-button>
+        <el-button class="w-full refresh-btn" type="success" @click="handleSearch">
+          <el-icon class="mr-1">
+            <Refresh />
+          </el-icon>
+          刷新
+        </el-button>
       </div>
     </div>
 
@@ -372,6 +398,28 @@ watch(dateRange, () => {
             class="w-full"
           />
         </el-form-item>
+
+        <el-form-item label="排序方式">
+          <el-select
+            v-model="searchForm.OrderByColumn"
+            placeholder="默认排序"
+            class="w-full"
+            clearable
+          >
+            <el-option label="创建时间" value="CreationTime" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item v-if="searchForm.OrderByColumn" label="排序方向">
+          <el-radio-group v-model="searchForm.IsAscending">
+            <el-radio :value="true">
+              升序
+            </el-radio>
+            <el-radio :value="false">
+              降序
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
       </el-form>
 
       <template #footer>
@@ -382,12 +430,18 @@ watch(dateRange, () => {
             </el-icon>
             搜索
           </el-button>
-          <el-button class="w-full" @click="handleReset(); showMobileFilter = false">
+          <el-button class="w-full refresh-btn" @click="handleReset(); showMobileFilter = false">
             <el-icon class="mr-1">
               <Refresh />
             </el-icon>
             重置
           </el-button>
+          <el-button class="w-full refresh-btn" type="success" @click="handleSearch(); showMobileFilter = false">
+            <el-icon class="mr-1">
+              <Refresh />
+            </el-icon>
+            刷新
+          </el-button>
         </div>
       </template>
     </el-drawer>

Yi.Ai.Vue3/src/pages/chat/image/components/MyImages.vue

@@ -4,9 +4,9 @@ import type { TaskItem, TaskListRequest } from '@/api/aiImage/types';
 import { Check, CircleCloseFilled, CollectionTag, CopyDocument, Download, Filter, Loading, MagicStick, Picture, Refresh, Search, Share, User, WarningFilled, ZoomIn } from '@element-plus/icons-vue';
 import { useClipboard } from '@vueuse/core';
 import { format } from 'date-fns';
-import { ElMessage } from 'element-plus';
+import { ElMessage, ElMessageBox } from 'element-plus';
 import { computed, nextTick, onMounted, onUnmounted, reactive, ref, watch } from 'vue';
-import { getMyTasks, publishImage } from '@/api/aiImage';
+import { deleteMyTasks, getMyTasks, publishImage } from '@/api/aiImage';
 import TaskCard from './TaskCard.vue';
 
 const emit = defineEmits(['use-prompt', 'use-reference']);
@@ -19,6 +19,10 @@ const noMore = ref(false);
 const dialogVisible = ref(false);
 const currentTask = ref<TaskItem | null>(null);
 
+// Batch selection
+const batchMode = ref(false);
+const selectedTaskIds = ref<Set<string>>(new Set());
+
 // Mobile detection
 const isMobile = ref(false);
 
@@ -29,6 +33,7 @@ function checkMobile() {
 onMounted(() => {
   checkMobile();
   window.addEventListener('resize', checkMobile);
+  loadMore();
 });
 
 onUnmounted(() => {
@@ -47,6 +52,8 @@ const searchForm = reactive({
   Prompt: '',
   TaskStatus: '' as 'Processing' | 'Success' | 'Fail' | '',
   PublishStatus: '' as 'Unpublished' | 'Published' | '',
+  OrderByColumn: '',
+  IsAscending: true,
 });
 const dateRange = ref<[string, string] | null>(null);
 
@@ -71,13 +78,15 @@ async function loadMore() {
   loading.value = true;
   try {
     const params: TaskListRequest = {
-      SkipCount: (pageIndex.value - 1) * pageSize.value,
+      SkipCount: pageIndex.value,
       MaxResultCount: pageSize.value,
       Prompt: searchForm.Prompt || undefined,
       TaskStatus: searchForm.TaskStatus || undefined,
       PublishStatus: searchForm.PublishStatus || undefined,
       StartTime: dateRange.value ? dateRange.value[0] : undefined,
       EndTime: dateRange.value ? dateRange.value[1] : undefined,
+      OrderByColumn: searchForm.OrderByColumn || undefined,
+      IsAscending: searchForm.IsAscending,
     };
 
     const res = await getMyTasks(params);
@@ -87,10 +96,6 @@ async function loadMore() {
     const items = data.items || [];
     const total = data.total || 0;
 
-    if (items.length < pageSize.value) {
-      noMore.value = true;
-    }
-
     if (pageIndex.value === 1) {
       taskList.value = items;
     }
@@ -100,16 +105,13 @@ async function loadMore() {
       taskList.value.push(...newItems);
     }
 
-    // Check if we reached total
+    // Check if we should stop loading more
-    if (taskList.value.length >= total) {
+    if (items.length === 0 || items.length < pageSize.value || taskList.value.length >= total) {
       noMore.value = true;
     }
-
-    if (items.length > 0) {
-      pageIndex.value++;
-    }
     else {
-      noMore.value = true;
+      // Increment pageIndex for next load only if there's more data
+      pageIndex.value++;
     }
   }
   catch (error) {
@@ -165,6 +167,11 @@ async function copyPrompt(text: string) {
   ElMessage.success('提示词已复制');
 }
 
+async function copyErrorInfo(text: string) {
+  await copy(text);
+  ElMessage.success('错误信息已复制');
+}
+
 function openPublishDialog(task: TaskItem) {
   taskToPublish.value = task;
   publishTags.value = [];
@@ -187,6 +194,12 @@ function showInput() {
 
 function handleInputConfirm() {
   if (inputValue.value) {
+    if (publishTags.value.length >= 3) {
+      ElMessage.warning('最多只能添加3个标签');
+      inputValue.value = '';
+      inputVisible.value = false;
+      return;
+    }
     if (!publishTags.value.includes(inputValue.value)) {
       publishTags.value.push(inputValue.value);
     }
@@ -242,6 +255,69 @@ async function downloadImage(url: string) {
   }
 }
 
+// Batch selection functions
+function toggleBatchMode() {
+  batchMode.value = !batchMode.value;
+  if (!batchMode.value) {
+    selectedTaskIds.value.clear();
+  }
+}
+
+function toggleTaskSelection(taskId: string) {
+  if (selectedTaskIds.value.has(taskId)) {
+    selectedTaskIds.value.delete(taskId);
+  }
+  else {
+    selectedTaskIds.value.add(taskId);
+  }
+  // Force reactivity update
+  selectedTaskIds.value = new Set(selectedTaskIds.value);
+}
+
+function selectAll() {
+  taskList.value.forEach(task => selectedTaskIds.value.add(task.id));
+  // Force reactivity update
+  selectedTaskIds.value = new Set(selectedTaskIds.value);
+}
+
+function clearSelection() {
+  selectedTaskIds.value.clear();
+  // Force reactivity update
+  selectedTaskIds.value = new Set(selectedTaskIds.value);
+}
+
+async function batchDelete() {
+  if (selectedTaskIds.value.size === 0) {
+    ElMessage.warning('请先选择要删除的图片');
+    return;
+  }
+
+  try {
+    await ElMessageBox.confirm(
+      `确定要删除选中的 ${selectedTaskIds.value.size} 张图片吗？`,
+      '批量删除',
+      {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    );
+
+    const ids = Array.from(selectedTaskIds.value);
+    await deleteMyTasks(ids);
+    ElMessage.success('删除成功');
+    selectedTaskIds.value.clear();
+    batchMode.value = false;
+    handleSearch();
+  }
+  catch (e: any) {
+    if (e !== 'cancel') {
+      console.error(e);
+      ElMessage.error('删除失败');
+    }
+  }
+}
+
 // Expose refresh method
 defineExpose({
   refresh: () => {
@@ -266,7 +342,7 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
 </script>
 
 <template>
-  <div class="h-full flex flex-col md:flex-row bg-gray-50">
+  <div class="h-full flex flex-col md:flex-row bg-gray-50 overflow-hidden">
     <!-- Mobile Filter Button -->
     <div class="md:hidden p-4 bg-white border-b border-gray-200 flex items-center justify-between">
       <h2 class="text-lg font-bold text-gray-800">
@@ -361,6 +437,30 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
               class="w-full"
             />
           </el-form-item>
+
+          <el-form-item v-if="false" label="排序方式">
+            <el-select
+              v-model="searchForm.OrderByColumn"
+              placeholder="默认排序"
+              class="w-full"
+              clearable
+            >
+              <el-option label="创建时间" value="CreationTime" />
+              <el-option label="任务状态" value="TaskStatus" />
+              <el-option label="发布状态" value="PublishStatus" />
+            </el-select>
+          </el-form-item>
+
+          <el-form-item v-if="searchForm.OrderByColumn" label="排序方向">
+            <el-radio-group v-model="searchForm.IsAscending">
+              <el-radio :value="true">
+                升序
+              </el-radio>
+              <el-radio :value="false">
+                降序
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
         </el-form>
       </div>
 
@@ -377,6 +477,12 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
           </el-icon>
           重置
         </el-button>
+        <el-button class="w-full refresh-btn" type="success" @click="handleSearch">
+          <el-icon class="mr-1">
+            <Refresh />
+          </el-icon>
+          刷新
+        </el-button>
       </div>
     </div>
 
@@ -436,6 +542,30 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
             class="w-full"
           />
         </el-form-item>
+
+        <el-form-item label="排序方式">
+          <el-select
+            v-model="searchForm.OrderByColumn"
+            placeholder="默认排序"
+            class="w-full"
+            clearable
+          >
+            <el-option label="创建时间" value="CreationTime" />
+            <el-option label="任务状态" value="TaskStatus" />
+            <el-option label="发布状态" value="PublishStatus" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item v-if="searchForm.OrderByColumn" label="排序方向">
+          <el-radio-group v-model="searchForm.IsAscending">
+            <el-radio :value="true">
+              升序
+            </el-radio>
+            <el-radio :value="false">
+              降序
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
       </el-form>
 
       <template #footer>
@@ -446,18 +576,53 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
             </el-icon>
             搜索
           </el-button>
-          <el-button class="w-full" @click="handleReset(); showMobileFilter = false">
+          <el-button class="w-full refresh-btn" @click="handleReset(); showMobileFilter = false">
             <el-icon class="mr-1">
               <Refresh />
             </el-icon>
             重置
           </el-button>
+          <el-button class="w-full refresh-btn" type="success" @click="handleSearch(); showMobileFilter = false">
+            <el-icon class="mr-1">
+              <Refresh />
+            </el-icon>
+            刷新
+          </el-button>
         </div>
       </template>
     </el-drawer>
 
     <!-- Right Content Area -->
     <div class="flex-1 flex flex-col overflow-hidden">
+      <!-- Batch Operation Toolbar -->
+      <div v-if="false" class="bg-white border-b border-gray-200 p-3 flex items-center justify-between">
+        <div class="flex items-center gap-2">
+          <el-button
+            :type="batchMode ? 'primary' : 'default'"
+            size="small"
+            @click="toggleBatchMode"
+          >
+            {{ batchMode ? '取消批量' : '批量管理' }}
+          </el-button>
+          <template v-if="batchMode">
+            <el-button size="small" @click="selectAll">
+              全选
+            </el-button>
+            <el-button size="small" @click="clearSelection">
+              清空
+            </el-button>
+            <el-button
+              type="danger"
+              size="small"
+              :disabled="selectedTaskIds.size === 0"
+              @click="batchDelete"
+            >
+              删除选中 ({{ selectedTaskIds.size }})
+            </el-button>
+          </template>
+        </div>
+      </div>
+
       <div
         v-infinite-scroll="loadMore"
         class="flex-1 overflow-y-auto p-4 md:p-6 custom-scrollbar"
@@ -470,7 +635,10 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
             :key="task.id"
             :task="task"
             show-publish-status
-            @click="handleCardClick(task)"
+            :batch-mode="batchMode"
+            :selected="selectedTaskIds.has(task.id)"
+            @click="batchMode ? toggleTaskSelection(task.id) : handleCardClick(task)"
+            @toggle-select="toggleTaskSelection"
             @use-prompt="$emit('use-prompt', $event)"
             @use-reference="$emit('use-reference', $event)"
             @publish="openPublishDialog(task)"
@@ -631,7 +799,9 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
             <div v-if="currentTask.publishStatus === 'Published'" class="flex justify-between text-sm items-center">
               <span class="text-gray-500">发布状态</span>
               <div class="flex items-center gap-1">
-                <el-tag size="small" type="warning" effect="dark">已发布</el-tag>
+                <el-tag size="small" type="warning" effect="dark">
+                  已发布
+                </el-tag>
                 <span v-if="!currentTask.isAnonymous && currentTask.userName" class="text-blue-500 text-xs flex items-center gap-1">
                   <el-icon><User /></el-icon> {{ currentTask.userName }}
                 </span>
@@ -642,7 +812,9 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
             </div>
             <div v-else class="flex justify-between text-sm items-center">
               <span class="text-gray-500">发布状态</span>
-              <el-tag size="small" type="info" effect="plain">未发布</el-tag>
+              <el-tag size="small" type="info" effect="plain">
+                未发布
+              </el-tag>
             </div>
 
             <!-- 操作按钮 - 所有状态都可以使用提示词 -->
@@ -661,7 +833,7 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
               <el-button
                 v-if="currentTask.taskStatus === 'Success' && currentTask.publishStatus === 'Unpublished'"
                 type="success"
-                class="w-full"
+                class="w-full refresh-btn"
                 :icon="Share"
                 @click="openPublishDialog(currentTask)"
               >
@@ -705,9 +877,10 @@ watch([() => searchForm.TaskStatus, () => searchForm.PublishStatus, dateRange],
               @keydown.enter.prevent="handleInputConfirm"
               @blur="handleInputConfirm"
             />
-            <el-button v-else class="button-new-tag" size="small" @click="showInput">
+            <el-button v-else-if="publishTags.length < 3" class="button-new-tag" size="small" @click="showInput">
               + New Tag
             </el-button>
+            <span v-else class="text-xs text-gray-400">最多3个标签</span>
           </div>
         </el-form-item>
         <el-form-item>

Yi.Ai.Vue3/src/pages/chat/image/components/TaskCard.vue

@@ -7,9 +7,11 @@ import { defineEmits, defineProps } from 'vue';
 const props = defineProps<{
   task: TaskItem;
   showPublishStatus?: boolean;
+  batchMode?: boolean;
+  selected?: boolean;
 }>();
 
-const emit = defineEmits(['click', 'use-prompt', 'use-reference', 'publish', 'preview']);
+const emit = defineEmits(['click', 'use-prompt', 'use-reference', 'publish', 'preview', 'toggle-select', 'delete']);
 
 function formatTime(time: string) {
   try {
@@ -88,7 +90,20 @@ async function handleDownload() {
 </script>
 
 <template>
-  <div class="task-card group relative flex flex-col bg-white rounded-xl overflow-hidden border border-gray-100 transition-all duration-300 hover:shadow-xl hover:-translate-y-1 cursor-pointer">
+  <div
+    class="task-card relative flex flex-col bg-white rounded-xl overflow-hidden border border-gray-100 transition-all duration-300 cursor-pointer"
+    :class="{
+      'ring-2 ring-primary': selected,
+      'group hover:shadow-xl hover:-translate-y-1': !batchMode
+    }"
+  >
+    <!-- Batch Selection Checkbox -->
+    <div v-if="batchMode" class="absolute top-2 right-2 z-20">
+      <div class="bg-white rounded-md p-1 shadow-md">
+        <el-checkbox :model-value="selected" size="large" />
+      </div>
+    </div>
+
     <!-- Image Area -->
     <div class="aspect-square w-full relative bg-gray-100 overflow-hidden">
       <!-- Blurred Background -->
@@ -142,7 +157,7 @@ async function handleDownload() {
       </div>
 
       <!-- Overlay (Hover) - Desktop -->
-      <div class="absolute inset-0 bg-black/40 opacity-0 group-hover:opacity-100 transition-opacity duration-300 hidden md:flex flex-col items-center justify-center gap-3 z-20 backdrop-blur-[2px]">
+      <div v-if="!batchMode" class="absolute inset-0 bg-black/40 opacity-0 group-hover:opacity-100 transition-opacity duration-300 hidden md:flex flex-col items-center justify-center gap-3 z-20 backdrop-blur-[2px]">
         <el-button type="primary" round size="small" class="transform scale-90 group-hover:scale-100 transition-transform shadow-lg" @click.stop="$emit('click')">
           查看详情
         </el-button>

Yi.Ai.Vue3/src/pages/chat/image/index.vue

@@ -40,8 +40,8 @@ watch(activeTab, (val) => {
 </script>
 
 <template>
-  <div class="image-page-container h-full flex flex-col">
+  <div class="image-page-container h-full flex flex-col ">
-    <el-tabs v-model="activeTab" class="flex-1 flex flex-col" type="border-card">
+    <el-tabs v-model="activeTab" class="max-h-[90vh] flex-1 flex flex-col" type="border-card">
       <el-tab-pane label="图片广场" name="plaza" class="h-full">
         <ImagePlaza
           v-if="activeTab === 'plaza'"

Yi.Ai.Vue3/types/components.d.ts

@@ -45,6 +45,8 @@ declare module 'vue' {
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElProgress: typeof import('element-plus/es')['ElProgress']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSegmented: typeof import('element-plus/es')['ElSegmented']