<script>
    import Vue from 'vue';
    import {Avatar} from 'view-design';
    import {oneOf} from 'view-design/src/utils/assist';
    import FunctionComponent from "../../../libs/utils/FunctionComponent";

    const prefixCls = 'ivu-avatar';
    const sizeList = ['small', 'large', 'default', 'bLarge'];

    const _Avatar = Vue.extend({
        name: 'HtBaseAvatar',
        extends: Avatar,
        props: {
            size: {
                type: [String, Number],
                default () {
                    return !this.$IVIEW || this.$IVIEW.size === '' ? 'default' : this.$IVIEW.size;
                }
            },
        },
        computed: {
            classes () {
                return [
                    `${prefixCls}`,
                    `${prefixCls}-${this.shape}`,
                    {
                        [`${prefixCls}-image`]: !!this.src,
                        [`${prefixCls}-icon`]: !!this.icon || !!this.customIcon,
                        [`${prefixCls}-${this.size}`]: oneOf(this.size, sizeList)
                    }
                ];
            }
        }
    });
    export default FunctionComponent(_Avatar, 'ht-base-avatar', 'i',{
        preDispose(ctx) {
            if (ctx.props.icon) {
                this.props.icon = ' uedicon ht-base-' + ctx.props.icon;
            }
        }
    })
</script>