feat: 판매내역 페이지에 제품 썸네일 이미지 표시

- app.py: /api/sales-detail에서 product_images.db 조회하여 thumbnail 반환
- admin_sales_pos.html: 거래별/목록 뷰에 36x36 썸네일 표시
- 이미지 없는 제품은 📦 플레이스홀더 표시
- barcode 우선, drug_code 폴백으로 이미지 매칭
This commit is contained in:
thug0bin
2026-03-04 12:19:06 +09:00
parent 9ce7e884d7
commit fa4e87b461
6 changed files with 223 additions and 6 deletions

View File

@@ -369,13 +369,42 @@
/* 제품 셀 */
.product-cell {
display: flex;
align-items: center;
gap: 10px;
}
.product-thumb {
width: 36px;
height: 36px;
object-fit: cover;
border-radius: 6px;
background: var(--bg-secondary);
flex-shrink: 0;
}
.product-thumb-placeholder {
width: 36px;
height: 36px;
display: flex;
align-items: center;
justify-content: center;
background: var(--bg-secondary);
border-radius: 6px;
font-size: 16px;
opacity: 0.4;
flex-shrink: 0;
}
.product-info {
display: flex;
flex-direction: column;
gap: 4px;
gap: 2px;
min-width: 0;
}
.product-name {
font-weight: 600;
color: var(--text-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.product-supplier {
font-size: 11px;
@@ -796,8 +825,14 @@
<tr>
<td>
<div class="product-cell">
<span class="product-name">${escapeHtml(item.product_name)}</span>
${item.supplier ? `<span class="product-supplier">${escapeHtml(item.supplier)}</span>` : ''}
${item.thumbnail
? `<img src="data:image/jpeg;base64,${item.thumbnail}" class="product-thumb" alt="">`
: `<div class="product-thumb-placeholder">📦</div>`
}
<div class="product-info">
<span class="product-name">${escapeHtml(item.product_name)}</span>
${item.supplier ? `<span class="product-supplier">${escapeHtml(item.supplier)}</span>` : ''}
</div>
</div>
</td>
<td>${renderCode(item)}</td>
@@ -826,8 +861,14 @@
<td style="color:var(--text-secondary);font-size:12px;">${item.sale_date}</td>
<td>
<div class="product-cell">
<span class="product-name">${escapeHtml(item.product_name)}</span>
${item.supplier ? `<span class="product-supplier">${escapeHtml(item.supplier)}</span>` : ''}
${item.thumbnail
? `<img src="data:image/jpeg;base64,${item.thumbnail}" class="product-thumb" alt="">`
: `<div class="product-thumb-placeholder">📦</div>`
}
<div class="product-info">
<span class="product-name">${escapeHtml(item.product_name)}</span>
${item.supplier ? `<span class="product-supplier">${escapeHtml(item.supplier)}</span>` : ''}
</div>
</div>
</td>
<td>${renderCode(item)}</td>