feat: 작업자-계정 통합 및 연차/출근 관리 시스템 구축

모든 작업자가 개인 계정으로 로그인하여 본인의 연차와 출근 기록을 확인할 수 있는 시스템을 구축했습니다.

주요 기능:
- 작업자-계정 1:1 통합 (기존 작업자 자동 계정 생성)
- 연차 관리 시스템 (연도별 잔액 관리)
- 출근 기록 시스템 (일일 근태 기록)
- 나의 대시보드 페이지 (개인 정보 조회)

데이터베이스:
- workers 테이블에 salary, base_annual_leave 컬럼 추가
- work_attendance_types, vacation_types 테이블 생성
- daily_attendance_records 테이블 생성
- worker_vacation_balance 테이블 생성
- 기존 작업자 자동 계정 생성 (username: 이름 기반)
- Guest 역할 추가

백엔드 API:
- 한글→영문 변환 유틸리티 (hangulToRoman.js)
- UserRoutes에 개인 정보 조회 API 추가
  - GET /api/users/me (내 정보)
  - GET /api/users/me/attendance-records (출근 기록)
  - GET /api/users/me/vacation-balance (연차 잔액)
  - GET /api/users/me/work-reports (작업 보고서)
  - GET /api/users/me/monthly-stats (월별 통계)

프론트엔드:
- 나의 대시보드 페이지 (my-dashboard.html)
- 연차 정보 위젯 (총/사용/잔여)
- 월별 출근 캘린더
- 근무 시간 통계
- 최근 작업 보고서 목록
- 네비게이션 바에 "나의 대시보드" 메뉴 추가

배포 시 주의사항:
- 마이그레이션 실행 필요
- 자동 생성된 계정 초기 비밀번호: 1234
- 작업자들에게 첫 로그인 후 비밀번호 변경 안내 필요

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

web-ui/js/manage-user.js

@@ -208,12 +208,38 @@ async function loadUsers() {
       list.forEach(item => {
         item.access_level = accessLabels[item.access_level] || item.access_level;
         item.worker_id = item.worker_id || '-';
-        const row = createRow(item, [
-          'user_id', 'username', 'name', 'access_level', 'worker_id'
-        ], async u => {
+
+        // 행 생성
+        const tr = document.createElement('tr');
+
+        // 데이터 컬럼
+        ['user_id', 'username', 'name', 'access_level', 'worker_id'].forEach(key => {
+          const td = document.createElement('td');
+          td.textContent = item[key] || '-';
+          tr.appendChild(td);
+        });
+
+        // 작업 컬럼 (페이지 권한 버튼 + 삭제 버튼)
+        const actionTd = document.createElement('td');
+
+        // 페이지 권한 버튼 (Admin/System이 아닌 경우에만)
+        if (item.access_level !== '관리자' && item.access_level !== '시스템') {
+          const pageAccessBtn = document.createElement('button');
+          pageAccessBtn.textContent = '페이지 권한';
+          pageAccessBtn.className = 'btn btn-info btn-sm';
+          pageAccessBtn.style.marginRight = '5px';
+          pageAccessBtn.onclick = () => openPageAccessModal(item.user_id, item.username, item.name);
+          actionTd.appendChild(pageAccessBtn);
+        }
+
+        // 삭제 버튼
+        const delBtn = document.createElement('button');
+        delBtn.textContent = '삭제';
+        delBtn.className = 'btn-delete';
+        delBtn.onclick = async () => {
           if (!confirm('삭제하시겠습니까?')) return;
           try {
-            const delRes = await fetch(`${API}/auth/users/${u.user_id}`, {
+            const delRes = await fetch(`${API}/auth/users/${item.user_id}`, {
               method: 'DELETE',
               headers: getAuthHeaders()
             });
@@ -226,8 +252,11 @@ async function loadUsers() {
           } catch (error) {
             alert('🚨 삭제 중 오류 발생');
           }
-        });
-        tbody.appendChild(row);
+        };
+        actionTd.appendChild(delBtn);
+
+        tr.appendChild(actionTd);
+        tbody.appendChild(tr);
       });
     } else {
       tbody.innerHTML = '<tr><td colspan="6">데이터 형식 오류</td></tr>';
@@ -288,6 +317,195 @@ function showToast(message) {
   setTimeout(() => toast.remove(), 2000);
 }
 
+// ========== 페이지 접근 권한 관리 ==========
+
+let currentEditingUserId = null;
+let currentUserPageAccess = [];
+
+/**
+ * 페이지 권한 관리 모달 열기
+ */
+async function openPageAccessModal(userId, username, name) {
+  currentEditingUserId = userId;
+
+  const modal = document.getElementById('pageAccessModal');
+  const modalUserInfo = document.getElementById('modalUserInfo');
+  const modalUserRole = document.getElementById('modalUserRole');
+
+  modalUserInfo.textContent = `${name} (${username})`;
+  modalUserRole.textContent = `사용자 ID: ${userId}`;
+
+  try {
+    // 사용자의 페이지 접근 권한 조회
+    const res = await fetch(`${API}/users/${userId}/page-access`, {
+      headers: getAuthHeaders()
+    });
+
+    if (!res.ok) {
+      throw new Error('페이지 접근 권한을 불러오는데 실패했습니다.');
+    }
+
+    const result = await res.json();
+    if (result.success) {
+      currentUserPageAccess = result.data.pageAccess;
+      renderPageAccessList(result.data.pageAccess);
+      modal.style.display = 'block';
+    } else {
+      throw new Error(result.error || '데이터 로드 실패');
+    }
+  } catch (error) {
+    console.error('페이지 권한 로드 오류:', error);
+    alert('❌ 페이지 권한을 불러오는데 실패했습니다: ' + error.message);
+  }
+}
+
+/**
+ * 페이지 접근 권한 목록 렌더링
+ */
+function renderPageAccessList(pageAccess) {
+  const categories = {
+    dashboard: document.getElementById('dashboardPageList'),
+    management: document.getElementById('managementPageList'),
+    common: document.getElementById('commonPageList')
+  };
+
+  // 카테고리별로 초기화
+  Object.values(categories).forEach(el => {
+    if (el) el.innerHTML = '';
+  });
+
+  // 카테고리별로 그룹화
+  const grouped = pageAccess.reduce((acc, page) => {
+    if (!acc[page.category]) acc[page.category] = [];
+    acc[page.category].push(page);
+    return acc;
+  }, {});
+
+  // 각 카테고리별로 렌더링
+  Object.keys(grouped).forEach(category => {
+    const container = categories[category];
+    if (!container) return;
+
+    grouped[category].forEach(page => {
+      const pageItem = document.createElement('div');
+      pageItem.className = 'page-item';
+
+      const checkbox = document.createElement('input');
+      checkbox.type = 'checkbox';
+      checkbox.id = `page_${page.page_id}`;
+      checkbox.checked = page.can_access === 1 || page.can_access === true;
+      checkbox.dataset.pageId = page.page_id;
+
+      const label = document.createElement('label');
+      label.htmlFor = `page_${page.page_id}`;
+      label.textContent = page.page_name;
+
+      const pathSpan = document.createElement('span');
+      pathSpan.className = 'page-path';
+      pathSpan.textContent = page.page_path;
+
+      pageItem.appendChild(checkbox);
+      pageItem.appendChild(label);
+      pageItem.appendChild(pathSpan);
+
+      container.appendChild(pageItem);
+    });
+  });
+}
+
+/**
+ * 페이지 권한 변경 사항 저장
+ */
+async function savePageAccessChanges() {
+  if (!currentEditingUserId) {
+    alert('사용자 정보가 없습니다.');
+    return;
+  }
+
+  // 모든 체크박스 상태 가져오기
+  const checkboxes = document.querySelectorAll('.page-item input[type="checkbox"]');
+  const pageAccessUpdates = {};
+
+  checkboxes.forEach(checkbox => {
+    const pageId = parseInt(checkbox.dataset.pageId);
+    const canAccess = checkbox.checked;
+    pageAccessUpdates[pageId] = canAccess;
+  });
+
+  try {
+    // 변경된 페이지 권한을 서버로 전송
+    const pageIds = Object.keys(pageAccessUpdates).map(id => parseInt(id));
+    const canAccessValues = pageIds.map(id => pageAccessUpdates[id]);
+
+    // 접근 가능한 페이지
+    const accessiblePages = pageIds.filter((id, index) => canAccessValues[index]);
+    // 접근 불가능한 페이지
+    const inaccessiblePages = pageIds.filter((id, index) => !canAccessValues[index]);
+
+    // 접근 가능 페이지 업데이트
+    if (accessiblePages.length > 0) {
+      await fetch(`${API}/users/${currentEditingUserId}/page-access`, {
+        method: 'POST',
+        headers: getAuthHeaders(),
+        body: JSON.stringify({
+          pageIds: accessiblePages,
+          canAccess: true
+        })
+      });
+    }
+
+    // 접근 불가능 페이지 업데이트
+    if (inaccessiblePages.length > 0) {
+      await fetch(`${API}/users/${currentEditingUserId}/page-access`, {
+        method: 'POST',
+        headers: getAuthHeaders(),
+        body: JSON.stringify({
+          pageIds: inaccessiblePages,
+          canAccess: false
+        })
+      });
+    }
+
+    showToast('✅ 페이지 접근 권한이 저장되었습니다.');
+    closePageAccessModal();
+  } catch (error) {
+    console.error('페이지 권한 저장 오류:', error);
+    alert('❌ 페이지 권한 저장에 실패했습니다: ' + error.message);
+  }
+}
+
+/**
+ * 페이지 권한 관리 모달 닫기
+ */
+function closePageAccessModal() {
+  const modal = document.getElementById('pageAccessModal');
+  modal.style.display = 'none';
+  currentEditingUserId = null;
+  currentUserPageAccess = [];
+}
+
+// 모달 닫기 버튼 이벤트
+document.addEventListener('DOMContentLoaded', () => {
+  const modal = document.getElementById('pageAccessModal');
+  const closeBtn = modal?.querySelector('.close');
+
+  if (closeBtn) {
+    closeBtn.onclick = closePageAccessModal;
+  }
+
+  // 모달 외부 클릭 시 닫기
+  window.onclick = (event) => {
+    if (event.target === modal) {
+      closePageAccessModal();
+    }
+  };
+});
+
+// 전역 함수로 노출
+window.openPageAccessModal = openPageAccessModal;
+window.closePageAccessModal = closePageAccessModal;
+window.savePageAccessChanges = savePageAccessChanges;
+
 window.addEventListener('DOMContentLoaded', () => {
   loadUsers();
   loadWorkerOptions();