index.vue 9.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. <template>
  2. <uni-shadow-root class="vant-popup-index"><van-overlay v-if="overlay" mask :show="show" :z-index="zIndex" :custom-style="overlayStyle" :duration="duration" @click="onClickOverlay"></van-overlay>
  3. <view v-if="inited" :class="'custom-class '+(classes)+' '+(utils.bem('popup', [position, { safe: isIPhoneX && safeAreaInsetBottom }]))" :style="'z-index: '+(zIndex)+'; -webkit-transition-duration:'+(currentDuration)+'ms; transition-duration:'+(currentDuration)+'ms; '+(display ? '' : 'display: none;')+' '+(customStyle)" @transitionend="onTransitionEnd">
  4. <view v-if="safeAreaInsetTop" class="van-popup__safe-top" :style="'padding-top: '+(statusBarHeight)+'px;'"></view>
  5. <slot></slot>
  6. </view></uni-shadow-root>
  7. </template>
  8. <wxs src="../wxs/utils.wxs" module="utils"></wxs>
  9. <script>
  10. import VanOverlay from '../overlay/index.vue'
  11. global['__wxVueOptions'] = {components:{'van-overlay': VanOverlay}}
  12. global['__wxRoute'] = 'vant/popup/index'
  13. "use strict";
  14. Object.defineProperty(exports, "__esModule", { value: true });
  15. var component_1 = require('./../common/component.js');
  16. var transition_1 = require('./../mixins/transition.js');
  17. var safe_area_1 = require('./../mixins/safe-area.js');
  18. component_1.VantComponent({
  19. classes: ['enter-class', 'enter-active-class', 'enter-to-class', 'leave-class', 'leave-active-class', 'leave-to-class'],
  20. mixins: [transition_1.transition(false), safe_area_1.safeArea()],
  21. props: {
  22. transition: {
  23. type: String,
  24. observer: 'observeClass'
  25. },
  26. customStyle: String,
  27. overlayStyle: String,
  28. zIndex: {
  29. type: Number,
  30. value: 100
  31. },
  32. overlay: {
  33. type: Boolean,
  34. value: true
  35. },
  36. closeOnClickOverlay: {
  37. type: Boolean,
  38. value: true
  39. },
  40. position: {
  41. type: String,
  42. value: 'center',
  43. observer: 'observeClass'
  44. }
  45. },
  46. created: function created() {
  47. this.observeClass();
  48. },
  49. methods: {
  50. onClickOverlay: function onClickOverlay() {
  51. this.$emit('click-overlay');
  52. if (this.data.closeOnClickOverlay) {
  53. this.$emit('close');
  54. }
  55. },
  56. observeClass: function observeClass() {
  57. var _a = this.data,
  58. transition = _a.transition,
  59. position = _a.position;
  60. var updateData = {
  61. name: transition || position
  62. };
  63. if (transition === 'none') {
  64. updateData.duration = 0;
  65. }
  66. this.set(updateData);
  67. }
  68. }
  69. });
  70. //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImluZGV4LmpzIl0sIm5hbWVzIjpbIk9iamVjdCIsInZhbHVlIiwiY29tcG9uZW50XzEiLCJyZXF1aXJlIiwidHJhbnNpdGlvbl8xIiwic2FmZV9hcmVhXzEiLCJjbGFzc2VzIiwibWl4aW5zIiwicHJvcHMiLCJ0cmFuc2l0aW9uIiwidHlwZSIsIm9ic2VydmVyIiwiY3VzdG9tU3R5bGUiLCJvdmVybGF5U3R5bGUiLCJ6SW5kZXgiLCJvdmVybGF5IiwiY2xvc2VPbkNsaWNrT3ZlcmxheSIsInBvc2l0aW9uIiwiY3JlYXRlZCIsIm1ldGhvZHMiLCJvbkNsaWNrT3ZlcmxheSIsIm9ic2VydmVDbGFzcyIsIl9hIiwidXBkYXRlRGF0YSIsIm5hbWUiXSwibWFwcGluZ3MiOiI7O0FBQ0FBLE9BQUFBLGNBQUFBLENBQUFBLE9BQUFBLEVBQUFBLFlBQUFBLEVBQTZDLEVBQUVDLE9BQS9DRCxJQUE2QyxFQUE3Q0E7QUFDQSxJQUFJRSxjQUFjQyxRQUFsQiwwQkFBa0JBLENBQWxCO0FBQ0EsSUFBSUMsZUFBZUQsUUFBbkIsMkJBQW1CQSxDQUFuQjtBQUNBLElBQUlFLGNBQWNGLFFBQWxCLDBCQUFrQkEsQ0FBbEI7QUFDQUQsWUFBQUEsYUFBQUEsQ0FBMEI7QUFDdEJJLGFBQVMsQ0FBQSxhQUFBLEVBQUEsb0JBQUEsRUFBQSxnQkFBQSxFQUFBLGFBQUEsRUFBQSxvQkFBQSxFQURhLGdCQUNiLENBRGE7QUFTdEJDLFlBQVEsQ0FBQ0gsYUFBQUEsVUFBQUEsQ0FBRCxLQUFDQSxDQUFELEVBQWlDQyxZQVRuQixRQVNtQkEsRUFBakMsQ0FUYztBQVV0QkcsV0FBTztBQUNIQyxvQkFBWTtBQUNSQyxrQkFEUSxNQUFBO0FBRVJDLHNCQUFVO0FBRkYsU0FEVDtBQUtIQyxxQkFMRyxNQUFBO0FBTUhDLHNCQU5HLE1BQUE7QUFPSEMsZ0JBQVE7QUFDSkosa0JBREksTUFBQTtBQUVKVCxtQkFBTztBQUZILFNBUEw7QUFXSGMsaUJBQVM7QUFDTEwsa0JBREssT0FBQTtBQUVMVCxtQkFBTztBQUZGLFNBWE47QUFlSGUsNkJBQXFCO0FBQ2pCTixrQkFEaUIsT0FBQTtBQUVqQlQsbUJBQU87QUFGVSxTQWZsQjtBQW1CSGdCLGtCQUFVO0FBQ05QLGtCQURNLE1BQUE7QUFFTlQsbUJBRk0sUUFBQTtBQUdOVSxzQkFBVTtBQUhKO0FBbkJQLEtBVmU7QUFtQ3RCTyxhQUFTLFNBQUEsT0FBQSxHQUFZO0FBQ2pCLGFBQUEsWUFBQTtBQXBDa0IsS0FBQTtBQXNDdEJDLGFBQVM7QUFDTEMsd0JBQWdCLFNBQUEsY0FBQSxHQUFZO0FBQ3hCLGlCQUFBLEtBQUEsQ0FBQSxlQUFBO0FBQ0EsZ0JBQUksS0FBQSxJQUFBLENBQUosbUJBQUEsRUFBbUM7QUFDL0IscUJBQUEsS0FBQSxDQUFBLE9BQUE7QUFDSDtBQUxBLFNBQUE7QUFPTEMsc0JBQWMsU0FBQSxZQUFBLEdBQVk7QUFDdEIsZ0JBQUlDLEtBQUssS0FBVCxJQUFBO0FBQUEsZ0JBQW9CYixhQUFhYSxHQUFqQyxVQUFBO0FBQUEsZ0JBQWdETCxXQUFXSyxHQUEzRCxRQUFBO0FBQ0EsZ0JBQUlDLGFBQWE7QUFDYkMsc0JBQU1mLGNBQWNRO0FBRFAsYUFBakI7QUFHQSxnQkFBSVIsZUFBSixNQUFBLEVBQTJCO0FBQ3ZCYywyQkFBQUEsUUFBQUEsR0FBQUEsQ0FBQUE7QUFDSDtBQUNELGlCQUFBLEdBQUEsQ0FBQSxVQUFBO0FBQ0g7QUFoQkk7QUF0Q2EsQ0FBMUJyQiIsInNvdXJjZXNDb250ZW50IjpbIlwidXNlIHN0cmljdFwiO1xuT2JqZWN0LmRlZmluZVByb3BlcnR5KGV4cG9ydHMsIFwiX19lc01vZHVsZVwiLCB7IHZhbHVlOiB0cnVlIH0pO1xudmFyIGNvbXBvbmVudF8xID0gcmVxdWlyZShcIi4uL2NvbW1vbi9jb21wb25lbnRcIik7XG52YXIgdHJhbnNpdGlvbl8xID0gcmVxdWlyZShcIi4uL21peGlucy90cmFuc2l0aW9uXCIpO1xudmFyIHNhZmVfYXJlYV8xID0gcmVxdWlyZShcIi4uL21peGlucy9zYWZlLWFyZWFcIik7XG5jb21wb25lbnRfMS5WYW50Q29tcG9uZW50KHtcbiAgICBjbGFzc2VzOiBbXG4gICAgICAgICdlbnRlci1jbGFzcycsXG4gICAgICAgICdlbnRlci1hY3RpdmUtY2xhc3MnLFxuICAgICAgICAnZW50ZXItdG8tY2xhc3MnLFxuICAgICAgICAnbGVhdmUtY2xhc3MnLFxuICAgICAgICAnbGVhdmUtYWN0aXZlLWNsYXNzJyxcbiAgICAgICAgJ2xlYXZlLXRvLWNsYXNzJ1xuICAgIF0sXG4gICAgbWl4aW5zOiBbdHJhbnNpdGlvbl8xLnRyYW5zaXRpb24oZmFsc2UpLCBzYWZlX2FyZWFfMS5zYWZlQXJlYSgpXSxcbiAgICBwcm9wczoge1xuICAgICAgICB0cmFuc2l0aW9uOiB7XG4gICAgICAgICAgICB0eXBlOiBTdHJpbmcsXG4gICAgICAgICAgICBvYnNlcnZlcjogJ29ic2VydmVDbGFzcydcbiAgICAgICAgfSxcbiAgICAgICAgY3VzdG9tU3R5bGU6IFN0cmluZyxcbiAgICAgICAgb3ZlcmxheVN0eWxlOiBTdHJpbmcsXG4gICAgICAgIHpJbmRleDoge1xuICAgICAgICAgICAgdHlwZTogTnVtYmVyLFxuICAgICAgICAgICAgdmFsdWU6IDEwMFxuICAgICAgICB9LFxuICAgICAgICBvdmVybGF5OiB7XG4gICAgICAgICAgICB0eXBlOiBCb29sZWFuLFxuICAgICAgICAgICAgdmFsdWU6IHRydWVcbiAgICAgICAgfSxcbiAgICAgICAgY2xvc2VPbkNsaWNrT3ZlcmxheToge1xuICAgICAgICAgICAgdHlwZTogQm9vbGVhbixcbiAgICAgICAgICAgIHZhbHVlOiB0cnVlXG4gICAgICAgIH0sXG4gICAgICAgIHBvc2l0aW9uOiB7XG4gICAgICAgICAgICB0eXBlOiBTdHJpbmcsXG4gICAgICAgICAgICB2YWx1ZTogJ2NlbnRlcicsXG4gICAgICAgICAgICBvYnNlcnZlcjogJ29ic2VydmVDbGFzcydcbiAgICAgICAgfVxuICAgIH0sXG4gICAgY3JlYXRlZDogZnVuY3Rpb24gKCkge1xuICAgICAgICB0aGlzLm9ic2VydmVDbGFzcygpO1xuICAgIH0sXG4gICAgbWV0aG9kczoge1xuICAgICAgICBvbkNsaWNrT3ZlcmxheTogZnVuY3Rpb24gKCkge1xuICAgICAgICAgICAgdGhpcy4kZW1pdCgnY2xpY2stb3ZlcmxheScpO1xuICAgICAgICAgICAgaWYgKHRoaXMuZGF0YS5jbG9zZU9uQ2xpY2tPdmVybGF5KSB7XG4gICAgICAgICAgICAgICAgdGhpcy4kZW1pdCgnY2xvc2UnKTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfSxcbiAgICAgICAgb2JzZXJ2ZUNsYXNzOiBmdW5jdGlvbiAoKSB7XG4gICAgICAgICAgICB2YXIgX2EgPSB0aGlzLmRhdGEsIHRyYW5zaXRpb24gPSBfYS50cmFuc2l0aW9uLCBwb3NpdGlvbiA9IF9hLnBvc2l0aW9uO1xuICAgICAgICAgICAgdmFyIHVwZGF0ZURhdGEgPSB7XG4gICAgICAgICAgICAgICAgbmFtZTogdHJhbnNpdGlvbiB8fCBwb3NpdGlvblxuICAgICAgICAgICAgfTtcbiAgICAgICAgICAgIGlmICh0cmFuc2l0aW9uID09PSAnbm9uZScpIHtcbiAgICAgICAgICAgICAgICB1cGRhdGVEYXRhLmR1cmF0aW9uID0gMDtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICAgIHRoaXMuc2V0KHVwZGF0ZURhdGEpO1xuICAgICAgICB9XG4gICAgfVxufSk7XG4iXSwiZmlsZSI6ImluZGV4LmpzIn0=
  71. export default global['__wxComponents']['vant/popup/index']
  72. </script>
  73. <style platform="mp-weixin">
  74. @import '../common/index.css';.van-popup{position:fixed;top:50%;left:50%;max-height:100%;overflow-y:auto;background-color:#fff;box-sizing:border-box;-webkit-animation:ease both;animation:ease both;-webkit-overflow-scrolling:touch;transition-timing-function:ease}.van-popup--center{-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}.van-popup--top{top:0;right:auto;bottom:auto;left:50%;width:100%;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}.van-popup--right{top:50%;right:0;bottom:auto;left:auto;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.van-popup--bottom{top:auto;right:auto;bottom:0;left:50%;width:100%;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}.van-popup--left{top:50%;right:auto;bottom:auto;left:0;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.van-popup--bottom.van-popup--safe{padding-bottom:34px}.van-popup--left .van-popup__safe-top,.van-popup--right .van-popup__safe-top,.van-popup--top .van-popup__safe-top{height:44px}.van-popup--bottom .van-popup__safe-top,.van-popup--center .van-popup__safe-top{padding-top:0!important}.van-scale-enter-active,.van-scale-leave-active{transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform}.van-scale-enter,.van-scale-leave-to{opacity:0;-webkit-transform:translate3d(-50%,-50%,0) scale(.7);transform:translate3d(-50%,-50%,0) scale(.7)}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-center-enter-active,.van-center-leave-active{transition-property:opacity}.van-center-enter,.van-center-leave-to{opacity:0}.van-bottom-enter-active,.van-bottom-leave-active,.van-left-enter-active,.van-left-leave-active,.van-right-enter-active,.van-right-leave-active,.van-top-enter-active,.van-top-leave-active{transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.van-bottom-enter,.van-bottom-leave-to{-webkit-transform:translate3d(-50%,100%,0);transform:translate3d(-50%,100%,0)}.van-top-enter,.van-top-leave-to{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0)}.van-left-enter,.van-left-leave-to{-webkit-transform:translate3d(-100%,-50%,0);transform:translate3d(-100%,-50%,0)}.van-right-enter,.van-right-leave-to{-webkit-transform:translate3d(100%,-50%,0);transform:translate3d(100%,-50%,0)}
  75. </style>