lfk/selfservice
3
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

sample toast integration

Browse Source
This commit is contained in:
Philipp Dormann 2021-02-27 18:28:32 +01:00
parent b7f15f4d68
commit ff89071156
3 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

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

13
src/components/Register.vue
View File

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

4
src/main.js
View File

@ -2,8 +2,10 @@ import { createApp } from 'vue';
import { createWebHistory, createRouter } from 'vue-router'; import { createWebHistory, createRouter } from 'vue-router';
import App from './App.vue'; import App from './App.vue';
import { createI18n } from 'vue-i18n'; import { createI18n } from 'vue-i18n';
import Toast from 'vue-toastification';
import 'windi.css'; import 'windi.css';
import 'toastify-js/src/toastify.css'; import 'toastify-js/src/toastify.css';
import 'vue-toastification/dist/index.css';
import * as keys_en from './locales/en.json'; import * as keys_en from './locales/en.json';
import * as keys_de from './locales/de.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');