// 通用提示信息--带删除
/**
*
* @param type 提示信息类型 showAlert
* @param content 提示信息内容
* @param time 提示信息时间,单位s,若为0则不会消失
*/
export function showAlert({
type,
content,
time = 3
}: {
type: string
content: string
time?: number
}) {
// pc增加删除按钮
let innerText = h('span', { style: {} }, content)
let innerIcon = createVNode('i', {
class: 'icon-guanbi_close',
style: {
marginRight: '0px',
marginLeft: '8px',
color: isMobile() ? '#fff' : '#ccc',
cursor: 'pointer',
fontSize: '12px'
},
attrs: { type: 'close' },
onclick: (e: any) => {
if ((_.get(e, 'target.__vnode.type', '') as string) == 'i' && !isMobile()) {
messageRef.value()
}
}
})
let container = h('span', {}, [innerText, innerIcon])
// app增加删除按钮
let innerTextApp = h(
'span',
{ style: { textAlign: 'left', width: '90%', display: 'inline-block' } },
content
)
let innerIconApp = createVNode(
'i',
{
class: 'icon-guanbi_close',
style: {},
attrs: { type: 'close' }
},
(onclick = (e: any) => {
if ((_.get(e, 'target.__vnode.type', '') as string) == 'i' && isMobile()) {
closeNotify()
}
})
)
let containerApp = h('span', { style: { width: '100%' } }, [innerText, innerIcon]) as any
const messageRef = ref()
switch (type) {
case 'success':
if (isMobile()) {
showNotify({ type: 'success', message: containerApp, duration: time * 1000 })
} else {
messageRef.value = message.success(container, time)
}
break
case 'warning':
case 'warn':
if (isMobile()) {
showNotify({ type: 'warning', message: containerApp, duration: time * 1000 })
} else {
messageRef.value = message.warning(container, time)
}
break
case 'error':
if (isMobile()) {
showNotify({ type: 'danger', message: containerApp, duration: time * 1000 })
} else {
messageRef.value = message.error(container, time)
}
break
case 'info':
if (isMobile()) {
showNotify({ type: 'primary', message: containerApp, duration: time * 1000 })
} else {
messageRef.value = message.info(container, time)
}
break
default:
if (isMobile()) {
showNotify({ type: 'primary', message: containerApp, duration: time * 1000 })
} else {
messageRef.value = message.info(container, time)
}
}
}
antd vue message提示自定义删除按钮
猜你喜欢
转载自blog.csdn.net/weixin_53841730/article/details/131787023
今日推荐
周排行