From d43ae50abc9461a9b20b3f015ba3679ba699dfa2 Mon Sep 17 00:00:00 2001
From: LiuHao <liuhaoai545@gmail.com>
Date: 星期二, 06 六月 2023 22:52:24 +0800
Subject: [PATCH] update 修改组件 去除无用引用和代码缩进
---
src/components/ImagePreview/index.vue | 58 ++++++++++++++++++++++++++++++----------------------------
1 files changed, 30 insertions(+), 28 deletions(-)
diff --git a/src/components/ImagePreview/index.vue b/src/components/ImagePreview/index.vue
index 57019e3..723ccdb 100644
--- a/src/components/ImagePreview/index.vue
+++ b/src/components/ImagePreview/index.vue
@@ -9,47 +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;
- }
- let real_src_list = props.src.split(",");
- let srcList:string[] = [];
- real_src_list.forEach(item => {
- return srcList.push(item);
- });
- return srcList;
+ if (!props.src) {
+ return;
+ }
+ let real_src_list = props.src.split(",");
+ let srcList: string[] = [];
+ real_src_list.forEach(item => {
+ return srcList.push(item);
+ });
+ return srcList;
});
const realWidth = computed(() =>
- typeof props.width == "string" ? props.width : `${props.width}px`
+ typeof props.width == "string" ? props.width : `${props.width}px`
);
const realHeight = computed(() =>
- typeof props.height == "string" ? props.height : `${props.height}px`
+ typeof props.height == "string" ? props.height : `${props.height}px`
);
</script>
@@ -58,13 +57,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