| | |
|---|
| | | // #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: {
|
|---|
| | | // #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.$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
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | 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 |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
