wd-button.js 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. "use strict";
  2. const common_vendor = require("../../../../common/vendor.js");
  3. if (!Math) {
  4. wdIcon();
  5. }
  6. const wdIcon = () => "../wd-icon/wd-icon.js";
  7. const __default__ = {
  8. name: "wd-button",
  9. options: {
  10. addGlobalClass: true,
  11. virtualHost: true,
  12. styleIsolation: "shared"
  13. }
  14. };
  15. const _sfc_main = /* @__PURE__ */ common_vendor.defineComponent({
  16. ...__default__,
  17. props: common_vendor.buttonProps,
  18. emits: [
  19. "click",
  20. "getuserinfo",
  21. "contact",
  22. "getphonenumber",
  23. "error",
  24. "launchapp",
  25. "opensetting",
  26. "chooseavatar",
  27. "agreeprivacyauthorization"
  28. ],
  29. setup(__props, { emit: __emit }) {
  30. const loadingIcon = (color = "#4D80F0", reverse = true) => {
  31. return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42"><defs><linearGradient x1="100%" y1="0%" x2="0%" y2="0%" id="a"><stop stop-color="${reverse ? color : "#fff"}" offset="0%" stop-opacity="0"/><stop stop-color="${reverse ? color : "#fff"}" offset="100%"/></linearGradient></defs><g fill="none" fill-rule="evenodd"><path d="M21 1c11.046 0 20 8.954 20 20s-8.954 20-20 20S1 32.046 1 21 9.954 1 21 1zm0 7C13.82 8 8 13.82 8 21s5.82 13 13 13 13-5.82 13-13S28.18 8 21 8z" fill="${reverse ? "#fff" : color}"/><path d="M4.599 21c0 9.044 7.332 16.376 16.376 16.376 9.045 0 16.376-7.332 16.376-16.376" stroke="url(#a)" stroke-width="3.5" stroke-linecap="round"/></g></svg>`;
  32. };
  33. const props = __props;
  34. const emit = __emit;
  35. const hoverStartTime = common_vendor.ref(20);
  36. const hoverStayTime = common_vendor.ref(70);
  37. const loadingIconSvg = common_vendor.ref("");
  38. const loadingStyle = common_vendor.computed(() => {
  39. return `background-image: url(${loadingIconSvg.value});`;
  40. });
  41. common_vendor.watch(
  42. () => props.loading,
  43. () => {
  44. buildLoadingSvg();
  45. },
  46. { deep: true, immediate: true }
  47. );
  48. function handleClick(event) {
  49. if (!props.disabled && !props.loading) {
  50. emit("click", event);
  51. }
  52. }
  53. function handleGetAuthorize(event) {
  54. if (props.scope === "phoneNumber") {
  55. handleGetphonenumber(event);
  56. } else if (props.scope === "userInfo") {
  57. handleGetuserinfo(event);
  58. }
  59. }
  60. function handleGetuserinfo(event) {
  61. emit("getuserinfo", event.detail);
  62. }
  63. function handleConcat(event) {
  64. emit("contact", event.detail);
  65. }
  66. function handleGetphonenumber(event) {
  67. emit("getphonenumber", event.detail);
  68. }
  69. function handleError(event) {
  70. emit("error", event.detail);
  71. }
  72. function handleLaunchapp(event) {
  73. emit("launchapp", event.detail);
  74. }
  75. function handleOpensetting(event) {
  76. emit("opensetting", event.detail);
  77. }
  78. function handleChooseavatar(event) {
  79. emit("chooseavatar", event.detail);
  80. }
  81. function handleAgreePrivacyAuthorization(event) {
  82. emit("agreeprivacyauthorization", event.detail);
  83. }
  84. function buildLoadingSvg() {
  85. const { loadingColor, type, plain } = props;
  86. let color = loadingColor;
  87. if (!color) {
  88. switch (type) {
  89. case "primary":
  90. color = "#4D80F0";
  91. break;
  92. case "success":
  93. color = "#34d19d";
  94. break;
  95. case "info":
  96. color = "#333";
  97. break;
  98. case "warning":
  99. color = "#f0883a";
  100. break;
  101. case "error":
  102. color = "#fa4350";
  103. break;
  104. case "default":
  105. color = "#333";
  106. break;
  107. }
  108. }
  109. const svg = loadingIcon(color, !plain);
  110. loadingIconSvg.value = `"data:image/svg+xml;base64,${common_vendor.encode(svg)}"`;
  111. }
  112. return (_ctx, _cache) => {
  113. return common_vendor.e({
  114. a: _ctx.loading
  115. }, _ctx.loading ? {
  116. b: common_vendor.s(loadingStyle.value)
  117. } : _ctx.icon ? {
  118. d: common_vendor.p({
  119. ["custom-class"]: "wd-button__icon",
  120. name: _ctx.icon,
  121. classPrefix: _ctx.classPrefix
  122. })
  123. } : {}, {
  124. c: _ctx.icon,
  125. e: _ctx.buttonId,
  126. f: `${_ctx.disabled || _ctx.loading ? "" : "wd-button--active"}`,
  127. g: common_vendor.s(_ctx.customStyle),
  128. h: common_vendor.n("is-" + _ctx.type),
  129. i: common_vendor.n("is-" + _ctx.size),
  130. j: common_vendor.n(_ctx.round ? "is-round" : ""),
  131. k: common_vendor.n(_ctx.hairline ? "is-hairline" : ""),
  132. l: common_vendor.n(_ctx.plain ? "is-plain" : ""),
  133. m: common_vendor.n(_ctx.disabled ? "is-disabled" : ""),
  134. n: common_vendor.n(_ctx.block ? "is-block" : ""),
  135. o: common_vendor.n(_ctx.loading ? "is-loading" : ""),
  136. p: common_vendor.n(_ctx.customClass),
  137. q: hoverStartTime.value,
  138. r: hoverStayTime.value,
  139. s: _ctx.disabled || _ctx.loading ? void 0 : _ctx.openType,
  140. t: _ctx.sendMessageTitle,
  141. v: _ctx.sendMessagePath,
  142. w: _ctx.sendMessageImg,
  143. x: _ctx.appParameter,
  144. y: _ctx.showMessageCard,
  145. z: _ctx.sessionFrom,
  146. A: _ctx.lang,
  147. B: _ctx.hoverStopPropagation,
  148. C: _ctx.scope,
  149. D: common_vendor.o(handleClick),
  150. E: common_vendor.o(handleGetAuthorize),
  151. F: common_vendor.o(handleGetuserinfo),
  152. G: common_vendor.o(handleConcat),
  153. H: common_vendor.o(handleGetphonenumber),
  154. I: common_vendor.o(handleError),
  155. J: common_vendor.o(handleLaunchapp),
  156. K: common_vendor.o(handleOpensetting),
  157. L: common_vendor.o(handleChooseavatar),
  158. M: common_vendor.o(handleAgreePrivacyAuthorization)
  159. });
  160. };
  161. }
  162. });
  163. const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-aa3a6253"]]);
  164. wx.createComponent(Component);