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