프리티어 변경

필터링 AND OR 조건 추가
데이터 JSON 구조 변경
(오류 발생 리스트 형식 안나오는중)

scripts/state.js

@@ -33,6 +33,8 @@ export const state = {
     /** 화면 보기 모드 ('grid' | 'table') */
     viewMode: 'grid',
 
+    tagMode: 'AND', // 태그 필터링 모드 ('AND' 또는 'OR')
+
     /** 장바구니/내보내기 등을 위해 선택된 상품 ID 세트 (세션 스토리지 복원) */
     selectedIds: new Set(JSON.parse(sessionStorage.getItem('selectedProductIds') || '[]')),
 
@@ -60,4 +62,31 @@ export const state = {
 export function saveSelection() {
     const idsArray = Array.from(state.selectedIds);
     sessionStorage.setItem('selectedProductIds', JSON.stringify(idsArray));
-}
+}
+
+window.toggleViewMode = function (mode) {
+    // 1. 이미 해당 모드라면 실행 중단
+    if (state.viewMode === mode) return;
+
+    // 2. 상태 변경
+    state.viewMode = mode;
+
+    // 3. 버튼 UI 업데이트 (활성화된 아이콘 강조)
+    const gridBtn = document.getElementById('view-grid-btn'); // HTML의 그리드 아이콘 ID
+    const listBtn = document.getElementById('view-list-btn'); // HTML의 리스트 아이콘 ID
+
+    if (gridBtn && listBtn) {
+        if (mode === 'grid') {
+            gridBtn.classList.add('text-primary', 'dark:text-white'); // 강조색
+            listBtn.classList.remove('text-primary', 'dark:text-white');
+            listBtn.classList.add('text-slate-400'); // 비활성색
+        } else {
+            listBtn.classList.add('text-primary', 'dark:text-white');
+            gridBtn.classList.remove('text-primary', 'dark:text-white');
+            gridBtn.classList.add('text-slate-400');
+        }
+    }
+
+    // 4. 즉시 화면 다시 그리기
+    renderProducts(state.currentPage);
+};