SubmitBar.mjs 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. import { createVNode as _createVNode } from "vue";
  2. import { ref, defineComponent } from "vue";
  3. import { truthProp, makeStringProp, makeNumericProp, createNamespace } from "../utils/index.mjs";
  4. import { Icon } from "../icon/index.mjs";
  5. import { Button } from "../button/index.mjs";
  6. import { usePlaceholder } from "../composables/use-placeholder.mjs";
  7. const [name, bem, t] = createNamespace("submit-bar");
  8. const submitBarProps = {
  9. tip: String,
  10. label: String,
  11. price: Number,
  12. tipIcon: String,
  13. loading: Boolean,
  14. currency: makeStringProp("\xA5"),
  15. disabled: Boolean,
  16. textAlign: String,
  17. buttonText: String,
  18. buttonType: makeStringProp("danger"),
  19. buttonColor: String,
  20. suffixLabel: String,
  21. placeholder: Boolean,
  22. decimalLength: makeNumericProp(2),
  23. safeAreaInsetBottom: truthProp
  24. };
  25. var stdin_default = defineComponent({
  26. name,
  27. props: submitBarProps,
  28. emits: ["submit"],
  29. setup(props, {
  30. emit,
  31. slots
  32. }) {
  33. const root = ref();
  34. const renderPlaceholder = usePlaceholder(root, bem);
  35. const renderText = () => {
  36. const {
  37. price,
  38. label,
  39. currency,
  40. textAlign,
  41. suffixLabel,
  42. decimalLength
  43. } = props;
  44. if (typeof price === "number") {
  45. const pricePair = (price / 100).toFixed(+decimalLength).split(".");
  46. const decimal = decimalLength ? `.${pricePair[1]}` : "";
  47. return _createVNode("div", {
  48. "class": bem("text"),
  49. "style": {
  50. textAlign
  51. }
  52. }, [_createVNode("span", null, [label || t("label")]), _createVNode("span", {
  53. "class": bem("price")
  54. }, [currency, _createVNode("span", {
  55. "class": bem("price-integer")
  56. }, [pricePair[0]]), decimal]), suffixLabel && _createVNode("span", {
  57. "class": bem("suffix-label")
  58. }, [suffixLabel])]);
  59. }
  60. };
  61. const renderTip = () => {
  62. var _a;
  63. const {
  64. tip,
  65. tipIcon
  66. } = props;
  67. if (slots.tip || tip) {
  68. return _createVNode("div", {
  69. "class": bem("tip")
  70. }, [tipIcon && _createVNode(Icon, {
  71. "class": bem("tip-icon"),
  72. "name": tipIcon
  73. }, null), tip && _createVNode("span", {
  74. "class": bem("tip-text")
  75. }, [tip]), (_a = slots.tip) == null ? void 0 : _a.call(slots)]);
  76. }
  77. };
  78. const onClickButton = () => emit("submit");
  79. const renderButton = () => {
  80. if (slots.button) {
  81. return slots.button();
  82. }
  83. return _createVNode(Button, {
  84. "round": true,
  85. "type": props.buttonType,
  86. "text": props.buttonText,
  87. "class": bem("button", props.buttonType),
  88. "color": props.buttonColor,
  89. "loading": props.loading,
  90. "disabled": props.disabled,
  91. "onClick": onClickButton
  92. }, null);
  93. };
  94. const renderSubmitBar = () => {
  95. var _a, _b;
  96. return _createVNode("div", {
  97. "ref": root,
  98. "class": [bem(), {
  99. "van-safe-area-bottom": props.safeAreaInsetBottom
  100. }]
  101. }, [(_a = slots.top) == null ? void 0 : _a.call(slots), renderTip(), _createVNode("div", {
  102. "class": bem("bar")
  103. }, [(_b = slots.default) == null ? void 0 : _b.call(slots), renderText(), renderButton()])]);
  104. };
  105. return () => {
  106. if (props.placeholder) {
  107. return renderPlaceholder(renderSubmitBar);
  108. }
  109. return renderSubmitBar();
  110. };
  111. }
  112. });
  113. export {
  114. stdin_default as default
  115. };