#63 migrate to Vue 3

src/main.js

@@ -1,9 +1,8 @@
-import Vue from 'vue'
+import { createApp } from 'vue'
 import App from '@/App.vue'
 import router from '@/router'
 import store from '@/store'
-import { VuePlugin } from 'vuera'
-import VModal from 'vue-js-modal'
+import { createVfm, VueFinalModal, useVfm } from 'vue-final-modal'
 
 import '@/assets/styles/variables.css'
 import '@/assets/styles/buttons.css'
@@ -11,20 +10,23 @@ import '@/assets/styles/tables.css'
 import '@/assets/styles/dialogs.css'
 import '@/assets/styles/tooltips.css'
 import '@/assets/styles/messages.css'
-import 'vue-multiselect/dist/vue-multiselect.min.css'
+import 'vue-multiselect/dist/vue-multiselect.css'
 import '@/assets/styles/multiselect.css'
+import 'vue-final-modal/style.css'
 
 if (!['localhost', '127.0.0.1'].includes(location.hostname)) {
   import('./registerServiceWorker') // eslint-disable-line no-unused-expressions
 }
 
-Vue.use(VuePlugin)
-Vue.use(VModal)
+const app = createApp(App)
+  .use(router)
+  .use(store)
+  .use(createVfm())
+  .component('modal', VueFinalModal)
 
-Vue.config.productionTip = false
-
-new Vue({
-  router,
-  store,
-  render: h => h(App)
-}).$mount('#app')
+const vfm = useVfm()
+app.config.globalProperties.$modal = {
+  show: modalId => vfm.open(modalId),
+  hide: modalId => vfm.close(modalId)
+}
+app.mount('#app')