From d87d6eec434e41673df7ffd8bc2503e271e11f95 Mon Sep 17 00:00:00 2001 From: umsangdon Date: Thu, 8 Oct 2026 18:28:51 +0900 Subject: [PATCH] =?UTF-8?q?feat(B05):=20=EC=A2=85=EB=8B=A8=20=EC=9A=B0?= =?UTF-8?q?=ED=81=B4=EB=A6=AD=20=E2=86=92=20[=EC=B6=94=EA=B0=80]=EA=B9=8C?= =?UTF-8?q?=EC=A7=80=20=EB=81=9D=EB=82=9C=20=EC=83=81=ED=83=9C=20=E2=80=94?= =?UTF-8?q?=20=ED=95=84=EC=88=98=20=EB=B9=88=EC=B9=B8=20=EC=97=86=EB=8A=94?= =?UTF-8?q?=20=EC=A2=85=EB=A5=98=20=EB=B0=94=EB=A1=9C=20=EC=B6=94=EA=B0=80?= =?UTF-8?q?=20+=20=EA=B3=A0=EB=A5=B8=20=EC=B1=84=20=C2=B7=20=ED=8C=A8?= =?UTF-8?q?=EB=84=90=20=ED=8F=84=20=C2=B7=20=EC=98=9B=20=EC=9E=87=EA=B8=B0?= =?UTF-8?q?=20=EB=B9=84=EC=9B=80(116-1)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 패널 addAt(B05 종단 · B06 종단 · 3D 공용) = 새로 놓기(startNew)에서 시작 · 좌측 패널 열고 「구조물 배치」 폄 - 필수 빈칸 없는 종류 = [추가] 대신 누름 + 새 항목 고름(구조물 = 임시 id · A군 = 그 측점 관) - 필수 빈칸 · 노면공(확인창) · 세월교 · 물넘이포장(월류 높이 = 유량 뒤) = 폼만 · A군 임시 배치 그대로 - 시험 test_116_right_click_add(헬퍼 helper_116_right_click_add.cjs) Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01UoSr2sqvYtBf1dtQdus88s --- .../B05_Profile_UI_Structures_Panel.ts | 22 ++- .../B05_Profile_UI_Structures_Panel_AddAt.ts | 48 +++++++ .../B05_Profile_UI_Structures_Panel_Events.ts | 5 +- .../tester/helper_116_right_click_add.cjs | 126 ++++++++++++++++++ resources/tester/test_116_right_click_add.py | 114 ++++++++++++++++ 5 files changed, 302 insertions(+), 13 deletions(-) create mode 100644 B05_Profile/B05_Profile_UI_Structures_Panel_AddAt.ts create mode 100644 resources/tester/helper_116_right_click_add.cjs create mode 100644 resources/tester/test_116_right_click_add.py diff --git a/B05_Profile/B05_Profile_UI_Structures_Panel.ts b/B05_Profile/B05_Profile_UI_Structures_Panel.ts index b29842a7e..0240f6ecd 100644 --- a/B05_Profile/B05_Profile_UI_Structures_Panel.ts +++ b/B05_Profile/B05_Profile_UI_Structures_Panel.ts @@ -43,6 +43,7 @@ import { loadPipeForm as loadPipeFormInto, } from "./B05_Profile_UI_Structures_Panel_Commit"; import { renderStructureList } from "./B05_Profile_UI_Structures_List"; +import { addsAtOnce, finishAdd } from "./B05_Profile_UI_Structures_Panel_AddAt"; import { pickable, showsAnchor } from "./B05_Profile_UI_Structures_Define"; import { hiddenOptionKeys } from "./B05_Profile_UI_Structures_Define_Form"; import { stationLabel as formatStation } from "../common_util/common_util_station"; @@ -522,7 +523,7 @@ export function createStructuresSection( setSummary: (value) => summary.set(value), groupBoxes, }; - bindStructuresEvents(panelContext); + const { startNew } = bindStructuresEvents(panelContext); // 집계 항목(본체 · 옵션 그룹) — [고르기]는 21-5 모달 · 배선은 `_Structures_Groups` bindSummaryPickers({ summary, @@ -635,16 +636,12 @@ export function createStructuresSection( addAt(chainageM, typeId) { const type = typeMap().get(typeId); if (!type) return; - // 우클릭 추가 = 즉시 추가 폐지(2026-08-18 사용자 지시 — 옵션 확대로 바로 넣을 - // 수 없는 타입이 생겼다). 폼에 종류·측점을 자동으로 실어 옵션을 활성화하고, - // [추가]로 확정한다. A군은 측점이 실리는 순간 임시 배치(세부유역 미리보기)까지 - // 자동으로 진행된다. - cancelTempPipe(); - groupSelect.value = type.group; - syncTypeOptions(typeId); - typeSelect.value = typeId; - editingId = null; - selectedPipeChainage = null; + // 우클릭 = [추가]까지 끝난 상태(116-1 · 08-18 「즉시 추가 폐지」를 바꿈) — 새로 놓기에서 + // 시작해 옛 고름 · 집계 항목 · 그룹 잇기를 비우고 패널을 열어 「구조물 배치」를 폄. + // 필수 빈칸이 없으면 바로 추가 + 새 항목 고름 · 남으면 폼만(A군은 임시 배치까지). + startNew(type.group, typeId); + callbacks.onReveal?.(); + root.classList.remove("is-collapsed"); positionConfirmed = true; // 우클릭은 측점이 확정돼 들어온다 — 옵션도 바로 연다. const placement = placementOf(typeId); const step = interval(); @@ -653,11 +650,12 @@ export function createStructuresSection( anchorFields.write(chainageM, step); startFields.write(isInterval ? chainageM : null, step); endFields.write(isInterval ? chainageM + DEFAULT_INTERVAL_LENGTH_M : null, step); - memoField.value = ""; syncPlacementFields(); // 새 구조물 — 등록부 기본값을 칸에 실제 값으로(PLAN 46-7 · 사용자가 고치면 됨). renderOptionFields(); syncFacilityForm(); + if (addsAtOnce(type, optionInputs)) + return void finishAdd({ type, anchorM: chainageM, structures, commit, pick: this }); // 임시 배치도 즉시 진행(A군). if (type.managed_by) commitTempPipe(); syncButtons(); diff --git a/B05_Profile/B05_Profile_UI_Structures_Panel_AddAt.ts b/B05_Profile/B05_Profile_UI_Structures_Panel_AddAt.ts new file mode 100644 index 000000000..4e402c01a --- /dev/null +++ b/B05_Profile/B05_Profile_UI_Structures_Panel_AddAt.ts @@ -0,0 +1,48 @@ +/* ============================================================================= + * B05_Profile_UI_Structures_Panel_AddAt.ts + * 종단 우클릭 → 종류 고름 = 「[추가]까지 끝난 상태」(PLAN 116-1) — 세 길(B05 종단 · B06 종단 · + * 3D)이 함께 쓰는 패널 `addAt` 의 끝맺음. 필수 빈칸이 없는 종류는 그 측점에 바로 추가하고 + * 새 항목을 고른 채로 둠 · 남는 종류는 폼만. + * ========================================================================== */ + +import type { StructureInstance, StructureType } from "./B05_Profile_Api_Structures"; +import type { StructuresSection } from "./B05_Profile_UI_Structures_Panel_Types"; + +/** 바로 추가하지 않는 종류 — 노면공(겹침 확인창) · 세월교 · 물넘이포장(월류 높이가 유량 뒤 채워짐). */ +const FORM_ONLY = new Set(["pavement_concrete", "ford_bridge", "ford_pavement"]); + +/** 우클릭 한 번으로 [추가]까지 끝낼 수 있는지 — [추가]가 막는 빈 필수 칸이 없어야 함. */ +export function addsAtOnce( + type: StructureType, + optionInputs: ReadonlyArray<{ required: boolean; isEmpty: () => boolean }>, +): boolean { + if (FORM_ONLY.has(type.type_id)) return false; + return !optionInputs.some((entry) => entry.required && entry.isEmpty()); +} + +/** [추가]를 대신 누르고 새 항목을 고름. [추가]가 거절하면(전길이 > 기준 등) 아무것도 안 들고 + * 그 칸에 포커스가 간 폼 그대로 남음 — false. */ +export async function finishAdd(ctx: { + type: StructureType; + anchorM: number; + structures: StructureInstance[]; + commit: () => Promise; + /** 패널 — 바깥에서 고를 때와 같은 길(좌측 패널 폄 · 폼 · 목록 고름). */ + pick: Pick; +}): Promise { + if (ctx.type.managed_by) { + // 관 지점 정본 — 배수유역 재계산은 종전 [추가] 그대로. B06 은 목록에 바로 들어 여기서 고르고, + // B05 는 재계산 뒤 배수유역 패널이 새 관 고름을 다시 알려 폼이 열림. + await ctx.commit(); + ctx.pick.selectPipeByChainage(ctx.anchorM); + return true; + } + const before = new Set(ctx.structures.map((entry) => entry.structure_id)); + await ctx.commit(); // 목록 알림 → 페이지가 임시 id 를 붙여 되돌려 줌(`withLocalIds`) + const added = ctx.structures.find( + (entry) => !!entry.structure_id && !before.has(entry.structure_id), + ); + if (!added?.structure_id) return false; + ctx.pick.selectById(added.structure_id); + return true; +} diff --git a/B05_Profile/B05_Profile_UI_Structures_Panel_Events.ts b/B05_Profile/B05_Profile_UI_Structures_Panel_Events.ts index 1d0b2bbf3..15e4b2be7 100644 --- a/B05_Profile/B05_Profile_UI_Structures_Panel_Events.ts +++ b/B05_Profile/B05_Profile_UI_Structures_Panel_Events.ts @@ -36,7 +36,9 @@ export interface StructuresEventContext extends StructuresCommitContext { optionRow: HTMLElement; } -export function bindStructuresEvents(ctx: StructuresEventContext): void { +export function bindStructuresEvents(ctx: StructuresEventContext): { + startNew: (group: string, typeId?: string) => void; +} { /** 새로 놓기(54-32) — 고름 · 측점 · 강조를 풀고 군(· 종류)만 남긴 빈 기본값 폼. */ function startNew(group: string, typeId?: string): void { ctx.resetForm(); @@ -223,4 +225,5 @@ export function bindStructuresEvents(ctx: StructuresEventContext): void { }); ctx.memoField.addEventListener("change", () => ctx.liveCommit()); + return { startNew }; // 우클릭 추가도 새로 놓기에서 시작(116-1) } diff --git a/resources/tester/helper_116_right_click_add.cjs b/resources/tester/helper_116_right_click_add.cjs new file mode 100644 index 000000000..cdd739d3f --- /dev/null +++ b/resources/tester/helper_116_right_click_add.cjs @@ -0,0 +1,126 @@ +/* 116-1 우클릭 → [추가]까지 헬퍼 — `_Structures_Panel_AddAt` 판정 · 끝맺음과 `_Commit.loadForm(null)` + * (새로 놓기가 부르는 비움)을 Node 로 돌려 표준출력 JSON 한 벌로. TS 로더는 `helper_54_12_live_required.cjs` 와 같다. + */ +const fs = require("fs"); +const path = require("path"); +const ts = require(path.join(__dirname, "..", "..", "config", "node_modules", "typescript")); + +const ROOT = path.join(__dirname, "..", ".."); +const cache = new Map(); +const session = new Map(); +const fakeStorage = { + getItem: (k) => session.get(k) ?? null, + setItem: (k, v) => session.set(k, String(v)), + removeItem: (k) => session.delete(k), +}; +globalThis.window = { sessionStorage: fakeStorage, localStorage: fakeStorage }; +globalThis.sessionStorage = fakeStorage; +globalThis.localStorage = fakeStorage; +const STUBS = { "@config/config_frontend": { API_BASE_URL: "/api", API_TIMEOUT_MS: 1000 } }; + +function loadTs(file) { + const full = path.resolve(file); + if (cache.has(full)) return cache.get(full); + const js = ts.transpileModule(fs.readFileSync(full, "utf8"), { + compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2020 }, + }).outputText; + const box = { exports: {} }; + cache.set(full, box.exports); + const localRequire = (request) => { + if (STUBS[request]) return STUBS[request]; + if (request.startsWith(".")) return loadTs(path.join(path.dirname(full), `${request}.ts`)); + if (request.startsWith("@")) return new Proxy({}, { get: () => () => {} }); + return require(request); + }; + new Function("exports", "module", "require", js)(box.exports, box, localRequire); + cache.set(full, box.exports); + return box.exports; +} + +const B05 = path.join(ROOT, "B05_Profile"); +const { addsAtOnce, finishAdd } = loadTs( + path.join(B05, "B05_Profile_UI_Structures_Panel_AddAt.ts"), +); +const { loadForm } = loadTs(path.join(B05, "B05_Profile_UI_Structures_Panel_Commit.ts")); + +const entry = (required, value) => ({ required, isEmpty: () => value === "" }); +const type = (type_id, managed_by = null) => ({ type_id, group: "C", managed_by }); + +/** 목록 알림 → 페이지가 임시 id 를 붙여 패널 배열 안을 갈아 채우는 것(`withLocalIds` · `setStructures`). */ +function fakeCommit(structures, adds) { + let n = 0; + return async () => { + if (!adds) return; // [추가]가 거절 — 아무것도 안 듦 + structures.push({ structure_id: null, type_id: "retaining_wall", chainage_m: 120 }); + structures.splice( + 0, + structures.length, + ...structures.map((s) => (s.structure_id ? s : { ...s, structure_id: `local${++n}` })), + ); + }; +} + +async function finish(t, adds) { + const structures = [{ structure_id: "old1", type_id: "berm", chainage_m: 40 }]; + const picked = []; + let commits = 0; + const commit = fakeCommit(structures, adds); + const done = await finishAdd({ + type: t, + anchorM: 120, + structures, + commit: async () => (commits++, commit()), + pick: { + selectById: (id) => picked.push(["id", id]), + selectPipeByChainage: (at) => picked.push(["pipe", at]), + }, + }); + return { done, picked, commits, count: structures.length }; +} + +/** 새로 놓기(startNew → resetForm → loadForm(null))가 옛 집계 항목 · 그룹 잇기를 비우는지. */ +function clearedByNew() { + let summary = { code: "OLD", name: "옛 집계" }; + let groups = { inlet: { code: "OLD2" } }; + const station = () => ({ write() {}, clearInvalid() {} }); + const ctx = { + cancelTempPipe() {}, + setEditingId() {}, + setSelectedPipeChainage() {}, + setPositionConfirmed() {}, + interval: () => 20, + anchorFields: station(), + startFields: station(), + endFields: station(), + memoField: { value: "옛 메모" }, + renderOptionFields() {}, + setSummary: (v) => (summary = v), + groupBoxes: { set: (v) => (groups = v), setShapes() {} }, + syncFacilityForm() {}, + syncPlacementFields() {}, + syncButtons() {}, + renderList() {}, + callbacks: { onSelect() {} }, + }; + loadForm(ctx, null); + return { summary, groups, memo: ctx.memoField.value }; +} + +(async () => { + const out = { + once: { + noRequired: addsAtOnce(type("retaining_wall"), [entry(false, ""), entry(true, "L")]), + requiredEmpty: addsAtOnce(type("masonry_wet"), [entry(true, ""), entry(false, "1")]), + pavement: addsAtOnce(type("pavement_concrete"), []), + fordBridge: addsAtOnce(type("ford_bridge", "pipe_points"), []), + fordPavement: addsAtOnce(type("ford_pavement", "pipe_points"), []), + pipe: addsAtOnce(type("pipe", "pipe_points"), []), + box: addsAtOnce(type("box_culvert", "pipe_points"), []), + }, + structure: await finish(type("retaining_wall"), true), + refused: await finish(type("retaining_wall"), false), + pipe: await finish(type("pipe", "pipe_points"), true), + cleared: clearedByNew(), + }; + process.stdout.write(JSON.stringify(out)); +})(); diff --git a/resources/tester/test_116_right_click_add.py b/resources/tester/test_116_right_click_add.py new file mode 100644 index 000000000..efa21ac6d --- /dev/null +++ b/resources/tester/test_116_right_click_add.py @@ -0,0 +1,114 @@ +# -*- coding: utf-8 -*- +"""116-1 종단 우클릭 → 종류 고름 = 「[추가]까지 끝난 상태」. + +못박는 것 + - 필수 빈칸 없는 종류 = 그 측점에 바로 추가(캐시) + 새 항목을 고른 채(구조물 = 임시 id · A군 = 측점). + - 필수 빈칸 남는 종류 · 노면공(확인창) · 세월교 · 물넘이포장(월류 높이 = 유량 뒤) = 폼만. + - [추가]가 거절하면 아무것도 안 듦 · 고르지 않음. + - 새로 놓기에서 시작 — 옛 집계 항목 · 그룹 잇기 · 메모가 새 항목에 안 실림. + - 세 길(B05 종단 · B06 종단 · 3D)이 모두 패널 `addAt` 한 곳 · 패널을 열고 「구조물 배치」를 폄. + +Node 헬퍼 `helper_116_right_click_add.cjs` 가 판정 · 끝맺음 · `loadForm(null)` 을 돌림. 화면은 사용자 확인. +""" + +import json +import os +import re +import subprocess + +import pytest + +HERE = os.path.dirname(os.path.abspath(__file__)) +ROOT = os.path.abspath(os.path.join(HERE, "..", "..")) + + +def _read(*parts: str) -> str: + with open(os.path.join(ROOT, *parts), encoding="utf-8") as f: + return f.read() + + +@pytest.fixture(scope="module") +def out(): + proc = subprocess.run( + ["node", os.path.join(HERE, "helper_116_right_click_add.cjs")], + capture_output=True, + text=True, + encoding="utf-8", + timeout=60, + ) + assert proc.returncode == 0, proc.stderr + return json.loads(proc.stdout) + + +def test_필수_빈칸_없는_종류만_바로_추가(out): + once = out["once"] + assert once["noRequired"] is True + assert once["pipe"] is True and once["box"] is True + assert once["requiredEmpty"] is False + + +def test_노면공_세월교_물넘이포장은_폼만(out): + once = out["once"] + assert once["pavement"] is False + assert once["fordBridge"] is False and once["fordPavement"] is False + + +def test_구조물은_목록에_들고_새_임시_id로_고른_채(out): + s = out["structure"] + assert s["done"] is True and s["commits"] == 1 and s["count"] == 2 + assert s["picked"] == [["id", "local1"]] # 옛 항목(old1)이 아니라 새 항목 + + +def test_추가가_거절하면_고르지_않고_폼만(out): + r = out["refused"] + assert r["done"] is False and r["count"] == 1 and r["picked"] == [] + + +def test_A군은_추가_뒤_그_측점_관을_고름(out): + p = out["pipe"] + assert p["done"] is True and p["commits"] == 1 + assert p["picked"] == [["pipe", 120]] + + +def test_새로_놓기가_옛_집계_항목_그룹_잇기를_비움(out): + c = out["cleared"] + assert c["summary"] is None and c["groups"] == {} and c["memo"] == "" + + +def _add_at_body() -> str: + src = _read("B05_Profile", "B05_Profile_UI_Structures_Panel.ts") + start = src.index(" addAt(chainageM, typeId) {") + return src[start : src.index(" moveById(", start)] + + +def test_addAt_은_새로_놓기_패널_폄_후_판정(): + body = _add_at_body() + order = [ + body.index("startNew(type.group, typeId)"), + body.index("callbacks.onReveal?.()"), + body.index('root.classList.remove("is-collapsed")'), + body.index("addsAtOnce(type, optionInputs)"), + body.index("finishAdd("), + body.index("commitTempPipe()"), # 폼만 갈래 — A군 임시 배치 그대로 + ] + assert order == sorted(order) + assert "DEFAULT_INTERVAL_LENGTH_M" in body # 구간형 기본 15 m 그대로 + events = _read("B05_Profile", "B05_Profile_UI_Structures_Panel_Events.ts") + new = events[ + events.index("function startNew(") : events.index("ctx.groupSelect.addEventListener") + ] + assert "ctx.resetForm()" in new and "onListRelease" in new + assert "return { startNew }" in events + + +def test_세_길이_모두_패널_addAt_한_곳(): + profile = _read("A00_Common", "design", "design_view_profile.ts") + assert re.search( + r"onStructureTypeAdd: \(chainage, typeId\) => panel\.structures\.addAt\(", profile + ) + cross = _read("A00_Common", "design", "design_view_cross.ts") + assert "structuresPanel.addStructureAt(chainageM, typeId)" in cross + b06 = _read("B06_Section", "B06_Section_UI_Page_Structures_Panel.ts") + assert "addStructureAt: (chainageM, typeId) => section.addAt(chainageM, typeId)" in b06 + viewer = _read("B05_Profile", "B05_Profile_UI_Page_Structures.ts") + assert "onPick: (chainage, typeId) => deps.panel().structures.addAt(chainage, typeId)" in viewer