antd vue message提示自定义删除按钮


// 通用提示信息--带删除
/**
 *
 * @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)
      }
  }
}

猜你喜欢

转载自blog.csdn.net/weixin_53841730/article/details/131787023