604 lines
20 KiB
HTML
604 lines
20 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>동물약 복약안내문 v2</title>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap');
|
|
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
|
|
html, body {
|
|
width: 210mm;
|
|
height: 297mm;
|
|
font-family: 'Noto Sans KR', sans-serif;
|
|
font-size: 9pt;
|
|
color: #333;
|
|
line-height: 1.4;
|
|
background: #fff;
|
|
}
|
|
|
|
.container {
|
|
width: 210mm;
|
|
min-height: 297mm;
|
|
padding: 6mm;
|
|
position: relative;
|
|
}
|
|
|
|
/* 헤더 */
|
|
.header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
border-bottom: 3px solid #1565C0;
|
|
padding-bottom: 3mm;
|
|
margin-bottom: 4mm;
|
|
}
|
|
|
|
.header-left .patient-name {
|
|
font-size: 16pt;
|
|
font-weight: 700;
|
|
color: #0D47A1;
|
|
}
|
|
|
|
.header-left .patient-info {
|
|
font-size: 8pt;
|
|
color: #666;
|
|
margin-top: 1mm;
|
|
}
|
|
|
|
.header-center {
|
|
text-align: center;
|
|
}
|
|
|
|
.header-center .pharmacy-name {
|
|
font-size: 14pt;
|
|
font-weight: 700;
|
|
color: #1565C0;
|
|
}
|
|
|
|
.header-center .pharmacy-slogan {
|
|
font-size: 8pt;
|
|
color: #42A5F5;
|
|
}
|
|
|
|
.header-right {
|
|
text-align: right;
|
|
font-size: 7pt;
|
|
color: #666;
|
|
}
|
|
|
|
/* 약품 카드 그리드 */
|
|
.drug-cards-grid {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 3mm;
|
|
}
|
|
|
|
/* 약품 카드 공통 */
|
|
.drug-card {
|
|
border: 1px solid #E0E0E0;
|
|
border-radius: 2mm;
|
|
overflow: hidden;
|
|
page-break-inside: avoid;
|
|
}
|
|
|
|
.drug-card-header {
|
|
background: linear-gradient(135deg, #1565C0, #42A5F5);
|
|
color: white;
|
|
padding: 2mm;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 2mm;
|
|
}
|
|
|
|
.drug-icon {
|
|
width: 8mm;
|
|
height: 8mm;
|
|
background: white;
|
|
border-radius: 1.5mm;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 12pt;
|
|
}
|
|
|
|
.drug-title-area {
|
|
flex: 1;
|
|
}
|
|
|
|
.drug-name {
|
|
font-size: 9pt;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.drug-subtitle {
|
|
font-size: 5pt;
|
|
opacity: 0.9;
|
|
}
|
|
|
|
.drug-badges {
|
|
display: flex;
|
|
gap: 0.5mm;
|
|
margin-top: 0.5mm;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.badge {
|
|
background: rgba(255,255,255,0.2);
|
|
padding: 0.3mm 1mm;
|
|
border-radius: 0.5mm;
|
|
font-size: 5pt;
|
|
}
|
|
|
|
.drug-card-body {
|
|
padding: 2mm;
|
|
font-size: 6pt;
|
|
}
|
|
|
|
/* 구충제 전용 - 커버리지 표 */
|
|
.coverage-section {
|
|
margin-bottom: 3mm;
|
|
}
|
|
|
|
.coverage-title {
|
|
font-size: 9pt;
|
|
font-weight: 700;
|
|
color: #1565C0;
|
|
margin-bottom: 2mm;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 1mm;
|
|
}
|
|
|
|
.coverage-table {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 1fr);
|
|
gap: 1mm;
|
|
background: #F5F5F5;
|
|
padding: 2mm;
|
|
border-radius: 2mm;
|
|
}
|
|
|
|
.coverage-item {
|
|
background: white;
|
|
padding: 1.5mm;
|
|
border-radius: 1mm;
|
|
text-align: center;
|
|
font-size: 7pt;
|
|
}
|
|
|
|
.coverage-item.covered {
|
|
border-left: 2px solid #4CAF50;
|
|
}
|
|
|
|
.coverage-item.not-covered {
|
|
border-left: 2px solid #F44336;
|
|
background: #FFEBEE;
|
|
}
|
|
|
|
.coverage-icon {
|
|
font-size: 10pt;
|
|
display: block;
|
|
}
|
|
|
|
.coverage-name {
|
|
font-weight: 500;
|
|
margin-top: 0.5mm;
|
|
}
|
|
|
|
/* 갭 경고 */
|
|
.gap-warning {
|
|
background: #FFF3E0;
|
|
border: 1px solid #FFB74D;
|
|
border-radius: 2mm;
|
|
padding: 2mm;
|
|
margin-top: 2mm;
|
|
font-size: 7pt;
|
|
}
|
|
|
|
.gap-warning-title {
|
|
font-weight: 700;
|
|
color: #E65100;
|
|
}
|
|
|
|
.gap-solution {
|
|
color: #F57C00;
|
|
margin-top: 1mm;
|
|
}
|
|
|
|
/* 투약 정보 */
|
|
.dosing-section {
|
|
background: #E3F2FD;
|
|
border-radius: 2mm;
|
|
padding: 2mm 3mm;
|
|
margin-bottom: 3mm;
|
|
}
|
|
|
|
.dosing-title {
|
|
font-weight: 700;
|
|
color: #1565C0;
|
|
font-size: 8pt;
|
|
}
|
|
|
|
.dosing-main {
|
|
font-size: 11pt;
|
|
font-weight: 700;
|
|
color: #0D47A1;
|
|
margin: 1mm 0;
|
|
}
|
|
|
|
.dosing-note {
|
|
font-size: 7pt;
|
|
color: #1976D2;
|
|
}
|
|
|
|
/* 체중별 제품 */
|
|
.weight-products {
|
|
display: flex;
|
|
gap: 1mm;
|
|
flex-wrap: wrap;
|
|
margin-top: 2mm;
|
|
}
|
|
|
|
.weight-product {
|
|
background: #E8F5E9;
|
|
padding: 1mm 2mm;
|
|
border-radius: 1mm;
|
|
font-size: 6pt;
|
|
border: 1px solid #A5D6A7;
|
|
}
|
|
|
|
/* NSAIDs 전용 - 용량표 */
|
|
.dosage-table-section {
|
|
margin-bottom: 3mm;
|
|
}
|
|
|
|
.dosage-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
gap: 1mm;
|
|
background: #E3F2FD;
|
|
padding: 2mm;
|
|
border-radius: 2mm;
|
|
}
|
|
|
|
.dosage-cell {
|
|
background: white;
|
|
padding: 1.5mm;
|
|
border-radius: 1mm;
|
|
text-align: center;
|
|
font-size: 7pt;
|
|
}
|
|
|
|
.dosage-weight {
|
|
font-weight: 500;
|
|
color: #1565C0;
|
|
}
|
|
|
|
.dosage-amount {
|
|
font-weight: 700;
|
|
color: #0D47A1;
|
|
font-size: 9pt;
|
|
}
|
|
|
|
/* 절대 금기 */
|
|
.contraindication-box {
|
|
background: #FFEBEE;
|
|
border: 2px solid #F44336;
|
|
border-radius: 2mm;
|
|
padding: 2mm 3mm;
|
|
margin-bottom: 3mm;
|
|
}
|
|
|
|
.contraindication-title {
|
|
font-weight: 900;
|
|
color: #C62828;
|
|
font-size: 9pt;
|
|
margin-bottom: 1mm;
|
|
}
|
|
|
|
.contraindication-list {
|
|
list-style: none;
|
|
}
|
|
|
|
.contraindication-list li {
|
|
font-size: 8pt;
|
|
color: #B71C1C;
|
|
padding: 1mm 0;
|
|
border-bottom: 1px dashed #FFCDD2;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 1mm;
|
|
}
|
|
|
|
.contraindication-list li:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
/* 주의사항 */
|
|
.warnings-section {
|
|
background: #FFF8E1;
|
|
border: 1px solid #FFE082;
|
|
border-radius: 2mm;
|
|
padding: 2mm 3mm;
|
|
}
|
|
|
|
.warnings-title {
|
|
font-weight: 700;
|
|
color: #F57F17;
|
|
font-size: 8pt;
|
|
margin-bottom: 1mm;
|
|
}
|
|
|
|
.warnings-list {
|
|
list-style: none;
|
|
}
|
|
|
|
.warnings-list li {
|
|
font-size: 7pt;
|
|
color: #795548;
|
|
padding: 0.5mm 0;
|
|
padding-left: 2mm;
|
|
position: relative;
|
|
}
|
|
|
|
.warnings-list li::before {
|
|
content: "•";
|
|
position: absolute;
|
|
left: 0;
|
|
color: #FF9800;
|
|
}
|
|
|
|
/* 푸터 */
|
|
.footer {
|
|
position: absolute;
|
|
bottom: 4mm;
|
|
left: 6mm;
|
|
right: 6mm;
|
|
text-align: center;
|
|
font-size: 6pt;
|
|
color: #9E9E9E;
|
|
border-top: 1px solid #E0E0E0;
|
|
padding-top: 2mm;
|
|
}
|
|
|
|
.footer-logo {
|
|
font-weight: 700;
|
|
color: #1565C0;
|
|
font-size: 8pt;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<!-- 헤더 -->
|
|
<div class="header">
|
|
<div class="header-left">
|
|
<div class="patient-name">{{ patient_name }} 보호자님</div>
|
|
<div class="patient-info">
|
|
🐾 {{ pet_name }} ({{ pet_species }}, {{ pet_age }})<br>
|
|
📅 {{ issue_date }}
|
|
</div>
|
|
</div>
|
|
<div class="header-center">
|
|
<div class="pharmacy-name">🏥 {{ pharmacy_name }}</div>
|
|
<div class="pharmacy-slogan">반려동물을 위한 전문 복약안내</div>
|
|
</div>
|
|
<div class="header-right">
|
|
{{ pharmacy_tel }}<br>
|
|
{{ pharmacy_address }}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 약품 카드들 (2x2 그리드) -->
|
|
<div class="drug-cards-grid">
|
|
{% for drug in drugs %}
|
|
<div class="drug-card">
|
|
<div class="drug-card-header">
|
|
<div class="drug-icon">💊</div>
|
|
<div class="drug-title-area">
|
|
<div class="drug-name">{{ drug.name }}</div>
|
|
<div class="drug-subtitle">{{ drug.english_name }}</div>
|
|
<div class="drug-badges">
|
|
<span class="badge">{{ drug.category_display }}</span>
|
|
{% for animal in drug.target_animal %}
|
|
<span class="badge">{{ animal }}</span>
|
|
{% endfor %}
|
|
<span class="badge">{{ drug.administration }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="drug-card-body">
|
|
{% if drug.category == 'antiparasitic' %}
|
|
<!-- 구충제 레이아웃 -->
|
|
<div class="coverage-section">
|
|
<div class="coverage-title">🎯 구충 범위</div>
|
|
<div class="coverage-table">
|
|
{% for item in drug.coverage_summary.covered %}
|
|
<div class="coverage-item covered">
|
|
<span class="coverage-icon">✅</span>
|
|
<span class="coverage-name">{{ item }}</span>
|
|
</div>
|
|
{% endfor %}
|
|
{% for item in drug.coverage_summary.not_covered %}
|
|
<div class="coverage-item not-covered">
|
|
<span class="coverage-icon">❌</span>
|
|
<span class="coverage-name">{{ item }}</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
{% if drug.coverage_summary.not_covered %}
|
|
<div class="gap-warning">
|
|
<div class="gap-warning-title">⚠️ 미커버 항목</div>
|
|
<div class="gap-solution">💡 {{ drug.coverage_summary.gap_solution }}</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="dosing-section">
|
|
<div class="dosing-title">📅 투약 주기</div>
|
|
<div class="dosing-main">{{ drug.dosing.interval }}</div>
|
|
<div class="dosing-note">
|
|
{{ drug.dosing.interval_reason }}<br>
|
|
최소 연령: {{ drug.dosing.minimum_age }} / 최소 체중: {{ drug.dosing.minimum_weight }}
|
|
</div>
|
|
|
|
{% if drug.weight_products %}
|
|
<div class="weight-products">
|
|
{% for wp in drug.weight_products %}
|
|
<div class="weight-product">{{ wp.size }} ({{ wp.weight_range }})</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% elif drug.category == 'nsaid' %}
|
|
<!-- NSAIDs 레이아웃 -->
|
|
<div class="dosage-table-section">
|
|
<div class="coverage-title">⚖️ 체중별 용량 ({{ drug.dosage.standard }})</div>
|
|
<div class="dosage-grid">
|
|
{% for row in drug.dosage_table %}
|
|
<div class="dosage-cell">
|
|
<div class="dosage-weight">{{ row.weight }}</div>
|
|
<div class="dosage-amount">{{ row.tablets }}</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
{% if drug.absolute_contraindications %}
|
|
<div class="contraindication-box">
|
|
<div class="contraindication-title">🚫 절대 금기</div>
|
|
<ul class="contraindication-list">
|
|
{% for contra in drug.absolute_contraindications %}
|
|
<li>❌ {{ contra.item }} — {{ contra.reason }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% elif drug.category == 'antibiotic' %}
|
|
<!-- 항생제 레이아웃 -->
|
|
<div class="dosing-section">
|
|
<div class="dosing-title">📋 적응증</div>
|
|
<div class="dosing-main">{{ drug.indication }}</div>
|
|
</div>
|
|
|
|
<div class="dosage-table-section">
|
|
<div class="coverage-title">⚖️ 체중별 용량 ({{ drug.dosage.standard }})</div>
|
|
<div class="dosage-grid">
|
|
{% for row in drug.dosage_table %}
|
|
<div class="dosage-cell">
|
|
<div class="dosage-weight">{{ row.weight }}</div>
|
|
<div class="dosage-amount">{{ row.tablets }}</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
<div class="dosing-note" style="margin-top:2mm;">
|
|
투약 기간: {{ drug.dosage.duration }}
|
|
</div>
|
|
</div>
|
|
|
|
{% if drug.cat_warning %}
|
|
<div class="contraindication-box">
|
|
<div class="contraindication-title">🐱 고양이 특별 주의</div>
|
|
<ul class="contraindication-list">
|
|
<li>❌ 최대 용량: {{ drug.cat_warning.max_dose }}</li>
|
|
<li>❌ 위험: {{ drug.cat_warning.risk }}</li>
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% elif drug.category == 'antiemetic' %}
|
|
<!-- 항구토제 레이아웃 -->
|
|
<div class="dosing-section">
|
|
<div class="dosing-title">📋 적응증</div>
|
|
<div class="dosing-main">{{ drug.indication }}</div>
|
|
</div>
|
|
|
|
<div class="coverage-section">
|
|
<div class="coverage-title">💊 용법용량</div>
|
|
<div class="coverage-table" style="grid-template-columns: 1fr 1fr;">
|
|
<div class="coverage-item covered">
|
|
<span class="coverage-name" style="font-weight:700;">급성 구토</span>
|
|
<span style="font-size:8pt;">{{ drug.dosage.acute_vomiting.dose }}</span>
|
|
<span style="font-size:6pt;">최대 {{ drug.dosage.acute_vomiting.duration }}</span>
|
|
</div>
|
|
<div class="coverage-item covered">
|
|
<span class="coverage-name" style="font-weight:700;">멀미 예방</span>
|
|
<span style="font-size:8pt;">{{ drug.dosage.motion_sickness.dose }}</span>
|
|
<span style="font-size:6pt;">{{ drug.dosage.motion_sickness.timing }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% if drug.clinical_notes %}
|
|
<div class="gap-warning">
|
|
<div class="gap-warning-title">💡 임상 참고</div>
|
|
{% for note in drug.clinical_notes %}
|
|
<div class="gap-solution">• {{ note }}</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% elif drug.category in ['otic', 'antifungal', 'topical'] %}
|
|
<!-- 외용제 레이아웃 -->
|
|
<div class="dosing-section">
|
|
<div class="dosing-title">📋 적응증</div>
|
|
<div class="dosing-main" style="font-size:7pt;">{{ drug.indication }}</div>
|
|
</div>
|
|
|
|
<div class="dosage-table-section">
|
|
<div class="coverage-title" style="font-size:7pt;">💊 용법</div>
|
|
<div style="font-size:6pt; background:#E8F5E9; padding:1.5mm; border-radius:1mm;">
|
|
{% if drug.dosage.frequency %}
|
|
<div><b>빈도:</b> {{ drug.dosage.frequency }}</div>
|
|
{% endif %}
|
|
{% if drug.dosage.duration %}
|
|
<div><b>기간:</b> {{ drug.dosage.duration }}</div>
|
|
{% endif %}
|
|
{% if drug.dosage.contact_time %}
|
|
<div><b>접촉시간:</b> {{ drug.dosage.contact_time }}</div>
|
|
{% endif %}
|
|
{% if drug.dosage.amount %}
|
|
<div><b>용량:</b> {{ drug.dosage.amount }}</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
{% else %}
|
|
<!-- 기본 레이아웃 -->
|
|
<div class="dosing-section">
|
|
<div class="dosing-title">📋 적응증</div>
|
|
<div class="dosing-main">{{ drug.indication }}</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- 공통: 주의사항 -->
|
|
{% if drug.warnings %}
|
|
<div class="warnings-section">
|
|
<div class="warnings-title">⚠️ 주의사항</div>
|
|
<ul class="warnings-list">
|
|
{% for warning in drug.warnings %}
|
|
<li>{{ warning }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- 푸터 -->
|
|
<div class="footer">
|
|
<div class="footer-logo">🐾 동물약 복약안내 시스템 v2</div>
|
|
※ 본 안내문은 참고용입니다. 정확한 투약은 반드시 수의사의 지시에 따라 주세요.
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|