Button.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167
  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_utils = require("../utils");
  26. var import_use_route = require("../composables/use-route");
  27. var import_icon = require("../icon");
  28. var import_loading = require("../loading");
  29. const [name, bem] = (0, import_utils.createNamespace)("button");
  30. const buttonProps = (0, import_utils.extend)({}, import_use_route.routeProps, {
  31. tag: (0, import_utils.makeStringProp)("button"),
  32. text: String,
  33. icon: String,
  34. type: (0, import_utils.makeStringProp)("default"),
  35. size: (0, import_utils.makeStringProp)("normal"),
  36. color: String,
  37. block: Boolean,
  38. plain: Boolean,
  39. round: Boolean,
  40. square: Boolean,
  41. loading: Boolean,
  42. hairline: Boolean,
  43. disabled: Boolean,
  44. iconPrefix: String,
  45. nativeType: (0, import_utils.makeStringProp)("button"),
  46. loadingSize: import_utils.numericProp,
  47. loadingText: String,
  48. loadingType: String,
  49. iconPosition: (0, import_utils.makeStringProp)("left")
  50. });
  51. var stdin_default = (0, import_vue.defineComponent)({
  52. name,
  53. props: buttonProps,
  54. emits: ["click"],
  55. setup(props, {
  56. emit,
  57. slots
  58. }) {
  59. const route = (0, import_use_route.useRoute)();
  60. const renderLoadingIcon = () => {
  61. if (slots.loading) {
  62. return slots.loading();
  63. }
  64. return (0, import_vue.createVNode)(import_loading.Loading, {
  65. "size": props.loadingSize,
  66. "type": props.loadingType,
  67. "class": bem("loading")
  68. }, null);
  69. };
  70. const renderIcon = () => {
  71. if (props.loading) {
  72. return renderLoadingIcon();
  73. }
  74. if (slots.icon) {
  75. return (0, import_vue.createVNode)("div", {
  76. "class": bem("icon")
  77. }, [slots.icon()]);
  78. }
  79. if (props.icon) {
  80. return (0, import_vue.createVNode)(import_icon.Icon, {
  81. "name": props.icon,
  82. "class": bem("icon"),
  83. "classPrefix": props.iconPrefix
  84. }, null);
  85. }
  86. };
  87. const renderText = () => {
  88. let text;
  89. if (props.loading) {
  90. text = props.loadingText;
  91. } else {
  92. text = slots.default ? slots.default() : props.text;
  93. }
  94. if (text) {
  95. return (0, import_vue.createVNode)("span", {
  96. "class": bem("text")
  97. }, [text]);
  98. }
  99. };
  100. const getStyle = () => {
  101. const {
  102. color,
  103. plain
  104. } = props;
  105. if (color) {
  106. const style = {
  107. color: plain ? color : "white"
  108. };
  109. if (!plain) {
  110. style.background = color;
  111. }
  112. if (color.includes("gradient")) {
  113. style.border = 0;
  114. } else {
  115. style.borderColor = color;
  116. }
  117. return style;
  118. }
  119. };
  120. const onClick = (event) => {
  121. if (props.loading) {
  122. (0, import_utils.preventDefault)(event);
  123. } else if (!props.disabled) {
  124. emit("click", event);
  125. route();
  126. }
  127. };
  128. return () => {
  129. const {
  130. tag,
  131. type,
  132. size,
  133. block,
  134. round,
  135. plain,
  136. square,
  137. loading,
  138. disabled,
  139. hairline,
  140. nativeType,
  141. iconPosition
  142. } = props;
  143. const classes = [bem([type, size, {
  144. plain,
  145. block,
  146. round,
  147. square,
  148. loading,
  149. disabled,
  150. hairline
  151. }]), {
  152. [import_utils.BORDER_SURROUND]: hairline
  153. }];
  154. return (0, import_vue.createVNode)(tag, {
  155. "type": nativeType,
  156. "class": classes,
  157. "style": getStyle(),
  158. "disabled": disabled,
  159. "onClick": onClick
  160. }, {
  161. default: () => [(0, import_vue.createVNode)("div", {
  162. "class": bem("content")
  163. }, [iconPosition === "left" && renderIcon(), renderText(), iconPosition === "right" && renderIcon()])]
  164. });
  165. };
  166. }
  167. });