report-service/public/test.html
2025-04-15 11:38:14 +08:00

128 lines
8.4 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>体检报告预览</title>
<style>
.container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
}
.search-box {
margin-bottom: 20px;
display: flex;
gap: 10px;
}
.search-input {
padding: 8px;
font-size: 16px;
border: 1px solid #ddd;
border-radius: 4px;
flex: 1;
}
.search-button {
padding: 8px 20px;
font-size: 16px;
background: #4CAF50;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
.search-button:hover {
background: #45a049;
}
#reportContainer {
margin-top: 20px;
}
</style>
</head>
<body>
<div class="container">
<div class="search-box">
<input type="text" class="search-input" id="medicalSn" placeholder="请输入体检编号">
<button class="search-button" onclick="searchReport()">查询报告</button>
</div>
<div id="reportContainer"></div>
</div>
<script>
// 配置基础URL
const BASE_URL = 'http://192.168.1.100:8080'; // 使用与后端相同的医疗系统地址
async function searchReport() {
const medicalSn = document.getElementById('medicalSn').value;
if (!medicalSn) {
alert('请输入体检编号');
return;
}
try {
// 直接从医疗系统获取数据
const dataResponse = await fetch(`${BASE_URL}/inspect/patient/getReportAll?medicalSn=${medicalSn}`);
if (!dataResponse.ok) {
throw new Error('获取数据失败');
}
const reportData = await dataResponse.json();
console.log('获取到的报告数据:', reportData);
// 调用预览API
const previewResponse = await fetch('/api/report/preview', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(reportData) // 直接使用医疗系统返回的数据
});
if (!previewResponse.ok) {
const errorText = await previewResponse.text();
throw new Error(errorText || '预览生成失败');
}
const result = await previewResponse.text();
// 创建一个新的文档片段
const parser = new DOMParser();
const doc = parser.parseFromString(result, 'text/html');
// 获取报告容器
const reportContainer = document.getElementById('reportContainer');
// 清空容器
reportContainer.innerHTML = '';
// 提取模板中的样式
const styles = doc.querySelectorAll('style');
styles.forEach(style => {
document.head.appendChild(style.cloneNode(true));
});
// 提取模板中的脚本
const scripts = doc.querySelectorAll('script');
scripts.forEach(script => {
const newScript = document.createElement('script');
Array.from(script.attributes).forEach(attr => {
newScript.setAttribute(attr.name, attr.value);
});
newScript.textContent = script.textContent;
document.body.appendChild(newScript);
});
// 添加报告内容
const reportContent = doc.querySelector('.report-container');
if (reportContent) {
reportContainer.appendChild(reportContent);
}
} catch (error) {
console.error('查询失败:', error);
alert('查询失败: ' + error.message);
}
}
</script>
</body>
</html>