dialog.js 6.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  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 { SuperComponent, wxComponent } from '../common/src/index';
  8. import config from '../common/config';
  9. import props from './props';
  10. import { isObject, toCamel } from '../common/utils';
  11. import useCustomNavbar from '../mixins/using-custom-navbar';
  12. const { prefix } = config;
  13. const name = `${prefix}-dialog`;
  14. let Dialog = class Dialog extends SuperComponent {
  15. constructor() {
  16. super(...arguments);
  17. this.behaviors = [useCustomNavbar];
  18. this.options = {
  19. multipleSlots: true,
  20. };
  21. this.externalClasses = [
  22. `${prefix}-class`,
  23. `${prefix}-class-content`,
  24. `${prefix}-class-confirm`,
  25. `${prefix}-class-cancel`,
  26. `${prefix}-class-action`,
  27. ];
  28. this.properties = props;
  29. this.data = {
  30. prefix,
  31. classPrefix: name,
  32. buttonVariant: 'text',
  33. };
  34. this.observers = {
  35. 'confirmBtn, cancelBtn'(confirm, cancel) {
  36. const { prefix, classPrefix, buttonLayout } = this.data;
  37. const rect = { buttonVariant: 'text' };
  38. const useBaseVariant = [confirm, cancel].some((item) => isObject(item) && item.variant && item.variant !== 'text');
  39. const buttonMap = { confirm, cancel };
  40. const cls = [`${classPrefix}__button`];
  41. const externalCls = [];
  42. if (useBaseVariant) {
  43. rect.buttonVariant = 'base';
  44. cls.push(`${classPrefix}__button--${buttonLayout}`);
  45. }
  46. else {
  47. cls.push(`${classPrefix}__button--text`);
  48. externalCls.push(`${classPrefix}-button`);
  49. }
  50. Object.keys(buttonMap).forEach((key) => {
  51. const btn = buttonMap[key];
  52. const base = {
  53. block: true,
  54. rootClass: [...cls, `${classPrefix}__button--${key}`],
  55. tClass: [...externalCls, `${prefix}-class-${key}`],
  56. variant: rect.buttonVariant,
  57. openType: '',
  58. };
  59. if (key === 'cancel' && rect.buttonVariant === 'base') {
  60. base.theme = 'light';
  61. }
  62. if (typeof btn === 'string') {
  63. rect[`_${key}`] = Object.assign(Object.assign({}, base), { content: btn });
  64. }
  65. else if (btn && typeof btn === 'object') {
  66. rect[`_${key}`] = Object.assign(Object.assign({}, base), btn);
  67. }
  68. else {
  69. rect[`_${key}`] = null;
  70. }
  71. });
  72. this.setData(Object.assign({}, rect));
  73. },
  74. };
  75. this.methods = {
  76. onTplButtonTap(e) {
  77. var _a, _b, _c;
  78. const evtType = e.type;
  79. const { type, extra } = e.target.dataset;
  80. const button = this.data[`_${type}`];
  81. const cbName = `bind${evtType}`;
  82. if (type === 'action') {
  83. this.onActionTap(extra);
  84. return;
  85. }
  86. if (typeof button[cbName] === 'function') {
  87. const closeFlag = button[cbName](e);
  88. if (closeFlag) {
  89. this.close();
  90. }
  91. }
  92. const hasOpenType = !!button.openType;
  93. if (!hasOpenType && ['confirm', 'cancel'].includes(type)) {
  94. (_a = this[toCamel(`on-${type}`)]) === null || _a === void 0 ? void 0 : _a.call(this, type);
  95. }
  96. if (evtType !== 'tap') {
  97. const success = ((_c = (_b = e.detail) === null || _b === void 0 ? void 0 : _b.errMsg) === null || _c === void 0 ? void 0 : _c.indexOf('ok')) > -1;
  98. this.triggerEvent(success ? 'open-type-event' : 'open-type-error-event', e.detail);
  99. }
  100. },
  101. onConfirm() {
  102. this.triggerEvent('confirm');
  103. if (this._onConfirm) {
  104. this._onConfirm();
  105. this.close();
  106. }
  107. },
  108. onCancel() {
  109. this.triggerEvent('close', { trigger: 'cancel' });
  110. this.triggerEvent('cancel');
  111. if (this._onCancel) {
  112. this._onCancel();
  113. this.close();
  114. }
  115. },
  116. onClose() {
  117. this.triggerEvent('close', { trigger: 'close-btn' });
  118. this.close();
  119. },
  120. close() {
  121. this.setData({ visible: false });
  122. },
  123. overlayClick() {
  124. if (this.properties.closeOnOverlayClick) {
  125. this.triggerEvent('close', { trigger: 'overlay' });
  126. this.close();
  127. }
  128. this.triggerEvent('overlay-click');
  129. },
  130. onActionTap(index) {
  131. this.triggerEvent('action', { index });
  132. if (this._onAction) {
  133. this._onAction({ index });
  134. this.close();
  135. }
  136. },
  137. openValueCBHandle(e) {
  138. this.triggerEvent('open-type-event', e.detail);
  139. },
  140. openValueErrCBHandle(e) {
  141. this.triggerEvent('open-type-error-event', e.detail);
  142. },
  143. };
  144. }
  145. };
  146. Dialog = __decorate([
  147. wxComponent()
  148. ], Dialog);
  149. export default Dialog;