SubmitBar.mjs 3.4 KB

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