index.js 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import _mergeJSXProps from "@vue/babel-helper-vue-jsx-merge-props";
  3. import Vue from 'vue'; // Utils
  4. import { createNamespace } from '../utils';
  5. import { emit, inherit } from '../utils/functional'; // Mixins
  6. import { popupMixinProps } from '../mixins/popup'; // Components
  7. import Icon from '../icon';
  8. import Popup from '../popup';
  9. import Loading from '../loading'; // Types
  10. var _createNamespace = createNamespace('action-sheet'),
  11. createComponent = _createNamespace[0],
  12. bem = _createNamespace[1];
  13. function ActionSheet(h, props, slots, ctx) {
  14. var title = props.title,
  15. cancelText = props.cancelText,
  16. closeable = props.closeable;
  17. function onCancel() {
  18. emit(ctx, 'input', false);
  19. emit(ctx, 'cancel');
  20. }
  21. function Header() {
  22. if (title) {
  23. return h("div", {
  24. "class": bem('header')
  25. }, [title, closeable && h(Icon, {
  26. "attrs": {
  27. "name": props.closeIcon
  28. },
  29. "class": bem('close'),
  30. "on": {
  31. "click": onCancel
  32. }
  33. })]);
  34. }
  35. }
  36. function Option(item, index) {
  37. var disabled = item.disabled,
  38. loading = item.loading,
  39. callback = item.callback;
  40. function onClickOption(event) {
  41. event.stopPropagation();
  42. if (disabled || loading) {
  43. return;
  44. }
  45. if (callback) {
  46. callback(item);
  47. }
  48. if (props.closeOnClickAction) {
  49. emit(ctx, 'input', false);
  50. }
  51. Vue.nextTick(function () {
  52. emit(ctx, 'select', item, index);
  53. });
  54. }
  55. function OptionContent() {
  56. if (loading) {
  57. return h(Loading, {
  58. "class": bem('loading-icon')
  59. });
  60. }
  61. return [h("span", {
  62. "class": bem('name')
  63. }, [item.name]), item.subname && h("div", {
  64. "class": bem('subname')
  65. }, [item.subname])];
  66. }
  67. return h("button", {
  68. "attrs": {
  69. "type": "button"
  70. },
  71. "class": [bem('item', {
  72. disabled: disabled,
  73. loading: loading
  74. }), item.className],
  75. "style": {
  76. color: item.color
  77. },
  78. "on": {
  79. "click": onClickOption
  80. }
  81. }, [OptionContent()]);
  82. }
  83. function CancelText() {
  84. if (cancelText) {
  85. return [h("div", {
  86. "class": bem('gap')
  87. }), h("button", {
  88. "attrs": {
  89. "type": "button"
  90. },
  91. "class": bem('cancel'),
  92. "on": {
  93. "click": onCancel
  94. }
  95. }, [cancelText])];
  96. }
  97. }
  98. function Description() {
  99. var description = (slots.description == null ? void 0 : slots.description()) || props.description;
  100. if (description) {
  101. return h("div", {
  102. "class": bem('description')
  103. }, [description]);
  104. }
  105. }
  106. return h(Popup, _mergeJSXProps([{
  107. "class": bem(),
  108. "attrs": {
  109. "position": "bottom",
  110. "round": props.round,
  111. "value": props.value,
  112. "overlay": props.overlay,
  113. "duration": props.duration,
  114. "lazyRender": props.lazyRender,
  115. "lockScroll": props.lockScroll,
  116. "getContainer": props.getContainer,
  117. "closeOnPopstate": props.closeOnPopstate,
  118. "closeOnClickOverlay": props.closeOnClickOverlay,
  119. "safeAreaInsetBottom": props.safeAreaInsetBottom
  120. }
  121. }, inherit(ctx, true)]), [Header(), Description(), h("div", {
  122. "class": bem('content')
  123. }, [props.actions && props.actions.map(Option), slots.default == null ? void 0 : slots.default()]), CancelText()]);
  124. }
  125. ActionSheet.props = _extends({}, popupMixinProps, {
  126. title: String,
  127. actions: Array,
  128. duration: [Number, String],
  129. cancelText: String,
  130. description: String,
  131. getContainer: [String, Function],
  132. closeOnPopstate: Boolean,
  133. closeOnClickAction: Boolean,
  134. round: {
  135. type: Boolean,
  136. default: true
  137. },
  138. closeable: {
  139. type: Boolean,
  140. default: true
  141. },
  142. closeIcon: {
  143. type: String,
  144. default: 'cross'
  145. },
  146. safeAreaInsetBottom: {
  147. type: Boolean,
  148. default: true
  149. },
  150. overlay: {
  151. type: Boolean,
  152. default: true
  153. },
  154. closeOnClickOverlay: {
  155. type: Boolean,
  156. default: true
  157. }
  158. });
  159. export default createComponent(ActionSheet);