logpm_page/src/utils/poptxt.js

import { ElMessage } from 'element-plus' // 引入 ElMessage 组件
export function popmsg(res) {
    // 显示成功消息
    if (res.msg == '导入成功') {
      ElMessage({
        message: res.msg,
        type: 'success',
      });
      return;
    }else{

   
    // 创建包含 p 标签的内容的 div 元素
    var fragment = document.createDocumentFragment();
    var div = document.createElement('div');
    div.id = 'createdDiv';
    var timeout; // 用于设置定时器
    // 设置 div 样式
    div.style.zIndex = '9999';
    div.style.position = 'fixed';
    div.style.fontSize = '16px';
    div.style.top = '50%';
    div.style.left = '50%';
    div.style.transform = 'translate(-50%, -50%)';
    div.style.width = '50%';
    div.style.height = '200px';
    div.style.backgroundColor = '#ffffff';
    div.style.borderRadius = '4px';
    div.style.overflow = 'scroll';
    div.style.border = '1px solid #ccc';
    div.style.padding = '10px';
    // 将后端返回的内容作为 HTML 插入到 div 中
    div.innerHTML = res.msg;
    // 遍历所有的 <p> 标签并设置首行缩进
    var pTags = div.querySelectorAll('p');
    pTags.forEach(function (pTag) {
      pTag.style.textIndent = '2em';
    });
    fragment.appendChild(div);
    // 添加鼠标事件监听
    // div.addEventListener('mouseover', function () {
    //   clearTimeout(timeout); // 清除自动消失的定时器
    // });

    // div.addEventListener('mouseout', function () {
    //   timeout = setTimeout(function () {
    //     div.remove(); // 3 秒后自动消失
    //   }, 3000);
    // });

    document.body.appendChild(fragment);

    // 初始化定时器
    // timeout = setTimeout(function () {
    //   div.remove(); // 自动消失
    // }, 3000);
    function closePopupOnClickOutside(event) {
      if (div && !div.contains(event.target)) {
        div.remove(); // 点击弹窗之外的地方，移除弹窗
        document.removeEventListener('click', closePopupOnClickOutside); // 移除监听器
      }
    }

    // 添加点击事件监听
    document.addEventListener('click', closePopupOnClickOutside);
  }
  }