u-avatar.js 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. "use strict";
  2. const uni_modules_uviewPlus_components_uAvatar_props = require("./props.js");
  3. const uni_modules_uviewPlus_libs_mixin_mpMixin = require("../../libs/mixin/mpMixin.js");
  4. const uni_modules_uviewPlus_libs_mixin_mixin = require("../../libs/mixin/mixin.js");
  5. const uni_modules_uviewPlus_libs_function_index = require("../../libs/function/index.js");
  6. const common_vendor = require("../../../../common/vendor.js");
  7. const base64Avatar = "data:image/jpg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAA8AAD/4QMraHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjMtYzAxMSA2Ni4xNDU2NjEsIDIwMTIvMDIvMDYtMTQ6NTY6MjcgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzYgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjREMEQwRkY0RjgwNDExRUE5OTY2RDgxODY3NkJFODMxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjREMEQwRkY1RjgwNDExRUE5OTY2RDgxODY3NkJFODMxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NEQwRDBGRjJGODA0MTFFQTk5NjZEODE4Njc2QkU4MzEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NEQwRDBGRjNGODA0MTFFQTk5NjZEODE4Njc2QkU4MzEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAGBAQEBQQGBQUGCQYFBgkLCAYG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";
  8. const _sfc_main = {
  9. name: "u-avatar",
  10. mixins: [uni_modules_uviewPlus_libs_mixin_mpMixin.mpMixin, uni_modules_uviewPlus_libs_mixin_mixin.mixin, uni_modules_uviewPlus_components_uAvatar_props.props],
  11. data() {
  12. return {
  13. // 如果配置randomBgColor参数为true,在图标或者文字的模式下,会随机从中取出一个颜色值当做背景色
  14. colors: [
  15. "#ffb34b",
  16. "#f2bba9",
  17. "#f7a196",
  18. "#f18080",
  19. "#88a867",
  20. "#bfbf39",
  21. "#89c152",
  22. "#94d554",
  23. "#f19ec2",
  24. "#afaae4",
  25. "#e1b0df",
  26. "#c38cc1",
  27. "#72dcdc",
  28. "#9acdcb",
  29. "#77b1cc",
  30. "#448aca",
  31. "#86cefa",
  32. "#98d1ee",
  33. "#73d1f1",
  34. "#80a7dc"
  35. ],
  36. avatarUrl: this.src,
  37. allowMp: false
  38. };
  39. },
  40. watch: {
  41. // 监听头像src的变化,赋值给内部的avatarUrl变量,因为图片加载失败时,需要修改图片的src为默认值
  42. // 而组件内部不能直接修改props的值,所以需要一个中间变量
  43. src: {
  44. immediate: true,
  45. handler(newVal) {
  46. this.avatarUrl = newVal;
  47. if (!newVal) {
  48. this.errorHandler();
  49. }
  50. }
  51. }
  52. },
  53. computed: {
  54. imageStyle() {
  55. const style = {};
  56. return style;
  57. }
  58. },
  59. created() {
  60. this.init();
  61. },
  62. emits: ["click"],
  63. methods: {
  64. addStyle: uni_modules_uviewPlus_libs_function_index.addStyle,
  65. addUnit: uni_modules_uviewPlus_libs_function_index.addUnit,
  66. random: uni_modules_uviewPlus_libs_function_index.random,
  67. init() {
  68. this.allowMp = true;
  69. },
  70. // 判断传入的name属性,是否图片路径,只要带有"/"均认为是图片形式
  71. isImg() {
  72. return this.src.indexOf("/") !== -1;
  73. },
  74. // 图片加载时失败时触发
  75. errorHandler() {
  76. this.avatarUrl = this.defaultUrl || base64Avatar;
  77. },
  78. clickHandler() {
  79. this.$emit("click", this.name);
  80. }
  81. }
  82. };
  83. if (!Array) {
  84. const _easycom_u_icon2 = common_vendor.resolveComponent("u-icon");
  85. const _easycom_u_text2 = common_vendor.resolveComponent("u-text");
  86. (_easycom_u_icon2 + _easycom_u_text2)();
  87. }
  88. const _easycom_u_icon = () => "../u-icon/u-icon.js";
  89. const _easycom_u_text = () => "../u-text/u-text.js";
  90. if (!Math) {
  91. (_easycom_u_icon + _easycom_u_text)();
  92. }
  93. function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  94. return common_vendor.e({
  95. a: _ctx.mpAvatar && $data.allowMp
  96. }, _ctx.mpAvatar && $data.allowMp ? {
  97. b: common_vendor.s({
  98. width: $options.addUnit(_ctx.size),
  99. height: $options.addUnit(_ctx.size)
  100. })
  101. } : {}, {
  102. c: _ctx.mpAvatar && $data.allowMp
  103. }, _ctx.mpAvatar && $data.allowMp ? {} : _ctx.icon ? {
  104. e: common_vendor.p({
  105. name: _ctx.icon,
  106. size: _ctx.fontSize,
  107. color: _ctx.color
  108. })
  109. } : _ctx.text ? {
  110. g: common_vendor.p({
  111. text: _ctx.text,
  112. size: _ctx.fontSize,
  113. color: _ctx.color,
  114. align: "center",
  115. customStyle: "justify-content: center"
  116. })
  117. } : {
  118. h: common_vendor.n(`u-avatar__image--${_ctx.shape}`),
  119. i: $data.avatarUrl || _ctx.defaultUrl,
  120. j: _ctx.mode,
  121. k: common_vendor.o((...args) => $options.errorHandler && $options.errorHandler(...args)),
  122. l: common_vendor.s({
  123. width: $options.addUnit(_ctx.size),
  124. height: $options.addUnit(_ctx.size)
  125. })
  126. }, {
  127. d: _ctx.icon,
  128. f: _ctx.text,
  129. m: common_vendor.n(`u-avatar--${_ctx.shape}`),
  130. n: common_vendor.s({
  131. backgroundColor: _ctx.text || _ctx.icon ? _ctx.randomBgColor ? $data.colors[_ctx.colorIndex !== "" ? _ctx.colorIndex : $options.random(0, 19)] : _ctx.bgColor : "transparent",
  132. width: $options.addUnit(_ctx.size),
  133. height: $options.addUnit(_ctx.size)
  134. }),
  135. o: common_vendor.s($options.addStyle(_ctx.customStyle)),
  136. p: common_vendor.o((...args) => $options.clickHandler && $options.clickHandler(...args))
  137. });
  138. }
  139. const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-34d954f9"]]);
  140. wx.createComponent(Component);