report_detail.html 2.49 KB
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>日报详情</title>
<style>
* { margin:0;padding:0;box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#f0f2f5;color:#333;padding:20px;max-width:800px;margin:0 auto; }
nav { margin-bottom:20px; }
nav a { color:#3498db;text-decoration:none;font-size:14px; }
.report-content { background:white;border-radius:8px;padding:24px;box-shadow:0 1px 2px rgba(0,0,0,0.05);line-height:1.8;white-space:pre-wrap;word-break:break-word;font-size:14px; }
.report-content h1 { font-size:22px;margin-bottom:8px; }
.report-content h2 { font-size:17px;margin-top:24px;margin-bottom:8px;border-bottom:1px solid #eee;padding-bottom:4px; }
.report-content a { color:#3498db; }
.report-content code { background:#f5f5f5;padding:2px 6px;border-radius:3px;font-size:12px; }
.report-content hr { border:none;border-top:1px solid #eee;margin:16px 0; }
.loading { text-align:center;padding:40px;color:#999; }
</style>
</head>
<body>
<nav><a href="/reports">← 返回日报列表</a></nav>
<div id="content" class="report-content"><div class="loading">加载中...</div></div>

<script>
const rid = {{ report_id }};

async function load() {
  try {
    const r = await fetch('/api/report/' + rid);
    const j = await r.json();
    if (!j.ok) {
      document.getElementById('content').innerHTML = '<div class="loading">日报不存在</div>';
      return;
    }
    document.title = j.data.chatroom_name + ' - ' + j.data.report_date;
    document.getElementById('content').innerHTML = renderMd(j.data.content);
  } catch(e) {
    document.getElementById('content').innerHTML = '<div class="loading">加载失败</div>';
  }
}

function renderMd(md) {
  if (!md) return '';
  // 简单 md → html
  let html = md
    .replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;')
    .replace(/^### (.+)$/gm,'<h3>$1</h3>')
    .replace(/^## (.+)$/gm,'<h2>$1</h2>')
    .replace(/^# (.+)$/gm,'<h1>$1</h1>')
    .replace(/^- (.+)$/gm,'<li>$1</li>')
    .replace(/\*\*(.+?)\*\*/g,'<strong>$1</strong>')
    .replace(/\[(.+?)\]\((.+?)\)/g,'<a href="$2" target="_blank">$1</a>')
    .replace(/^---$/gm,'<hr>')
    .replace(/\n\n/g,'</p><p>')
    .replace(/\n/g,'<br>');
  html = '<p>' + html + '</p>';
  html = html.replace(/<li>/g, '<ul><li>').replace(/<\/li>/g, '</li></ul>');
  html = html.replace(/<\/ul><ul>/g, '');
  return html;
}

load();
</script>
</body>
</html>