simon987/sist2
1
0
Fork 0
mirror of https://github.com/simon987/sist2.git synced 2025-04-19 10:16:42 +00:00
Code Issues Projects Releases Wiki Activity

fix: DateSlider component is modified to avoid noUiSlider "Error: noUiSlider: 'range' 'min' and 'max' cannot be equal"

Browse Source
This commit is contained in:
Stephan GRAVIASSY 2023-03-21 16:42:23 +01:00
parent 60c77678b4
commit f532cacf3d
1 changed files with 27 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
sist2-vue/src/components/DateSlider.vue
View File

@ -70,21 +70,37 @@ export default {
return; return;
} }
const dateMax = this.$store.state.dateBoundsMax; // Compute slider bound dates (seconds since EPOCH)
const dateMin = this.$store.state.dateBoundsMin; let bDateMin = this.$store.state.dateBoundsMin;
let bDateMax = this.$store.state.dateBoundsMax;
if (!bDateMin || !bDateMax || bDateMax <= bDateMin) {
// if initialization of $store.state values outside this function failed
let today = new Date()
let todayP1 = new Date();
todayP1.setFullYear(today.getFullYear()+1);
let todayM20 = new Date()
todayM20.setFullYear(today.getFullYear()-20);
bDateMax = todayP1.getTime()/1000; // today plus 1 year
bDateMin = todayM20.getTime()/1000; // today minus 20 year
}
// Compute initail slider dates (seconds since EPOCH)
let cDateMin = this.$store.state.dateMin ? this.$store.state.dateMin : bDateMin;
let cDateMax = this.$store.state.dateMax ? this.$store.state.dateMax : bDateMax;
if (cDateMax <= cDateMin) {
// if initialization out of $store.state values outside this function failed
cDateMin = bDateMin;
cDateMax = bDateMax;
}
const slider = noUiSlider.create(elem, { const slider = noUiSlider.create(elem, {
start: [ start: [ cDateMin, cDateMax],
this.$store.state.dateMin ? this.$store.state.dateMin : dateMin,
this.$store.state.dateMax ? this.$store.state.dateMax : dateMax
],
tooltips: [true, true], tooltips: [true, true],
behaviour: "drag-tap", behaviour: "drag-tap",
connect: true, connect: true,
range: { range: {
"min": dateMin, "min": bDateMin,
"max": dateMax, "max": bDateMax,
}, },
format: { format: {
to: x => humanDate(x), to: x => humanDate(x),
@ -98,9 +114,9 @@ export default {
slider.on("set", (values, handle, unencoded) => { slider.on("set", (values, handle, unencoded) => {
if (handle === 0) { if (handle === 0) {
this.$store.commit("setDateMin", unencoded[0] === dateMin ? undefined : Math.round(unencoded[0])); this.$store.commit("setDateMin", unencoded[0] === bDateMin ? undefined : Math.round(unencoded[0]));
} else { } else {
this.$store.commit("setDateMax", unencoded[1] >= dateMax ? undefined : Math.round(unencoded[1])); this.$store.commit("setDateMax", unencoded[1] >= bDateMax ? undefined : Math.round(unencoded[1]));
} }
}); });
} }