sample toast integration

package.json

@@ -14,7 +14,8 @@
     "vue": "^3.0.5",
     "vue-i18n": "^9.0.0",
     "vue-phone-number-input": "^1.1.10",
-    "vue-router": "4"
+    "vue-router": "4",
+    "vue-toastification": "^2.0.0-rc.1"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^1.1.5",

src/components/Register.vue

@@ -182,11 +182,13 @@ import axios from "redaxios";
 import Toastify from "toastify-js";
 import isEmail from 'validator/es/lib/isEmail';
 import isMobilePhone from 'validator/es/lib/isMobilePhone';
+import { useToast } from "vue-toastification";
 
 let userdetails = ref({ firstname: "", lastname: "", middlename: "", mail: "", phone: "" });
 let phone_valid = ref(!userdetails.value.phone.trim() || isMobilePhone(userdetails.value.phone));
 let provide_address = ref(false);
 let agb_accepted = ref(false);
+const toast = useToast();
 function login() {
   userdetails = userdetails.value;
   if (userdetails.phone === "" || isMobilePhone(userdetails.phone)) {
@@ -201,20 +203,21 @@ function login() {
       if (isMobilePhone(userdetails.phone)) {
         postdata.phone = userdetails.phone;
       }
-      axios.post('https://dev.lauf-fuer-kaya.de/api/runners/register',)
-        .then(function(response) {
+      toast("registration in progress...");
+      axios.post('https://dev.lauf-fuer-kaya.de/api/runners/register', postdata)
+        .then((response) => {
           response = response.data;
           const token = response.token;
           const userid = JSON.parse(atob(token.split(".")[1])).id;
           console.log({ token });
           console.log({ userid });
+          // 
+          toast.success("You have been registered!");
         })
-        .catch(function(error) {
+        .catch((error) => {
           console.log(error);
         });
     }
   }
-  // console.log(agb_accepted.value);
-  // alert("AGB was " + (agb_accepted.value === true ? "accepted" : "not accepted"));
 }
 </script>

src/main.js

@@ -2,8 +2,10 @@ import { createApp } from 'vue';
 import { createWebHistory, createRouter } from 'vue-router';
 import App from './App.vue';
 import { createI18n } from 'vue-i18n';
+import Toast from 'vue-toastification';
 import 'windi.css';
 import 'toastify-js/src/toastify.css';
+import 'vue-toastification/dist/index.css';
 import * as keys_en from './locales/en.json';
 import * as keys_de from './locales/de.json';
 
@@ -32,4 +34,4 @@ const router = createRouter({
 	]
 });
 // ---------------
-createApp(App).use(i18n).use(router).mount('#app');
+createApp(App).use(Toast).use(i18n).use(router).mount('#app');