I'm currently developing a booking system where the pricing varies based on seasons that recur annually. The overall functionality is working smoothly, however, I am encountering difficulties with handling the recurring seasons. I have implemented moment.js along with the moment-range plugin but it does not seem to be the root cause of the issue. To tackle the problem of recurring ranges with moment-range, I decided to iterate through my seasonsObject and create new seasons for the next five (or any specified number) years. This is where I have hit a roadblock - my loop is not functioning as expected.
var seasonsObject = {
low: {
period: "low",
seasonStart: "2017-11-01T12:01:00.000Z",
seasonEnd: "2018-03-15T12:01:00.000Z"
},
high: {
period: "high",
seasonStart: "2018-06-01T12:01:00.000Z",
seasonEnd: "2018-08-01T12:01:00.000Z"
}
}
var futureSeasons;
for (var i = 0; i < 5; i++) {
futureSeasons = _.each(seasonsObject,(val) => {
val.range = moment.range(moment(val.seasonStart).add(i,'y'), moment(val.seasonEnd).add(i,'y'))
});
}
I have verified that the segment using moment.js and moment-range works correctly, therefore, the issue lies within my loop - it appears to stop after i = 0
since only the seasons of the first year are displayed. I attempted replacing _.each()
with _.map()
and _.mapObject()
, but neither provided the desired outcome.
The end goal should be:
futureSeasons: {
low0: {
period: "low",
seasonStart: "2017-11-01T12:01:00.000Z",
seasonEnd: "2018-03-15T12:01:00.000Z"
},
high0: {
period: "high",
seasonStart: "2018-06-01T12:01:00.000Z",
seasonEnd: "2018-08-01T12:01:00.000Z"
},
low1: {
period: "low",
seasonStart: "2018-11-01T12:01:00.000Z",
seasonEnd: "2018-03-15T12:01:00.000Z"
},
high1: {
period: "high",
seasonStart: "2019-06-01T12:01:00.000Z",
seasonEnd: "2018-08-01T12:01:00.000Z"
},
low2: {
period: "low",
seasonStart: "2020-11-01T12:01:00.000Z",
seasonEnd: "2018-03-15T12:01:00.000Z"
},
high2: {
period: "high",
seasonStart: "2021-06-01T12:01:00.000Z",
seasonEnd: "2018-08-01T12:01:00.000Z"
},
...
}
I am utilizing Vue.js and plan to encapsulate this behavior in a computed property! Any assistance would be highly valued :-)