43 lines
885 B
Vue
43 lines
885 B
Vue
<template>
|
|
<el-image :style="styles" v-bind="props" :preview-teleported="true"> </el-image>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { computed } from 'vue'
|
|
import type { CSSProperties } from 'vue'
|
|
import { addUnit } from '@/utils/util'
|
|
import { imageProps } from 'element-plus'
|
|
const props = defineProps({
|
|
width: {
|
|
type: [String, Number],
|
|
default: 'auto'
|
|
},
|
|
height: {
|
|
type: [String, Number],
|
|
default: 'auto'
|
|
},
|
|
radius: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
...imageProps
|
|
})
|
|
|
|
const styles = computed<CSSProperties>(() => {
|
|
return {
|
|
width: addUnit(props.width),
|
|
height: addUnit(props.height),
|
|
borderRadius: addUnit(props.radius)
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.el-image {
|
|
display: block;
|
|
.el-image__error {
|
|
@apply text-xs;
|
|
}
|
|
}
|
|
</style>
|