Compare commits
No commits in common. "6836bc59b78ee3f8e2791f849931735a344ae475" and "0f98692b254d4af0433bea478cc33f587903037c" have entirely different histories.
6836bc59b7
...
0f98692b25
@ -1,395 +0,0 @@
|
||||
<template>
|
||||
<div class="coi-image-viewer">
|
||||
<!-- 缩略图展示 -->
|
||||
<div
|
||||
class="thumbnail-container"
|
||||
:style="{ width: `${width}px`, height: `${height}px` }"
|
||||
@click="handlePreview"
|
||||
>
|
||||
<img
|
||||
v-if="!imageError && src"
|
||||
:src="src"
|
||||
:alt="alt || 'image'"
|
||||
class="thumbnail-image"
|
||||
@load="handleImageLoad"
|
||||
@error="handleImageError"
|
||||
>
|
||||
<div v-else class="error-placeholder">
|
||||
<NIcon size="16" class="error-icon">
|
||||
<IconParkOutlinePic />
|
||||
</NIcon>
|
||||
<span class="error-text">加载失败</span>
|
||||
</div>
|
||||
|
||||
<!-- 悬停遮罩层 -->
|
||||
<div class="hover-overlay">
|
||||
<NIcon size="18" class="preview-icon">
|
||||
<IconParkOutlinePreviewOpen />
|
||||
</NIcon>
|
||||
<span class="preview-text">点击预览</span>
|
||||
</div>
|
||||
|
||||
<!-- 加载状态 -->
|
||||
<div v-if="loading" class="loading-overlay">
|
||||
<NSpin size="small" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 大图预览弹框 -->
|
||||
<NModal
|
||||
v-model:show="previewVisible"
|
||||
preset="card"
|
||||
:title="modalTitle"
|
||||
:style="{ width: '90%', maxWidth: '1200px' }"
|
||||
:mask-closable="true"
|
||||
:closable="true"
|
||||
:auto-focus="false"
|
||||
:trap-focus="false"
|
||||
>
|
||||
<div class="preview-container">
|
||||
<img
|
||||
v-if="!previewError"
|
||||
:src="src"
|
||||
:alt="alt || 'preview'"
|
||||
class="preview-image"
|
||||
@load="handlePreviewLoad"
|
||||
@error="handlePreviewError"
|
||||
>
|
||||
<div v-else class="preview-error">
|
||||
<NIcon size="48" class="error-icon">
|
||||
<IconParkOutlinePic />
|
||||
</NIcon>
|
||||
<p class="error-message">
|
||||
图片加载失败
|
||||
</p>
|
||||
<p class="error-url">
|
||||
{{ src }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- 预览加载状态 -->
|
||||
<div v-if="previewLoading" class="preview-loading">
|
||||
<NSpin size="large" />
|
||||
<p class="loading-text">
|
||||
图片加载中...
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 弹框底部操作 -->
|
||||
<template #action>
|
||||
<NSpace justify="space-between">
|
||||
<NSpace>
|
||||
<NButton size="small" @click="handleDownload">
|
||||
<template #icon>
|
||||
<NIcon><IconParkOutlineDownload /></NIcon>
|
||||
</template>
|
||||
下载图片
|
||||
</NButton>
|
||||
<NButton size="small" @click="handleCopyUrl">
|
||||
<template #icon>
|
||||
<NIcon><IconParkOutlineCopy /></NIcon>
|
||||
</template>
|
||||
复制链接
|
||||
</NButton>
|
||||
</NSpace>
|
||||
<NButton type="primary" @click="previewVisible = false">
|
||||
关闭
|
||||
</NButton>
|
||||
</NSpace>
|
||||
</template>
|
||||
</NModal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { coiMsgError, coiMsgSuccess } from '@/utils/coi'
|
||||
import IconParkOutlinePic from '~icons/icon-park-outline/pic'
|
||||
import IconParkOutlinePreviewOpen from '~icons/icon-park-outline/preview-open'
|
||||
import IconParkOutlineDownload from '~icons/icon-park-outline/download'
|
||||
import IconParkOutlineCopy from '~icons/icon-park-outline/copy'
|
||||
|
||||
interface Props {
|
||||
/** 图片链接 */
|
||||
src: string | undefined
|
||||
/** 图片描述 */
|
||||
alt?: string
|
||||
/** 缩略图宽度 */
|
||||
width?: number
|
||||
/** 缩略图高度 */
|
||||
height?: number
|
||||
/** 是否可以预览 */
|
||||
previewable?: boolean
|
||||
/** 预览弹框标题 */
|
||||
title?: string
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
alt: '',
|
||||
width: 50,
|
||||
height: 40,
|
||||
previewable: true,
|
||||
title: '图片预览',
|
||||
})
|
||||
|
||||
// 缩略图状态
|
||||
const loading = ref(true)
|
||||
const imageError = ref(false)
|
||||
|
||||
// 预览状态
|
||||
const previewVisible = ref(false)
|
||||
const previewLoading = ref(false)
|
||||
const previewError = ref(false)
|
||||
|
||||
// 计算弹框标题
|
||||
const modalTitle = computed(() => {
|
||||
return props.title || props.alt || '图片预览'
|
||||
})
|
||||
|
||||
// 缩略图加载完成
|
||||
function handleImageLoad() {
|
||||
loading.value = false
|
||||
imageError.value = false
|
||||
}
|
||||
|
||||
// 缩略图加载错误
|
||||
function handleImageError() {
|
||||
loading.value = false
|
||||
imageError.value = true
|
||||
}
|
||||
|
||||
// 点击预览
|
||||
function handlePreview() {
|
||||
if (!props.previewable || imageError.value) {
|
||||
return
|
||||
}
|
||||
|
||||
previewVisible.value = true
|
||||
previewLoading.value = true
|
||||
previewError.value = false
|
||||
}
|
||||
|
||||
// 预览图片加载完成
|
||||
function handlePreviewLoad() {
|
||||
previewLoading.value = false
|
||||
previewError.value = false
|
||||
}
|
||||
|
||||
// 预览图片加载错误
|
||||
function handlePreviewError() {
|
||||
previewLoading.value = false
|
||||
previewError.value = true
|
||||
}
|
||||
|
||||
// 下载图片
|
||||
async function handleDownload() {
|
||||
try {
|
||||
const link = document.createElement('a')
|
||||
link.href = props.src
|
||||
link.download = props.alt || 'image'
|
||||
link.target = '_blank'
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link)
|
||||
coiMsgSuccess('下载已开始')
|
||||
}
|
||||
catch {
|
||||
coiMsgError('下载失败，请重试')
|
||||
}
|
||||
}
|
||||
|
||||
// 复制图片链接
|
||||
async function handleCopyUrl() {
|
||||
try {
|
||||
await navigator.clipboard.writeText(props.src)
|
||||
coiMsgSuccess('链接已复制到剪贴板')
|
||||
}
|
||||
catch {
|
||||
coiMsgError('复制失败，请手动复制')
|
||||
}
|
||||
}
|
||||
|
||||
// 重置状态（当src变化时）
|
||||
watch(
|
||||
() => props.src,
|
||||
() => {
|
||||
loading.value = true
|
||||
imageError.value = false
|
||||
previewError.value = false
|
||||
},
|
||||
{ immediate: true },
|
||||
)
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.coi-image-viewer {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.thumbnail-container {
|
||||
position: relative;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
background: var(--card-color);
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.thumbnail-container:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.thumbnail-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.thumbnail-container:hover .thumbnail-image {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
/* 当组件被设置为100%宽高时的样式调整 */
|
||||
.coi-image-viewer.w-full.h-full .thumbnail-container {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.error-placeholder {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: var(--card-color);
|
||||
color: var(--text-color-3);
|
||||
border: 1px dashed var(--border-color);
|
||||
}
|
||||
|
||||
.error-icon {
|
||||
margin-bottom: 4px;
|
||||
color: var(--text-color-3);
|
||||
}
|
||||
|
||||
.error-text {
|
||||
font-size: 10px;
|
||||
color: var(--text-color-3);
|
||||
}
|
||||
|
||||
.hover-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.thumbnail-container:hover .hover-overlay {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.preview-icon {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.preview-text {
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.loading-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: var(--card-color);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.preview-container {
|
||||
position: relative;
|
||||
min-height: 300px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: var(--body-color);
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.preview-image {
|
||||
max-width: 100%;
|
||||
max-height: 70vh;
|
||||
object-fit: contain;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.preview-error {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--text-color-3);
|
||||
text-align: center;
|
||||
padding: 40px 20px;
|
||||
}
|
||||
|
||||
.error-message {
|
||||
font-size: 16px;
|
||||
margin: 16px 0 8px 0;
|
||||
color: var(--text-color-2);
|
||||
}
|
||||
|
||||
.error-url {
|
||||
font-size: 12px;
|
||||
color: var(--text-color-3);
|
||||
word-break: break-all;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.preview-loading {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: var(--modal-color);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
margin-top: 16px;
|
||||
color: var(--text-color-2);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* 响应式适配 */
|
||||
@media (max-width: 768px) {
|
||||
.preview-container {
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
.preview-image {
|
||||
max-height: 50vh;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -59,14 +59,12 @@ export interface FileUploadResult {
|
||||
// 文件服务类型枚举
|
||||
export enum FileServiceType {
|
||||
LOCAL = 'LOCAL', // 本地存储
|
||||
MINIO = 'MINIO', // MinIO对象存储
|
||||
OSS = 'OSS', // 阿里云对象存储
|
||||
}
|
||||
|
||||
// 文件服务类型映射（用于数据库存储）
|
||||
export const FileServiceTypeMapping = {
|
||||
LOCAL: '1',
|
||||
MINIO: '2',
|
||||
OSS: '3',
|
||||
} as const
|
||||
|
||||
@ -97,13 +95,11 @@ export const FILE_TYPE_OPTIONS = [
|
||||
// 文件服务类型选项
|
||||
export const FILE_SERVICE_OPTIONS = [
|
||||
{ label: '本地存储', value: FileServiceType.LOCAL },
|
||||
{ label: 'MinIO存储', value: FileServiceType.MINIO },
|
||||
{ label: '阿里云OSS', value: FileServiceType.OSS },
|
||||
]
|
||||
|
||||
// 文件服务类型数据库值选项（用于搜索）
|
||||
export const FILE_SERVICE_DB_OPTIONS = [
|
||||
{ label: '本地存储', value: '1' },
|
||||
{ label: 'MinIO存储', value: '2' },
|
||||
{ label: '阿里云OSS', value: '3' },
|
||||
]
|
||||
|
||||
@ -59,7 +59,6 @@ export interface PictureUploadResult {
|
||||
// 图片服务类型枚举
|
||||
export enum PictureServiceType {
|
||||
LOCAL = '1', // 本地存储
|
||||
MINIO = '2', // MinIO对象存储
|
||||
OSS = '3', // 阿里云对象存储
|
||||
}
|
||||
|
||||
@ -90,6 +89,5 @@ export const PICTURE_TYPE_OPTIONS = [
|
||||
// 图片服务类型选项
|
||||
export const PICTURE_SERVICE_OPTIONS = [
|
||||
{ label: '本地存储', value: PictureServiceType.LOCAL },
|
||||
{ label: 'MinIO存储', value: PictureServiceType.MINIO },
|
||||
{ label: '阿里云OSS', value: PictureServiceType.OSS },
|
||||
]
|
||||
|
||||
@ -433,15 +433,9 @@ async function handleAvatarChange(event: Event) {
|
||||
uploading.value = true
|
||||
const result = await uploadAvatar(file, 2)
|
||||
if (result.isSuccess) {
|
||||
// 智能处理头像访问URL
|
||||
let avatarUrl = result.data.fileUploadPath
|
||||
|
||||
// 如果返回的不是完整URL（如本地存储返回相对路径），则添加服务地址前缀
|
||||
if (!avatarUrl.startsWith('http://') && !avatarUrl.startsWith('https://')) {
|
||||
// 使用配置文件中的服务地址构建头像访问URL
|
||||
const baseUrl = serviceConfig[import.meta.env.MODE].url
|
||||
avatarUrl = `${baseUrl}${avatarUrl}`
|
||||
}
|
||||
// 如果返回的是完整URL（如MinIO、OSS），直接使用
|
||||
const avatarUrl = `${baseUrl}${result.data.fileUploadPath}`
|
||||
|
||||
basicForm.value.avatar = avatarUrl
|
||||
personalData.value.avatar = avatarUrl
|
||||
|
||||
@ -217,7 +217,6 @@
|
||||
:options="[
|
||||
{ label: 'LOCAL', value: 'LOCAL' },
|
||||
{ label: 'OSS', value: 'OSS' },
|
||||
{ label: 'MINIO', value: 'MINIO' },
|
||||
]"
|
||||
/>
|
||||
</n-form-item>
|
||||
@ -272,16 +271,36 @@
|
||||
</div>
|
||||
</template>
|
||||
</CoiDialog>
|
||||
|
||||
<!-- 图片预览弹框 -->
|
||||
<n-modal
|
||||
v-model:show="imagePreviewVisible"
|
||||
preset="card"
|
||||
title="图片预览"
|
||||
:style="{ width: '80%', maxWidth: '800px' }"
|
||||
:mask-closable="true"
|
||||
>
|
||||
<div class="text-center">
|
||||
<img
|
||||
v-if="previewImageUrl"
|
||||
:src="previewImageUrl"
|
||||
:alt="previewImageName"
|
||||
class="max-w-full max-h-96 mx-auto"
|
||||
>
|
||||
<div class="mt-2 text-sm text-gray-500">
|
||||
{{ previewImageName }}
|
||||
</div>
|
||||
</div>
|
||||
</n-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { h, onMounted, ref } from 'vue'
|
||||
import { NButton, NIcon, NP, NPopconfirm, NSpace, NTag, NText, NUpload, NUploadDragger } from 'naive-ui'
|
||||
import { NButton, NIcon, NImage, NP, NPopconfirm, NSpace, NTag, NText, NUpload, NUploadDragger } from 'naive-ui'
|
||||
import type { DataTableColumns, DataTableInst, FormInst, UploadFileInfo, UploadInst } from 'naive-ui'
|
||||
import CoiEmpty from '@/components/common/CoiEmpty.vue'
|
||||
import CoiPagination from '@/components/common/CoiPagination.vue'
|
||||
import CoiImageViewer from '@/components/common/CoiImageViewer.vue'
|
||||
import { coiMsgBox, coiMsgError, coiMsgSuccess, coiMsgWarning } from '@/utils/coi'
|
||||
import { usePermission } from '@/hooks/usePermission'
|
||||
import { PERMISSIONS } from '@/constants/permissions'
|
||||
@ -341,6 +360,11 @@ const searchForm = ref<SysFileSearchForm>({
|
||||
fileType: '0', // 默认全部
|
||||
})
|
||||
|
||||
// 图片预览相关
|
||||
const imagePreviewVisible = ref(false)
|
||||
const previewImageUrl = ref('')
|
||||
const previewImageName = ref('')
|
||||
|
||||
// 文件上传相关
|
||||
const uploadFileList = ref<UploadFileInfo[]>([])
|
||||
const uploading = ref(false)
|
||||
@ -434,13 +458,14 @@ const columns: DataTableColumns<SysFileVo> = [
|
||||
)
|
||||
|
||||
if (isImage && row.filePath) {
|
||||
return h(CoiImageViewer, {
|
||||
return h(NImage, {
|
||||
src: row.filePath,
|
||||
alt: row.fileName,
|
||||
width: 50,
|
||||
height: 40,
|
||||
previewable: true,
|
||||
title: `文件预览 - ${row.fileName}`,
|
||||
width: 45,
|
||||
height: 30,
|
||||
objectFit: 'cover',
|
||||
previewDisabled: true,
|
||||
onClick: () => handleImagePreview(row.filePath!, row.fileName),
|
||||
class: 'cursor-pointer rounded border',
|
||||
})
|
||||
}
|
||||
|
||||
@ -456,7 +481,6 @@ const columns: DataTableColumns<SysFileVo> = [
|
||||
render: (row) => {
|
||||
const serviceMap: Record<string, { type: 'success' | 'info' | 'warning', text: string }> = {
|
||||
1: { type: 'success', text: '本地存储' },
|
||||
2: { type: 'info', text: 'MinIO存储' },
|
||||
3: { type: 'warning', text: '阿里云OSS' },
|
||||
}
|
||||
const config = serviceMap[row.fileService] || { type: 'info', text: '未知' }
|
||||
@ -652,6 +676,13 @@ function handleDownload(row: SysFileVo) {
|
||||
}
|
||||
}
|
||||
|
||||
// 图片预览
|
||||
function handleImagePreview(url: string, name: string) {
|
||||
previewImageUrl.value = url
|
||||
previewImageName.value = name
|
||||
imagePreviewVisible.value = true
|
||||
}
|
||||
|
||||
// 文件上传相关函数
|
||||
|
||||
// 打开上传弹框
|
||||
|
||||
@ -191,16 +191,13 @@
|
||||
<template #trigger>
|
||||
<div class="picture-card group relative bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden hover:shadow-md transition-shadow cursor-pointer">
|
||||
<!-- 图片预览 -->
|
||||
<div class="aspect-square relative overflow-hidden bg-gray-100 flex items-center justify-center">
|
||||
<CoiImageViewer
|
||||
<div class="aspect-square relative overflow-hidden bg-gray-100">
|
||||
<img
|
||||
:src="picture.picturePath"
|
||||
:alt="picture.pictureName"
|
||||
:width="200"
|
||||
:height="200"
|
||||
:previewable="true"
|
||||
:title="`图片预览 - ${picture.pictureName}`"
|
||||
class="w-full h-full"
|
||||
/>
|
||||
class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-200"
|
||||
@error="handleImageError"
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- 图片信息 -->
|
||||
@ -347,7 +344,6 @@
|
||||
:options="[
|
||||
{ label: 'LOCAL', value: 'LOCAL' },
|
||||
{ label: 'OSS', value: 'OSS' },
|
||||
{ label: 'MINIO', value: 'MINIO' },
|
||||
]"
|
||||
/>
|
||||
</n-form-item>
|
||||
@ -406,12 +402,11 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { h, onMounted, ref } from 'vue'
|
||||
import { NButton, NIcon, NP, NPopconfirm, NSpace, NSpin, NTag, NText, NTooltip, NUpload, NUploadDragger } from 'naive-ui'
|
||||
import { NButton, NIcon, NImage, NP, NPopconfirm, NSpace, NSpin, NTag, NText, NTooltip, NUpload, NUploadDragger } from 'naive-ui'
|
||||
import type { DataTableColumns, DataTableInst, FormInst, UploadFileInfo, UploadInst } from 'naive-ui'
|
||||
import CoiEmpty from '@/components/common/CoiEmpty.vue'
|
||||
import CoiDialog from '@/components/common/CoiDialog.vue'
|
||||
import CoiPagination from '@/components/common/CoiPagination.vue'
|
||||
import CoiImageViewer from '@/components/common/CoiImageViewer.vue'
|
||||
import { coiMsgBox, coiMsgError, coiMsgSuccess, coiMsgWarning } from '@/utils/coi'
|
||||
import { usePermission } from '@/hooks/usePermission'
|
||||
import { PERMISSIONS } from '@/constants/permissions'
|
||||
@ -575,13 +570,13 @@ const columns: DataTableColumns<SysPictureVo> = [
|
||||
},
|
||||
render: (row) => {
|
||||
if (row.picturePath) {
|
||||
return h(CoiImageViewer, {
|
||||
return h(NImage, {
|
||||
src: row.picturePath,
|
||||
alt: row.pictureName,
|
||||
width: 50,
|
||||
height: 40,
|
||||
previewable: true,
|
||||
title: `图片预览 - ${row.pictureName}`,
|
||||
width: 45,
|
||||
height: 30,
|
||||
objectFit: 'cover',
|
||||
previewDisabled: true,
|
||||
class: 'rounded border',
|
||||
})
|
||||
}
|
||||
return '--'
|
||||
@ -595,7 +590,6 @@ const columns: DataTableColumns<SysPictureVo> = [
|
||||
render: (row) => {
|
||||
const serviceMap: Record<string, { type: 'success' | 'info' | 'warning', text: string }> = {
|
||||
1: { type: 'success', text: '本地存储' },
|
||||
2: { type: 'info', text: 'MinIO存储' },
|
||||
3: { type: 'warning', text: '阿里云OSS' },
|
||||
}
|
||||
const config = serviceMap[row.pictureService] || { type: 'info', text: '未知' }
|
||||
@ -801,11 +795,16 @@ function handleDownload(row: SysPictureVo) {
|
||||
}
|
||||
}
|
||||
|
||||
// 图片加载错误处理
|
||||
function handleImageError(e: Event) {
|
||||
const img = e.target as HTMLImageElement
|
||||
img.src = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjY0IiBoZWlnaHQ9IjY0IiBmaWxsPSIjRjVGNUY1Ii8+CjxwYXRoIGQ9Ik0yMCAyMEw0NCA0NEwyMCA0NFYyMFoiIGZpbGw9IiNEOUQ5RDkiLz4KPGNpcmNsZSBjeD0iMjgiIGN5PSIyOCIgcj0iNCIgZmlsbD0iI0Q5RDlEOSIvPgo8L3N2Zz4K'
|
||||
}
|
||||
|
||||
// 获取图片服务类型文本
|
||||
function getPictureServiceText(serviceType: string): string {
|
||||
const serviceMap: Record<string, string> = {
|
||||
1: '本地存储',
|
||||
2: 'MinIO存储',
|
||||
3: '阿里云OSS',
|
||||
}
|
||||
return serviceMap[serviceType] || '未知'
|
||||
|
||||
Loading…
Reference in New Issue
Block a user