Team2890/PhotonVision
4
0
Fork 0
mirror of https://github.com/PhotonVision/photonvision synced 2026-07-01 02:41:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Bound check sliders in web UI (#1134)

Browse Source 
* Bound check sliders

* Update pv-range-slider.vue

---------

Co-authored-by: Sriman Achanta <68172138+srimanachanta@users.noreply.github.com>
This commit is contained in:
Matt
2024-01-08 09:27:54 -05:00
committed by GitHub
parent 4d458198c1
commit 02df8aa925
1 changed files with 13 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
photon-client/src/components/common/pv-range-slider.vue
View File

@@ -40,12 +40,21 @@ const localValue = computed<[number, number]>({
} }
}); });
const changeFromSlot = (v: number, i: number) => { const changeFromSlot = (v: string, i: number) => {
// v comes in as a string, not a number, for some reason
// if v is undefined, take a guess and set it to 0
const val = Math.max(props.min, Math.min(parseFloat(v) || 0, props.max));
// localValue.value must be replaced for a reactive change to take place // localValue.value must be replaced for a reactive change to take place
const temp = localValue.value; const temp = localValue.value;
temp[i] = v; temp[i] = val;
localValue.value = temp; localValue.value = temp;
}; };
const checkNumberRange = (v: string): boolean => {
const val: number = parseFloat(v);
return isFinite(val) && val >= props.min && val <= props.max;
};
</script> </script>
<template> <template>
@@ -79,6 +88,7 @@ const changeFromSlot = (v: number, i: number) => {
:max="max" :max="max"
:min="min" :min="min"
:step="step" :step="step"
:rules="[checkNumberRange]"
type="number" type="number"
style="width: 60px" style="width: 60px"
@input="(v) => changeFromSlot(v, 0)" @input="(v) => changeFromSlot(v, 0)"
@@ -95,6 +105,7 @@ const changeFromSlot = (v: number, i: number) => {
:max="max" :max="max"
:min="min" :min="min"
:step="step" :step="step"
:rules="[checkNumberRange]"
type="number" type="number"
style="width: 60px" style="width: 60px"
@input="(v) => changeFromSlot(v, 1)" @input="(v) => changeFromSlot(v, 1)"