Переход на quasar

client/components/Reader/HelpPage/CommonHelpPage/CommonHelpPage.vue

@@ -45,6 +45,7 @@ import Vue from 'vue';
 import Component from 'vue-class-component';
 
 import {copyTextToClipboard} from '../../../../share/utils';
+import * as notify from '../../../share/notify';
 
 export default @Component({
 })
@@ -60,9 +61,9 @@ class CommonHelpPage extends Vue {
         const result = await copyTextToClipboard(text);
         const msg = (result ? mes : 'Копирование не удалось');
         if (result)
-            this.$notify.success({message: msg});
+            notify.success(this, msg);
         else
-            this.$notify.error({message: msg});
+            notify.error(this, msg);
     }
 }
 //-----------------------------------------------------------------------------

client/components/share/notify.js

@@ -0,0 +1,35 @@
+export function success(vue, message, caption) {
+    caption = (caption ? `<div style="font-size: 130%; color: black"><b>${caption}</b></div><br>` : '');
+    vue.$q.notify({
+        position: 'top-right',
+        color: 'positive',
+        textColor: 'white',
+        icon: 'o_check_circle',
+        actions: [{icon: 'o_close', color: 'black'}],
+        html: true,
+
+        message: 
+            `<div style="max-width: 350px;">
+                ${caption}
+                <div style="color: black">${message}</div>
+            </div>`
+    });
+}
+
+export function error(vue, message, caption) {
+    caption = (caption ? `<div style="font-size: 130%; color: yellow"><b>${caption}</b></div><br>` : '');
+    vue.$q.notify({
+        position: 'top-right',
+        color: 'negative',
+        textColor: 'white',
+        icon: 'o_error_outline',
+        actions: [{icon: 'o_close', color: 'black'}],
+        html: true,
+
+        message: 
+            `<div style="max-width: 350px;">
+                ${caption}
+                <div style="color: yellow">${message}</div>
+            </div>`
+    });
+}

client/quasar.js

@@ -28,7 +28,7 @@ const components = {
     //QLayout,
     //QPageContainer, QPage,
     //QDrawer,
-    
+
     QCircularProgress,
     QInput,
     QBtn,
@@ -51,9 +51,11 @@ const directives = {Ripple};
 
 //plugins
 import AppFullscreen from 'quasar/src/plugins/AppFullscreen';
+import Notify from 'quasar/src/plugins/Notify';
 
 const plugins = {
     AppFullscreen,
+    Notify,
 };
 
 //use