diff --git a/pages/6170/deviceControl/index.vue b/pages/6170/deviceControl/index.vue index 07e5aa6..c22e2b3 100644 --- a/pages/6170/deviceControl/index.vue +++ b/pages/6170/deviceControl/index.vue @@ -67,10 +67,12 @@ - - + + + + @@ -257,6 +259,11 @@ export default { data() { return { + lastBrightnessTime: 0, + isCardSliding: false, + cardRect: null, + touchStartX: 0, + touchStartY: 0, pageLoading: true, mainMode: 'string', secondaryMode: 'string', @@ -328,18 +335,107 @@ }) }, // ***********进度条*********** + cardTouchStart(e) { + if (!this.cardRect) return; + this.touchStartX = e.touches[0].clientX; + this.touchStartY = e.touches[0].clientY; + }, + + cardTouchMove(e) { + if (!this.cardRect || e.touches.length === 0) return; + + const deltaX = e.touches[0].clientX - this.touchStartX; + const deltaY = e.touches[0].clientY - this.touchStartY; + + // 只有当水平滑动距离大于垂直距离时,才判断为有效滑动 + if (Math.abs(deltaX) > Math.abs(deltaY)) { + this.isCardSliding = true; + this.updateSliderFromTouch(e); + } + }, + + cardTouchEnd(e) { + if (this.isCardSliding) { + // 触摸结束时,调用滑动结束的处理函数来发送最终值 + this.onSliderChangeEnd({ + detail: { + value: this.sliderValue + } + }); + this.isCardSliding = false; + } + this.touchStartX = 0; + this.touchStartY = 0; + }, + + updateSliderFromTouch(e) { + const touchX = e.touches[0].clientX; + const cardLeft = this.cardRect.left; + const cardWidth = this.cardRect.width; + + let relativeX = touchX - cardLeft; + + // 边界处理 + if (relativeX < 0) relativeX = 0; + if (relativeX > cardWidth) relativeX = cardWidth; + + const newValue = Math.round((relativeX / cardWidth) * 100); + + // 调用已有的节流函数来更新值和发送命令 + this.onSliderChanging({ + detail: { + value: newValue + } + }); + }, onSliderChanging(e) { - console.log('这是我滑动的吗'); - this.sliderValue = e.detail.value; + if (!this.cardRect) return; + let value = e.detail.value; + if (value < 10) { + value = 10; + } + this.sliderValue = value; // 实时更新UI + + const now = Date.now(); + // 使用节流防止指令发送过于频繁 + if (now - this.lastBrightnessTime > 200) { // 200毫秒节流 + this.lastBrightnessTime = now; + + // 增加轻微的震动反馈,提升手感 + uni.vibrateShort({ + type: 'light' + }); + + let data = { + deviceId: this.deviceID, + instructValue: this.sliderValue + '.00' + } + lightBrightnessSettings(data).then((res) => { + if (res.code !== 200) { + // 可以在这里处理错误,但滑动中不建议用toast + } + }) + } + }, + onSliderChangeEnd(e) { + let value = e.detail.value; + if (value < 10) { + value = 10; + } + this.sliderValue = value; + let data = { deviceId: this.deviceID, instructValue: this.sliderValue + '.00' } lightBrightnessSettings(data).then((res) => { if (res.code == 200) { - + // 可以在此处理成功反馈 } else { - + uni.showToast({ + icon: 'none', + title: res.msg || '亮度调节失败' + }) } }) }, @@ -675,6 +771,13 @@ if (res.code == 200) { // 最后关闭加载状态 this.pageLoading = false + this.$nextTick(() => { + uni.createSelectorQuery().in(this).select('.control-card').boundingClientRect(data => { + if (data) { + this.cardRect = data; + } + }).exec(); + }) this.deviceInfo = res.data this.personnelInfo = { unitName: res.data.personnelInfo?.unitName || '',