feat: 알림 시스템 및 시설설비 관리 기능 구현

- 알림 시스템 구축 (navbar 알림 아이콘, 드롭다운)
- 알림 수신자 설정 기능 (계정관리 페이지)
- 시설설비 관리 페이지 추가 (수리 워크플로우)
- 수리 신청 → 접수 → 처리중 → 완료 상태 관리
- 사이드바 메뉴 구조 개선 (공장 관리 카테고리)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

web-ui/js/load-navbar.js

@@ -269,6 +269,151 @@ async function updateWeather() {
   }
 }
 
+// ==========================================
+// 알림 시스템
+// ==========================================
+
+/**
+ * 알림 관련 이벤트 설정
+ */
+function setupNotificationEvents() {
+  const notificationBtn = document.getElementById('notificationBtn');
+  const notificationDropdown = document.getElementById('notificationDropdown');
+  const notificationWrapper = document.getElementById('notificationWrapper');
+
+  if (notificationBtn) {
+    notificationBtn.addEventListener('click', (e) => {
+      e.stopPropagation();
+      notificationDropdown?.classList.toggle('show');
+    });
+  }
+
+  // 외부 클릭시 드롭다운 닫기
+  document.addEventListener('click', (e) => {
+    if (notificationWrapper && notificationDropdown && !notificationWrapper.contains(e.target)) {
+      notificationDropdown.classList.remove('show');
+    }
+  });
+}
+
+/**
+ * 알림 목록 로드
+ */
+async function loadNotifications() {
+  try {
+    const token = localStorage.getItem('token');
+    if (!token) return;
+
+    const response = await fetch(`${window.API_BASE_URL}/notifications/unread`, {
+      method: 'GET',
+      headers: {
+        'Content-Type': 'application/json',
+        'Authorization': `Bearer ${token}`
+      }
+    });
+
+    if (!response.ok) return;
+
+    const result = await response.json();
+    if (result.success) {
+      const notifications = result.data || [];
+      updateNotificationBadge(notifications.length);
+      renderNotificationList(notifications);
+    }
+  } catch (error) {
+    console.warn('알림 로드 오류:', error.message);
+  }
+}
+
+/**
+ * 배지 업데이트
+ */
+function updateNotificationBadge(count) {
+  const badge = document.getElementById('notificationBadge');
+  const btn = document.getElementById('notificationBtn');
+  if (!badge) return;
+
+  if (count > 0) {
+    badge.textContent = count > 99 ? '99+' : count;
+    badge.style.display = 'flex';
+    btn?.classList.add('has-notifications');
+  } else {
+    badge.style.display = 'none';
+    btn?.classList.remove('has-notifications');
+  }
+}
+
+/**
+ * 알림 목록 렌더링
+ */
+function renderNotificationList(notifications) {
+  const list = document.getElementById('notificationList');
+  if (!list) return;
+
+  if (notifications.length === 0) {
+    list.innerHTML = '<div class="notification-empty">새 알림이 없습니다.</div>';
+    return;
+  }
+
+  const NOTIF_ICONS = {
+    repair: '🔧',
+    safety: '⚠️',
+    system: '📢',
+    equipment: '🔩',
+    maintenance: '🛠️'
+  };
+
+  list.innerHTML = notifications.slice(0, 5).map(n => `
+    <div class="notification-item ${n.is_read ? '' : 'unread'}" data-id="${n.notification_id}" data-url="${n.link_url || ''}">
+      <div class="notification-item-icon ${n.type || 'repair'}">
+        ${NOTIF_ICONS[n.type] || '🔔'}
+      </div>
+      <div class="notification-item-content">
+        <div class="notification-item-title">${escapeHtml(n.title)}</div>
+        <div class="notification-item-desc">${escapeHtml(n.message || '')}</div>
+      </div>
+      <div class="notification-item-time">${formatTimeAgo(n.created_at)}</div>
+    </div>
+  `).join('');
+
+  // 클릭 이벤트 추가
+  list.querySelectorAll('.notification-item').forEach(item => {
+    item.addEventListener('click', () => {
+      const linkUrl = item.dataset.url;
+      // 수리 알림은 클릭해도 읽음 처리 안함 (수리 처리 페이지에서 확인 처리)
+      window.location.href = linkUrl || '/pages/admin/notifications.html';
+    });
+  });
+}
+
+/**
+ * 시간 포맷팅
+ */
+function formatTimeAgo(dateString) {
+  const date = new Date(dateString);
+  const now = new Date();
+  const diffMs = now - date;
+  const diffMins = Math.floor(diffMs / 60000);
+  const diffHours = Math.floor(diffMs / 3600000);
+  const diffDays = Math.floor(diffMs / 86400000);
+
+  if (diffMins < 1) return '방금 전';
+  if (diffMins < 60) return `${diffMins}분 전`;
+  if (diffHours < 24) return `${diffHours}시간 전`;
+  if (diffDays < 7) return `${diffDays}일 전`;
+  return date.toLocaleDateString('ko-KR', { month: 'short', day: 'numeric' });
+}
+
+/**
+ * HTML 이스케이프
+ */
+function escapeHtml(text) {
+  if (!text) return '';
+  const div = document.createElement('div');
+  div.textContent = text;
+  return div.innerHTML;
+}
+
 // 메인 로직: DOMContentLoaded 시 실행
 document.addEventListener('DOMContentLoaded', async () => {
   if (getUser()) {
@@ -285,5 +430,10 @@ document.addEventListener('DOMContentLoaded', async () => {
     // 4. 날씨 정보 로드 (10분마다 갱신)
     updateWeather();
     setInterval(updateWeather, 10 * 60 * 1000);
+
+    // 5. 알림 이벤트 설정 및 로드 (30초마다 갱신)
+    setupNotificationEvents();
+    loadNotifications();
+    setInterval(loadNotifications, 30000);
   }
 });