From 31909619000276537cff52e1027e66a162dc7ac4 Mon Sep 17 00:00:00 2001 From: Robert Kossessa Date: Tue, 23 Jan 2024 11:46:20 +0100 Subject: [PATCH] FIX: Missing model type --- src/components/device-gui/PixelBarTest.vue | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/components/device-gui/PixelBarTest.vue b/src/components/device-gui/PixelBarTest.vue index 57cafc3..06b0d7f 100644 --- a/src/components/device-gui/PixelBarTest.vue +++ b/src/components/device-gui/PixelBarTest.vue @@ -2,9 +2,9 @@ import { ref, computed } from 'vue' import { Input } from '@/components/ui/input' -const model = defineModel() +const model = defineModel({ type: Number, default: 60 }) -const bar = ref(null); +const bar = ref(null) const width = ref(160) const count = ref(40) @@ -19,15 +19,18 @@ const rect_width = computed(() => { const current_pos = computed(() => { return Math.round((percent.value / 100) * (count.value - 1)) }) + function onMouseDown() { window.addEventListener('mousemove', onMouseMove) window.addEventListener('mouseup', onMouseUp) } + function onMouseMove(e) { const rect = bar.value.getBoundingClientRect() percent.value = Math.max(0, Math.min(Math.round((e.clientX - rect.left - 9) / (width.value - 6) * 100), 100)) model.value = percent.value } + function onMouseUp() { window.removeEventListener('mousemove', onMouseMove) window.removeEventListener('mouseup', onMouseUp)