feat: 路由动态权限控制、图片广场优化

This commit is contained in:
Gsh
2026-01-03 17:03:42 +08:00
parent 3892ff1937
commit 42edd4c230
11 changed files with 660 additions and 145 deletions

View File

@@ -55,18 +55,22 @@
class="w-full h-full"
:preview-src-list="[currentTask.storeUrl]"
/>
<!-- Download Button Overlay -->
<div class="absolute bottom-4 right-4 opacity-0 group-hover:opacity-100 transition-opacity z-10">
<el-button circle type="primary" :icon="Download" @click="downloadImage(currentTask.storeUrl)" />
</div>
</div>
<!-- Right Info -->
<div class="w-full md:w-[300px] flex flex-col gap-4 overflow-y-auto">
<div>
<h3 class="font-bold text-gray-800 mb-2 flex items-center gap-2">
<div class="w-full md:w-[300px] flex flex-col gap-4 overflow-hidden">
<div class="flex-1 flex flex-col min-h-0">
<h3 class="font-bold text-gray-800 mb-2 flex items-center gap-2 shrink-0">
<el-icon><MagicStick /></el-icon> 提示词
</h3>
<div class="bg-gray-50 p-4 rounded-lg border border-gray-100 text-sm text-gray-600 leading-relaxed relative group/prompt">
<div class="bg-gray-50 p-4 rounded-lg border border-gray-100 text-sm text-gray-600 leading-relaxed relative group/prompt overflow-y-auto custom-scrollbar flex-1">
{{ currentTask.prompt }}
<el-button
class="absolute top-2 right-2 opacity-0 group-hover/prompt:opacity-100 transition-opacity shadow-sm"
class="absolute top-2 right-2 opacity-0 group-hover/prompt:opacity-100 transition-opacity shadow-sm z-10"
size="small"
circle
:icon="CopyDocument"
@@ -76,7 +80,7 @@
</div>
</div>
<div class="mt-auto space-y-3 pt-4 border-t border-gray-100">
<div class="mt-auto space-y-3 pt-4 border-t border-gray-100 shrink-0">
<div class="flex justify-between text-sm">
<span class="text-gray-500">创建时间</span>
<span class="text-gray-800">{{ formatTime(currentTask.creationTime) }}</span>
@@ -118,7 +122,7 @@ import TaskCard from './TaskCard.vue';
import { format } from 'date-fns';
import { ElMessage } from 'element-plus';
import { useClipboard } from '@vueuse/core';
import { Picture, Loading, MagicStick, CopyDocument } from '@element-plus/icons-vue';
import { Picture, Loading, MagicStick, CopyDocument, Download } from '@element-plus/icons-vue';
const emit = defineEmits(['use-prompt', 'use-reference']);
@@ -197,6 +201,24 @@ const copyPrompt = async (text: string) => {
await copy(text);
ElMessage.success('提示词已复制');
};
const downloadImage = async (url: string) => {
try {
const response = await fetch(url);
const blob = await response.blob();
const blobUrl = window.URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = blobUrl;
link.download = `image-${Date.now()}.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
window.URL.revokeObjectURL(blobUrl);
} catch (e) {
console.error('Download failed', e);
window.open(url, '_blank');
}
};
</script>
<style scoped>