Globally register toast plugin allows us to call this.$toast.info({})
from anywhere for a toast.
Currently styled types:
 - error
 - info
		
	
		
			
				
	
	
		
			52 lines
		
	
	
		
			1.1 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			52 lines
		
	
	
		
			1.1 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
import Vue from "vue";
 | 
						|
import ToastComponent from "./Toast";
 | 
						|
 | 
						|
const optionsDefaults = {
 | 
						|
  data: {
 | 
						|
    type: "info",
 | 
						|
    show: true,
 | 
						|
    timeout: 4500,
 | 
						|
 | 
						|
    onCreate(created = null) {},
 | 
						|
    onEdit(editted = null) {},
 | 
						|
    onRemove(removed = null) {}
 | 
						|
  }
 | 
						|
};
 | 
						|
 | 
						|
function toast(options) {
 | 
						|
  // merge the default options with the passed options.
 | 
						|
  const root = new Vue({
 | 
						|
    data: {
 | 
						|
      ...optionsDefaults.data,
 | 
						|
      ...options
 | 
						|
    },
 | 
						|
    render: createElement => createElement(ToastComponent)
 | 
						|
  });
 | 
						|
 | 
						|
  root.$mount(document.body.appendChild(document.createElement("div")));
 | 
						|
}
 | 
						|
 | 
						|
export default {
 | 
						|
  install(vue) {
 | 
						|
    console.log("Installing toast plugin!");
 | 
						|
 | 
						|
    Vue.prototype.$toast = {
 | 
						|
      info(options) {
 | 
						|
        toast({ type: "info", ...options });
 | 
						|
      },
 | 
						|
      success(options) {
 | 
						|
        toast({ type: "success", ...options });
 | 
						|
      },
 | 
						|
      warning(options) {
 | 
						|
        toast({ type: "warning", ...options });
 | 
						|
      },
 | 
						|
      error(options) {
 | 
						|
        toast({ type: "error", ...options });
 | 
						|
      },
 | 
						|
      simple(options) {
 | 
						|
        toast({ type: "simple", ...options });
 | 
						|
      }
 | 
						|
    };
 | 
						|
  }
 | 
						|
};
 |