From 1d5133b6957d95c0c2b1e9641f21a03d9a1c85bb Mon Sep 17 00:00:00 2001
From: ahaos <8406649+lhailgl@user.noreply.gitee.com>
Date: 星期四, 14 十二月 2023 16:17:12 +0800
Subject: [PATCH] !69 修复升级依赖带来的类型问题 * fix 修复变量问题 * Merge remote-tracking branch 'origin/dev' into dev * update 依赖升级 * update 依赖升级 * Merge remote-tracking branch 'origin/dev' into dev * 升级依赖 * Merge remote-tracking branch 'origin/ts' into ts * 升级依赖 * Merge branch 'dev' of gitee.com:JavaLionLi/plus-ui into ts * 升级依赖 * !61 fix: 删除重复环境变量ElUploadInstance * fix: 删除重复环境变量ElUploadInstance
---
src/components/ImagePreview/index.vue | 41 ++++++++++++++++-------------------------
1 files changed, 16 insertions(+), 25 deletions(-)
diff --git a/src/components/ImagePreview/index.vue b/src/components/ImagePreview/index.vue
index 1dfe123..5543923 100644
--- a/src/components/ImagePreview/index.vue
+++ b/src/components/ImagePreview/index.vue
@@ -1,11 +1,5 @@
<template>
- <el-image
- :src="`${realSrc}`"
- fit="cover"
- :style="`width:${realWidth};height:${realHeight};`"
- :preview-src-list="realSrcList"
- preview-teleported
- >
+ <el-image :src="`${realSrc}`" fit="cover" :style="`width:${realWidth};height:${realHeight};`" :preview-src-list="realSrcList" preview-teleported>
<template #error>
<div class="image-slot">
<el-icon><picture-filled /></el-icon>
@@ -14,20 +8,18 @@
</el-image>
</template>
-<script setup>
+<script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
const props = defineProps({
- src: {
- type: String,
- default: ""
- },
+ src: propTypes.string.def(''),
width: {
type: [Number, String],
- default: ""
+ default: ''
},
height: {
type: [Number, String],
- default: ""
+ default: ''
}
});
@@ -35,29 +27,25 @@
if (!props.src) {
return;
}
- let real_src = props.src.split(",")[0];
+ let real_src = props.src.split(',')[0];
return real_src;
});
const realSrcList = computed(() => {
if (!props.src) {
- return;
+ return [];
}
- let real_src_list = props.src.split(",");
- let srcList = [];
- real_src_list.forEach(item => {
+ let real_src_list = props.src.split(',');
+ let srcList: string[] = [];
+ real_src_list.forEach((item: string) => {
return srcList.push(item);
});
return srcList;
});
-const realWidth = computed(() =>
- typeof props.width == "string" ? props.width : `${props.width}px`
-);
+const realWidth = computed(() => (typeof props.width == 'string' ? props.width : `${props.width}px`));
-const realHeight = computed(() =>
- typeof props.height == "string" ? props.height : `${props.height}px`
-);
+const realHeight = computed(() => (typeof props.height == 'string' ? props.height : `${props.height}px`));
</script>
<style lang="scss" scoped>
@@ -65,13 +53,16 @@
border-radius: 5px;
background-color: #ebeef5;
box-shadow: 0 0 5px 1px #ccc;
+
:deep(.el-image__inner) {
transition: all 0.3s;
cursor: pointer;
+
&:hover {
transform: scale(1.2);
}
}
+
:deep(.image-slot) {
display: flex;
justify-content: center;
--
Gitblit v1.9.3