// 本文件由FirstUI授权予四川政采招投标咨询有限公司(会员ID: 1 63,营业执照号: 915 10 1 3 133 20061 9 3K)专用,请尊重知识产权,勿私下传播,违者追究法律责任。
|
// #ifdef APP-NVUE
|
const BindingX = uni.requireNativePlugin('bindingx');
|
const dom = uni.requireNativePlugin('dom');
|
const animation = uni.requireNativePlugin('animation');
|
|
export default {
|
data() {
|
return {}
|
},
|
watch: {
|
show(newVal) {
|
// if (this.autoClose) return
|
if (this.stop) return
|
this.stop = true
|
if (newVal) {
|
this.open(newVal)
|
} else {
|
this.close()
|
}
|
},
|
buttons(newVal) {
|
this.init()
|
}
|
},
|
created() {
|
this.group = this.getParent()
|
if (this.group.children !== undefined) {
|
this.group.children.push(this)
|
}
|
},
|
mounted() {
|
this.$nextTick(() => {
|
this.box = this.getEl(this.$refs['fui_swipea_wrap'])
|
this.selector = this.getEl(this.$refs['fui_swipea_content']);
|
this.rightButton = this.getEl(this.$refs['fui_swipea_buttons']);
|
})
|
this.init()
|
},
|
methods: {
|
init() {
|
this.$nextTick(() => {
|
this.x = 0
|
this.button = {
|
show: false
|
}
|
setTimeout(() => {
|
this.getSelectorQuery()
|
}, 200)
|
})
|
},
|
handleClick(e, index, item) {
|
e.stopPropagation();
|
this.$emit('click', {
|
item,
|
index,
|
param: this.param
|
})
|
},
|
touchstart(e) {
|
if (this.disabled) return
|
// 每次只触发一次,避免多次监听造成闪烁
|
if (this.stop) return
|
this.stop = true
|
if (this.autoClose) {
|
this.group && this.group.closeAuto(this)
|
}
|
|
const rightWidth = this.button.right.width || 0
|
let expression = this.range(this.x, -rightWidth, 0)
|
let rightExpression = this.range(this.x + rightWidth, 0, rightWidth)
|
|
this.eventpan = BindingX.bind({
|
anchor: this.box,
|
eventType: 'pan',
|
props: [{
|
element: this.selector,
|
property: 'transform.translateX',
|
expression
|
}, {
|
element: this.rightButton,
|
property: 'transform.translateX',
|
expression: rightExpression
|
}]
|
}, (e) => {
|
if (e.state === 'end') {
|
this.x = e.deltaX + this.x;
|
this.isclick = true
|
this.bindTiming(e.deltaX)
|
}
|
});
|
},
|
touchend(e) {
|
if (this.isopen && !this.isclick && this.clickClose) {
|
this.open(false)
|
}
|
},
|
bindTiming(x) {
|
const left = this.x
|
const rightWidth = this.button.right.width || 0
|
const threshold = Number(this.threshold)
|
if (!this.isopen) {
|
if (left < -threshold) {
|
this.open(true)
|
} else {
|
this.open(false)
|
}
|
} else {
|
if ((x < threshold && x > 0) || (x < -threshold)) {
|
this.open(true)
|
} else {
|
this.open(false)
|
}
|
}
|
},
|
range(num, mix, max) {
|
return `min(max(x+${num}, ${mix}), ${max})`
|
},
|
open(type) {
|
this.animation(type)
|
},
|
close() {
|
this.animation(false)
|
},
|
animation(type) {
|
const time = 300
|
const rightWidth = this.button.right.width || 0
|
if (this.eventpan && this.eventpan.token) {
|
BindingX.unbind({
|
token: this.eventpan.token,
|
eventType: 'pan'
|
})
|
}
|
|
if (type) {
|
Promise.all([
|
this.move(this.selector, -rightWidth),
|
this.move(this.rightButton, 0)
|
]).then(() => {
|
this.setEmit(-rightWidth, type)
|
})
|
} else {
|
Promise.all([
|
this.move(this.selector, 0),
|
this.move(this.rightButton, rightWidth)
|
]).then(() => {
|
this.setEmit(0, type)
|
})
|
}
|
},
|
setEmit(x, type) {
|
const rightWidth = this.button.right.width
|
this.isopen = this.isopen || false
|
this.stop = false
|
this.isclick = false
|
if (this.isopen !== type && this.x !== x) {
|
if (type && rightWidth > 0) {
|
this.$emit('change', {
|
isOpen: true,
|
param: this.param
|
})
|
}
|
if (!type) {
|
this.$emit('change', {
|
isOpen: false,
|
param: this.param
|
})
|
}
|
}
|
this.x = x
|
this.isopen = type
|
},
|
move(ref, value) {
|
return new Promise((resolve, reject) => {
|
animation.transition(ref, {
|
styles: {
|
transform: `translateX(${value})`,
|
},
|
duration: 150, //ms
|
timingFunction: 'linear',
|
needLayout: false,
|
delay: 0 //ms
|
}, function(res) {
|
resolve(res)
|
})
|
})
|
|
},
|
getEl(el) {
|
return el.ref
|
},
|
getSelectorQuery() {
|
Promise.all([
|
this.getDom(),
|
]).then((data) => {
|
// let show = false
|
// if (!this.autoClose) {
|
// show = this.show
|
// }
|
// if (show) {
|
// this.open(show)
|
// }
|
this.open(this.show)
|
})
|
|
},
|
getDom() {
|
return new Promise((resolve, reject) => {
|
dom.getComponentRect(this.$refs['fui_swipea_buttons'], (data) => {
|
if (data) {
|
this.button['right'] = data.size
|
resolve(data)
|
} else {
|
reject()
|
}
|
})
|
})
|
}
|
}
|
}
|
|
// #endif
|
|
// #ifndef APP-NVUE
|
export default {}
|
// #endif
|