|
@@ -1,824 +0,0 @@
|
|
|
-
|
|
|
-import u from '.././z-paging-utils'
|
|
|
-import c from '.././z-paging-constant'
|
|
|
-import Enum from '.././z-paging-enum'
|
|
|
-
|
|
|
-
|
|
|
-const weexAnimation = weex.requireModule('animation');
|
|
|
-
|
|
|
-export default {
|
|
|
- props: {
|
|
|
-
|
|
|
- refresherThemeStyle: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherThemeStyle', '')
|
|
|
- },
|
|
|
-
|
|
|
- refresherImgStyle: {
|
|
|
- type: Object,
|
|
|
- default: u.gc('refresherImgStyle', {})
|
|
|
- },
|
|
|
-
|
|
|
- refresherTitleStyle: {
|
|
|
- type: Object,
|
|
|
- default: u.gc('refresherTitleStyle', {})
|
|
|
- },
|
|
|
-
|
|
|
- refresherUpdateTimeStyle: {
|
|
|
- type: Object,
|
|
|
- default: u.gc('refresherUpdateTimeStyle', {})
|
|
|
- },
|
|
|
-
|
|
|
- watchRefresherTouchmove: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('watchRefresherTouchmove', false)
|
|
|
- },
|
|
|
-
|
|
|
- loadingMoreThemeStyle: {
|
|
|
- type: String,
|
|
|
- default: u.gc('loadingMoreThemeStyle', '')
|
|
|
- },
|
|
|
-
|
|
|
- refresherOnly: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherOnly', false)
|
|
|
- },
|
|
|
-
|
|
|
- refresherDefaultDuration: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherDefaultDuration', 100)
|
|
|
- },
|
|
|
-
|
|
|
- refresherCompleteDelay: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherCompleteDelay', 0)
|
|
|
- },
|
|
|
-
|
|
|
- refresherCompleteDuration: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherCompleteDuration', 300)
|
|
|
- },
|
|
|
-
|
|
|
- refresherRefreshingScrollable: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherRefreshingScrollable', true)
|
|
|
- },
|
|
|
-
|
|
|
- refresherCompleteScrollable: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherCompleteScrollable', false)
|
|
|
- },
|
|
|
-
|
|
|
- useCustomRefresher: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('useCustomRefresher', true)
|
|
|
- },
|
|
|
-
|
|
|
- refresherFps: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherFps', 40)
|
|
|
- },
|
|
|
-
|
|
|
- refresherMaxAngle: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherMaxAngle', 40)
|
|
|
- },
|
|
|
-
|
|
|
- refresherAngleEnableChangeContinued: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherAngleEnableChangeContinued', false)
|
|
|
- },
|
|
|
-
|
|
|
- refresherDefaultText: {
|
|
|
- type: [String, Object],
|
|
|
- default: u.gc('refresherDefaultText', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherPullingText: {
|
|
|
- type: [String, Object],
|
|
|
- default: u.gc('refresherPullingText', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherRefreshingText: {
|
|
|
- type: [String, Object],
|
|
|
- default: u.gc('refresherRefreshingText', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherCompleteText: {
|
|
|
- type: [String, Object],
|
|
|
- default: u.gc('refresherCompleteText', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherGoF2Text: {
|
|
|
- type: [String, Object],
|
|
|
- default: u.gc('refresherGoF2Text', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherDefaultImg: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherDefaultImg', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherPullingImg: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherPullingImg', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherRefreshingImg: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherRefreshingImg', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherCompleteImg: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherCompleteImg', null)
|
|
|
- },
|
|
|
-
|
|
|
- refresherRefreshingAnimated: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherRefreshingAnimated', true)
|
|
|
- },
|
|
|
-
|
|
|
- refresherEndBounceEnabled: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherEndBounceEnabled', true)
|
|
|
- },
|
|
|
-
|
|
|
- refresherEnabled: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherEnabled', true)
|
|
|
- },
|
|
|
-
|
|
|
- refresherThreshold: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherThreshold', '80rpx')
|
|
|
- },
|
|
|
-
|
|
|
- refresherDefaultStyle: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherDefaultStyle', 'black')
|
|
|
- },
|
|
|
-
|
|
|
- refresherBackground: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherBackground', 'transparent')
|
|
|
- },
|
|
|
-
|
|
|
- refresherFixedBackground: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherFixedBackground', 'transparent')
|
|
|
- },
|
|
|
-
|
|
|
- refresherFixedBacHeight: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherFixedBacHeight', 0)
|
|
|
- },
|
|
|
-
|
|
|
- refresherOutRate: {
|
|
|
- type: Number,
|
|
|
- default: u.gc('refresherOutRate', 0.65)
|
|
|
- },
|
|
|
-
|
|
|
- refresherF2Enabled: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherF2Enabled', false)
|
|
|
- },
|
|
|
-
|
|
|
- refresherF2Threshold: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherF2Threshold', '200rpx')
|
|
|
- },
|
|
|
-
|
|
|
- refresherF2Duration: {
|
|
|
- type: [Number, String],
|
|
|
- default: u.gc('refresherF2Duration', 200)
|
|
|
- },
|
|
|
-
|
|
|
- showRefresherF2: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('showRefresherF2', true)
|
|
|
- },
|
|
|
-
|
|
|
- refresherPullRate: {
|
|
|
- type: Number,
|
|
|
- default: u.gc('refresherPullRate', 0.75)
|
|
|
- },
|
|
|
-
|
|
|
- showRefresherUpdateTime: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('showRefresherUpdateTime', false)
|
|
|
- },
|
|
|
-
|
|
|
- refresherUpdateTimeKey: {
|
|
|
- type: String,
|
|
|
- default: u.gc('refresherUpdateTimeKey', 'default')
|
|
|
- },
|
|
|
-
|
|
|
- refresherVibrate: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherVibrate', false)
|
|
|
- },
|
|
|
-
|
|
|
- refresherNoTransform: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('refresherNoTransform', false)
|
|
|
- },
|
|
|
-
|
|
|
- useRefresherStatusBarPlaceholder: {
|
|
|
- type: Boolean,
|
|
|
- default: u.gc('useRefresherStatusBarPlaceholder', false)
|
|
|
- },
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- R: Enum.Refresher,
|
|
|
-
|
|
|
- refresherStatus: Enum.Refresher.Default,
|
|
|
- refresherTouchstartY: 0,
|
|
|
- lastRefresherTouchmove: null,
|
|
|
- refresherReachMaxAngle: true,
|
|
|
- refresherTransform: 'translateY(0px)',
|
|
|
- refresherTransition: '',
|
|
|
- finalRefresherDefaultStyle: 'black',
|
|
|
- refresherRevealStackCount: 0,
|
|
|
- refresherCompleteTimeout: null,
|
|
|
- refresherCompleteSubTimeout: null,
|
|
|
- refresherEndTimeout: null,
|
|
|
- isTouchmovingTimeout: null,
|
|
|
- refresherTriggered: false,
|
|
|
- isTouchmoving: false,
|
|
|
- isTouchEnded: false,
|
|
|
- isUserPullDown: false,
|
|
|
- privateRefresherEnabled: -1,
|
|
|
- privateShowRefresherWhenReload: false,
|
|
|
- customRefresherHeight: -1,
|
|
|
- showCustomRefresher: false,
|
|
|
- doRefreshAnimateAfter: false,
|
|
|
- isRefresherInComplete: false,
|
|
|
- showF2: false,
|
|
|
- f2Transform: '',
|
|
|
- pullDownTimeStamp: 0,
|
|
|
- moveDis: 0,
|
|
|
- oldMoveDis: 0,
|
|
|
- currentDis: 0,
|
|
|
- oldCurrentMoveDis: 0,
|
|
|
- oldRefresherTouchmoveY: 0,
|
|
|
- oldTouchDirection: '',
|
|
|
- oldEmitedTouchDirection: '',
|
|
|
- oldPullingDistance: -1,
|
|
|
- refresherThresholdUpdateTag: 0
|
|
|
- }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- refresherDefaultStyle: {
|
|
|
- handler(newVal) {
|
|
|
- if (newVal.length) {
|
|
|
- this.finalRefresherDefaultStyle = newVal;
|
|
|
- }
|
|
|
- },
|
|
|
- immediate: true
|
|
|
- },
|
|
|
- refresherStatus(newVal) {
|
|
|
- newVal === Enum.Refresher.Loading && this._cleanRefresherEndTimeout();
|
|
|
- this.refresherVibrate && (newVal === Enum.Refresher.ReleaseToRefresh || newVal === Enum.Refresher.GoF2) && this._doVibrateShort();
|
|
|
- this.$emit('refresherStatusChange', newVal);
|
|
|
- this.$emit('update:refresherStatus', newVal);
|
|
|
- },
|
|
|
-
|
|
|
- refresherEnabled(newVal) {
|
|
|
-
|
|
|
- !newVal && this.endRefresh();
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
- pullDownDisTimeStamp() {
|
|
|
- return 1000 / this.refresherFps;
|
|
|
- },
|
|
|
- refresherThresholdUnitConverted() {
|
|
|
- return u.addUnit(this.refresherThreshold, this.unit);
|
|
|
- },
|
|
|
- finalRefresherEnabled() {
|
|
|
- if (this.useChatRecordMode) return false;
|
|
|
- if (this.privateRefresherEnabled === -1) return this.refresherEnabled;
|
|
|
- return this.privateRefresherEnabled === 1;
|
|
|
- },
|
|
|
- finalRefresherThreshold() {
|
|
|
- let refresherThreshold = this.refresherThresholdUnitConverted;
|
|
|
- let idDefault = false;
|
|
|
- if (refresherThreshold === u.addUnit(80, this.unit)) {
|
|
|
- idDefault = true;
|
|
|
- if (this.showRefresherUpdateTime) {
|
|
|
- refresherThreshold = u.addUnit(120, this.unit);
|
|
|
- }
|
|
|
- }
|
|
|
- if (idDefault && this.customRefresherHeight > 0) return this.customRefresherHeight + this.finalRefresherThresholdPlaceholder;
|
|
|
- return u.convertToPx(refresherThreshold) + this.finalRefresherThresholdPlaceholder;
|
|
|
- },
|
|
|
- finalRefresherF2Threshold() {
|
|
|
- return u.convertToPx(u.addUnit(this.refresherF2Threshold, this.unit));
|
|
|
- },
|
|
|
- finalRefresherThresholdPlaceholder() {
|
|
|
- return this.useRefresherStatusBarPlaceholder ? this.statusBarHeight : 0;
|
|
|
- },
|
|
|
- finalRefresherFixedBacHeight() {
|
|
|
- return u.convertToPx(this.refresherFixedBacHeight);
|
|
|
- },
|
|
|
- finalRefresherThemeStyle() {
|
|
|
- return this.refresherThemeStyle.length ? this.refresherThemeStyle : this.defaultThemeStyle;
|
|
|
- },
|
|
|
- finalRefresherOutRate() {
|
|
|
- let rate = this.refresherOutRate;
|
|
|
- rate = Math.max(0,rate);
|
|
|
- rate = Math.min(1,rate);
|
|
|
- return rate;
|
|
|
- },
|
|
|
- finalRefresherPullRate() {
|
|
|
- let rate = this.refresherPullRate;
|
|
|
- rate = Math.max(0,rate);
|
|
|
- return rate;
|
|
|
- },
|
|
|
- finalRefresherTransform() {
|
|
|
- if (this.refresherNoTransform || this.refresherTransform === 'translateY(0px)') return 'none';
|
|
|
- return this.refresherTransform;
|
|
|
- },
|
|
|
- finalShowRefresherWhenReload() {
|
|
|
- return this.showRefresherWhenReload || this.privateShowRefresherWhenReload;
|
|
|
- },
|
|
|
- finalRefresherTriggered() {
|
|
|
- if (!(this.finalRefresherEnabled && !this.useCustomRefresher)) return false;
|
|
|
- return this.refresherTriggered;
|
|
|
- },
|
|
|
- showRefresher() {
|
|
|
- const showRefresher = this.finalRefresherEnabled && this.useCustomRefresher;
|
|
|
-
|
|
|
- this.active && this.customRefresherHeight === -1 && showRefresher && this.updateCustomRefresherHeight();
|
|
|
-
|
|
|
- return showRefresher;
|
|
|
- },
|
|
|
- hasTouchmove() {
|
|
|
-
|
|
|
-
|
|
|
- if (this.$listeners && !this.$listeners.refresherTouchmove) return false;
|
|
|
-
|
|
|
-
|
|
|
- return this.watchRefresherTouchmove;
|
|
|
-
|
|
|
- return true;
|
|
|
-
|
|
|
- return this.watchRefresherTouchmove;
|
|
|
- },
|
|
|
- },
|
|
|
- methods: {
|
|
|
-
|
|
|
- endRefresh() {
|
|
|
- this.totalData = this.realTotalData;
|
|
|
- this._refresherEnd();
|
|
|
- this._endSystemLoadingAndRefresh();
|
|
|
- this._handleScrollViewBounce({ bounce: true });
|
|
|
- this.$nextTick(() => {
|
|
|
- this.refresherTriggered = false;
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- updateCustomRefresherHeight() {
|
|
|
- u.delay(() => this.$nextTick(this._updateCustomRefresherHeight));
|
|
|
- },
|
|
|
-
|
|
|
- closeF2() {
|
|
|
- this._handleCloseF2();
|
|
|
- },
|
|
|
-
|
|
|
- _onRefresh(fromScrollView = false, isUserPullDown = true) {
|
|
|
- if (fromScrollView && !(this.finalRefresherEnabled && !this.useCustomRefresher)) return;
|
|
|
- this.$emit('onRefresh');
|
|
|
- this.$emit('Refresh');
|
|
|
-
|
|
|
- if (this.loading) {
|
|
|
- u.delay(this._nRefresherEnd, 500)
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- if (this.loading || this.isRefresherInComplete) return;
|
|
|
- this.loadingType = Enum.LoadingType.Refresher;
|
|
|
- if (this.nShowRefresherReveal) return;
|
|
|
- this.isUserPullDown = isUserPullDown;
|
|
|
- this.isUserReload = !isUserPullDown;
|
|
|
- this._startLoading(true);
|
|
|
- this.refresherTriggered = true;
|
|
|
- if(this.reloadWhenRefresh && isUserPullDown){
|
|
|
- this.useChatRecordMode ? this._onLoadingMore('click') : this._reload(false, false, isUserPullDown);
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- _onRestore() {
|
|
|
- this.refresherTriggered = 'restore';
|
|
|
- this.$emit('onRestore');
|
|
|
- this.$emit('Restore');
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- _refresherTouchstart(e) {
|
|
|
- this._handleListTouchstart();
|
|
|
- if (this._touchDisabled()) return;
|
|
|
- this._handleRefresherTouchstart(u.getTouch(e));
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- _handleRefresherTouchstart(touch) {
|
|
|
- if (!this.loading && this.isTouchEnded) {
|
|
|
- this.isTouchmoving = false;
|
|
|
- }
|
|
|
- this.loadingType = Enum.LoadingType.Refresher;
|
|
|
- this.isTouchmovingTimeout && clearTimeout(this.isTouchmovingTimeout);
|
|
|
- this.isTouchEnded = false;
|
|
|
- this.refresherTransition = '';
|
|
|
- this.refresherTouchstartY = touch.touchY;
|
|
|
- this.$emit('refresherTouchstart', this.refresherTouchstartY);
|
|
|
- this.lastRefresherTouchmove = touch;
|
|
|
- this._cleanRefresherCompleteTimeout();
|
|
|
- this._cleanRefresherEndTimeout();
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- _refresherTouchmove(e) {
|
|
|
- const currentTimeStamp = u.getTime();
|
|
|
- let touch = null;
|
|
|
- let refresherTouchmoveY = 0;
|
|
|
- if (this.watchTouchDirectionChange) {
|
|
|
-
|
|
|
- touch = u.getTouch(e);
|
|
|
- refresherTouchmoveY = touch.touchY;
|
|
|
- const direction = refresherTouchmoveY > this.oldRefresherTouchmoveY ? 'top' : 'bottom';
|
|
|
-
|
|
|
- if (direction === this.oldTouchDirection && direction !== this.oldEmitedTouchDirection) {
|
|
|
- this._handleTouchDirectionChange({ direction });
|
|
|
- this.oldEmitedTouchDirection = direction;
|
|
|
- }
|
|
|
- this.oldTouchDirection = direction;
|
|
|
- this.oldRefresherTouchmoveY = refresherTouchmoveY;
|
|
|
- }
|
|
|
-
|
|
|
- if (this.pullDownTimeStamp && currentTimeStamp - this.pullDownTimeStamp <= this.pullDownDisTimeStamp) return;
|
|
|
-
|
|
|
- if (this._touchDisabled()) return;
|
|
|
- this.pullDownTimeStamp = Number(currentTimeStamp);
|
|
|
- touch = u.getTouch(e);
|
|
|
- refresherTouchmoveY = touch.touchY;
|
|
|
-
|
|
|
- let moveDis = refresherTouchmoveY - this.refresherTouchstartY;
|
|
|
- if (moveDis < 0) return;
|
|
|
-
|
|
|
- if (this.refresherMaxAngle >= 0 && this.refresherMaxAngle <= 90 && this.lastRefresherTouchmove && this.lastRefresherTouchmove.touchY <= refresherTouchmoveY) {
|
|
|
- if (!moveDis && !this.refresherAngleEnableChangeContinued && this.moveDis < 1 && !this.refresherReachMaxAngle) return;
|
|
|
- const x = Math.abs(touch.touchX - this.lastRefresherTouchmove.touchX);
|
|
|
- const y = Math.abs(refresherTouchmoveY - this.lastRefresherTouchmove.touchY);
|
|
|
- const z = Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
|
|
|
- if ((x || y) && x > 1) {
|
|
|
-
|
|
|
- const angle = Math.asin(y / z) / Math.PI * 180;
|
|
|
-
|
|
|
- if (angle < this.refresherMaxAngle) {
|
|
|
- this.lastRefresherTouchmove = touch;
|
|
|
- this.refresherReachMaxAngle = false;
|
|
|
- return;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- moveDis = this._getFinalRefresherMoveDis(moveDis);
|
|
|
-
|
|
|
- this._handleRefresherTouchmove(moveDis, touch);
|
|
|
-
|
|
|
- if (!this.disabledBounce) {
|
|
|
-
|
|
|
- this._handleScrollViewBounce({ bounce: false });
|
|
|
-
|
|
|
- this.disabledBounce = true;
|
|
|
- }
|
|
|
- this._emitTouchmove({ pullingDistance: moveDis, dy: this.moveDis - this.oldMoveDis });
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- _handleRefresherTouchmove(moveDis, touch) {
|
|
|
- this.refresherReachMaxAngle = true;
|
|
|
- this.isTouchmovingTimeout && clearTimeout(this.isTouchmovingTimeout);
|
|
|
- this.isTouchmoving = true;
|
|
|
- this.isTouchEnded = false;
|
|
|
-
|
|
|
-
|
|
|
- if (moveDis >= this.finalRefresherThreshold) {
|
|
|
-
|
|
|
- this.refresherStatus = this.refresherF2Enabled && moveDis >= this.finalRefresherF2Threshold ? Enum.Refresher.GoF2 : Enum.Refresher.ReleaseToRefresh;
|
|
|
- } else {
|
|
|
-
|
|
|
- this.refresherStatus = Enum.Refresher.Default;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- this.refresherTransform = `translateY(${moveDis}px)`;
|
|
|
- this.lastRefresherTouchmove = touch;
|
|
|
-
|
|
|
- this.moveDis = moveDis;
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- _refresherTouchend(e) {
|
|
|
-
|
|
|
- this._handleScrollViewBounce({bounce: true});
|
|
|
- if (this._touchDisabled() || !this.isTouchmoving) return;
|
|
|
- const touch = u.getTouch(e);
|
|
|
- let refresherTouchendY = touch.touchY;
|
|
|
- let moveDis = refresherTouchendY - this.refresherTouchstartY;
|
|
|
- moveDis = this._getFinalRefresherMoveDis(moveDis);
|
|
|
- this._handleRefresherTouchend(moveDis);
|
|
|
- this.disabledBounce = false;
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- _handleRefresherTouchend(moveDis) {
|
|
|
-
|
|
|
- if (!this.isTouchmoving) return;
|
|
|
-
|
|
|
- this.isTouchmovingTimeout && clearTimeout(this.isTouchmovingTimeout);
|
|
|
- this.refresherReachMaxAngle = true;
|
|
|
- this.isTouchEnded = true;
|
|
|
- const refresherThreshold = this.finalRefresherThreshold;
|
|
|
- if (moveDis >= refresherThreshold && (this.refresherStatus === Enum.Refresher.ReleaseToRefresh || this.refresherStatus === Enum.Refresher.GoF2)) {
|
|
|
-
|
|
|
- if (this.refresherStatus === Enum.Refresher.GoF2) {
|
|
|
- this._handleGoF2();
|
|
|
- this._refresherEnd();
|
|
|
- } else {
|
|
|
-
|
|
|
-
|
|
|
- this.refresherTransform = `translateY(${refresherThreshold}px)`;
|
|
|
- this.refresherTransition = 'transform .1s linear';
|
|
|
-
|
|
|
- u.delay(() => {
|
|
|
- this._emitTouchmove({ pullingDistance: refresherThreshold, dy: this.moveDis - refresherThreshold });
|
|
|
- }, 0.1);
|
|
|
- this.moveDis = refresherThreshold;
|
|
|
- this.refresherStatus = Enum.Refresher.Loading;
|
|
|
- this._doRefresherLoad();
|
|
|
- }
|
|
|
- } else {
|
|
|
- this._refresherEnd();
|
|
|
- this.isTouchmovingTimeout = u.delay(() => {
|
|
|
- this.isTouchmoving = false;
|
|
|
- }, this.refresherDefaultDuration);
|
|
|
- }
|
|
|
- this.scrollEnable = true;
|
|
|
- this.$emit('refresherTouchend', moveDis);
|
|
|
- },
|
|
|
-
|
|
|
- _handleListTouchstart() {
|
|
|
- if (this.useChatRecordMode && this.autoHideKeyboardWhenChat) {
|
|
|
- uni.hideKeyboard();
|
|
|
- this.$emit('hidedKeyboard');
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- _handleScrollViewBounce({ bounce }) {
|
|
|
- if (!this.usePageScroll && !this.scrollToTopBounceEnabled) {
|
|
|
- if (this.wxsScrollTop <= 5) {
|
|
|
-
|
|
|
- this.refresherTransition = '';
|
|
|
-
|
|
|
- this.scrollEnable = bounce;
|
|
|
- } else if (bounce) {
|
|
|
- this.scrollEnable = bounce;
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- _handleWxsPullingDownStatusChange(onPullingDown) {
|
|
|
- this.wxsOnPullingDown = onPullingDown;
|
|
|
- if (onPullingDown && !this.useChatRecordMode) {
|
|
|
- this.renderPropScrollTop = 0;
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- _handleWxsPullingDown({ moveDis, diffDis }){
|
|
|
- this._emitTouchmove({ pullingDistance: moveDis,dy: diffDis });
|
|
|
- },
|
|
|
-
|
|
|
- _handleTouchDirectionChange({ direction }) {
|
|
|
- this.$emit('touchDirectionChange',direction);
|
|
|
- },
|
|
|
-
|
|
|
- _handlePropUpdate(){
|
|
|
- this.wxsPropType = u.getTime().toString();
|
|
|
- },
|
|
|
-
|
|
|
- _refresherEnd(shouldEndLoadingDelay = true, fromAddData = false, isUserPullDown = false, setLoading = true) {
|
|
|
- if (this.loadingType === Enum.LoadingType.Refresher) {
|
|
|
- const refresherCompleteDelay = (fromAddData && (isUserPullDown || this.showRefresherWhenReload)) ? this.refresherCompleteDelay : 0;
|
|
|
- const refresherStatus = refresherCompleteDelay > 0 ? Enum.Refresher.Complete : Enum.Refresher.Default;
|
|
|
- if (this.finalShowRefresherWhenReload) {
|
|
|
- const stackCount = this.refresherRevealStackCount;
|
|
|
- this.refresherRevealStackCount --;
|
|
|
- if (stackCount > 1) return;
|
|
|
- }
|
|
|
- this._cleanRefresherEndTimeout();
|
|
|
- this.refresherEndTimeout = u.delay(() => {
|
|
|
- this.refresherStatus = refresherStatus;
|
|
|
- }, this.refresherStatus !== Enum.Refresher.Default && refresherStatus === Enum.Refresher.Default ? this.refresherCompleteDuration : 0);
|
|
|
-
|
|
|
-
|
|
|
- if (refresherCompleteDelay > 0) {
|
|
|
- this.isRefresherInComplete = true;
|
|
|
- }
|
|
|
-
|
|
|
- this._cleanRefresherCompleteTimeout();
|
|
|
- this.refresherCompleteTimeout = u.delay(() => {
|
|
|
- let animateDuration = 1;
|
|
|
- const animateType = this.refresherEndBounceEnabled && fromAddData ? 'cubic-bezier(0.19,1.64,0.42,0.72)' : 'linear';
|
|
|
- if (fromAddData) {
|
|
|
- animateDuration = this.refresherEndBounceEnabled ? this.refresherCompleteDuration / 1000 : this.refresherCompleteDuration / 3000;
|
|
|
- }
|
|
|
- this.refresherTransition = `transform ${fromAddData ? animateDuration : this.refresherDefaultDuration / 1000}s ${animateType}`;
|
|
|
-
|
|
|
- this.refresherTransform = 'translateY(0px)';
|
|
|
- this.currentDis = 0;
|
|
|
-
|
|
|
-
|
|
|
- this.wxsPropType = this.refresherTransition + 'end' + u.getTime();
|
|
|
-
|
|
|
-
|
|
|
- this._nRefresherEnd();
|
|
|
-
|
|
|
- this.moveDis = 0;
|
|
|
-
|
|
|
- if (refresherStatus === Enum.Refresher.Complete) {
|
|
|
- if (this.refresherCompleteSubTimeout) {
|
|
|
- clearTimeout(this.refresherCompleteSubTimeout);
|
|
|
- this.refresherCompleteSubTimeout = null;
|
|
|
- }
|
|
|
- this.refresherCompleteSubTimeout = u.delay(() => {
|
|
|
- this.$nextTick(() => {
|
|
|
- this.refresherStatus = Enum.Refresher.Default;
|
|
|
- this.isRefresherInComplete = false;
|
|
|
- })
|
|
|
- }, animateDuration * 800);
|
|
|
- }
|
|
|
-
|
|
|
- this._emitTouchmove({ pullingDistance: 0, dy: this.moveDis });
|
|
|
- }, refresherCompleteDelay);
|
|
|
- }
|
|
|
- if (setLoading) {
|
|
|
- u.delay(() => this.loading = false, shouldEndLoadingDelay ? 10 : 0);
|
|
|
- isUserPullDown && this._onRestore();
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- _handleGoF2() {
|
|
|
- if (this.showF2 || !this.refresherF2Enabled) return;
|
|
|
- this.$emit('refresherF2Change', 'go');
|
|
|
-
|
|
|
- if (!this.showRefresherF2) return;
|
|
|
-
|
|
|
- this.f2Transform = `translateY(${-this.superContentHeight}px)`;
|
|
|
- this.showF2 = true;
|
|
|
- u.delay(() => {
|
|
|
- this.f2Transform = 'translateY(0px)';
|
|
|
- }, 100, 'f2ShowDelay')
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- this.showF2 = true;
|
|
|
- this.$nextTick(() => {
|
|
|
- weexAnimation.transition(this.$refs['zp-n-f2'], {
|
|
|
- styles: { transform: `translateY(${-this.superContentHeight}px)` },
|
|
|
- duration: 0,
|
|
|
- timingFunction: 'linear',
|
|
|
- needLayout: true,
|
|
|
- delay: 0
|
|
|
- })
|
|
|
- this.nF2Opacity = 1;
|
|
|
- })
|
|
|
- u.delay(() => {
|
|
|
- weexAnimation.transition(this.$refs['zp-n-f2'], {
|
|
|
- styles: { transform: 'translateY(0px)' },
|
|
|
- duration: this.refresherF2Duration,
|
|
|
- timingFunction: 'linear',
|
|
|
- needLayout: true,
|
|
|
- delay: 0
|
|
|
- })
|
|
|
- }, 10, 'f2GoDelay')
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- _handleCloseF2() {
|
|
|
- if (!this.showF2 || !this.refresherF2Enabled) return;
|
|
|
- this.$emit('refresherF2Change', 'close');
|
|
|
-
|
|
|
- if (!this.showRefresherF2) return;
|
|
|
-
|
|
|
- this.f2Transform = `translateY(${-this.superContentHeight}px)`;
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- weexAnimation.transition(this.$refs['zp-n-f2'], {
|
|
|
- styles: { transform: `translateY(${-this.superContentHeight}px)` },
|
|
|
- duration: this.refresherF2Duration,
|
|
|
- timingFunction: 'linear',
|
|
|
- needLayout: true,
|
|
|
- delay: 0
|
|
|
- })
|
|
|
-
|
|
|
-
|
|
|
- u.delay(() => {
|
|
|
- this.showF2 = false;
|
|
|
- this.nF2Opacity = 0;
|
|
|
- }, this.refresherF2Duration, 'f2CloseDelay')
|
|
|
- },
|
|
|
-
|
|
|
- _doRefresherRefreshAnimate() {
|
|
|
- this._cleanRefresherCompleteTimeout();
|
|
|
-
|
|
|
-
|
|
|
- const doRefreshAnimateAfter = !this.doRefreshAnimateAfter && (this.finalShowRefresherWhenReload) && this
|
|
|
- .customRefresherHeight === -1 && this.refresherThreshold === u.addUnit(80, this.unit);
|
|
|
- if (doRefreshAnimateAfter) {
|
|
|
- this.doRefreshAnimateAfter = true;
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- this.refresherRevealStackCount ++;
|
|
|
-
|
|
|
- this.refresherTransform = `translateY(${this.finalRefresherThreshold}px)`;
|
|
|
-
|
|
|
-
|
|
|
- this.wxsPropType = 'begin' + u.getTime();
|
|
|
-
|
|
|
- this.moveDis = this.finalRefresherThreshold;
|
|
|
- this.refresherStatus = Enum.Refresher.Loading;
|
|
|
- this.isTouchmoving = true;
|
|
|
- this.isTouchmovingTimeout && clearTimeout(this.isTouchmovingTimeout);
|
|
|
- this._doRefresherLoad(false);
|
|
|
- },
|
|
|
-
|
|
|
- _doRefresherLoad(isUserPullDown = true) {
|
|
|
- this._onRefresh(false,isUserPullDown);
|
|
|
- this.loading = true;
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- _getFinalRefresherMoveDis(moveDis) {
|
|
|
- let diffDis = moveDis - this.oldCurrentMoveDis;
|
|
|
- this.oldCurrentMoveDis = moveDis;
|
|
|
- if (diffDis > 0) {
|
|
|
-
|
|
|
- diffDis = diffDis * this.finalRefresherPullRate;
|
|
|
- if (this.currentDis > this.finalRefresherThreshold) {
|
|
|
- diffDis = diffDis * (1 - this.finalRefresherOutRate);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- diffDis = diffDis > 100 ? diffDis / 100 : diffDis;
|
|
|
- this.currentDis += diffDis;
|
|
|
- this.currentDis = Math.max(0, this.currentDis);
|
|
|
- return this.currentDis;
|
|
|
- },
|
|
|
-
|
|
|
- _touchDisabled() {
|
|
|
- const checkOldScrollTop = this.oldScrollTop > 5;
|
|
|
- return this.loading || this.isRefresherInComplete || this.useChatRecordMode || !this.refresherEnabled || !this.useCustomRefresher ||(this.usePageScroll && this.useCustomRefresher && this.pageScrollTop > 10) || (!(this.usePageScroll && this.useCustomRefresher) && checkOldScrollTop);
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- _updateCustomRefresherHeight() {
|
|
|
- this._getNodeClientRect('.zp-custom-refresher-slot-view').then((res) => {
|
|
|
- this.customRefresherHeight = res ? res[0].height : 0;
|
|
|
- this.showCustomRefresher = this.customRefresherHeight > 0;
|
|
|
- if (this.doRefreshAnimateAfter) {
|
|
|
- this.doRefreshAnimateAfter = false;
|
|
|
- this._doRefresherRefreshAnimate();
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
-
|
|
|
- _emitTouchmove(e) {
|
|
|
-
|
|
|
- e.viewHeight = this.finalRefresherThreshold;
|
|
|
-
|
|
|
- e.rate = e.viewHeight > 0 ? e.pullingDistance / e.viewHeight : 0;
|
|
|
- this.hasTouchmove && this.oldPullingDistance !== e.pullingDistance && this.$emit('refresherTouchmove', e);
|
|
|
- this.oldPullingDistance = e.pullingDistance;
|
|
|
- },
|
|
|
-
|
|
|
- _cleanRefresherCompleteTimeout() {
|
|
|
- this.refresherCompleteTimeout = this._cleanTimeout(this.refresherCompleteTimeout);
|
|
|
-
|
|
|
- this._nRefresherEnd(false);
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- _cleanRefresherEndTimeout() {
|
|
|
- this.refresherEndTimeout = this._cleanTimeout(this.refresherEndTimeout);
|
|
|
- },
|
|
|
- }
|
|
|
-}
|