feat: OTC 모달에 제품 썸네일 이미지 표시
- product_images.db에서 thumbnail_base64 조회
- drug_code로 이미지 매칭
- 이미지 없으면 💊 placeholder
This commit is contained in:
@@ -261,14 +261,40 @@
|
||||
}
|
||||
.otc-purchase-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 5px 0;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 8px 0;
|
||||
font-size: 0.85rem;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
}
|
||||
.otc-purchase-item:last-child { border-bottom: none; }
|
||||
.otc-purchase-item .name { color: #1e293b; }
|
||||
.otc-purchase-item .qty { color: #64748b; }
|
||||
.otc-purchase-item .thumb {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 6px;
|
||||
object-fit: cover;
|
||||
background: #f1f5f9;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.otc-purchase-item .thumb-placeholder {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 6px;
|
||||
background: #e2e8f0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #94a3b8;
|
||||
font-size: 1.2rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.otc-purchase-item .info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
.otc-purchase-item .name { color: #1e293b; font-weight: 500; }
|
||||
.otc-purchase-item .category { font-size: 0.75rem; color: #64748b; }
|
||||
.otc-purchase-item .qty { color: #64748b; white-space: nowrap; }
|
||||
|
||||
/* 약품 목록 */
|
||||
.medication-list {
|
||||
@@ -1118,7 +1144,14 @@
|
||||
<div class="otc-purchase-items">
|
||||
${p.items.map(item => `
|
||||
<div class="otc-purchase-item">
|
||||
<span class="name">${item.name}</span>
|
||||
${item.image
|
||||
? `<img class="thumb" src="data:image/jpeg;base64,${item.image}" alt="">`
|
||||
: `<div class="thumb-placeholder">💊</div>`
|
||||
}
|
||||
<div class="info">
|
||||
<div class="name">${item.name}</div>
|
||||
${item.category ? `<div class="category">${item.category}</div>` : ''}
|
||||
</div>
|
||||
<span class="qty">${item.quantity}개 / ${item.price.toLocaleString()}원</span>
|
||||
</div>
|
||||
`).join('')}
|
||||
|
||||
Reference in New Issue
Block a user