Переход на quasar

client/components/share/Notify.vue

@@ -0,0 +1,58 @@
+<template>
+    <div class="hidden"></div>
+</template>
+
+<script>
+//-----------------------------------------------------------------------------
+import Vue from 'vue';
+import Component from 'vue-class-component';
+
+export default @Component({
+})
+class Notify extends Vue {
+    notify(opts) {
+        let {
+            caption = null,
+            captionColor = 'black',
+            color = 'positive',
+            icon = '',
+            iconColor = 'white',
+            message = '',
+            messageColor = 'black',
+        } = opts;
+
+        caption = (caption ? `<div style="font-size: 120%; color: ${captionColor}"><b>${caption}</b></div><br>` : '');
+        return this.$q.notify({
+            position: 'top-right',
+            color,
+            textColor: iconColor,
+            icon,
+            actions: [{icon: 'la la-times notify-button-icon', color: 'black'}],
+            html: true,
+
+            message: 
+                `<div style="max-width: 350px;">
+                    ${caption}
+                    <div style="color: ${messageColor}; overflow-wrap: break-word; word-wrap: break-word;">${message}</div>
+                </div>`
+        });
+    }
+
+    success(message, caption) {
+        this.notify({color: 'positive', icon: 'la la-check-circle', message, caption});
+    }
+
+    warning(message, caption) {
+        this.notify({color: 'warning', icon: 'la la-exclamation-circle', message, caption});
+    }
+
+    error(message, caption) {
+        this.notify({color: 'negative', icon: 'la la-exclamation-circle', messageColor: 'yellow', message, caption});
+    }
+
+    info(message, caption) {
+        this.notify({color: 'info', icon: 'la la-bell', message, caption});
+    }
+}
+//-----------------------------------------------------------------------------
+</script>

client/components/share/notify.js

@@ -1,43 +0,0 @@
-export function notify(vue, opts) {
-    let {
-        caption = null,
-        captionColor = 'black',
-        color = 'positive',
-        icon = '',
-        iconColor = 'white',
-        message = '',
-        messageColor = 'black',
-    } = opts;
-
-    caption = (caption ? `<div style="font-size: 120%; color: ${captionColor}"><b>${caption}</b></div><br>` : '');
-    return vue.$q.notify({
-        position: 'top-right',
-        color,
-        textColor: iconColor,
-        icon,
-        actions: [{icon: 'la la-times notify-button-icon', color: 'black'}],
-        html: true,
-
-        message: 
-            `<div style="max-width: 350px;">
-                ${caption}
-                <div style="color: ${messageColor}; overflow-wrap: break-word; word-wrap: break-word;">${message}</div>
-            </div>`
-    });
-}
-
-export function success(vue, message, caption) {
-    notify(vue, {color: 'positive', icon: 'la la-check-circle', message, caption});
-}
-
-export function warning(vue, message, caption) {
-    notify(vue, {color: 'warning', icon: 'la la-exclamation-circle', message, caption});
-}
-
-export function error(vue, message, caption) {
-    notify(vue, {color: 'negative', icon: 'la la-exclamation-circle', messageColor: 'yellow', message, caption});
-}
-
-export function info(vue, message, caption) {
-    notify(vue, {color: 'info', icon: 'la la-bell', message, caption});
-}