From 2fef02a5bf0a565411e1d213c4793c968aab7b3b Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Fri, 30 May 2025 14:19:59 +0800
Subject: [PATCH] feat:算法仓库图片预览-暂无缩略图
---
src/views/algorithmRepository/algorithmRepository.vue | 25 +++++++++++++++++++++----
1 files changed, 21 insertions(+), 4 deletions(-)
diff --git a/src/views/algorithmRepository/algorithmRepository.vue b/src/views/algorithmRepository/algorithmRepository.vue
index ac63bf2..8431819 100644
--- a/src/views/algorithmRepository/algorithmRepository.vue
+++ b/src/views/algorithmRepository/algorithmRepository.vue
@@ -10,7 +10,7 @@
@click="jumpDatail(item)"
>
<img class="imgicon" :src="`${baseUrl}/后台-算法仓库/${item.dictValue}.png`" alt="" />
- <div>{{ item.dictValue }}</div>
+ <div class="item-title">{{ item.dictValue }}</div>
<div
:class="!statusSign && item.dictValue === nameSign ? 'stopStatus' : 'normalStatus'"
@click.stop="changeStatus(item)"
@@ -65,7 +65,14 @@
element-loading-text="加载中"
>
<div class="imgitem" v-for="(item, index) in detailData" :key="index">
- <img :src="item.url" alt="" />
+ <el-image
+ ref="imageRef"
+ :src="item.url"
+ show-progress
+ :preview-src-list="detailData.map(i => i.url)"
+ fit="cover"
+ />
+
<div class="info">
<div class="name">{{ item.name }}</div>
<div class="time">{{ item.create_time.slice(5, 16).replace('-', '/', 1) }}</div>
@@ -100,7 +107,7 @@
});
import { getDictionaryByCode } from '@/api/system/dictbiz';
import { getalgorithmList, selectDeviceList } from '@/api/algorithm';
-
+import { getSmallImg } from '@/utils/util'
import { useRouter } from 'vue-router';
const router = useRouter();
const baseUrl = import.meta.env.VITE_APP_TERRAIN_URL;
@@ -119,6 +126,11 @@
current: 1,
size: 10,
});
+
+// const getSmallImg = (url) => {
+
+// return url ? encodeURI(url.substring(0, url.lastIndexOf('.')) + '_small' + url.substring(url.lastIndexOf('.'))) : ''
+// }
// 请求字典字段
let AlgorithmData = ref([]);
const detailData = ref([]);
@@ -211,6 +223,11 @@
align-items: center;
background: url('/src/assets/images/ht-sfbg.png') no-repeat center;
background-size: 100% 100%;
+ .item-title {
+ font-weight: bold;
+ font-size: 18px;
+ color: #656565;
+ }
.imgicon {
width: 100px;
height: 100px;
@@ -267,7 +284,7 @@
.imgitem {
border-radius: 12px 12px 0 0;
overflow: hidden;
- img {
+ .el-image {
width: 100%;
height: 200px;
display: block;
--
Gitblit v1.9.3