xref: /openbmc/webui-vue/src/main.js (revision aa0dc59c) 
1import Vue from 'vue';
2import App from './App.vue';
3import router from './router';
4import store from './store';
5import {
6  AlertPlugin,
7  BadgePlugin,
8  ButtonPlugin,
9  BVConfigPlugin,
10  CollapsePlugin,
11  DropdownPlugin,
12  FormPlugin,
13  FormCheckboxPlugin,
14  FormDatepickerPlugin,
15  FormFilePlugin,
16  FormGroupPlugin,
17  FormInputPlugin,
18  FormRadioPlugin,
19  FormSelectPlugin,
20  FormTagsPlugin,
21  InputGroupPlugin,
22  LayoutPlugin,
23  LinkPlugin,
24  ListGroupPlugin,
25  ModalPlugin,
26  NavbarPlugin,
27  NavPlugin,
28  PaginationPlugin,
29  ProgressPlugin,
30  TablePlugin,
31  ToastPlugin,
32  TooltipPlugin
33} from 'bootstrap-vue';
34import Vuelidate from 'vuelidate';
35import i18n from './i18n';
36import { format } from 'date-fns-tz';
37
38// Filters
39Vue.filter('shortTimeZone', function(value) {
40  const longTZ = value
41    .toString()
42    .match(/\((.*)\)/)
43    .pop();
44  const regexNotUpper = /[*a-z ]/g;
45  return longTZ.replace(regexNotUpper, '');
46});
47
48Vue.filter('formatDate', function(value) {
49  const isUtcDisplay = store.getters['global/isUtcDisplay'];
50
51  if (value instanceof Date) {
52    if (isUtcDisplay) {
53      return value.toISOString().substring(0, 10);
54    }
55    const pattern = `yyyy-MM-dd`;
56    const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
57    return format(value, pattern, { timezone });
58  }
59});
60
61Vue.filter('formatTime', function(value) {
62  const isUtcDisplay = store.getters['global/isUtcDisplay'];
63
64  if (value instanceof Date) {
65    if (isUtcDisplay) {
66      let timeOptions = {
67        timeZone: 'UTC',
68        hour12: false
69      };
70      return `${value.toLocaleTimeString('default', timeOptions)} UTC`;
71    }
72    const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
73    const shortTz = Vue.filter('shortTimeZone')(value);
74    const pattern = `HH:mm:ss ('${shortTz}' O)`;
75    return format(value, pattern, { timezone }).replace('GMT', 'UTC');
76  }
77});
78
79// Plugins
80Vue.use(AlertPlugin);
81Vue.use(BadgePlugin);
82Vue.use(ButtonPlugin);
83Vue.use(BVConfigPlugin, {
84  BFormText: { textVariant: 'secondary' },
85  BTable: {
86    headVariant: 'light',
87    footVariant: 'light'
88  },
89  BFormTags: {
90    tagVariant: 'primary',
91    addButtonVariant: 'link-primary'
92  },
93  BBadge: {
94    variant: 'primary'
95  }
96});
97Vue.use(CollapsePlugin);
98Vue.use(DropdownPlugin);
99Vue.use(FormPlugin);
100Vue.use(FormCheckboxPlugin);
101Vue.use(FormDatepickerPlugin);
102Vue.use(FormFilePlugin);
103Vue.use(FormGroupPlugin);
104Vue.use(FormInputPlugin);
105Vue.use(FormRadioPlugin);
106Vue.use(FormSelectPlugin);
107Vue.use(FormTagsPlugin);
108Vue.use(InputGroupPlugin);
109Vue.use(LayoutPlugin);
110Vue.use(LayoutPlugin);
111Vue.use(LinkPlugin);
112Vue.use(ListGroupPlugin);
113Vue.use(ModalPlugin);
114Vue.use(NavbarPlugin);
115Vue.use(NavPlugin);
116Vue.use(PaginationPlugin);
117Vue.use(ProgressPlugin);
118Vue.use(TablePlugin);
119Vue.use(ToastPlugin);
120Vue.use(TooltipPlugin);
121Vue.use(Vuelidate);
122
123new Vue({
124  router,
125  store,
126  i18n,
127  render: h => h(App)
128}).$mount('#app');
129