action-sheet.js 3.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
  2. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  3. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  4. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  5. return c > 3 && r && Object.defineProperty(target, key, r), r;
  6. };
  7. import { chunk } from '../common/utils';
  8. import { SuperComponent, wxComponent } from '../common/src/index';
  9. import config from '../common/config';
  10. import { ActionSheetTheme, show } from './show';
  11. import props from './props';
  12. const { prefix } = config;
  13. const name = `${prefix}-action-sheet`;
  14. let ActionSheet = class ActionSheet extends SuperComponent {
  15. constructor() {
  16. super(...arguments);
  17. this.externalClasses = [`${prefix}-class`, `${prefix}-class-content`, `${prefix}-class-cancel`];
  18. this.properties = Object.assign({}, props);
  19. this.data = {
  20. prefix,
  21. classPrefix: name,
  22. gridThemeItems: [],
  23. currentSwiperIndex: 0,
  24. };
  25. this.controlledProps = [
  26. {
  27. key: 'visible',
  28. event: 'visible-change',
  29. },
  30. ];
  31. this.methods = {
  32. onSwiperChange(e) {
  33. const { detail: { current }, } = e;
  34. this.setData({
  35. currentSwiperIndex: current,
  36. });
  37. },
  38. splitGridThemeActions() {
  39. if (this.data.theme !== ActionSheetTheme.Grid)
  40. return;
  41. this.setData({
  42. gridThemeItems: chunk(this.data.items, this.data.count),
  43. });
  44. },
  45. show(options) {
  46. this.setData(Object.assign(Object.assign(Object.assign({}, this.initialData), options), { visible: true }));
  47. this.splitGridThemeActions();
  48. this.autoClose = true;
  49. this._trigger('visible-change', { visible: true });
  50. },
  51. memoInitialData() {
  52. this.initialData = Object.assign(Object.assign({}, this.properties), this.data);
  53. },
  54. close() {
  55. this._trigger('visible-change', { visible: false });
  56. },
  57. onPopupVisibleChange({ detail }) {
  58. if (!detail.visible) {
  59. this._trigger('visible-change', { visible: false });
  60. }
  61. if (this.autoClose) {
  62. this.setData({ visible: false });
  63. this.autoClose = false;
  64. }
  65. },
  66. onSelect(event) {
  67. const { currentSwiperIndex, items, gridThemeItems, count, theme } = this.data;
  68. const { index } = event.currentTarget.dataset;
  69. const isSwiperMode = theme === ActionSheetTheme.Grid;
  70. const item = isSwiperMode ? gridThemeItems[currentSwiperIndex][index] : items[index];
  71. const realIndex = isSwiperMode ? index + currentSwiperIndex * count : index;
  72. if (item) {
  73. this.triggerEvent('selected', { selected: item, index: realIndex });
  74. this._trigger('visible-change', { visible: false });
  75. }
  76. },
  77. onCancel() {
  78. this.triggerEvent('cancel');
  79. },
  80. };
  81. }
  82. ready() {
  83. this.memoInitialData();
  84. this.splitGridThemeActions();
  85. }
  86. };
  87. ActionSheet.show = show;
  88. ActionSheet = __decorate([
  89. wxComponent()
  90. ], ActionSheet);
  91. export default ActionSheet;