zhangwei
2024-08-14 9d8994790fe403935ed46ad478f83ae110bb7a01
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
// 本文件由FirstUI授权予四川政采招投标咨询有限公司(会员ID:16  3,营业执照号:9   1510 1 3 1   33200 6  1     93K)专用,请尊重知识产权,勿私下传播,违者追究法律责任。
// #ifdef APP-NVUE
const animation = uni.requireNativePlugin('animation');
export default {
    data() {
        return {
            passWidth: 0
        };
    },
    watch: {
        resetNum(val) {
            this.startX = 0;
            this.lastLeft = 0;
            this._animation(0)
        }
    },
    created() {
        this.startX = 0
        this.lastLeft = 0
    },
    mounted() {
        this.foreground = this.getEl(this.$refs['foreground'])
        this.slider = this.getEl(this.$refs['slider']);
    },
    methods: {
        getEl(el) {
            return el.ref;
        },
        _animation(left) {
            if (!this.foreground || !this.slider) return;
            animation.transition(this.foreground, {
                styles: {
                    width: left + 'px'
                },
                duration: left == 0 ? 200 : 0,
                timingFunction: 'linear',
                needLayout: false,
                delay: 0
            });
            animation.transition(this.slider, {
                styles: {
                    transform: 'translate(' + left + 'px,0)'
                },
                duration: left == 0 ? 200 : 0,
                timingFunction: 'linear',
                needLayout: false,
                delay: 0
            });
        },
        touchstart(e) {
            if (this.isPass) return;
            let touch = e.touches[0] || e.changedTouches[0];
            this.startX = touch.screenX
        },
        touchmove(e) {
            if (this.isPass) return;
            let touch = e.changedTouches[0];
            let pageX = touch.screenX;
            let left = pageX - this.startX + this.lastLeft;
            left = left < 0 ? 0 : left;
            let width = this.totalWidth - this.sliderW;
            left = left >= width ? width : left;
            this.startX = pageX
            this.lastLeft = left
            this._animation(left)
        },
        touchend(e) {
            if (this.isPass) return;
            let left = this.targetWidth - this.sliderW
            if (Math.abs(left - this.lastLeft) <= Number(this.range)) {
                this.passWidth = this.lastLeft;
                this.success()
            } else {
                setTimeout(() => {
                    this.startX = 0;
                    this.lastLeft = 0;
                    this._animation(0)
                    this.fail()
                }, 20)
            }
        }
    }
}
 
// #endif
 
// #ifndef APP-NVUE
export default {}
// #endif