[260211] 상품 컨디션 정의

- 가격 누락 복구
This commit is contained in:
2026-02-11 00:27:42 +09:00
parent 526d310ac9
commit b268a97e0f
45 changed files with 451 additions and 261 deletions

View File

@@ -72,3 +72,15 @@ export const SEARCH_CONFIG = {
USE_DESCRIPTION: true, // 요약 설명 검색
USE_FULL_DESCRIPTION: false, // 상세 설명 배열 검색
};
/** 상품 컨디션(specs.condition) 정의 */
export const PRODUCT_CONDITIONS = {
BRAND_NEW: { label: 'Brand New (미개봉)', color: 'text-emerald-600', level: 'S' },
LIKE_NEW: { label: 'Like New (단순개봉)', color: 'text-blue-600', level: 'A+' },
EXCELLENT: { label: 'Excellent (최상급)', color: 'text-sky-600', level: 'A' },
GOOD: { label: 'Good (보통/사용감)', color: 'text-slate-600', level: 'B' },
INCOMPLETE: { label: 'Incomplete (구성품 누락)', color: 'text-amber-600', level: 'C' },
DAMAGED: { label: 'Damaged (하자/파손)', color: 'text-orange-600', level: 'D' },
JUNK: { label: 'Junk (동작불가/부품용)', color: 'text-red-600', level: 'F' },
OTHER: { label: '기타 (상세설명 참고)', color: 'text-indigo-600', level: '-' }
};

View File

@@ -1,6 +1,6 @@
/** 상품 그리드·페이지네이션 렌더링 */
import { state } from './state.js';
import { ITEMS_PER_PAGE, STATUS_META, STATUS_COLOR } from './config.js';
import { ITEMS_PER_PAGE, STATUS_META, STATUS_COLOR, PRODUCT_CONDITIONS } from './config.js';
import { updateSummary } from './main.js';
export function renderProducts(page = 1) {
@@ -73,7 +73,10 @@ export function renderProducts(page = 1) {
</div>
</div>
<div class="flex flex-col gap-1">
<h3 class="text-slate-900 dark:text-white text-base font-semibold leading-tight ${isSold ? 'line-through text-slate-400' : ''}">${product.title}</h3>
<div class="flex flex-col sm:flex-row justify-between items-start gap-1">
<h3 class="text-slate-900 dark:text-white text-base font-semibold leading-tight break-keep ${isSold ? 'line-through text-slate-400' : ''}">${product.title}</h3>
<p class="text-slate-900 dark:text-white text-base font-bold text-nowrap">${product.currency}${product.price.toLocaleString()}</p>
</div>
<p class="text-slate-500 dark:text-slate-400 text-sm font-normal line-clamp-1">${product.description}</p>
</div>
</div>
@@ -85,23 +88,39 @@ export function renderProducts(page = 1) {
tableBody.innerHTML = pagedProducts
.map((product) => {
const isSelectable = STATUS_META[product.status]?.selectable !== false;
const conditionKey = product.specs.condition;
const conditionConfig = PRODUCT_CONDITIONS[conditionKey];
let conditionDisplay = '';
let conditionClass = 'text-slate-500';
if (conditionConfig) {
// 1. 정의된 Key인 경우 (추천 방식)
conditionDisplay = conditionConfig.label;
conditionClass = conditionConfig.color;
} else if (conditionKey && conditionKey.trim() !== '') {
// 2. 정의되지 않았지만 텍스트가 있는 경우 (기존 수기 입력 데이터)
conditionDisplay = conditionKey;
} else {
// 3. 데이터가 비어있는 경우
conditionDisplay = '상세 설명 참고 ';
conditionClass = 'text-indigo-500 italic';
}
return `
<tr class="hover:bg-slate-50 dark:hover:bg-slate-800/50 transition-colors cursor-pointer" onclick="if(event.target.type !== 'checkbox') openModal('${product.id}')">
<td class="py-4 px-4 text-center" onclick="event.stopPropagation()">
<input type="checkbox" class="product-check rounded border-slate-300 w-4 h-4 ${isSelectable ? 'cursor-pointer' : 'opacity-20 cursor-not-allowed'}"
${state.selectedIds.has(product.id) ? 'checked' : ''}
${isSelectable ? '' : 'disabled'}
onchange="window.toggleSelectItem('${product.id}')">
</td>
<td class="py-4 px-4 font-semibold text-slate-900 dark:text-white">${product.title}</td>
<td class="py-4 px-4 text-slate-500 text-xs">${product.category}</td>
<td class="py-4 px-4 text-right font-bold text-slate-900 dark:text-white">₩${product.price.toLocaleString()}</td>
<td class="py-4 px-4 text-center">
<span class="px-2 py-0.5 rounded text-[10px] font-bold border ${STATUS_COLOR[product.status]}">${product.status}</span>
</td>
</tr>`;
<tr class="hover:bg-slate-50 dark:hover:bg-slate-800/50 transition-colors cursor-pointer" onclick="if(event.target.type !== 'checkbox') openModal('${product.id}')">
<td class="py-4 px-4 text-center" onclick="event.stopPropagation()">
<input type="checkbox" ...>
</td>
<td class="py-4 px-4 font-semibold text-slate-900 dark:text-white">${product.title}</td>
<td class="py-4 px-4 text-xs break-keep ${conditionClass}">${conditionDisplay}</td>
<td class="py-4 px-4 text-right font-bold text-slate-900 dark:text-white">₩${product.price.toLocaleString()}</td>
<td class="hidden lg:block py-4 px-4 text-center">
<span class="px-2 py-0.5 rounded text-[10px] font-bold border ${STATUS_COLOR[product.status]}">${product.status}</span>
</td>
</tr>`;
})
.join('');
.join('');
}
// [중요] 전체 선택 체크박스 상태 동기화