You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
import { provide, reactive } from 'vue'
|
|
import type { NotifyProps } from './type'
|
|
import { deepMerge, isString } from '../common/util'
|
|
|
|
let timer: ReturnType<typeof setTimeout>
|
|
let currentOptions = getDefaultOptions()
|
|
const notifyDefaultOptionKey = '__NOTIFY_OPTION__'
|
|
export const setNotifyDefaultOptions = (options: NotifyProps) => {
|
|
currentOptions = deepMerge(currentOptions, options) as NotifyProps
|
|
}
|
|
export const resetNotifyDefaultOptions = () => {
|
|
currentOptions = getDefaultOptions()
|
|
}
|
|
export const useNotify = (selector: string = '') => {
|
|
const notifyOption = reactive<NotifyProps>(currentOptions)
|
|
const showNotify = (option: NotifyProps | string) => {
|
|
const options = deepMerge(currentOptions, isString(option) ? { message: option } : option) as NotifyProps
|
|
|
|
Object.assign(notifyOption, options, { visible: true })
|
|
if (notifyOption.duration && notifyOption.duration > 0) {
|
|
timer && clearTimeout(timer)
|
|
timer = setTimeout(() => closeNotify(), options.duration)
|
|
}
|
|
}
|
|
const closeNotify = () => {
|
|
timer && clearTimeout(timer)
|
|
notifyOption.visible = false
|
|
}
|
|
|
|
// provide
|
|
provide(getNotifyOptionKey(selector), notifyOption)
|
|
|
|
return {
|
|
showNotify,
|
|
closeNotify
|
|
}
|
|
}
|
|
export const getNotifyOptionKey = (selector: string) => {
|
|
return selector ? `${notifyDefaultOptionKey}${selector}` : notifyDefaultOptionKey
|
|
}
|
|
|
|
function getDefaultOptions(): NotifyProps {
|
|
return {
|
|
type: 'danger',
|
|
color: undefined,
|
|
zIndex: 99,
|
|
message: '',
|
|
duration: 3000,
|
|
position: 'top',
|
|
safeHeight: undefined,
|
|
background: undefined,
|
|
onClick: undefined,
|
|
onClosed: undefined,
|
|
onOpened: undefined
|
|
}
|
|
}
|