king/dbx-main
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(project): 내 업무 개수 배지 - 진행/완료만, 이름 오른쪽, 하늘색/빨강

Browse Source 
전체 배지 제거하고 진행(하늘색)·완료(빨강) 두 개만 프로젝트 이름
오른쪽(.pj-mytree-head 안, 접어도 계속 보이는 자리)에 표시.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
king
2026-09-17 15:30:39 +09:00
parent 1582e9e84c
commit 48e7e0a87d
4 changed files with 23 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/modules/project/templates/project/inbox.html
+1 -1
View File
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
<link rel="stylesheet" href="/static/project.css?v=20260917x" />
<link rel="stylesheet" href="/static/project.css?v=20260917y" />
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
{% endblock %}
app/modules/project/templates/project/index.html
+7 -8
View File
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
<link rel="stylesheet" href="/static/project.css?v=20260917x" />
<link rel="stylesheet" href="/static/project.css?v=20260917y" />
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
{% endblock %}
@@ -156,13 +156,12 @@
<a class="pj-mytree-proj" href="/project/p/{{ p.id }}">
<span class="pj-mytree-proj-name">{{ p.name }}</span>
</a>
</div>
<!-- 폴더를 접어도(is-collapsed 는 .pj-mytree-tasks 만 숨김) 계속 보이도록
업무 목록과 별개 형제로 둔다. -->
<div class="pj-mytree-counts">
<span class="pj-mtc">전체<span class="pj-mtc-num pj-mtc-total">{{ p.total }}</span></span>
<span class="pj-mtc">진행<span class="pj-mtc-num pj-mtc-open">{{ p.open }}</span></span>
<span class="pj-mtc">완료<span class="pj-mtc-num pj-mtc-done">{{ p.done }}</span></span>
<!-- .pj-mytree-head 자체는 접어도(is-collapsed 는 .pj-mytree-tasks 만
숨김) 계속 보인다. -->
<span class="pj-mytree-counts">
<span class="pj-mtc-num pj-mtc-open" title="진행">{{ p.open }}</span>
<span class="pj-mtc-num pj-mtc-done" title="완료">{{ p.done }}</span>
</span>
</div>
<ul class="pj-mytree-tasks">
{% for t in p.tasks %}
app/modules/project/templates/project/project.html
+7 -8
View File
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
<link rel="stylesheet" href="/static/project.css?v=20260917x" />
<link rel="stylesheet" href="/static/project.css?v=20260917y" />
<!-- 구글 머티리얼 심볼(담당자 아이콘 등) — self-host -->
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
<!-- 타임라인 vis-timeline — self-host -->
@@ -207,13 +207,12 @@
<a class="pj-mytree-proj" href="/project/p/{{ p.id }}">
<span class="pj-mytree-proj-name">{{ p.name }}</span>
</a>
</div>
<!-- 폴더를 접어도(is-collapsed 는 .pj-mytree-tasks 만 숨김) 계속 보이도록
업무 목록과 별개 형제로 둔다. -->
<div class="pj-mytree-counts">
<span class="pj-mtc">전체<span class="pj-mtc-num pj-mtc-total">{{ p.total }}</span></span>
<span class="pj-mtc">진행<span class="pj-mtc-num pj-mtc-open">{{ p.open }}</span></span>
<span class="pj-mtc">완료<span class="pj-mtc-num pj-mtc-done">{{ p.done }}</span></span>
<!-- .pj-mytree-head 자체는 접어도(is-collapsed 는 .pj-mytree-tasks 만
숨김) 계속 보인다. -->
<span class="pj-mytree-counts">
<span class="pj-mtc-num pj-mtc-open" title="진행">{{ p.open }}</span>
<span class="pj-mtc-num pj-mtc-done" title="완료">{{ p.done }}</span>
</span>
</div>
<ul class="pj-mytree-tasks">
{% for t in p.tasks %}
app/static/project.css
+8 -10
View File
@@ -408,19 +408,17 @@
.pj-mytree-proj:hover { background: #f6f7f8; }
/* 긴 이름이 밀려도 2줄로 안 꺾이게 — 말줄임표로. */
.pj-mytree-proj-name { display: block; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 프로젝트 이름 "아래" 줄에 전체/진행/완료 개수(숫자는 색깔 있는 동그라미 안에).
.pj-mytree-tasks(업무 목록)와 형제라 폴더를 접어도(is-collapsed) 계속 보인다.
왼쪽 여백은 토글 버튼 폭(26px)만큼 줘서 프로젝트 이름과 줄을 맞춘다. */
.pj-mytree-counts { display: flex; align-items: center; gap: 7px; margin: 1px 0 4px 26px; }
.pj-mtc { display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px; color: #9aa1a9; font-weight: 600; }
/* 프로젝트 이름 오른쪽에 진행/완료 개수(숫자만, 색깔 있는 동그라미 안에).
.pj-mytree-head 자체가 폴더를 접어도(is-collapsed 는 .pj-mytree-tasks 만
숨김) 항상 보이므로 이 위치 그대로 유지된다. */
.pj-mytree-counts { display: flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.pj-mtc-num {
display: inline-flex; align-items: center; justify-content: center;
min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px;
font-size: 10px; font-weight: 800; color: #fff;
min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
font-size: 10.5px; font-weight: 800; color: #fff;
}
.pj-mtc-num.pj-mtc-total { background: #8b93a0; } /* 전체 = 중립 회색 */
.pj-mtc-num.pj-mtc-open { background: #4573d2; } /* 진행 = 파랑 */
.pj-mtc-num.pj-mtc-done { background: #37a36c; } /* 완료 = 초록 */
.pj-mtc-num.pj-mtc-open { background: #38bdf8; } /* 진행 = 하늘색 */
.pj-mtc-num.pj-mtc-done { background: #e8384f; } /* 완료 = 빨강 */
.pj-mytree-tasks { list-style: none; margin: 2px 0 0; padding: 0 0 0 8px; border-left: 2px solid #eef0f2; margin-left: 10px; }
.pj-mytree-group.is-collapsed .pj-mytree-tasks { display: none; }
.pj-mytree-task a { display: flex; align-items: flex-start; gap: 7px; padding: 6px 6px; border-radius: 7px; text-decoration: none; color: inherit; }