feat: 대시보드 조제 모달에도 AI 상호작용 체크 버튼 추가
This commit is contained in:
thug0bin
parent
16adca3646
commit
f102f6b42e
@ -999,6 +999,10 @@
|
||||
`;
|
||||
}).join('');
|
||||
|
||||
// 약품 코드 배열 (상호작용 체크용)
|
||||
const drugCodes = (rx.items || []).map(item => item.drug_code).filter(c => c);
|
||||
const drugCodesJson = JSON.stringify(drugCodes).replace(/"/g, '"');
|
||||
|
||||
html += `
|
||||
<div style="border: 1px solid #e9ecef; border-radius: 12px; margin-bottom: 12px; padding: 16px; border-left: 4px solid #6366f1;">
|
||||
<div style="display: flex; justify-content: space-between; margin-bottom: 8px;">
|
||||
@ -1009,6 +1013,14 @@
|
||||
🏥 ${rx.hospital || ''} · ${rx.doctor || ''}
|
||||
</div>
|
||||
${rx.items && rx.items.length > 0 ? `<div style="background: #f8f9fa; border-radius: 8px; padding: 12px;">${itemsHtml}</div>` : ''}
|
||||
${drugCodes.length >= 2 ? `
|
||||
<div style="margin-top: 12px; text-align: right;">
|
||||
<button onclick='checkDrugInteraction(${drugCodesJson}, "${rx.pre_serial || ""}")'
|
||||
style="background: linear-gradient(135deg, #8b5cf6, #6366f1); color: #fff; border: none; padding: 8px 14px; border-radius: 8px; font-size: 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;">
|
||||
🔬 AI 상호작용 체크
|
||||
</button>
|
||||
</div>
|
||||
` : ''}
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
@ -1710,6 +1722,162 @@
|
||||
closeAIAnalysisModal();
|
||||
}
|
||||
});
|
||||
|
||||
// ═══════════════════════════════════════════════════
|
||||
// KIMS 약물 상호작용 체크
|
||||
// ═══════════════════════════════════════════════════
|
||||
|
||||
async function checkDrugInteraction(drugCodes, preSerial) {
|
||||
// drugCodes가 문자열로 넘어올 수 있음
|
||||
if (typeof drugCodes === 'string') {
|
||||
try { drugCodes = JSON.parse(drugCodes); } catch(e) { return; }
|
||||
}
|
||||
|
||||
// 로딩 모달 표시
|
||||
showInteractionModal('loading');
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/kims/interaction-check', {
|
||||
method: 'POST',
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
body: JSON.stringify({
|
||||
drug_codes: drugCodes,
|
||||
pre_serial: preSerial
|
||||
})
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.success) {
|
||||
showInteractionModal('result', data);
|
||||
} else {
|
||||
showInteractionModal('error', data.error || '알 수 없는 오류');
|
||||
}
|
||||
} catch (err) {
|
||||
showInteractionModal('error', '서버 연결 실패: ' + err.message);
|
||||
}
|
||||
}
|
||||
|
||||
function showInteractionModal(type, data) {
|
||||
let modal = document.getElementById('interactionModal');
|
||||
if (!modal) {
|
||||
modal = document.createElement('div');
|
||||
modal.id = 'interactionModal';
|
||||
modal.style.cssText = 'position:fixed;inset:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:9999;';
|
||||
modal.onclick = (e) => { if (e.target === modal) modal.remove(); };
|
||||
document.body.appendChild(modal);
|
||||
}
|
||||
|
||||
let content = '';
|
||||
|
||||
if (type === 'loading') {
|
||||
content = `
|
||||
<div style="background:#fff;border-radius:16px;padding:40px;text-align:center;max-width:400px;">
|
||||
<div style="font-size:48px;margin-bottom:16px;">🔬</div>
|
||||
<div style="font-size:18px;font-weight:600;color:#334155;">상호작용 분석 중...</div>
|
||||
<div style="font-size:14px;color:#64748b;margin-top:8px;">KIMS 데이터베이스 조회 중</div>
|
||||
</div>
|
||||
`;
|
||||
} else if (type === 'error') {
|
||||
content = `
|
||||
<div style="background:#fff;border-radius:16px;padding:30px;max-width:400px;">
|
||||
<div style="font-size:40px;text-align:center;margin-bottom:16px;">⚠️</div>
|
||||
<div style="font-size:16px;font-weight:600;color:#dc2626;text-align:center;">분석 실패</div>
|
||||
<div style="font-size:14px;color:#64748b;margin-top:12px;text-align:center;">${escapeHtml(data)}</div>
|
||||
<div style="text-align:center;margin-top:20px;">
|
||||
<button onclick="document.getElementById('interactionModal').remove()"
|
||||
style="background:#6366f1;color:#fff;border:none;padding:10px 24px;border-radius:8px;cursor:pointer;">
|
||||
닫기
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
} else if (type === 'result') {
|
||||
const interactions = data.interactions || [];
|
||||
const drugsChecked = data.drugs_checked || [];
|
||||
|
||||
// 약품 목록 (상호작용 여부에 따른 색상)
|
||||
const drugsHtml = drugsChecked.map(d => {
|
||||
const hasInteraction = d.has_interaction;
|
||||
const bgColor = hasInteraction ? '#fef2f2' : '#f1f5f9';
|
||||
const borderColor = hasInteraction ? '#fca5a5' : '#e2e8f0';
|
||||
const textColor = hasInteraction ? '#dc2626' : '#334155';
|
||||
const icon = hasInteraction ? '⚠️ ' : '';
|
||||
return `<span style="display:inline-block;background:${bgColor};border:1px solid ${borderColor};color:${textColor};padding:4px 8px;border-radius:4px;margin:2px;font-size:12px;">${icon}${escapeHtml(d.name.slice(0,20))}</span>`;
|
||||
}).join('');
|
||||
|
||||
// 상호작용 목록
|
||||
let interactionsHtml = '';
|
||||
if (interactions.length === 0) {
|
||||
interactionsHtml = `
|
||||
<div style="text-align:center;padding:30px;">
|
||||
<div style="font-size:48px;margin-bottom:12px;">✅</div>
|
||||
<div style="font-size:16px;font-weight:600;color:#10b981;">상호작용 없음</div>
|
||||
<div style="font-size:13px;color:#64748b;margin-top:8px;">
|
||||
${data.total_pairs}개 약품 조합을 검사했습니다.<br>
|
||||
주의가 필요한 상호작용이 발견되지 않았습니다.
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
} else {
|
||||
interactionsHtml = interactions.map(item => `
|
||||
<div style="background:#fff;border:1px solid ${item.severity_color};border-radius:12px;padding:16px;margin-bottom:12px;">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;">
|
||||
<span style="font-weight:600;color:#334155;">
|
||||
${escapeHtml(item.drug1_name?.slice(0,20) || '')} ↔ ${escapeHtml(item.drug2_name?.slice(0,20) || '')}
|
||||
</span>
|
||||
<span style="background:${item.severity_color};color:#fff;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500;">
|
||||
${item.severity_text}
|
||||
</span>
|
||||
</div>
|
||||
${item.description ? `
|
||||
<div style="font-size:13px;color:#475569;margin-bottom:8px;line-height:1.5;">
|
||||
📋 ${escapeHtml(item.description)}
|
||||
</div>
|
||||
` : ''}
|
||||
${item.management ? `
|
||||
<div style="font-size:12px;color:#059669;background:#ecfdf5;padding:8px 12px;border-radius:6px;">
|
||||
💡 ${escapeHtml(item.management.slice(0, 150))}...
|
||||
</div>
|
||||
` : ''}
|
||||
</div>
|
||||
`).join('');
|
||||
}
|
||||
|
||||
content = `
|
||||
<div style="background:#f8fafc;border-radius:20px;max-width:500px;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;">
|
||||
<div style="background:linear-gradient(135deg,#8b5cf6,#6366f1);padding:20px 24px;color:#fff;">
|
||||
<div style="font-size:18px;font-weight:700;display:flex;align-items:center;gap:10px;">
|
||||
🔬 약물 상호작용 분석
|
||||
</div>
|
||||
<div style="font-size:13px;opacity:0.9;margin-top:6px;">
|
||||
${drugsChecked.length}개 약품 · ${data.total_pairs}개 조합 검사
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding:16px 20px;border-bottom:1px solid #e2e8f0;">
|
||||
<div style="font-size:12px;color:#64748b;margin-bottom:6px;">분석 약품</div>
|
||||
${drugsHtml}
|
||||
</div>
|
||||
<div style="flex:1;overflow-y:auto;padding:16px 20px;">
|
||||
${interactions.length > 0 ? `
|
||||
<div style="font-size:13px;color:#dc2626;font-weight:600;margin-bottom:12px;">
|
||||
⚠️ ${interactions.length}건의 상호작용 발견
|
||||
</div>
|
||||
` : ''}
|
||||
${interactionsHtml}
|
||||
</div>
|
||||
<div style="padding:16px 20px;border-top:1px solid #e2e8f0;text-align:center;">
|
||||
<button onclick="document.getElementById('interactionModal').remove()"
|
||||
style="background:#6366f1;color:#fff;border:none;padding:12px 32px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;">
|
||||
닫기
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
modal.innerHTML = content;
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Lottie 애니메이션 라이브러리 (로컬) -->
|
||||
|
||||
Loading…
Reference in New Issue
Block a user