dolphin-weex-ui 2.1.0 → 2.1.2

package/dist/index.web.js

@@ -9605,7 +9605,7 @@ exports = module.exports = __webpack_require__(0)(true);
 
 
 // module
-exports.push([module.i, "\n.dof-popup[data-v-fa0ab532] {\n  position: fixed;\n  width: 10rem;\n}\n.top[data-v-fa0ab532] {\n  left: 0;\n  right: 0;\n}\n.bottom[data-v-fa0ab532] {\n  left: 0;\n  right: 0;\n}\n.left[data-v-fa0ab532] {\n  bottom: 0;\n  top: 0;\n}\n.right[data-v-fa0ab532] {\n  bottom: 0;\n  top: 0;\n}\n.midea-actionsheet-bottom[data-v-fa0ab532] {\n  height: 1.33333rem;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n  -webkit-flex-direction: row;\n          flex-direction: row;\n  /* margin-top: 16px; */\n  -webkit-box-pack: justify;\n  -webkit-justify-content: space-between;\n          justify-content: space-between;\n}\n.midea-actionsheet-btn[data-v-fa0ab532] {\n  font-size: 0.42667rem;\n  /* color: #232323; */\n  background-color: #ffffff;\n  line-height: 1.33333rem;\n  text-align: center;\n  -webkit-box-flex: 1;\n  -webkit-flex: 1;\n          flex: 1; /* add by lau resolve bottom button */\n}\n.leftBtn[data-v-fa0ab532] {\n  color: #666666;\n  border-right-color: #e5e5e5;\n  border-right-width: 1px;\n  border-right-style: solid;\n}\n.rightBtn[data-v-fa0ab532] {\n  color: #267aff;\n}\n.midea-actionsheet-btn[data-v-fa0ab532]:active {\n  background-color: #f5f5f5;\n}\n.btnGap[data-v-fa0ab532] {\n  background-color: #f3f3f3;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-popup/index.vue?86976dca"],"names":[],"mappings":";AA0CA;EACA,gBAAA;EACA,aAAA;CACA;AACA;EACA,QAAA;EACA,SAAA;CACA;AACA;EACA,QAAA;EACA,SAAA;CACA;AACA;EACA,UAAA;EACA,OAAA;CACA;AACA;EACA,UAAA;EACA,OAAA;CACA;AAEA;EACA,mBAAA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,uBAAA;EACA,0BAAA;EAAA,uCAAA;UAAA,+BAAA;CACA;AACA;EACA,sBAAA;EACA,qBAAA;EACA,0BAAA;EACA,wBAAA;EACA,mBAAA;EACA,oBAAA;EAAA,gBAAA;UAAA,QAAA,CAAA,sCAAA;CACA;AACA;EACA,eAAA;EACA,4BAAA;EACA,wBAAA;EACA,0BAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA","file":"index.vue","sourcesContent":["<template>\n  <div>\n    <div @touchend=\"handleTouchEnd\">\n      <dof-overlay\n        :show=\"show\"\n        ref=\"overlay\"\n        v-bind=\"overlayCfg\"\n        @dofOverlayBodyClicked=\"dofOverlayBodyClicking\"\n      ></dof-overlay>\n    </div>\n    <div ref=\"dof-popup\" v-if=\"show_\" :height=\"_height\" @click=\"() => {}\" :class=\"['dof-popup', pos]\" :style=\"padStyle\">\n      <slot></slot>\n      <div class=\"btnGap\" v-if=\"button && button.length > 0\" style=\"width:750px; height:20px;\"></div>\n      <div v-if=\"button && button.length > 0\" class=\"midea-actionsheet-bottom\">\n        <text\n          v-for=\"(btn, index) in button\"\n          :key=\"index\"\n          :class=\"['midea-actionsheet-btn']\"\n          :style=\"{\n            color: btn.hasOwnProperty('textColor')\n              ? btn.textColor\n              : _isColmo\n              ? 'rgba(255,255,255,0.80)'\n              : index === 0\n              ? '#666666'\n              : '#267aff'\n          }\"\n          @click=\"actionsheetBtnClick(index, btn.hasOwnProperty('text') ? btn.text : btn)\"\n          >{{ btn.hasOwnProperty('text') ? btn.text : btn }}</text\n        >\n      </div>\n      <div\n        :style=\"{\n          height: show && isipx ? '68px' : '0px',\n          backgroundColor: _isColmo ? '#151617' : padStyle.backgroundColor\n        }\"\n      ></div>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.dof-popup {\n  position: fixed;\n  width: 750px;\n}\n.top {\n  left: 0;\n  right: 0;\n}\n.bottom {\n  left: 0;\n  right: 0;\n}\n.left {\n  bottom: 0;\n  top: 0;\n}\n.right {\n  bottom: 0;\n  top: 0;\n}\n\n.midea-actionsheet-bottom {\n  height: 100px;\n  flex-direction: row;\n  /* margin-top: 16px; */\n  justify-content: space-between;\n}\n.midea-actionsheet-btn {\n  font-size: 32px;\n  /* color: #232323; */\n  background-color: #ffffff;\n  line-height: 100px;\n  text-align: center;\n  flex: 1; /* add by lau resolve bottom button */\n}\n.leftBtn {\n  color: #666666;\n  border-right-color: #e5e5e5;\n  border-right-width: 1px;\n  border-right-style: solid;\n}\n.rightBtn {\n  color: #267aff;\n}\n.midea-actionsheet-btn:active {\n  background-color: #f5f5f5;\n}\n.btnGap {\n  background-color: #f3f3f3;\n}\n</style>\n<style scoped src=\"./colmo.css\"></style>\n\n<script>\nconst animation = weex.requireModule('animation')\nconst { platform } = weex.config.env\nconst isWeb = typeof window === 'object' && platform.toLowerCase() === 'web'\nimport DofOverlay from '../dof-overlay'\nimport Utils from '../utils'\nimport { Bridge } from 'dolphin-native-bridge'\nimport ColmoMixin from '../../mixins/colmo'\n\nexport default {\n  mixins: [ColmoMixin],\n  components: { DofOverlay },\n  props: {\n    show: {\n      type: Boolean,\n      default: false\n    },\n    pos: {\n      type: String,\n      default: 'bottom'\n    },\n    // 背景色  暂不开放\n    popupColor: {\n      type: String,\n      default: ''\n    },\n    overlayCfg: {\n      type: Object,\n      default: () => ({\n        hasAnimation: true,\n        timingFunction: ['ease-in', 'ease-out'],\n        duration: 300\n      })\n    },\n    height: {\n      type: [Number, String],\n      default: 840\n    },\n    standOut: {\n      type: [Number, String],\n      default: 0\n    },\n    width: {\n      type: [Number, String],\n      default: 750\n    },\n    animation: {\n      type: Object,\n      default: () => ({\n        // timingFunction: 'ease-in'\n        timingFunction: 'cubic-bezier(0.25, 0.1, 0.25, 1.0)'\n      })\n    },\n    button: {\n      type: Array,\n      default: () => []\n    },\n    borderRadius: {\n      type: String,\n      default: '32px'\n    }\n  },\n  data: () => ({\n    haveOverlay: true,\n    isOverShow: true,\n    bottomArc: 0,\n    show_: false\n  }),\n  computed: {\n    isipx: function() {\n      if (this.bottomArc) return true\n      return (\n        weex &&\n        (weex.config.env.deviceModel === 'iPhone10,3' ||\n        weex.config.env.deviceModel === 'iPhone10,6' || // iphoneX\n        weex.config.env.deviceModel === 'iPhone11,8' || // iPhone XR\n        weex.config.env.deviceModel === 'iPhone11,2' || // iPhone XS\n        weex.config.env.deviceModel === 'iPhone11,4' ||\n        weex.config.env.deviceModel === 'iPhone11,6' || // iPhone XS Max\n        weex.config.env.deviceModel === 'iPhone12,1' || // iPhone11\n        weex.config.env.deviceModel === 'iPhone12,3' ||\n        weex.config.env.deviceModel === 'iPhone12,5' || // iPhone 11 Pro iPhone 11 Pro Max\n        weex.config.env.deviceModel === 'iPhone13,1' ||\n        weex.config.env.deviceModel === 'iPhone13,2' || // iPhone12 Mini && iPhone12\n        weex.config.env.deviceModel === 'iPhone13,3' || //iPhone12 Pro\n        weex.config.env.deviceModel === 'iPhone13,4' || // iPhone12 Pro Max\n        weex.config.env.deviceModel === 'iPhone14,4' || //iPhone 13 mini\n        weex.config.env.deviceModel === 'iPhone14,5' || //iPhone 13\n        weex.config.env.deviceModel === 'iPhone14,2' || //iPhone 13 Pro\n          weex.config.env.deviceModel === 'Iphone14,3') //iPhone 13 Pro Max\n      )\n    },\n    _height() {\n      let { height, isipx, pos } = this\n      height = Number(height)\n      height = isipx && pos == 'bottom' ? height + 68 : height\n      return height\n    },\n    transformValue() {\n      return this.getTransform(this.pos, this.width, this.height, true)\n    },\n    _popupColor() {\n      if (this.popupColor) return this.popupColor\n      return this._isColmo ? '#1c1e21' : '#fff'\n    },\n    padStyle() {\n      const { pos, width, height, _popupColor, _height } = this\n      let style = {\n        width: `${width}px`,\n        backgroundColor: _popupColor\n      }\n      pos === 'top' &&\n        (style = {\n          ...style,\n          top: `${-height}px`,\n          height: `${height}px`,\n          borderBottomLeftRadius: this._isColmo ? 0 : this.borderRadius,\n          borderBottomRightRadius: this._isColmo ? 0 : this.borderRadius\n        })\n      pos === 'bottom' &&\n        (style = {\n          ...style,\n          bottom: `${-_height - 1}px`,\n          height: `${_height}px`,\n          borderTopLeftRadius: this._isColmo ? 0 : this.borderRadius,\n          borderTopRightRadius: this._isColmo ? 0 : this.borderRadius\n        })\n      pos === 'left' &&\n        (style = {\n          ...style,\n          left: `${-width}px`\n        })\n      pos === 'right' &&\n        (style = {\n          ...style,\n          right: `${-width}px`\n        })\n      return style\n    },\n    buttonComp() {\n      return this.button\n    }\n  },\n  watch: {\n    _height() {\n      this.appearPopup(this.show_, 0)\n    },\n    show_(val) {\n      setTimeout(() => {\n        val && this.appearPopup(val)\n      }, 100)\n    },\n    show: {\n      handler(val) {\n        if (val) {\n          setTimeout(() => {\n            this.show_ = true\n          }, 0)\n        } else {\n          this.appearPopup(false, 300, () => {})\n          setTimeout(() => {\n            this.show_ = false\n          }, 0)\n        }\n      },\n      immediate: true\n    }\n  },\n  mounted() {\n    Bridge.getAllBarHeight().then(res => {\n      this.bottomArc = res.bottomArc || 0\n    })\n  },\n  methods: {\n    actionsheetBtnClick(index, text) {\n      this.appearPopup(false)\n      this.$refs.overlay.appearOverlay(false)\n      this.$emit('dofPopupButtonClicked', { index, text })\n    },\n    handleTouchEnd(e) {\n      // 在支付宝上面有点击穿透问题\n      const { platform } = weex.config.env\n      platform === 'Web' && e.preventDefault && e.preventDefault()\n    },\n    hide() {\n      this.appearPopup(false)\n      this.$refs.overlay.appearOverlay(false)\n    },\n    dofOverlayBodyClicking() {\n      this.isShow && this.appearPopup(false)\n      setTimeout(() => {\n        this.$emit('dofPopupOverlayClicked')\n      }, 100)\n    },\n    appearPopup(bool, duration = 300, cb = () => {}) {\n      this.isShow = bool\n      const popupEl = this.$refs['dof-popup']\n      if (!popupEl) {\n        return\n      }\n      animation.transition(\n        popupEl,\n        {\n          styles: {\n            transform: this.getTransform(this.pos, this.width, this._height, !bool) //_height解决iphonex系列向上过渡距离不够的问题\n          },\n          duration,\n          delay: 0,\n          ...this.animation\n        },\n        () => {\n          cb()\n          if (!bool) {\n            // this.$emit('dofPopupOverlayClicked', { pos: this.pos })\n          }\n        }\n      )\n    },\n    getTransform(pos, width, height, bool) {\n      let _size = pos === 'top' || pos === 'bottom' ? height : width\n      let _transform\n      if (isWeb) {\n        _size -= this.standOut\n      }\n      bool && (_size = 0)\n      switch (pos) {\n        case 'top':\n          _transform = `translateY(${_size}px)`\n          break\n        case 'bottom':\n          _transform = `translateY(-${_size}px)`\n          break\n        case 'left':\n          _transform = `translateX(${_size}px)`\n          break\n        case 'right':\n          _transform = `translateX(-${_size}px)`\n          break\n      }\n      return _transform\n    }\n  },\n  genBtnText(item) {\n    if (Utils.isPlainObject(item)) {\n      return item.text\n    } else {\n      return item\n    }\n  }\n}\n</script>\n"],"sourceRoot":""}]);
+exports.push([module.i, "\n.dof-popup[data-v-fa0ab532] {\n  position: fixed;\n  width: 10rem;\n}\n.top[data-v-fa0ab532] {\n  left: 0;\n  right: 0;\n}\n.bottom[data-v-fa0ab532] {\n  left: 0;\n  right: 0;\n}\n.left[data-v-fa0ab532] {\n  bottom: 0;\n  top: 0;\n}\n.right[data-v-fa0ab532] {\n  bottom: 0;\n  top: 0;\n}\n.midea-actionsheet-bottom[data-v-fa0ab532] {\n  height: 1.33333rem;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n  -webkit-flex-direction: row;\n          flex-direction: row;\n  /* margin-top: 16px; */\n  -webkit-box-pack: justify;\n  -webkit-justify-content: space-between;\n          justify-content: space-between;\n}\n.midea-actionsheet-btn[data-v-fa0ab532] {\n  font-size: 0.42667rem;\n  /* color: #232323; */\n  background-color: #ffffff;\n  line-height: 1.33333rem;\n  text-align: center;\n  -webkit-box-flex: 1;\n  -webkit-flex: 1;\n          flex: 1; /* add by lau resolve bottom button */\n}\n.leftBtn[data-v-fa0ab532] {\n  color: #666666;\n  border-right-color: #e5e5e5;\n  border-right-width: 1px;\n  border-right-style: solid;\n}\n.rightBtn[data-v-fa0ab532] {\n  color: #267aff;\n}\n.midea-actionsheet-btn[data-v-fa0ab532]:active {\n  background-color: #f5f5f5;\n}\n.btnGap[data-v-fa0ab532] {\n  background-color: #f3f3f3;\n}\n", "", {"version":3,"sources":["/Users/wuhm45/Documents/code/weex组件库/dolphin-weex-ui/packages/dof-popup/index.vue?00e9aa36"],"names":[],"mappings":";AA2CA;EACA,gBAAA;EACA,aAAA;CACA;AACA;EACA,QAAA;EACA,SAAA;CACA;AACA;EACA,QAAA;EACA,SAAA;CACA;AACA;EACA,UAAA;EACA,OAAA;CACA;AACA;EACA,UAAA;EACA,OAAA;CACA;AAEA;EACA,mBAAA;EACA,+BAAA;EAAA,8BAAA;EAAA,4BAAA;UAAA,oBAAA;EACA,uBAAA;EACA,0BAAA;EAAA,uCAAA;UAAA,+BAAA;CACA;AACA;EACA,sBAAA;EACA,qBAAA;EACA,0BAAA;EACA,wBAAA;EACA,mBAAA;EACA,oBAAA;EAAA,gBAAA;UAAA,QAAA,CAAA,sCAAA;CACA;AACA;EACA,eAAA;EACA,4BAAA;EACA,wBAAA;EACA,0BAAA;CACA;AACA;EACA,eAAA;CACA;AACA;EACA,0BAAA;CACA;AACA;EACA,0BAAA;CACA","file":"index.vue","sourcesContent":["<template>\n  <div>\n    <div @touchend=\"handleTouchEnd\">\n      <dof-overlay\n        :show=\"overlayShow\"\n        ref=\"overlay\"\n        v-bind=\"overlayCfg\"\n        :canAutoClose=\"isOverLayClickHide\"\n        @dofOverlayBodyClicked=\"dofOverlayBodyClicking\"\n      ></dof-overlay>\n    </div>\n    <div ref=\"dof-popup\" v-if=\"show_\" :height=\"_height\" @click=\"() => {}\" :class=\"['dof-popup', pos]\" :style=\"padStyle\">\n      <slot></slot>\n      <div class=\"btnGap\" v-if=\"button && button.length > 0\" style=\"width:750px; height:20px;\"></div>\n      <div v-if=\"button && button.length > 0\" class=\"midea-actionsheet-bottom\">\n        <text\n          v-for=\"(btn, index) in button\"\n          :key=\"index\"\n          :class=\"['midea-actionsheet-btn']\"\n          :style=\"{\n            color: btn.hasOwnProperty('textColor')\n              ? btn.textColor\n              : _isColmo\n              ? 'rgba(255,255,255,0.80)'\n              : index === 0\n              ? '#666666'\n              : '#267aff'\n          }\"\n          @click=\"actionsheetBtnClick(index, btn.hasOwnProperty('text') ? btn.text : btn)\"\n          >{{ btn.hasOwnProperty('text') ? btn.text : btn }}</text\n        >\n      </div>\n      <div\n        :style=\"{\n          height: show && isipx ? '68px' : '0px',\n          backgroundColor: _isColmo ? '#151617' : padStyle.backgroundColor\n        }\"\n      ></div>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.dof-popup {\n  position: fixed;\n  width: 750px;\n}\n.top {\n  left: 0;\n  right: 0;\n}\n.bottom {\n  left: 0;\n  right: 0;\n}\n.left {\n  bottom: 0;\n  top: 0;\n}\n.right {\n  bottom: 0;\n  top: 0;\n}\n\n.midea-actionsheet-bottom {\n  height: 100px;\n  flex-direction: row;\n  /* margin-top: 16px; */\n  justify-content: space-between;\n}\n.midea-actionsheet-btn {\n  font-size: 32px;\n  /* color: #232323; */\n  background-color: #ffffff;\n  line-height: 100px;\n  text-align: center;\n  flex: 1; /* add by lau resolve bottom button */\n}\n.leftBtn {\n  color: #666666;\n  border-right-color: #e5e5e5;\n  border-right-width: 1px;\n  border-right-style: solid;\n}\n.rightBtn {\n  color: #267aff;\n}\n.midea-actionsheet-btn:active {\n  background-color: #f5f5f5;\n}\n.btnGap {\n  background-color: #f3f3f3;\n}\n</style>\n<style scoped src=\"./colmo.css\"></style>\n\n<script>\nconst animation = weex.requireModule('animation')\nconst { platform } = weex.config.env\nconst isWeb = typeof window === 'object' && platform.toLowerCase() === 'web'\nimport DofOverlay from '../dof-overlay'\nimport Utils from '../utils'\nimport { Bridge } from 'dolphin-native-bridge'\nimport ColmoMixin from '../../mixins/colmo'\n\nexport default {\n  mixins: [ColmoMixin],\n  components: { DofOverlay },\n  props: {\n    show: {\n      type: Boolean,\n      default: false\n    },\n    pos: {\n      type: String,\n      default: 'bottom'\n    },\n    // 背景色  暂不开放\n    popupColor: {\n      type: String,\n      default: ''\n    },\n    overlayCfg: {\n      type: Object,\n      default: () => ({\n        hasAnimation: true,\n        timingFunction: ['ease-in', 'ease-out'],\n        duration: 300\n      })\n    },\n    height: {\n      type: [Number, String],\n      default: 840\n    },\n    standOut: {\n      type: [Number, String],\n      default: 0\n    },\n    width: {\n      type: [Number, String],\n      default: 750\n    },\n    animation: {\n      type: Object,\n      default: () => ({\n        // timingFunction: 'ease-in'\n        timingFunction: 'cubic-bezier(0.25, 0.1, 0.25, 1.0)'\n      })\n    },\n    button: {\n      type: Array,\n      default: () => []\n    },\n    borderRadius: {\n      type: String,\n      default: '32px'\n    },\n    isOverLayClickHide: {\n      type: Boolean,\n      default: true\n    }\n  },\n  data: () => ({\n    haveOverlay: true,\n    isOverShow: true,\n    bottomArc: 0,\n    show_: false,\n    overlayShow: false\n  }),\n  computed: {\n    isipx: function() {\n      if (this.bottomArc) return true\n      return (\n        weex &&\n        (weex.config.env.deviceModel === 'iPhone10,3' ||\n        weex.config.env.deviceModel === 'iPhone10,6' || // iphoneX\n        weex.config.env.deviceModel === 'iPhone11,8' || // iPhone XR\n        weex.config.env.deviceModel === 'iPhone11,2' || // iPhone XS\n        weex.config.env.deviceModel === 'iPhone11,4' ||\n        weex.config.env.deviceModel === 'iPhone11,6' || // iPhone XS Max\n        weex.config.env.deviceModel === 'iPhone12,1' || // iPhone11\n        weex.config.env.deviceModel === 'iPhone12,3' ||\n        weex.config.env.deviceModel === 'iPhone12,5' || // iPhone 11 Pro iPhone 11 Pro Max\n        weex.config.env.deviceModel === 'iPhone13,1' ||\n        weex.config.env.deviceModel === 'iPhone13,2' || // iPhone12 Mini && iPhone12\n        weex.config.env.deviceModel === 'iPhone13,3' || //iPhone12 Pro\n        weex.config.env.deviceModel === 'iPhone13,4' || // iPhone12 Pro Max\n        weex.config.env.deviceModel === 'iPhone14,4' || //iPhone 13 mini\n        weex.config.env.deviceModel === 'iPhone14,5' || //iPhone 13\n        weex.config.env.deviceModel === 'iPhone14,2' || //iPhone 13 Pro\n          weex.config.env.deviceModel === 'Iphone14,3') //iPhone 13 Pro Max\n      )\n    },\n    _height() {\n      let { height, isipx, pos } = this\n      height = Number(height)\n      height = isipx && pos == 'bottom' ? height + 68 : height\n      return height\n    },\n    transformValue() {\n      return this.getTransform(this.pos, this.width, this.height, true)\n    },\n    _popupColor() {\n      if (this.popupColor) return this.popupColor\n      return this._isColmo ? '#1c1e21' : '#fff'\n    },\n    padStyle() {\n      const { pos, width, height, _popupColor, _height } = this\n      let style = {\n        width: `${width}px`,\n        backgroundColor: _popupColor\n      }\n      pos === 'top' &&\n        (style = {\n          ...style,\n          top: `${-height}px`,\n          height: `${height}px`,\n          borderBottomLeftRadius: this._isColmo ? 0 : this.borderRadius,\n          borderBottomRightRadius: this._isColmo ? 0 : this.borderRadius\n        })\n      pos === 'bottom' &&\n        (style = {\n          ...style,\n          bottom: `${-_height - 1}px`,\n          height: `${_height}px`,\n          borderTopLeftRadius: this._isColmo ? 0 : this.borderRadius,\n          borderTopRightRadius: this._isColmo ? 0 : this.borderRadius\n        })\n      pos === 'left' &&\n        (style = {\n          ...style,\n          left: `${-width}px`\n        })\n      pos === 'right' &&\n        (style = {\n          ...style,\n          right: `${-width}px`\n        })\n      return style\n    },\n    buttonComp() {\n      return this.button\n    }\n  },\n  watch: {\n    _height() {\n      this.appearPopup(this.show_, 0)\n    },\n    show_(val) {\n      setTimeout(() => {\n        val && this.appearPopup(val)\n      }, 100)\n    },\n    show: {\n      handler(val) {\n        if (val) {\n          this.overlayShow = true\n          setTimeout(() => {\n            this.show_ = true\n          }, 0)\n        } else {\n          this.appearPopup(false, 300, () => {})\n          setTimeout(() => {\n            this.show_ = false\n            this.overlayShow = false\n          }, 400)\n        }\n      },\n      immediate: true\n    }\n  },\n  mounted() {\n    Bridge.getAllBarHeight().then(res => {\n      this.bottomArc = res.bottomArc || 0\n    })\n  },\n  methods: {\n    actionsheetBtnClick(index, text) {\n      this.appearPopup(false)\n      this.$refs.overlay.appearOverlay(false)\n      this.$emit('dofPopupButtonClicked', { index, text })\n    },\n    handleTouchEnd(e) {\n      // 在支付宝上面有点击穿透问题\n      const { platform } = weex.config.env\n      platform === 'Web' && e.preventDefault && e.preventDefault()\n    },\n    hide() {\n      this.appearPopup(false)\n      this.$refs.overlay.appearOverlay(false)\n    },\n    dofOverlayBodyClicking() {\n      this.isOverLayClickHide && this.isShow && this.appearPopup(false)\n      setTimeout(() => {\n        this.$emit('dofPopupOverlayClicked')\n      }, 100)\n    },\n    appearPopup(bool, duration = 300, cb = () => {}) {\n      this.isShow = bool\n      const popupEl = this.$refs['dof-popup']\n      if (!popupEl) {\n        return\n      }\n      animation.transition(\n        popupEl,\n        {\n          styles: {\n            transform: this.getTransform(this.pos, this.width, this._height, !bool) //_height解决iphonex系列向上过渡距离不够的问题\n          },\n          duration,\n          delay: 0,\n          ...this.animation\n        },\n        () => {\n          cb()\n          if (!bool) {\n            // this.$emit('dofPopupOverlayClicked', { pos: this.pos })\n          }\n        }\n      )\n    },\n    getTransform(pos, width, height, bool) {\n      let _size = pos === 'top' || pos === 'bottom' ? height : width\n      let _transform\n      if (isWeb) {\n        _size -= this.standOut\n      }\n      bool && (_size = 0)\n      switch (pos) {\n        case 'top':\n          _transform = `translateY(${_size}px)`\n          break\n        case 'bottom':\n          _transform = `translateY(-${_size}px)`\n          break\n        case 'left':\n          _transform = `translateX(${_size}px)`\n          break\n        case 'right':\n          _transform = `translateX(-${_size}px)`\n          break\n      }\n      return _transform\n    }\n  },\n  genBtnText(item) {\n    if (Utils.isPlainObject(item)) {\n      return item.text\n    } else {\n      return item\n    }\n  }\n}\n</script>\n"],"sourceRoot":""}]);
 
 // exports
 
@@ -23534,6 +23534,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 //
 //
 //
+//
 
 var animation = weex.requireModule('animation');
 var platform = weex.config.env.platform;
@@ -23596,6 +23597,10 @@ exports.default = {
     borderRadius: {
       type: String,
       default: '32px'
+    },
+    isOverLayClickHide: {
+      type: Boolean,
+      default: true
     }
   },
   data: function data() {
@@ -23603,7 +23608,8 @@ exports.default = {
       haveOverlay: true,
       isOverShow: true,
       bottomArc: 0,
-      show_: false
+      show_: false,
+      overlayShow: false
     };
   },
   computed: {
@@ -23692,6 +23698,7 @@ exports.default = {
         var _this2 = this;
 
         if (val) {
+          this.overlayShow = true;
           setTimeout(function () {
             _this2.show_ = true;
           }, 0);
@@ -23699,7 +23706,8 @@ exports.default = {
           this.appearPopup(false, 300, function () {});
           setTimeout(function () {
             _this2.show_ = false;
-          }, 0);
+            _this2.overlayShow = false;
+          }, 400);
         }
       },
 
@@ -23733,7 +23741,7 @@ exports.default = {
     dofOverlayBodyClicking: function dofOverlayBodyClicking() {
       var _this4 = this;
 
-      this.isShow && this.appearPopup(false);
+      this.isOverLayClickHide && this.isShow && this.appearPopup(false);
       setTimeout(function () {
         _this4.$emit('dofPopupOverlayClicked');
       }, 100);
@@ -51911,7 +51919,8 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
   }, [_c('dof-overlay', _vm._b({
     ref: "overlay",
     attrs: {
-      "show": _vm.show,
+      "show": _vm.overlayShow,
+      "canAutoClose": _vm.isOverLayClickHide,
       "data-evt-dofOverlayBodyClicked": ""
     },
     on: {