jiapu/public/js/notification-pages.js

(function (root, factory) {
  // 消息模块同时支持浏览器页面和 Node 单元测试。
  if (typeof module === 'object' && module.exports) {
    module.exports = factory(root);
    return;
  }

  root.NotificationPages = factory(root);
  if (root.document) {
    root.document.addEventListener('DOMContentLoaded', function () {
      root.NotificationPages.init();
    });
  }
})(typeof globalThis !== 'undefined' ? globalThis : window, function (root) {
  'use strict';

  var documentRef = root.document;

  function normalizeList(data) {
    // 列表响应在不同接口中可能使用 rows、records、list 或 data 包裹。
    if (Array.isArray(data)) return data;
    if (!data || typeof data !== 'object') return [];
    if (Array.isArray(data.rows)) return data.rows;
    if (Array.isArray(data.records)) return data.records;
    if (Array.isArray(data.list)) return data.list;
    if (Array.isArray(data.data)) return data.data;
    return [];
  }

  function pick(item, keys, fallback) {
    var source = item || {};
    var index;
    var value;

    for (index = 0; index < keys.length; index += 1) {
      value = source[keys[index]];
      if (value !== undefined && value !== null && value !== '') return value;
    }

    return fallback || '';
  }

  function escapeHtml(value) {
    // 通知标题和正文来自接口，进入 innerHTML 前统一转义。
    return String(value === undefined || value === null ? '' : value)
      .replace(/&/g, '&amp;')
      .replace(/</g, '&lt;')
      .replace(/>/g, '&gt;')
      .replace(/"/g, '&quot;')
      .replace(/'/g, '&#39;');
  }

  function getApi() {
    return root.GenealogyApi && root.GenealogyApi.defaultClient;
  }

  function query(selector, rootNode) {
    return (rootNode || documentRef).querySelector(selector);
  }

  function queryAll(selector, rootNode) {
    return Array.prototype.slice.call((rootNode || documentRef).querySelectorAll(selector));
  }

  function showMessage(message) {
    if (root.layui && root.layui.layer) {
      root.layui.layer.msg(message);
      return;
    }

    root.alert(message);
  }

  function isRead(item) {
    var readStatus = pick(item, ['readStatus', 'status'], '');
    var readFlag = pick(item, ['readFlag', 'isRead', 'read'], '');

    if (readFlag === true || readFlag === 'true' || readFlag === 1 || readFlag === '1') return true;
    return readStatus === '1' || readStatus === 1 || readStatus === '已读';
  }

  function formatNotificationStatus(item) {
    return isRead(item) ? '已读' : '未读';
  }

  function buildNotificationRow(item) {
    // 通知字段名按接口常见命名做兼容，页面只关心标题、内容、时间和已读状态。
    var id = pick(item, ['notificationId', 'id'], '');
    var title = pick(item, ['title', 'noticeTitle', 'messageTitle'], '系统通知');
    var content = pick(item, ['content', 'message', 'noticeContent', 'summary'], '暂无通知内容');
    var time = pick(item, ['createTime', 'createdAt', 'time'], '');
    var status = formatNotificationStatus(item);
    var className = isRead(item)
      ? 'module-row notification-row'
      : 'module-row notification-row is-unread';
    var action = isRead(item)
      ? '<span class="pill">已读</span>'
      : '<button class="btn ghost" type="button" data-notification-read="' + escapeHtml(id) + '">标记已读</button>';

    return '<div class="' + className + '" data-notification-id="' + escapeHtml(id) + '">' +
      '<div><h3>' + escapeHtml(title) + '</h3><p>' + escapeHtml(time) + ' · ' + escapeHtml(content) + '</p></div>' +
      action +
      '</div>';
  }

  function renderNotifications(items) {
    var container = query('[data-notification-list]');

    if (!container) return;
    if (!items.length) {
      container.innerHTML = '<div class="api-empty">暂无消息通知</div>';
      return;
    }

    container.innerHTML = items.map(buildNotificationRow).join('');
  }

  async function loadNotifications() {
    var api = getApi();
    var container = query('[data-notification-list]');

    if (!api || !container) return;
    container.classList.add('is-loading');
    try {
      renderNotifications(normalizeList(await api.notifications()));
    } catch (error) {
      showMessage(error.message || '消息通知加载失败');
    } finally {
      container.classList.remove('is-loading');
    }
  }

  async function markRead(notificationId) {
    var api = getApi();

    if (!api || !notificationId) return;
    try {
      await api.markNotificationRead(notificationId);
      showMessage('已标记为已读');
      loadNotifications();
    } catch (error) {
      showMessage(error.message || '标记已读失败');
    }
  }

  async function markAllRead() {
    var api = getApi();

    if (!api) return;
    try {
      await api.markAllNotificationsRead();
      showMessage('已全部标记为已读');
      loadNotifications();
    } catch (error) {
      showMessage(error.message || '全部标记已读失败');
    }
  }

  function bindActions() {
    if (!documentRef) return;

    documentRef.addEventListener('click', function (event) {
      var readButton = event.target.closest('[data-notification-read]');
      var readAllButton = event.target.closest('[data-notification-read-all]');
      var refreshButton = event.target.closest('[data-notification-refresh]');

      if (readButton) {
        event.preventDefault();
        markRead(readButton.getAttribute('data-notification-read'));
      }

      if (readAllButton) {
        event.preventDefault();
        markAllRead();
      }

      if (refreshButton) {
        event.preventDefault();
        loadNotifications();
      }
    });
  }

  function init() {
    if (!documentRef) return;

    bindActions();
    loadNotifications();
  }

  return {
    normalizeList: normalizeList,
    formatNotificationStatus: formatNotificationStatus,
    buildNotificationRow: buildNotificationRow,
    renderNotifications: renderNotifications,
    init: init
  };
});