Button.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. var __defProp = Object.defineProperty;
  2. var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
  3. var __getOwnPropNames = Object.getOwnPropertyNames;
  4. var __hasOwnProp = Object.prototype.hasOwnProperty;
  5. var __export = (target, all) => {
  6. for (var name2 in all)
  7. __defProp(target, name2, { get: all[name2], enumerable: true });
  8. };
  9. var __copyProps = (to, from, except, desc) => {
  10. if (from && typeof from === "object" || typeof from === "function") {
  11. for (let key of __getOwnPropNames(from))
  12. if (!__hasOwnProp.call(to, key) && key !== except)
  13. __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  14. }
  15. return to;
  16. };
  17. var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
  18. var stdin_exports = {};
  19. __export(stdin_exports, {
  20. buttonProps: () => buttonProps,
  21. default: () => stdin_default
  22. });
  23. module.exports = __toCommonJS(stdin_exports);
  24. var import_vue = require("vue");
  25. var import_vue2 = require("vue");
  26. var import_utils = require("../utils");
  27. var import_use_route = require("../composables/use-route");
  28. var import_icon = require("../icon");
  29. var import_loading = require("../loading");
  30. const [name, bem] = (0, import_utils.createNamespace)("button");
  31. const buttonProps = (0, import_utils.extend)({}, import_use_route.routeProps, {
  32. tag: (0, import_utils.makeStringProp)("button"),
  33. text: String,
  34. icon: String,
  35. type: (0, import_utils.makeStringProp)("default"),
  36. size: (0, import_utils.makeStringProp)("normal"),
  37. color: String,
  38. block: Boolean,
  39. plain: Boolean,
  40. round: Boolean,
  41. square: Boolean,
  42. loading: Boolean,
  43. hairline: Boolean,
  44. disabled: Boolean,
  45. iconPrefix: String,
  46. nativeType: (0, import_utils.makeStringProp)("button"),
  47. loadingSize: import_utils.numericProp,
  48. loadingText: String,
  49. loadingType: String,
  50. iconPosition: (0, import_utils.makeStringProp)("left")
  51. });
  52. var stdin_default = (0, import_vue2.defineComponent)({
  53. name,
  54. props: buttonProps,
  55. emits: ["click"],
  56. setup(props, {
  57. emit,
  58. slots
  59. }) {
  60. const route = (0, import_use_route.useRoute)();
  61. const renderLoadingIcon = () => {
  62. if (slots.loading) {
  63. return slots.loading();
  64. }
  65. return (0, import_vue.createVNode)(import_loading.Loading, {
  66. "size": props.loadingSize,
  67. "type": props.loadingType,
  68. "class": bem("loading")
  69. }, null);
  70. };
  71. const renderIcon = () => {
  72. if (props.loading) {
  73. return renderLoadingIcon();
  74. }
  75. if (slots.icon) {
  76. return (0, import_vue.createVNode)("div", {
  77. "class": bem("icon")
  78. }, [slots.icon()]);
  79. }
  80. if (props.icon) {
  81. return (0, import_vue.createVNode)(import_icon.Icon, {
  82. "name": props.icon,
  83. "class": bem("icon"),
  84. "classPrefix": props.iconPrefix
  85. }, null);
  86. }
  87. };
  88. const renderText = () => {
  89. let text;
  90. if (props.loading) {
  91. text = props.loadingText;
  92. } else {
  93. text = slots.default ? slots.default() : props.text;
  94. }
  95. if (text) {
  96. return (0, import_vue.createVNode)("span", {
  97. "class": bem("text")
  98. }, [text]);
  99. }
  100. };
  101. const getStyle = () => {
  102. const {
  103. color,
  104. plain
  105. } = props;
  106. if (color) {
  107. const style = {
  108. color: plain ? color : "white"
  109. };
  110. if (!plain) {
  111. style.background = color;
  112. }
  113. if (color.includes("gradient")) {
  114. style.border = 0;
  115. } else {
  116. style.borderColor = color;
  117. }
  118. return style;
  119. }
  120. };
  121. const onClick = (event) => {
  122. if (props.loading) {
  123. (0, import_utils.preventDefault)(event);
  124. } else if (!props.disabled) {
  125. emit("click", event);
  126. route();
  127. }
  128. };
  129. return () => {
  130. const {
  131. tag,
  132. type,
  133. size,
  134. block,
  135. round,
  136. plain,
  137. square,
  138. loading,
  139. disabled,
  140. hairline,
  141. nativeType,
  142. iconPosition
  143. } = props;
  144. const classes = [bem([type, size, {
  145. plain,
  146. block,
  147. round,
  148. square,
  149. loading,
  150. disabled,
  151. hairline
  152. }]), {
  153. [import_utils.BORDER_SURROUND]: hairline
  154. }];
  155. return (0, import_vue.createVNode)(tag, {
  156. "type": nativeType,
  157. "class": classes,
  158. "style": getStyle(),
  159. "disabled": disabled,
  160. "onClick": onClick
  161. }, {
  162. default: () => [(0, import_vue.createVNode)("div", {
  163. "class": bem("content")
  164. }, [iconPosition === "left" && renderIcon(), renderText(), iconPosition === "right" && renderIcon()])]
  165. });
  166. };
  167. }
  168. });