import Vue from 'vue'
import Toasted from 'vue-toasted'
import '@/vendor/libs/vue-toasted/vue-toasted.scss'
Vue.use(Toasted)
const getCustomClasses = (toastStyle, toastVariant) => {
  if (!toastVariant) return null
  if (toastStyle !== 'outline') {
    return `bg-${toastVariant} text-${
      toastVariant === 'warning' ? 'dark' : 'white'
    }`
  } else {
    return `border-${toastVariant} text-${toastVariant}`
  }
}
// const getActionCustomClasses = (toastStyle, toastVariant) => {
//   if (!toastVariant) return null

//   if (toastStyle !== 'outline') {
//     return `opacity-75 text-${toastVariant === 'warning' ? 'dark' : 'white'}`
//   } else {
//     return `opacity-75 text-${toastVariant}`
//   }
// }
const Toast = ({
  message,
  type = 'default', // success warning  error  info default
  toastStyle = 'primary', // primary,bubble,outline
  toastVerticalPosition = 'top', // top,bottom
  toastHorizontalPosition = 'center', // left,center,right
  toastActions = null,
  toastIcon = null,
  toastDuration = 2000
}) => {
  let toastVariant = '' // primary secondary success warning  info  danger  dark
  switch (type) {
    case 'error':
      toastVariant = 'danger'
      break
    case 'default':
      toastVariant = 'dark'
      break
    default:
      toastVariant = type
  }

  const actions = [
    {
      text: '关闭',
      onClick: (e, toastObject) => {
        toastObject.goAway(0)
      }
    }
  ]
  // {
  //   text: 'Undo',
  //   push: {
  //     name: 'somewhere',
  //     dontClose: true
  //   },
  //   class: getActionCustomClasses()
  // }

  Vue.toasted.show(message, {
    theme: toastStyle,
    position: `${toastVerticalPosition}-${toastHorizontalPosition}`,
    action: toastActions ? actions : toastActions,
    icon: toastIcon || null,
    className: getCustomClasses(toastStyle, toastVariant),
    duration: toastDuration
  })
}
export default Toast