fix: 耗材滑动改变重构优化

src/pages/Index/Regular/Consumables.vue

@@ -342,7 +342,7 @@ const updateTipNum = async ({
   sync: boolean
 }) => {
   if (tipNum < 0) {
-    return
+    tipNum = 0
   }
   if (deviceStore.deviceState.workState !== 'WORKING') {
     consumableStore.setDisableUpdateConsumableData(true)

src/pages/Index/components/Consumables/BallGrid2.vue

@@ -86,17 +86,19 @@ const ballStates = ref(Array.from({ length: props.total }, () => false)) // 小
 // 发出自定义事件通知父组件
 const emit = defineEmits(['update:TipNum'])
 
-const updateSliderVal = async (hVal, vVal) => {
-  const empty = parseInt(vVal) * columns + parseInt(hVal)
+const updateSliderVal = async (empty) => {
+  if (empty< 0){
+    empty = 0
+  }
   const activated = total - empty
 
   emit('update:TipNum', activated, props.order, false)
 }
 
 const updateSliderEndVal = async (hVal, vVal) => {
-  const empty = parseInt(vVal) * columns + parseInt(hVal)
-  const activated = total - empty
-  emit('update:TipNum', activated, props.order, true)
+  // const empty = parseInt(vVal) * columns + parseInt(hVal)
+  // const activated = total - empty
+  // emit('update:TipNum', activated, props.order, true)
 }
 // 计算网格样式
 const gridStyle = computed(() => ({

src/pages/Index/components/Consumables/DragAreaEx.vue

@@ -84,20 +84,30 @@ function handleDrag(event) {
   if (!isDragging.value) return
 
   const touchEvent = event.touches ? event.touches[0] : event
-  const deltaX = touchEvent.clientX - startX.value
-  const deltaY = touchEvent.clientY - startY.value
   const rect = sliderTrack.value.getBoundingClientRect()
-  let percentX = (deltaX + startXValue.value) / rect.width
-  let percentY = (deltaY + startYValue.value) / rect.height
-
-  hValue.value = Math.min(1, Math.max(0, percentX)) * hTotalVal.value
-  vValue.value = Math.min(1, Math.max(0, percentY)) * vTotalVal.value
-
-  emit('update:sliderValue', +hValue.value.toFixed(), +vValue.value.toFixed())
+  const clientX = touchEvent.clientX
+  const clientY = touchEvent.clientY
+  const relativeX = clientX - rect.left
+  const relativeY = clientY - rect.top
+
+  const row = Math.ceil(relativeY / (rect.height / vTotalVal.value) )
+  const col = Math.ceil(relativeX / (rect.width /hTotalVal.value) )
+
+  const empty = (row - 1)* hTotalVal.value + col
+  emit('update:sliderValue', empty)
+
+  //
+  // let percentX = (deltaX + startXValue.value) / rect.width
+  // let percentY = (deltaY + startYValue.value) / rect.height
+  //
+  // hValue.value = Math.min(1, Math.max(0, percentX)) * hTotalVal.value
+  // vValue.value = Math.min(1, Math.max(0, percentY)) * vTotalVal.value
+  //
+  // emit('update:sliderValue', +hValue.value.toFixed(), +vValue.value.toFixed())
 }
 
 function handleEnd() {
-  emit('update:sliderEndValue', +hValue.value.toFixed(), +vValue.value.toFixed())
+  // emit('update:sliderEndValue', +hValue.value.toFixed(), +vValue.value.toFixed())
   isDragging.value = false
   document.removeEventListener('mousemove', handleDrag)
   document.removeEventListener('touchmove', handleDrag)