index.html 2.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>HealthRecordAgent</title>
  6. <link rel="stylesheet" href="style.css">
  7. <style>
  8. .container { max-width: 800px; margin: auto; padding: 20px; font-family: sans-serif; }
  9. h1 { text-align: center; margin-bottom: 30px; }
  10. .card { background: #f7f7f7; padding: 20px; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 2px 6px rgba(0,0,0,0.1); }
  11. textarea { width: 100%; height: 120px; padding: 10px; border-radius: 4px; border: 1px solid #ccc; resize: vertical; }
  12. input[type="file"] { width: 100%; padding: 6px; }
  13. button { padding: 8px 16px; border: none; border-radius: 4px; background-color: #007bff; color: white; cursor: pointer; }
  14. button:hover { background-color: #0056b3; }
  15. .flex-row { display: flex; gap: 20px; flex-wrap: wrap; }
  16. .flex-column { display: flex; flex-direction: column; gap: 10px; flex: 1; }
  17. #analysis { margin-top: 10px; font-weight: bold; }
  18. #report { margin-top: 15px; white-space: pre-wrap; }
  19. #progressList { margin-top: 10px; padding-left: 20px; list-style: none; }
  20. #progressList li { margin-bottom: 5px; }
  21. .hidden { display: none; }
  22. </style>
  23. </head>
  24. <body>
  25. <div class="container">
  26. <h1>HealthRecordAgent 多Agent健康分析系统</h1>
  27. <div class="card">
  28. <h2>📄 输入体检报告或上传 PDF</h2>
  29. <div class="flex-row">
  30. <!-- 左边:文字输入 -->
  31. <div class="flex-column">
  32. <label>📝 文本报告输入</label>
  33. <textarea id="reportText" placeholder="请输入体检报告内容..."></textarea>
  34. <button onclick="analyze()">💡 分析文本报告</button>
  35. </div>
  36. <!-- 右边:PDF 上传 -->
  37. <div class="flex-column">
  38. <label>📄 PDF 报告上传</label>
  39. <input type="file" id="pdfFile" accept=".pdf" />
  40. <button onclick="uploadPDF()">💡 分析 PDF 报告</button>
  41. </div>
  42. </div>
  43. <!-- 分析状态显示 -->
  44. <div id="analysis"> </div>
  45. <ul id="progressList" class="hidden"></ul>
  46. </div>
  47. <!-- 分析结果 -->
  48. <div id="resultCard" class="card hidden">
  49. <h2>📊 分析结果</h2>
  50. <div id="report"></div>
  51. </div>
  52. </div>
  53. <script src="app.js"></script>
  54. </body>
  55. </html>