fix(project): 시간 입력란을 체크 전엔 비활성화

기존엔 pj-time-row 를 hidden 으로 숨겼으나 .pj-form-row{display:flex} 가
[hidden] 을 이겨 항상 보였다. 숨김 대신 입력란을 disabled 로 두고 '시간
지정' 체크 시 활성화하도록 변경(회색 비활성 → 체크 시 활성).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-06-25 13:41:52 +09:00
parent 7c85c147e0
commit 88ce4ee378
5 changed files with 16 additions and 12 deletions
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
<link rel="stylesheet" href="/static/project.css?v=20260625n" />
<link rel="stylesheet" href="/static/project.css?v=20260625o" />
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
{% endblock %}
@@ -45,5 +45,5 @@
{% endif %}
</div>
<script src="/static/project.js?v=20260625n" defer></script>
<script src="/static/project.js?v=20260625o" defer></script>
{% endblock %}
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
<link rel="stylesheet" href="/static/project.css?v=20260625n" />
<link rel="stylesheet" href="/static/project.css?v=20260625o" />
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
{% endblock %}
@@ -100,5 +100,5 @@
<script>
window.PJ_COLORS = {{ ["#4573d2","#37a3a3","#62a420","#e8a33d","#e8384f","#aa62e3","#f06a6a","#5a6772"] | tojson }};
</script>
<script src="/static/project.js?v=20260625n" defer></script>
<script src="/static/project.js?v=20260625o" defer></script>
{% endblock %}
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
<link rel="stylesheet" href="/static/project.css?v=20260625n" />
<link rel="stylesheet" href="/static/project.css?v=20260625o" />
<!-- 구글 머티리얼 심볼(담당자 아이콘 등) — self-host -->
<link rel="stylesheet" href="/static/vendor/material-symbols/material-symbols.css" />
<!-- 타임라인 vis-timeline — self-host -->
@@ -225,9 +225,9 @@
<label class="pj-time-toggle">
<input type="checkbox" id="pj-t-usetime" /> 시간 지정 (체크 안 하면 종일)
</label>
<div class="pj-form-row" id="pj-time-row" hidden>
<label>시작 시간<input type="time" id="pj-t-stime" /></label>
<label>마감 시간<input type="time" id="pj-t-dtime" /></label>
<div class="pj-form-row" id="pj-time-row">
<label>시작 시간<input type="time" id="pj-t-stime" disabled /></label>
<label>마감 시간<input type="time" id="pj-t-dtime" disabled /></label>
</div>
<!-- 첨부파일 (기존 업무 편집 시에만) -->
<div class="pj-task-extra" id="pj-attach-block" hidden>
@@ -297,5 +297,5 @@
</script>
<script src="/static/vendor/vis-timeline/vis-timeline-graph2d.min.js"></script>
<script src="/static/project.js?v=20260625n" defer></script>
<script src="/static/project.js?v=20260625o" defer></script>
{% endblock %}
+2
View File
@@ -184,6 +184,8 @@
.pj-time-toggle { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: #525860; margin-bottom: 12px; cursor: pointer; }
.pj-time-toggle input { width: auto; margin: 0; }
.pj-form-row input[type="time"] { display: block; width: 100%; margin-top: 5px; padding: 8px 10px; border: 1px solid #d8dce2; border-radius: 8px; font-size: 13.5px; font-family: inherit; box-sizing: border-box; }
.pj-form-row input[type="time"]:disabled { background: #f2f2f2; color: #aaa; cursor: not-allowed; }
#pj-time-row:has(input:disabled) label { color: #aaa; }
.pj-modal-actions { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.pj-modal-actions .pj-btn:last-child { }
+5 -3
View File
@@ -456,7 +456,8 @@
el("pj-t-usetime").checked = useTime;
el("pj-t-stime").value = task ? (task.start_time || "") : "";
el("pj-t-dtime").value = task ? (task.due_time || "") : "";
el("pj-time-row").hidden = !useTime;
el("pj-t-stime").disabled = !useTime;
el("pj-t-dtime").disabled = !useTime;
el("pj-delete-task").hidden = !task;
// 댓글·첨부는 기존 업무 편집 시에만
currentTaskId = task ? task.id : null;
@@ -596,9 +597,10 @@
const newTaskBtn = el("pj-new-task");
if (newTaskBtn) newTaskBtn.addEventListener("click", function () { openTaskModal(null); });
// '시간 지정' 체크 → 시간 입력란 토글
// '시간 지정' 체크 → 시간 입력란 활성/비활성
el("pj-t-usetime").addEventListener("change", function () {
el("pj-time-row").hidden = !this.checked;
el("pj-t-stime").disabled = !this.checked;
el("pj-t-dtime").disabled = !this.checked;
});
// 시간 입력란 클릭 시 즉시 시간 피커 드롭다운 열기
["pj-t-stime", "pj-t-dtime"].forEach(function (id) {