From d8b41fff43a2cee6a8f714ffa807623b15803786 Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Fri, 20 Oct 2023 15:21:35 +0800
Subject: [PATCH] fix:立行立改Uniapp小程序新建项目

---
 uni_modules/uview-ui/components/u-slider/nvue - 副本.js |  180 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 180 insertions(+), 0 deletions(-)

diff --git "a/uni_modules/uview-ui/components/u-slider/nvue - \345\211\257\346\234\254.js" "b/uni_modules/uview-ui/components/u-slider/nvue - \345\211\257\346\234\254.js"
new file mode 100644
index 0000000..df62349
--- /dev/null
+++ "b/uni_modules/uview-ui/components/u-slider/nvue - \345\211\257\346\234\254.js"
@@ -0,0 +1,180 @@
+/**
+ * ������bindingx������������slider
+ * ���������������nvue���
+ */
+// ������bindingx���������������������������������wxs���������������js���������������������������������������������������������������
+const BindingX = uni.requireNativePlugin('bindingx')
+// nvue������dom���������������������dom���������������
+const dom = uni.requireNativePlugin('dom')
+// nvue���������������������������������������������uni.animation������������uni.animation������������nvue
+const animation = uni.requireNativePlugin('animation')
+
+export default {
+	data() {
+		return {
+			// bindingx���������������������������������
+			panEvent: null,
+			// ������������������������
+			moving: false,
+			// ������������������
+			x: 0,
+			// ������������������������������������������������������������������������
+			touching: false,
+			changeFromInside: false
+		}
+	},
+	watch: {
+		// ������vlaue������������������������������������������������v-model���������������������
+		// ������������������������������������������slider���v-model������������
+		value(n) {
+			if (!this.changeFromInside) {
+				this.initX()
+			} else {
+				this.changeFromInside = false
+			}
+		}
+	},
+	mounted() {
+		this.init()
+	},
+	methods: {
+		init() {
+			this.getSliderRect()
+		},
+		// ������������������
+		// ������slider������
+		getSliderRect() {
+			// ������������������������������
+			// ������nvue���dom���������������������������
+			setTimeout(() => {
+				dom.getComponentRect(this.$refs['slider'], res => {
+					this.sliderRect = res.size
+					this.initX()
+				})
+			}, 10)
+		},
+		// ���������������������
+		initButtonStyle({
+			barStyle,
+			buttonWrapperStyle
+		}) {
+			this.barStyle = barStyle
+			this.buttonWrapperStyle = buttonWrapperStyle
+		},
+		emitEvent(event, value) {
+			this.$emit(event, value ? value : this.value)
+		},
+		formatStep(value) {
+			// ���������������������������������
+			return Math.round(Math.max(this.min, Math.min(value, this.max)) / this.step) * this.step
+		},
+		// ������������
+		onTouchStart(e) {
+			// ������������������������������������������������������������������������������������������������������������
+			e.stopPropagation && e.stopPropagation()
+			e.preventDefault && e.preventDefault()
+			if (this.moving || this.disabled) {
+				// ������������������������
+				if (this.panEvent?.token != 0) {
+					BindingX.unbind({
+						token: this.panEvent.token,
+						// pan���������������
+						eventType: 'pan'
+					})
+					this.gesToken = 0
+				}
+				return
+			}
+
+			this.moving = true
+			this.touching = true
+
+			// ������������ref
+			const button = this.$refs['nvue-button'].ref
+			const gap = this.$refs['nvue-gap'].ref
+
+			const {
+				min,
+				max,
+				step
+			} = this
+			const {
+				left,
+				width
+			} = this.sliderRect
+
+			// ���������������������������x���������������������������������������
+			let exporession = `(${this.x} + x)`
+			// ������������x������������������������������������������������min���max������������
+			exporession = `(${exporession} / ${width}) * 100`
+			if (step > 1) {
+				// ������step������������1������������������������������������Math.round������������
+				exporession = `round(max(${min}, min(${exporession}, ${max})) / ${step}) * ${step}`
+			} else {
+				// ���step=1���������������������������������bindingx���������������������������������������������������������
+				exporession = `max(${min}, min(${exporession}, ${max}))`
+			}
+			// ������������������������������������px���
+			exporession = `${exporession} / 100 * ${width}`
+			// ���������������������������������������
+			const {
+				sliderWidth
+			} = this.sliderRect
+			exporession = `min(${sliderWidth}, ${exporession})`
+			// ���������������������������������������������������������������������
+			const buttonExpression = `${exporession} - ${this.blockHeight / 2}`
+			// ������������KPI������������BindingX
+			this.panEvent = BindingX.bind({
+				anchor: button,
+				eventType: 'pan',
+				props: [{
+					element: gap,
+					// ������width���������������������������
+					property: 'width',
+					expression
+				}, {
+					element: button,
+					// ������width���������������������������
+					property: 'transform.translateX',
+					expression: buttonExpression
+				}]
+			}, (e) => {
+				if (e.state === 'end' || e.state === 'exit') {
+					// 
+					this.x = uni.$u.range(0, left + width, e.deltaX + this.x)
+					// ������������������������������������������������������������������������v-model������
+					const value = (this.x / width) * 100
+					const percent = this.formatStep(value)
+					// ������value���
+					this.$emit('input', percent)
+					// ���������������������value���watch������������������������������������������������
+					this.changeFromInside = true
+					this.moving = false
+					this.touching = false
+				}
+			})
+		},
+		// ���value������������������������x������������������
+		initX() {
+			const {
+				left,
+				width
+			} = this.sliderRect
+			// ������x������������������������������������������������������������bindingX������������������������������������������������������������
+			// ���������������������������������������������������������������weex������������������������KPI(������������������)������������������������
+			this.x = this.value / 100 * width
+			// ������������������
+			const barStyle = {
+				width: this.x + 'px'
+			}
+			// ������������������
+			const buttonWrapperStyle = {
+				transform: `translateX(${this.x - this.blockHeight / 2}px)`
+			}
+			this.initButtonStyle({
+				barStyle,
+				buttonWrapperStyle
+			})
+		}
+	}
+}

--
Gitblit v1.8.0