ant-design-vue/components/skeleton/Avatar.jsx

35 lines
923 B
Vue
Raw Normal View History

2019-01-12 11:33:27 +08:00
import classNames from 'classnames';
import PropTypes from '../_util/vue-types';
import { initDefaultProps } from '../_util/props-util';
2018-12-10 11:34:51 +08:00
const skeletonAvatarProps = {
prefixCls: PropTypes.string,
size: PropTypes.oneOf(['large', 'small', 'default']),
shape: PropTypes.oneOf(['circle', 'square']),
2019-01-12 11:33:27 +08:00
};
2018-12-10 11:34:51 +08:00
2019-01-12 11:33:27 +08:00
export const SkeletonAvatarProps = PropTypes.shape(skeletonAvatarProps).loose;
2018-12-10 11:34:51 +08:00
const Avatar = {
props: initDefaultProps(skeletonAvatarProps, {
size: 'large',
}),
2019-01-12 11:33:27 +08:00
render() {
const { prefixCls, size, shape } = this.$props;
2018-12-10 11:34:51 +08:00
const sizeCls = classNames({
[`${prefixCls}-lg`]: size === 'large',
[`${prefixCls}-sm`]: size === 'small',
2019-01-12 11:33:27 +08:00
});
2018-12-10 11:34:51 +08:00
const shapeCls = classNames({
[`${prefixCls}-circle`]: shape === 'circle',
[`${prefixCls}-square`]: shape === 'square',
2019-01-12 11:33:27 +08:00
});
2018-12-10 11:34:51 +08:00
2019-01-12 11:33:27 +08:00
return <span class={classNames(prefixCls, sizeCls, shapeCls)} />;
2018-12-10 11:34:51 +08:00
},
2019-01-12 11:33:27 +08:00
};
2018-12-10 11:34:51 +08:00
2019-01-12 11:33:27 +08:00
export default Avatar;