122 lines
4.2 KiB
JavaScript
122 lines
4.2 KiB
JavaScript
/**
|
|
* @module PricingMetricsDates
|
|
* PricingMetricsDates components are used on the Pricing Metrics page to handle queries related to pricing metrics.
|
|
* This component assumes that query parameters (as in, from route params) are being passed in with the format MM-yyyy,
|
|
* while the inputs expect a format of MM/yyyy.
|
|
*
|
|
* @example
|
|
* ```js
|
|
* <PricingMetricsDates @resultStart="2020-03-01T00:00:00Z" @resultEnd="2020-08-31T23:59:59Z" @queryStart="03-2020" @queryEnd="08-2020" />
|
|
* ```
|
|
* @param {object} resultStart - resultStart is the start date of the metrics returned. Should be a valid date string that the built-in Date() fn can parse
|
|
* @param {object} resultEnd - resultEnd is the end date of the metrics returned. Should be a valid date string that the built-in Date() fn can parse
|
|
* @param {string} [queryStart] - queryStart is the route param (formatted MM-yyyy) that the result will be measured against for showing discrepancy warning
|
|
* @param {string} [queryEnd] - queryEnd is the route param (formatted MM-yyyy) that the result will be measured against for showing discrepancy warning
|
|
* @param {number} [defaultSpan=12] - setting for default time between start and end input dates
|
|
* @param {number} [retentionMonths=24] - setting for the retention months, which informs valid dates to query by
|
|
*/
|
|
import { set, computed } from '@ember/object';
|
|
import { inject as service } from '@ember/service';
|
|
import Component from '@ember/component';
|
|
import { subMonths, startOfToday, format, endOfMonth, startOfMonth, isBefore } from 'date-fns';
|
|
import layout from '../templates/components/pricing-metrics-dates';
|
|
import { parseDateString } from 'vault/helpers/parse-date-string';
|
|
|
|
export default Component.extend({
|
|
layout,
|
|
router: service(),
|
|
|
|
queryStart: null,
|
|
queryEnd: null,
|
|
resultStart: null,
|
|
resultEnd: null,
|
|
|
|
start: null,
|
|
end: null,
|
|
|
|
defaultSpan: 12,
|
|
retentionMonths: 24,
|
|
|
|
startDate: computed('start', function () {
|
|
if (!this.start) return null;
|
|
let date;
|
|
try {
|
|
date = parseDateString(this.start, '/');
|
|
if (date) return date;
|
|
return null;
|
|
} catch (e) {
|
|
return null;
|
|
}
|
|
}),
|
|
endDate: computed('end', function () {
|
|
if (!this.end) return null;
|
|
let date;
|
|
try {
|
|
date = parseDateString(this.end, '/');
|
|
if (date) return endOfMonth(date);
|
|
return null;
|
|
} catch (e) {
|
|
return null;
|
|
}
|
|
}),
|
|
|
|
error: computed('end', 'endDate', 'retentionMonths', 'start', 'startDate', function () {
|
|
if (!this.startDate) {
|
|
return 'Start date is invalid. Please use format MM/yyyy';
|
|
}
|
|
if (!this.endDate) {
|
|
return 'End date is invalid. Please use format MM/yyyy';
|
|
}
|
|
if (isBefore(this.endDate, this.startDate)) {
|
|
return 'Start date is after end date';
|
|
}
|
|
const lastMonthAvailable = endOfMonth(subMonths(startOfToday(), 1));
|
|
if (isBefore(lastMonthAvailable, this.endDate)) {
|
|
return `Data is not available until the end of the month`;
|
|
}
|
|
const earliestRetained = startOfMonth(subMonths(lastMonthAvailable, this.retentionMonths));
|
|
if (isBefore(this.startDate, earliestRetained)) {
|
|
return `No data retained before ${format(earliestRetained, 'MM/yyyy')} due to your settings`;
|
|
}
|
|
|
|
return null;
|
|
}),
|
|
|
|
init() {
|
|
this._super(...arguments);
|
|
let initialEnd;
|
|
let initialStart;
|
|
|
|
initialEnd = subMonths(startOfToday(), 1);
|
|
if (this.queryEnd) {
|
|
initialEnd = parseDateString(this.queryEnd, '-');
|
|
} else {
|
|
// if query isn't passed in, set it so that showResultsWarning works
|
|
this.queryEnd = format(initialEnd, 'MM-yyyy');
|
|
}
|
|
initialStart = subMonths(initialEnd, this.defaultSpan);
|
|
if (this.queryStart) {
|
|
initialStart = parseDateString(this.queryStart, '-');
|
|
} else {
|
|
// if query isn't passed in, set it so that showResultsWarning works
|
|
this.queryStart = format(initialStart, 'MM-yyyy');
|
|
}
|
|
|
|
set(this, 'start', format(initialStart, 'MM/yyyy'));
|
|
set(this, 'end', format(initialEnd, 'MM/yyyy'));
|
|
},
|
|
|
|
actions: {
|
|
handleQuery() {
|
|
const start = format(this.startDate, 'MM-yyyy');
|
|
const end = format(this.endDate, 'MM-yyyy');
|
|
this.router.transitionTo('vault.cluster.clients', {
|
|
queryParams: {
|
|
start,
|
|
end,
|
|
},
|
|
});
|
|
},
|
|
},
|
|
});
|