From f32a7105c38ee455c4b165d48651ef19fc6948db Mon Sep 17 00:00:00 2001 From: ahaos <8406649+lhailgl@user.noreply.gitee.com> Date: 星期三, 13 十二月 2023 18:35:55 +0800 Subject: [PATCH] !68 修复升级依赖带来的问题 * 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 | 39 +++++++++++++++------------------------ 1 files changed, 15 insertions(+), 24 deletions(-) diff --git a/src/components/ImagePreview/index.vue b/src/components/ImagePreview/index.vue index 1dfe123..31bf873 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,7 +27,7 @@ if (!props.src) { return; } - let real_src = props.src.split(",")[0]; + let real_src = props.src.split(',')[0]; return real_src; }); @@ -43,21 +35,17 @@ if (!props.src) { 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