diff options
Diffstat (limited to 'app/assets/javascripts/analytics')
4 files changed, 14 insertions, 17 deletions
diff --git a/app/assets/javascripts/analytics/shared/components/daterange.vue b/app/assets/javascripts/analytics/shared/components/daterange.vue index 7df66d1b2be..92ccac59057 100644 --- a/app/assets/javascripts/analytics/shared/components/daterange.vue +++ b/app/assets/javascripts/analytics/shared/components/daterange.vue @@ -1,13 +1,10 @@ <script> -import { GlDaterangePicker, GlSprintf } from '@gitlab/ui'; -import { getDayDifference } from '~/lib/utils/datetime_utility'; -import { __, sprintf } from '~/locale'; -import { OFFSET_DATE_BY_ONE } from '../constants'; +import { GlDaterangePicker } from '@gitlab/ui'; +import { n__, __, sprintf } from '~/locale'; export default { components: { GlDaterangePicker, - GlSprintf, }, props: { show: { @@ -69,9 +66,10 @@ export default { this.$emit('change', { startDate, endDate }); }, }, - numberOfDays() { - const dayDifference = getDayDifference(this.startDate, this.endDate); - return this.includeSelectedDate ? dayDifference + OFFSET_DATE_BY_ONE : dayDifference; + }, + methods: { + numberOfDays(daysSelected) { + return n__('1 day selected', '%d days selected', daysSelected); }, }, }; @@ -83,7 +81,7 @@ export default { > <gl-daterange-picker v-model="dateRange" - class="d-flex flex-column flex-lg-row" + class="gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row" :default-start-date="startDate" :default-end-date="endDate" :default-min-date="minDate" @@ -93,12 +91,12 @@ export default { :tooltip="maxDateRangeTooltip" theme="animate-picker" start-picker-class="js-daterange-picker-from gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row gl-lg-align-items-center gl-lg-mr-3 gl-mb-2 gl-lg-mb-0" - end-picker-class="js-daterange-picker-to d-flex flex-column flex-lg-row align-items-lg-center gl-mb-2 gl-lg-mb-0" + end-picker-class="js-daterange-picker-to gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row gl-lg-align-items-center gl-mb-2 gl-lg-mb-0" label-class="gl-mb-2 gl-lg-mb-0" > - <gl-sprintf :message="n__('1 day selected', '%d days selected', numberOfDays)"> - <template #numberOfDays>{{ numberOfDays }}</template> - </gl-sprintf> + <template #default="{ daysSelected }"> + {{ numberOfDays(daysSelected) }} + </template> </gl-daterange-picker> </div> </template> diff --git a/app/assets/javascripts/analytics/shared/constants.js b/app/assets/javascripts/analytics/shared/constants.js index e1bc59b36ef..c62736d55a8 100644 --- a/app/assets/javascripts/analytics/shared/constants.js +++ b/app/assets/javascripts/analytics/shared/constants.js @@ -1,8 +1,7 @@ -import { masks } from 'dateformat'; +import { masks } from '~/lib/dateformat'; import { s__ } from '~/locale'; export const DATE_RANGE_LIMIT = 180; -export const OFFSET_DATE_BY_ONE = 1; export const PROJECTS_PER_PAGE = 50; const { isoDate, mediumDate } = masks; diff --git a/app/assets/javascripts/analytics/shared/utils.js b/app/assets/javascripts/analytics/shared/utils.js index 1887f2affc3..bc52e38fc81 100644 --- a/app/assets/javascripts/analytics/shared/utils.js +++ b/app/assets/javascripts/analytics/shared/utils.js @@ -1,5 +1,5 @@ -import dateFormat from 'dateformat'; import { hideFlash } from '~/flash'; +import dateFormat from '~/lib/dateformat'; import { slugify } from '~/lib/utils/text_utility'; import { urlQueryToFilter } from '~/vue_shared/components/filtered_search_bar/filtered_search_utils'; import { dateFormats } from './constants'; diff --git a/app/assets/javascripts/analytics/usage_trends/utils.js b/app/assets/javascripts/analytics/usage_trends/utils.js index 91907877ed6..9474d264363 100644 --- a/app/assets/javascripts/analytics/usage_trends/utils.js +++ b/app/assets/javascripts/analytics/usage_trends/utils.js @@ -1,5 +1,5 @@ -import { masks } from 'dateformat'; import { get } from 'lodash'; +import { masks } from '~/lib/dateformat'; import { formatDate } from '~/lib/utils/datetime_utility'; const { isoDate } = masks; |