From e181f04c642204e79749af93fa921875ff6c21ba Mon Sep 17 00:00:00 2001 From: baoshiwei <baoshiwei@shlanbao.cn> Date: 星期二, 20 五月 2025 10:46:35 +0800 Subject: [PATCH] refactor(qms): 重构趋势图展示逻辑 --- src/components/ImagePreview/index.vue | 63 ++++++++++++++++--------------- 1 files changed, 32 insertions(+), 31 deletions(-) diff --git a/src/components/ImagePreview/index.vue b/src/components/ImagePreview/index.vue index 57019e3..98e6479 100644 --- a/src/components/ImagePreview/index.vue +++ b/src/components/ImagePreview/index.vue @@ -9,48 +9,46 @@ </template> <script setup lang="ts"> +import { propTypes } from '@/utils/propTypes'; + const props = defineProps({ - src: { - type: String, - default: "" - }, - width: { - type: [Number, String], - default: "" - }, - height: { - type: [Number, String], - default: "" - } + src: propTypes.string.def(''), + width: { + type: [Number, String], + default: '' + }, + height: { + type: [Number, String], + default: '' + } }); const realSrc = computed(() => { - if (!props.src) { - return; - } - let real_src = props.src.split(",")[0]; - return real_src; + if (!props.src) { + return; + } + let real_src = props.src.split(',')[0]; + return real_src; }); const realSrcList = computed(() => { - if (!props.src) { - return; + if (!props.src) { + return []; + } + let real_src_list = props.src.split(','); + let srcList: string[] = []; + real_src_list.forEach((item: string) => { + if (item.trim() === '') { + return; } - let real_src_list = props.src.split(","); - let srcList:string[] = []; - real_src_list.forEach(item => { - return srcList.push(item); - }); - return srcList; + 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> @@ -58,13 +56,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