Permalink
Browse files

Add new toast component with toast on new entry

  • Loading branch information...
overshard committed Jan 10, 2019
1 parent a4f501c commit 1057fed997021f2f6853bdb23533a83685ab8571
@@ -11,6 +11,8 @@
</div>
</transition>

<toast></toast>

<div class="navbar navbar-expand-sm navbar-dark bg-dark">
<div class="container">
<router-link
@@ -134,11 +136,13 @@
import {mapGetters} from 'vuex';
import Tracker from './tracker.vue';
import Toast from './toast.vue';
export default {
components: {
Tracker,
Toast,
},
data() {
return {
@@ -0,0 +1,49 @@
<template>
<div class="toast float-right" role="alert" aria-live="assertive" aria-atomic="true" data-delay="5000">
<div class="toast-header">
<strong class="mr-auto">{{ toast.title }}</strong>
<button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="toast-body">
{{ toast.message }}
</div>
</div>
</template>


<script>
import $ from 'jquery';
export default {
data() {
return {
toast: {
title: null,
message: null,
}
}
},
mounted() {
const self = this;
this.$bus.$on('toast', function(data) {
self.toast = data;
setTimeout(function() {
$(self.$el).toast('show');
}, 2000);
})
},
};
</script>


<style lang="scss">
.toast {
position: absolute;
top: 25px;
right: 25px;
z-index: 100;
}
</style>
@@ -15,7 +15,7 @@ import store from './store';

// Global event bus

Vue.prototype.bus = new Vue();
Vue.prototype.$bus = new Vue();


// Plugins
@@ -73,6 +73,10 @@ export default {
createEntry({commit}, entry) {
fetch.post(timestrapConfig.API_URLS.ENTRIES, entry).then(response => {
if (response.data.user_details.id == timestrapConfig.USER.ID) commit('addEntry', response.data);
Vue.prototype.$bus.$emit('toast', {
title: 'New Entry Added',
message: 'Your new entry has been successfully added.',
});
}).catch(error => console.log(error));
},
editEntry({commit, state}, entry) {

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.
@@ -40,7 +40,7 @@
"@fortawesome/free-solid-svg-icons": "^5.1.0",
"@fortawesome/vue-fontawesome": "^0.1.0",
"axios": "^0.18.0",
"bootstrap": "^4.1.1",
"bootstrap": "^4.2.1",
"chart.js": "^2.7.2",
"jquery": "^3.3.1",
"moment": "^2.22.2",

0 comments on commit 1057fed

Please sign in to comment.