appWareHouse/components/uni-swipe-action-item/mpalipay.js

export default {
	data() {
		return {
			isshow: false,
			viewWidth: 0,
			buttonWidth: 0,
			disabledView: false,
			x: 0,
			transition: false
		}
	},
	watch: {
		show(newVal) {
			if (this.autoClose) return
			if (newVal) {
				this.open()
			} else {
				this.close()
			}
		},
	},
	created() {
		if (this.swipeaction.children !== undefined) {
			this.swipeaction.children.push(this)
		}
	},
	beforeDestroy() {
		this.swipeaction.children.forEach((item, index) => {
			if (item === this) {
				this.swipeaction.children.splice(index, 1)
			}
		})
	},
	mounted() {
		this.isopen = false
		this.transition = true
		setTimeout(() => {
			this.getQuerySelect()
		}, 50)

	},
	methods: {
		onClick(index, item) {
			this.$emit('click', {
				content: item,
				index
			})
		},
		touchstart(e) {
			let {
				pageX,
				pageY
			} = e.changedTouches[0]
			this.transition = false
			this.startX = pageX
			if (this.autoClose) {
				this.swipeaction.closeOther(this)
			}
		},
		touchmove(e) {
			let {
				pageX,
			} = e.changedTouches[0]
			this.slide = this.getSlide(pageX)
			if (this.slide === 0) {
				this.disabledView = false
			}

		},
		touchend(e) {
			this.stop = false
			this.transition = true
			if (this.isopen) {
				if (this.moveX === -this.buttonWidth) {
					this.close()
					return
				}
				this.move()
			} else {
				if (this.moveX === 0) {
					this.close()
					return
				}
				this.move()
			}
		},
		open() {
			this.x = this.moveX
			this.$nextTick(() => {
				this.x = -this.buttonWidth
				this.moveX = this.x
				
				if(!this.isopen){
					this.isopen = true
					this.$emit('change', true)
				}
			})
		},
		close() {
			this.x = this.moveX
			this.$nextTick(() => {
				this.x = 0
				this.moveX = this.x
				if(this.isopen){
					this.isopen = false
					this.$emit('change', false)
				}
			})
		},
		move() {
			if (this.slide === 0) {
				this.open()
			} else {
				this.close()
			}
		},
		onChange(e) {
			let x = e.detail.x
			this.moveX = x
			if (x >= this.buttonWidth) {
				this.disabledView = true
				this.$nextTick(() => {
					this.x = this.buttonWidth
				})
			}
		},
		getSlide(x) {
			if (x >= this.startX) {
				this.startX = x
				return 1
			} else {
				this.startX = x
				return 0
			}

		},
		getQuerySelect() {
			const query = uni.createSelectorQuery().in(this);
			query.selectAll('.viewWidth-hook').boundingClientRect(data => {

				this.viewWidth = data[0].width
				this.buttonWidth = data[1].width
				this.transition = false
				this.$nextTick(() => {
					this.transition = true
				})

				if (!this.buttonWidth) {
					this.disabledView = true
				}

				if (this.autoClose) return
				if (this.show) {
					this.open()
				}
			}).exec();

		}
	}
}