fix(project): 프로젝트 상세 진입 시 기본 화면을 보드(세션)로

지금까지 프로젝트를 선택해도 기본 탭이 "달력"이라 가운데 화면에 세션이
바로 안 보였다(아사나는 프로젝트 진입 시 보드/리스트가 기본). 탭 순서를
보드·리스트·달력·타임라인으로 바꾸고 보드를 기본 활성 탭으로.

달력 이전/다음달 이동은 페이지를 통째로 새로고침하므로(?y=&m=), 마지막
탭을 localStorage(pj_view)에 기억해뒀다가 복원한다 — 안 그러면 달력을
보다가 월 이동만 해도 매번 보드로 튕겨나간다.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-15 19:50:20 +09:00
parent 3e4883854d
commit 86558dc8c1
4 changed files with 31 additions and 12 deletions
@@ -45,5 +45,5 @@
{% endif %} {% endif %}
</div> </div>
<script src="/static/project.js?v=20260916a" defer></script> <script src="/static/project.js?v=20260916b" defer></script>
{% endblock %} {% endblock %}
@@ -349,5 +349,5 @@
<script> <script>
window.PJ_COLORS = {{ ["#4573d2","#37a3a3","#62a420","#e8a33d","#e8384f","#aa62e3","#f06a6a","#5a6772"] | tojson }}; window.PJ_COLORS = {{ ["#4573d2","#37a3a3","#62a420","#e8a33d","#e8384f","#aa62e3","#f06a6a","#5a6772"] | tojson }};
</script> </script>
<script src="/static/project.js?v=20260916a" defer></script> <script src="/static/project.js?v=20260916b" defer></script>
{% endblock %} {% endblock %}
@@ -113,10 +113,10 @@
<section class="pj-main"> <section class="pj-main">
<div class="pj-toolbar"> <div class="pj-toolbar">
<div class="pj-view-tabs" id="pj-view-tabs"> <div class="pj-view-tabs" id="pj-view-tabs">
<button type="button" class="pj-tab is-active" data-view="calendar">달력</button> <button type="button" class="pj-tab is-active" data-view="board">보드</button>
<button type="button" class="pj-tab" data-view="timeline">타임라인</button>
<button type="button" class="pj-tab" data-view="board">보드</button>
<button type="button" class="pj-tab" data-view="list">리스트</button> <button type="button" class="pj-tab" data-view="list">리스트</button>
<button type="button" class="pj-tab" data-view="calendar">달력</button>
<button type="button" class="pj-tab" data-view="timeline">타임라인</button>
</div> </div>
<!-- 아사나처럼 기본은 "이 프로젝트"만 보여준다. 전체 프로젝트 보기는 <!-- 아사나처럼 기본은 "이 프로젝트"만 보여준다. 전체 프로젝트 보기는
예전처럼 접근 가능한 모든 프로젝트를 합쳐서 보여주는 모드. --> 예전처럼 접근 가능한 모든 프로젝트를 합쳐서 보여주는 모드. -->
@@ -127,7 +127,7 @@
</div> </div>
<!-- 달력 (휴가 모듈과 동일한 월간 그리드) --> <!-- 달력 (휴가 모듈과 동일한 월간 그리드) -->
<div class="pj-view" data-view="calendar"> <div class="pj-view" data-view="calendar" hidden>
<div class="pj-cal-head"> <div class="pj-cal-head">
<a class="pj-btn pj-nav-btn" href="/project/p/{{ project.id }}?y={{ prev_y }}&m={{ prev_m }}"></a> <a class="pj-btn pj-nav-btn" href="/project/p/{{ project.id }}?y={{ prev_y }}&m={{ prev_m }}"></a>
<h2 class="pj-cal-title">{{ year }}년 {{ month }}월</h2> <h2 class="pj-cal-title">{{ year }}년 {{ month }}월</h2>
@@ -164,8 +164,8 @@
<div class="pj-view" data-view="timeline" hidden> <div class="pj-view" data-view="timeline" hidden>
<div id="pj-timeline"></div> <div id="pj-timeline"></div>
</div> </div>
<!-- 보드(칸반) --> <!-- 보드(칸반=세션) — 아사나처럼 프로젝트에 들어오면 기본으로 보이는 화면 -->
<div class="pj-view" data-view="board" hidden> <div class="pj-view" data-view="board">
<div class="pj-board" id="pj-board"></div> <div class="pj-board" id="pj-board"></div>
</div> </div>
<!-- 리스트 --> <!-- 리스트 -->
@@ -331,5 +331,5 @@
</script> </script>
<script src="/static/vendor/vis-timeline/vis-timeline-graph2d.min.js"></script> <script src="/static/vendor/vis-timeline/vis-timeline-graph2d.min.js"></script>
<script src="/static/project.js?v=20260916a" defer></script> <script src="/static/project.js?v=20260916b" defer></script>
{% endblock %} {% endblock %}
+22 -3
View File
@@ -605,7 +605,15 @@
} }
let timeline = null; let timeline = null;
let currentView = "calendar"; // 마지막으로 보던 뷰를 기억한다 — 달력 이전/다음달 이동은 페이지를 통째로
// 새로고침하므로(?y=&m=), 기억이 없으면 달력을 보다가도 매번 기본값(보드)
// 으로 튕겨나간다.
const VIEW_KEY = "pj_view";
let currentView = "board";
try {
const saved = localStorage.getItem(VIEW_KEY);
if (saved && ["board", "list", "calendar", "timeline"].indexOf(saved) >= 0) currentView = saved;
} catch (_) {}
// ── 프로젝트 스코프 — 아사나처럼 기본은 "이 프로젝트만", "전체 프로젝트"로 // ── 프로젝트 스코프 — 아사나처럼 기본은 "이 프로젝트만", "전체 프로젝트"로
// 전환하면 예전처럼 접근 가능한 모든 프로젝트를 합쳐서 보여준다. // 전환하면 예전처럼 접근 가능한 모든 프로젝트를 합쳐서 보여준다.
@@ -633,8 +641,18 @@
v.hidden = v.dataset.view !== view; v.hidden = v.dataset.view !== view;
}); });
currentView = view; currentView = view;
try { localStorage.setItem(VIEW_KEY, view); } catch (_) {}
renderView(view); renderView(view);
}); });
// 서버가 그린 기본 탭(보드)과 기억된 탭이 다르면 화면을 맞춰준다.
if (currentView !== "board") {
tabs.querySelectorAll(".pj-tab").forEach(function (t) {
t.classList.toggle("is-active", t.dataset.view === currentView);
});
document.querySelectorAll(".pj-view").forEach(function (v) {
v.hidden = v.dataset.view !== currentView;
});
}
// ── 프로젝트 스코프 토글 ── // ── 프로젝트 스코프 토글 ──
const scopeToggle = el("pj-scope-toggle"); const scopeToggle = el("pj-scope-toggle");
@@ -1828,8 +1846,9 @@
}); });
}); });
// 최초 렌더 — 달력 막대 그리기 + 드래그 연결 // 최초 렌더 — 아사나처럼 프로젝트에 들어오면 보드(세션)가 기본 화면이다
renderCalendar(); // (달력을 보던 중이었다면 그 기억된 뷰를 그린다, 위 VIEW_KEY 복원 참고).
renderView(currentView);
// 사이드 트리에서 업무 클릭(?task=ID)으로 들어오면 해당 업무 모달 자동 열기. // 사이드 트리에서 업무 클릭(?task=ID)으로 들어오면 해당 업무 모달 자동 열기.
// 단, 처리 후 URL 에서 task 파라미터를 제거한다 — 드래그 이동 후 location.reload() // 단, 처리 후 URL 에서 task 파라미터를 제거한다 — 드래그 이동 후 location.reload()