| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259 | let otherMixins = {}// #ifndef APP-PLUS|| MP-WEIXIN  ||  H5const MIN_DISTANCE = 10;otherMixins = {	data() {		// TODO 随机生生元素ID,解决百度小程序获取同一个元素位置信息的bug		const elClass = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`		return {			uniShow: false,			left: 0,			buttonShow: 'none',			ani: false,			moveLeft: '',			elClass		}	},	watch: {		show(newVal) {			if (this.autoClose) return			this.openState(newVal)		},		left() {			this.moveLeft = `translateX(${this.left}px)`		},		buttonShow(newVal) {			if (this.autoClose) return			this.openState(newVal)		},		leftOptions() {			this.init()		},		rightOptions() {			this.init()		}	},	mounted() {		this.swipeaction = this.getSwipeAction()		if (this.swipeaction.children !== undefined) {			this.swipeaction.children.push(this)		}		this.init()	},	methods: {		init() {			clearTimeout(this.timer)			this.timer = setTimeout(() => {				this.getSelectorQuery()			}, 100)			// 移动距离			this.left = 0			this.x = 0		},		closeSwipe(e) {			if (!this.autoClose) return			this.swipeaction.closeOther(this)		},		appTouchStart(e) {			const {				clientX			} = e.changedTouches[0]			this.clientX = clientX			this.timestamp = new Date().getTime()		},		appTouchEnd(e, index, item, position) {			const {				clientX			} = e.changedTouches[0]			// fixed by xxxx 模拟点击事件,解决 ios 13 点击区域错位的问题			let diff = Math.abs(this.clientX - clientX)			let time = (new Date().getTime()) - this.timestamp			if (diff < 40 && time < 300) {				this.$emit('click', {					content: item,					index,					position				})			}		},		touchstart(e) {			if (this.disabled) return			this.ani = false			this.x = this.left || 0			this.stopTouchStart(e)			this.autoClose && this.closeSwipe()		},		touchmove(e) {			if (this.disabled) return			// 是否可以滑动页面			this.stopTouchMove(e);			if (this.direction !== 'horizontal') {				return;			}			this.move(this.x + this.deltaX)			return false		},		touchend() {			if (this.disabled) return			this.moveDirection(this.left)		},		/**		 * 设置移动距离		 * @param {Object} value		 */		move(value) {			value = value || 0			const leftWidth = this.leftWidth			const rightWidth = this.rightWidth			// 获取可滑动范围			this.left = this.range(value, -rightWidth, leftWidth);		},		/**		 * 获取范围		 * @param {Object} num		 * @param {Object} min		 * @param {Object} max		 */		range(num, min, max) {			return Math.min(Math.max(num, min), max);		},		/**		 * 移动方向判断		 * @param {Object} left		 * @param {Object} value		 */		moveDirection(left) {			const threshold = this.threshold			const isopen = this.isopen || 'none'			const leftWidth = this.leftWidth			const rightWidth = this.rightWidth			if (this.deltaX === 0) {				this.openState('none')				return			}			if ((isopen === 'none' && rightWidth > 0 && -left > threshold) || (isopen !== 'none' && rightWidth >					0 && rightWidth +					left < threshold)) {				// right				this.openState('right')			} else if ((isopen === 'none' && leftWidth > 0 && left > threshold) || (isopen !== 'none' && leftWidth >					0 &&					leftWidth - left < threshold)) {				// left				this.openState('left')			} else {				// default				this.openState('none')			}		},		/**		 * 开启状态		 * @param {Boolean} type		 */		openState(type) {			const leftWidth = this.leftWidth			const rightWidth = this.rightWidth			let left = ''			this.isopen = this.isopen ? this.isopen : 'none'			switch (type) {				case "left":					left = leftWidth					break				case "right":					left = -rightWidth					break				default:					left = 0			}			if (this.isopen !== type) {				this.throttle = true				this.$emit('change', type)			}			this.isopen = type			// 添加动画类			this.ani = true			this.$nextTick(() => {				this.move(left)			})			// 设置最终移动位置,理论上只要进入到这个函数,肯定是要打开的		},		close() {			this.openState('none')		},		getDirection(x, y) {			if (x > y && x > MIN_DISTANCE) {				return 'horizontal';			}			if (y > x && y > MIN_DISTANCE) {				return 'vertical';			}			return '';		},		/**		 * 重置滑动状态		 * @param {Object} event		 */		resetTouchStatus() {			this.direction = '';			this.deltaX = 0;			this.deltaY = 0;			this.offsetX = 0;			this.offsetY = 0;		},		/**		 * 设置滑动开始位置		 * @param {Object} event		 */		stopTouchStart(event) {			this.resetTouchStatus();			const touch = event.touches[0];			this.startX = touch.clientX;			this.startY = touch.clientY;		},		/**		 * 滑动中,是否禁止打开		 * @param {Object} event		 */		stopTouchMove(event) {			const touch = event.touches[0];			this.deltaX = touch.clientX - this.startX;			this.deltaY = touch.clientY - this.startY;			this.offsetX = Math.abs(this.deltaX);			this.offsetY = Math.abs(this.deltaY);			this.direction = this.direction || this.getDirection(this.offsetX, this.offsetY);		},		getSelectorQuery() {			const views = uni.createSelectorQuery().in(this)			views				.selectAll('.' + this.elClass)				.boundingClientRect(data => {					if (data.length === 0) return					let show = 'none'					if (this.autoClose) {						show = 'none'					} else {						show = this.show					}					this.leftWidth = data[0].width || 0					this.rightWidth = data[1].width || 0					this.buttonShow = show				})				.exec()		}	}}// #endifexport default otherMixins
 |