<template>
    <el-image class="app-image" fit="cover" :style="styles">
        <template #error>
            <div class="app-image__error">
                <app-icon icon="Picture" />
            </div>
        </template>
    </el-image>
</template>

<script lang="ts" setup>
import { computed } from 'vue'
import AppIcon from '@pc/components/base/icon/index.vue'

const props = defineProps({
    width: Number,
    height: Number,
})

const styles = computed(() => {
    return {
        width: props.width ? props.width + 'px' : 'auto',
        height: props.height ? props.height + 'px' : 'auto',
    }
})
</script>

<style lang="less">
@import './index.less';
</style>