diff --git a/app/modules/project/router.py b/app/modules/project/router.py index 506b23b..6b85579 100644 --- a/app/modules/project/router.py +++ b/app/modules/project/router.py @@ -336,9 +336,10 @@ async def index(request: Request) -> HTMLResponse: include_archived=False, member_email=None if admin else user["email"], ) - # 완료된 프로젝트는 비활성으로 맨 끝에 (홈 카드 정렬). 안정 정렬. - projects = sorted(projects, key=lambda p: 1 if p.get("status") == "completed" else 0) tree = _build_tree(projects) + # 진행중/완료 프로젝트를 구분해 별도 섹션으로 표시. + active_projects = [p for p in tree if p.get("status") != "completed"] + done_projects = [p for p in tree if p.get("status") == "completed"] # 아바타 맵: 이메일(소문자) → 구글 프로필 이미지 URL (홈 카드 업무 담당자 표시용) from app.main import user_store # noqa: WPS433 @@ -348,26 +349,29 @@ async def index(request: Request) -> HTMLResponse: if u.get("picture") } - # 프로젝트 카드에 업무 미리보기(담당자·마감일·진행률) 붙이기 — 한눈에 현황 파악용 + # 프로젝트 카드에 업무 미리보기(담당자·마감일·진행률) 붙이기 — 한눈에 현황 파악용. + # 완료 업무도 취소선으로 계속 보이도록 목록에 포함하되, 미완료를 먼저 보여준다. today_iso = today_kst().isoformat() for p in tree: p_tasks = st.list_tasks(project_id=p["id"], include_subprojects=True, limit=500) total = len(p_tasks) - done = sum(1 for t in p_tasks if t.get("completed_at")) open_tasks = [t for t in p_tasks if not t.get("completed_at")] + done_tasks = [t for t in p_tasks if t.get("completed_at")] open_tasks.sort(key=lambda t: (t.get("due_date") is None, t.get("due_date") or "", t["id"])) - for t in open_tasks: + done_tasks.sort(key=lambda t: t.get("completed_at") or "", reverse=True) + ordered_tasks = open_tasks + done_tasks + for t in ordered_tasks: t["assignee_display"] = ( t.get("assignee_name") or (t["assignee_email"].split("@")[0] if t.get("assignee_email") else "") ) d = t.get("due_date") - t["due_overdue"] = bool(d and d[:10] < today_iso) + t["due_overdue"] = bool(d and d[:10] < today_iso and not t.get("completed_at")) p["task_total"] = total - p["task_done"] = done - p["task_percent"] = round(done * 100 / total) if total else 0 - p["task_preview"] = open_tasks[:8] - p["task_more"] = max(0, len(open_tasks) - 8) + p["task_done"] = len(done_tasks) + p["task_percent"] = round(len(done_tasks) * 100 / total) if total else 0 + p["task_preview"] = ordered_tasks[:8] + p["task_more"] = max(0, len(ordered_tasks) - 8) my_tasks = st.list_tasks(assignee_email=user["email"], limit=500) # 내 업무를 프로젝트별로 묶어 트리로 표시 @@ -394,7 +398,8 @@ async def index(request: Request) -> HTMLResponse: "nav_items": build_erp_nav(user, active="project"), "page_title": "프로젝트 관리", "page_subtitle": "달력·타임라인·보드로 프로젝트를 관리하세요.", - "tree": tree, + "active_projects": active_projects, + "done_projects": done_projects, "my_projects": my_projects, "avatars": avatars, "today": today_kst().isoformat(), diff --git a/app/modules/project/templates/project/inbox.html b/app/modules/project/templates/project/inbox.html index 2b9efa2..86d84b8 100644 --- a/app/modules/project/templates/project/inbox.html +++ b/app/modules/project/templates/project/inbox.html @@ -1,7 +1,7 @@ {% extends "erp_base.html" %} {% block head_extra %} - + {% endblock %} @@ -45,5 +45,5 @@ {% endif %} - + {% endblock %} diff --git a/app/modules/project/templates/project/index.html b/app/modules/project/templates/project/index.html index ba6e802..f557814 100644 --- a/app/modules/project/templates/project/index.html +++ b/app/modules/project/templates/project/index.html @@ -1,7 +1,7 @@ {% extends "erp_base.html" %} {% block head_extra %} - + {% endblock %} @@ -10,18 +10,78 @@ data-is-super="{{ 'true' if user.is_super_admin else 'false' }}" data-me="{{ user.email }}"> + {% macro project_card(p) %} +
+ + +
+
{{ p.name }} + {% if p.status == 'completed' %}완료{% endif %} +
+ {% if p.description %}
{{ p.description }}
{% endif %} +
+ {% if p.due_date %}마감 {{ p.due_date }}{% endif %} + {% if p.task_total %}업무 {{ p.task_done }}/{{ p.task_total }}{% endif %} +
+ {% if p.task_total %} +
+
+
+ {% endif %} +
+
+ {% if is_admin %} + + {% endif %} + + {% if p.task_preview %} + + {% if p.task_more %} + +{{ p.task_more }}개 업무 더보기 + {% endif %} + {% elif p.task_total == 0 %} +
진행 중인 업무가 없습니다.
+ {% endif %} +
+ {% endmacro %} +
-

프로젝트

+

진행중인 프로젝트

- {% set done_count = tree | selectattr('status', 'equalto', 'completed') | list | length %} - {% if done_count %} - - {% endif %} notifications @@ -34,81 +94,31 @@
- {% if not tree %} + {% if not active_projects and not done_projects %}
아직 프로젝트가 없습니다. {% if is_admin %}상단의 새 프로젝트 버튼으로 만들어 보세요. {% else %}관리자가 프로젝트에 배정하면 여기에 표시됩니다.{% endif %}
+ {% elif not active_projects %} +
진행중인 프로젝트가 없습니다.
{% endif %}
+ + {% if done_projects %} +
+

완료된 프로젝트

+ +
+
+ {% for p in done_projects %}{{ project_card(p) }}{% endfor %} +
+ {% endif %}
@@ -202,5 +212,5 @@ - + {% endblock %} diff --git a/app/modules/project/templates/project/project.html b/app/modules/project/templates/project/project.html index 437c3a9..cea81e5 100644 --- a/app/modules/project/templates/project/project.html +++ b/app/modules/project/templates/project/project.html @@ -1,7 +1,7 @@ {% extends "erp_base.html" %} {% block head_extra %} - + @@ -291,5 +291,5 @@ - + {% endblock %} diff --git a/app/static/project.css b/app/static/project.css index c318c33..5cecdb8 100644 --- a/app/static/project.css +++ b/app/static/project.css @@ -44,8 +44,6 @@ .pj-project-card.is-done { background: #f6f7f8; opacity: .62; } .pj-project-card.is-done:hover { opacity: .85; } .pj-project-card.is-done .pj-project-dot { background: #9aa5b1; } -/* 완료 숨기기 토글 */ -.pj-project-grid.pj-hide-done .pj-project-card.is-done { display: none; } /* 카드 수정 버튼 */ .pj-card-edit { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; @@ -80,6 +78,8 @@ } .pj-project-task-due { font-size: 11px; color: #9aa1a9; flex: 0 0 auto; } .pj-project-task-due.is-overdue { color: #c22b10; font-weight: 700; } +.pj-project-taskrow.is-done .pj-project-task-title { text-decoration: line-through; color: #9aa1a9; } +.pj-project-taskrow.is-done .pj-project-task-ic { color: #9aa5b1; } .pj-project-more { display: block; padding: 6px 16px 12px; font-size: 12px; font-weight: 600; color: #6b7280; text-decoration: none; @@ -87,6 +87,10 @@ .pj-project-more:hover { color: #1e1f21; text-decoration: underline; } .pj-project-tasks-empty { padding: 4px 16px 14px; font-size: 12px; color: #b7bdc5; border-top: 1px solid #f0f1f3; margin-top: 2px; } +/* 완료 프로젝트 섹션 헤더 */ +.pj-section-head-done { margin-top: 22px; } +.pj-section-head-done h2 { font-size: 14px; color: #6b7280; } + .pj-home-side { border-left: 1px solid #eef0f2; padding-left: 24px; } @media (max-width: 980px) { .pj-home-side { border-left: none; padding-left: 0; } } .pj-mytask-list { list-style: none; margin: 0; padding: 0; } diff --git a/app/static/project.js b/app/static/project.js index 6ae8ff3..411ab71 100644 --- a/app/static/project.js +++ b/app/static/project.js @@ -71,18 +71,19 @@ return !!cb && cb === me; } - // ── 완료 프로젝트 숨기기 토글 (localStorage 기억) ── + // ── 완료 프로젝트 섹션 접기/펼치기 (localStorage 기억) ── const toggleBtn = el("pj-toggle-done"); - if (toggleBtn) { + const doneGrid = el("pj-project-grid-done"); + if (toggleBtn && doneGrid) { const KEY = "pj_hide_done"; function apply(hide) { - if (grid) grid.classList.toggle("pj-hide-done", hide); + doneGrid.hidden = hide; const n = toggleBtn.dataset.count; toggleBtn.textContent = hide ? "완료 " + n + "개 보기" : "완료 " + n + "개 숨기기"; } apply(localStorage.getItem(KEY) === "1"); toggleBtn.addEventListener("click", function () { - const hide = !(grid && grid.classList.contains("pj-hide-done")); + const hide = !doneGrid.hidden; try { localStorage.setItem(KEY, hide ? "1" : "0"); } catch (_) {} apply(hide); }); @@ -111,12 +112,12 @@ }); } - // ── 프로젝트 수정 모달 ── + // ── 프로젝트 수정 모달 (진행중/완료 두 그리드 모두 대상) ── const editModal = el("pj-modal-edit"); if (editModal && grid) { wireModalClose(editModal); let getEditColor = null; - grid.querySelectorAll(".pj-card-edit").forEach(function (btn) { + document.querySelectorAll(".pj-project-card .pj-card-edit").forEach(function (btn) { btn.addEventListener("click", function (e) { e.preventDefault(); e.stopPropagation(); const card = btn.closest(".pj-project-card"); @@ -148,7 +149,7 @@ }); el("pj-delete-project").addEventListener("click", async function () { const id = el("pj-e-id").value; - const card = grid.querySelector('.pj-project-card[data-id="' + id + '"]'); + const card = document.querySelector('.pj-project-card[data-id="' + id + '"]'); if (card && !canDelete(card.dataset.creator)) { alert("삭제는 만든 사람만 할 수 있습니다."); return; } if (!confirm("이 프로젝트를 삭제할까요? 안의 업무도 모두 삭제됩니다.")) return; try { await api("DELETE", "/project/api/projects/" + id); location.reload(); } @@ -1098,8 +1099,9 @@ if (newProjSide) newProjSide.addEventListener("click", async function () { const name = prompt("새 프로젝트 이름"); if (!name || !name.trim()) return; + const due = prompt("마감일 (YYYY-MM-DD, 없으면 취소 없이 비워두고 확인)") || ""; try { - await api("POST", "/project/api/projects", { name: name.trim() }); + await api("POST", "/project/api/projects", { name: name.trim(), due_date: due.trim() || null }); location.reload(); } catch (e) { alert("생성 실패: " + e.message); } }); diff --git a/docs/PROJECT_MODULE.md b/docs/PROJECT_MODULE.md index daa654b..c46f687 100644 --- a/docs/PROJECT_MODULE.md +++ b/docs/PROJECT_MODULE.md @@ -26,8 +26,10 @@ ## 3. 화면 / 뷰 -- **홈** (`/project/`): 프로젝트 카드 그리드 + "내 업무" 사이드. 관리자는 "새 프로젝트". - 각 카드에 진행률 바(완료/전체 업무)와 미완료 업무 미리보기(담당자·마감일, 최대 8건 + 더보기)를 표시해 전체 현황을 한눈에 파악. +- **홈** (`/project/`): "진행중인 프로젝트" / "완료된 프로젝트" 두 섹션으로 구분된 카드 그리드 + "내 업무" 사이드. + 관리자는 "새 프로젝트"(이름/설명/시작일/마감일/색상 지정). 완료 섹션은 접기/펼치기(localStorage 기억). + 각 카드에 진행률 바(완료/전체 업무)와 업무 미리보기(담당자·마감일, 최대 8건 + 더보기)를 표시 — + 완료된 업무도 취소선으로 계속 노출해 전체 현황을 한눈에 파악. - **프로젝트** (`/project/p/{id}`): 좌측 서브프로젝트/멤버, 우측 뷰 토글. - **달력** — FullCalendar. 업무를 시작~마감 기간으로 표시. 클릭 편집. - **타임라인** — vis-timeline(간트형). 기간 있는 업무만.