159 lines
3.2 KiB
JavaScript
159 lines
3.2 KiB
JavaScript
// #ifdef APP-NVUE
|
|
const dom = weex.requireModule('dom');
|
|
// #endif
|
|
export default {
|
|
data() {
|
|
return {
|
|
uniShow: false,
|
|
left: 0
|
|
}
|
|
},
|
|
computed: {
|
|
moveLeft() {
|
|
return `translateX(${this.left}px)`
|
|
}
|
|
},
|
|
watch: {
|
|
show(newVal) {
|
|
if (!this.position || JSON.stringify(this.position) === '{}') return;
|
|
if (this.autoClose) return
|
|
if (newVal) {
|
|
this.$emit('change', true)
|
|
this.open()
|
|
} else {
|
|
this.$emit('change', false)
|
|
this.close()
|
|
}
|
|
}
|
|
},
|
|
mounted() {
|
|
this.position = {}
|
|
if (this.swipeaction.children !== undefined) {
|
|
this.swipeaction.children.push(this)
|
|
}
|
|
setTimeout(() => {
|
|
this.getSelectorQuery()
|
|
}, 100)
|
|
},
|
|
beforeDestoy() {
|
|
this.swipeaction.children.forEach((item, index) => {
|
|
if (item === this) {
|
|
this.swipeaction.children.splice(index, 1)
|
|
}
|
|
})
|
|
},
|
|
methods: {
|
|
onClick(index, item) {
|
|
this.$emit('click', {
|
|
content: item,
|
|
index
|
|
})
|
|
this.close()
|
|
},
|
|
touchstart(e) {
|
|
const {
|
|
pageX
|
|
} = e.touches[0]
|
|
if (this.disabled) return
|
|
const left = this.position.content.left
|
|
if (this.autoClose) {
|
|
this.swipeaction.closeOther(this)
|
|
}
|
|
this.width = pageX - left
|
|
if (this.isopen) return
|
|
if (this.uniShow) {
|
|
this.uniShow = false
|
|
this.isopen = true
|
|
this.openleft = this.left + this.position.button.width
|
|
}
|
|
},
|
|
touchmove(e, index) {
|
|
if (this.disabled) return
|
|
const {
|
|
pageX
|
|
} = e.touches[0]
|
|
this.setPosition(pageX)
|
|
},
|
|
touchend() {
|
|
if (this.disabled) return
|
|
if (this.isopen) {
|
|
this.move(this.openleft, 0)
|
|
return
|
|
}
|
|
this.move(this.left, -40)
|
|
},
|
|
setPosition(x, y) {
|
|
if (!this.position.button.width) {
|
|
return
|
|
}
|
|
// this.left = x - this.width
|
|
this.setValue(x - this.width)
|
|
},
|
|
setValue(value) {
|
|
// 设置最大最小值
|
|
this.left = Math.max(-this.position.button.width, Math.min(parseInt(value), 0))
|
|
this.position.content.left = this.left
|
|
if (this.isopen) {
|
|
this.openleft = this.left + this.position.button.width
|
|
}
|
|
},
|
|
move(left, value) {
|
|
if (left >= value) {
|
|
this.$emit('change', false)
|
|
this.close()
|
|
} else {
|
|
this.$emit('change', true)
|
|
this.open()
|
|
}
|
|
},
|
|
open() {
|
|
this.uniShow = true
|
|
this.left = -this.position.button.width
|
|
this.setValue(-this.position.button.width)
|
|
},
|
|
close() {
|
|
this.uniShow = true
|
|
this.setValue(0)
|
|
setTimeout(() => {
|
|
this.uniShow = false
|
|
this.isopen = false
|
|
}, 300)
|
|
},
|
|
getSelectorQuery() {
|
|
// #ifndef APP-NVUE
|
|
const views = uni.createSelectorQuery()
|
|
.in(this)
|
|
views
|
|
.selectAll('.selector-query-hock')
|
|
.boundingClientRect(data => {
|
|
this.position.content = data[1]
|
|
this.position.button = data[0]
|
|
if (this.autoClose) return
|
|
if (this.show) {
|
|
this.open()
|
|
} else {
|
|
this.close()
|
|
}
|
|
})
|
|
.exec()
|
|
// #endif
|
|
// #ifdef APP-NVUE
|
|
dom.getComponentRect(this.$refs['selector-content-hock'], (data) => {
|
|
if (this.position.content) return
|
|
this.position.content = data.size
|
|
})
|
|
dom.getComponentRect(this.$refs['selector-button-hock'], (data) => {
|
|
if (this.position.button) return
|
|
this.position.button = data.size
|
|
if (this.autoClose) return
|
|
if (this.show) {
|
|
this.open()
|
|
} else {
|
|
this.close()
|
|
}
|
|
})
|
|
// #endif
|
|
}
|
|
}
|
|
}
|