avatar2.mjs 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. import { defineComponent, ref, computed, watch, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, createBlock, withCtx, resolveDynamicComponent, renderSlot } from 'vue';
  2. import { ElIcon } from '../../icon/index.mjs';
  3. import '../../../hooks/index.mjs';
  4. import '../../../utils/index.mjs';
  5. import { avatarProps, avatarEmits } from './avatar.mjs';
  6. import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
  7. import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
  8. import { isString } from '@vue/shared';
  9. import { isNumber } from '../../../utils/types.mjs';
  10. import { addUnit } from '../../../utils/dom/style.mjs';
  11. const _hoisted_1 = ["src", "alt", "srcset"];
  12. const __default__ = defineComponent({
  13. name: "ElAvatar"
  14. });
  15. const _sfc_main = /* @__PURE__ */ defineComponent({
  16. ...__default__,
  17. props: avatarProps,
  18. emits: avatarEmits,
  19. setup(__props, { emit }) {
  20. const props = __props;
  21. const ns = useNamespace("avatar");
  22. const hasLoadError = ref(false);
  23. const avatarClass = computed(() => {
  24. const { size, icon, shape } = props;
  25. const classList = [ns.b()];
  26. if (isString(size))
  27. classList.push(ns.m(size));
  28. if (icon)
  29. classList.push(ns.m("icon"));
  30. if (shape)
  31. classList.push(ns.m(shape));
  32. return classList;
  33. });
  34. const sizeStyle = computed(() => {
  35. const { size } = props;
  36. return isNumber(size) ? ns.cssVarBlock({
  37. size: addUnit(size) || ""
  38. }) : void 0;
  39. });
  40. const fitStyle = computed(() => ({
  41. objectFit: props.fit
  42. }));
  43. watch(() => props.src, () => hasLoadError.value = false);
  44. function handleError(e) {
  45. hasLoadError.value = true;
  46. emit("error", e);
  47. }
  48. return (_ctx, _cache) => {
  49. return openBlock(), createElementBlock("span", {
  50. class: normalizeClass(unref(avatarClass)),
  51. style: normalizeStyle(unref(sizeStyle))
  52. }, [
  53. (_ctx.src || _ctx.srcSet) && !hasLoadError.value ? (openBlock(), createElementBlock("img", {
  54. key: 0,
  55. src: _ctx.src,
  56. alt: _ctx.alt,
  57. srcset: _ctx.srcSet,
  58. style: normalizeStyle(unref(fitStyle)),
  59. onError: handleError
  60. }, null, 44, _hoisted_1)) : _ctx.icon ? (openBlock(), createBlock(unref(ElIcon), { key: 1 }, {
  61. default: withCtx(() => [
  62. (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon)))
  63. ]),
  64. _: 1
  65. })) : renderSlot(_ctx.$slots, "default", { key: 2 })
  66. ], 6);
  67. };
  68. }
  69. });
  70. var Avatar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "avatar.vue"]]);
  71. export { Avatar as default };
  72. //# sourceMappingURL=avatar2.mjs.map