From 209df3f3f7ab6186285367d56ecaa16f62e3e234 Mon Sep 17 00:00:00 2001 From: sharifcse57 Date: Fri, 17 Feb 2023 20:29:36 +0600 Subject: [PATCH] Fix: Date range data show in chart --- .../bookings/forms/RateHistoriesComponent.vue | 80 +++++++++++++------ 1 file changed, 56 insertions(+), 24 deletions(-) diff --git a/resources/assets/vue/components/bookings/forms/RateHistoriesComponent.vue b/resources/assets/vue/components/bookings/forms/RateHistoriesComponent.vue index 18845a78..290d18ba 100644 --- a/resources/assets/vue/components/bookings/forms/RateHistoriesComponent.vue +++ b/resources/assets/vue/components/bookings/forms/RateHistoriesComponent.vue @@ -87,8 +87,9 @@ export default { 'red', 'pink', 'blue', - 'yellow', - 'black' + 'purple', + 'black', + 'yellow' ] }; }, @@ -115,10 +116,18 @@ export default { } }, rateHistory: function(newVal) { - // Set current month and year - const date = new Date(); - const currentMonth = date.getMonth() + 1; - const currentYear = date.getFullYear(); + + const date_from_parts = this.filters.date_from.split("-"); + const date_from_year = date_from_parts[2]; + const date_from_month = date_from_parts[1] - 1; // Subtract 1 from month, since it's zero-based in Date objects + const date_from_day = date_from_parts[0]; + const start = new Date(date_from_year, date_from_month, date_from_day); + + const date_to_parts = this.filters.date_to.split("-"); + const date_to_year = date_to_parts[2]; + const date_to_month = date_to_parts[1] - 1; // Subtract 1 from month, since it's zero-based in Date objects + const date_to_day = date_to_parts[0]; + const end = new Date(date_to_year, date_to_month, date_to_day); // Group rates by payment method type const ratesByType = {}; @@ -126,36 +135,59 @@ export default { if (!ratesByType[rate.payment_method_type]) { ratesByType[rate.payment_method_type] = []; } - ratesByType[rate.payment_method_type].push(rate); + ratesByType[rate.payment_method_type].push(rate); }); - // Get rates for current month - const ratesForMonth = {}; + const startYear = start.getFullYear(); + const startMonth = start.getMonth() + 1; + const endYear = end.getFullYear(); + const endMonth = end.getMonth() + 1; + + // Get rates for date range + const ratesForRange = {}; Object.keys(ratesByType).forEach(type => { - ratesForMonth[type] = []; - for (let i = 1; i <= new Date(currentYear, currentMonth, 0).getDate(); i++) { - const dateStr = `${i.toString().padStart(2, '0')}-${currentMonth.toString().padStart(2, '0')}-${currentYear}`; + ratesForRange[type] = []; + for (let i = start.getDate(); i <= end.getDate(); i++) { + const dateStr = `${i.toString().padStart(2, '0')}-${startMonth.toString().padStart(2, '0')}-${startYear}`; + if (i === end.getDate() && startMonth !== endMonth) { + // Handle end month + const endMonthDays = new Date(endYear, endMonth, 0).getDate(); + for (let j = 1; j <= end.getDate(); j++) { + const dateStr = `${j.toString().padStart(2, '0')}-${endMonth.toString().padStart(2, '0')}-${endYear}`; + const rate = ratesByType[type].find(r => r.created_at === dateStr); + ratesForRange[type].push(rate ? rate.rate : ''); + } + } else { + // Handle start month and other months in range const rate = ratesByType[type].find(r => r.created_at === dateStr); - console.log(dateStr); - ratesForMonth[type].push(rate ? rate.rate : ''); + ratesForRange[type].push(rate ? rate.rate : ''); + } } }); - // Generate labels for chart const labels = []; - for (let i = 1; i <= new Date(currentYear, currentMonth, 0).getDate(); i++) { - labels.push(`${i.toString().padStart(2, '0')}-${currentMonth.toString().padStart(2, '0')}-${currentYear}`); + for (let i = start.getDate(); i <= end.getDate(); i++) { + if (i === end.getDate() && startMonth !== endMonth) { + // Handle end month + const endMonthDays = new Date(endYear, endMonth, 0).getDate(); + for (let j = 1; j <= end.getDate(); j++) { + labels.push(`${j.toString().padStart(2, '0')}-${endMonth.toString().padStart(2, '0')}-${endYear}`); + } + } else { + // Handle start month and other months in range + labels.push(`${i.toString().padStart(2, '0')}-${startMonth.toString().padStart(2, '0')}-${startYear}`); + } } // Generate datasets for chart const datasets = []; - Object.keys(ratesForMonth).forEach(type => { - datasets.push({ - label: `${this.paymentMethodsConst[type]}`, - data: ratesForMonth[type], - borderColor: this.colors[type], - fill: false - }); + Object.keys(ratesForRange).forEach(type => { + datasets.push({ + label: `${this.paymentMethodsConst[type]}`, + data: ratesForRange[type], + borderColor: this.colors[type], + fill: false + }); }); setTimeout(() => {