ypshim/Pier_v1
1
0 Fork 0
generated from disong/ITAM-test
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(view): reflect 시안 ① main screen and ⑤ save dialog

Browse Source 
- Header follows the mockup: dark bar, project line, stage chips (② shows the
  pending change count), save status, 저장 / 엑셀 불러오기 / 프로젝트 열기 and
  the primary 선택 교각 다시 생성 · 변경 n button.
- Left column: pier list with header row, 선택 n기 bulk bar, 입력값 and the
  2단계 input card. The bottom input panel is gone.
- First save opens 시안 ⑤ (project name, bridge, client, author, 좌표계, memo);
  later Ctrl+S / 저장 write the same file, as the spec's B5 requires.
- Project info (client, author, 좌표계, memo) is kept in the project file.
- Style layer uses the mockup's tokens (#18212B header, #1F5FA8 primary,
  #D5DBE2 borders, #E3EDF8 selected row, JetBrains Mono for numbers).
- Not reflected: ② and ③ screens (not built yet), and the mockup's static
  front preview (the app draws the model in 3D). Not verified in a browser.

Co-Authored-By: Claude Haiku 5.5 <noreply@anthropic.com>
This commit is contained in:
ypshimandClaude Haiku 5.5 committed 2026-10-22 09:57:02 +09:00
1 parent 0b62f694c5
commit fae8d7b9b8
3 files changed
+193 -27
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

index.html
+79 -20
View File
@@ -9,21 +9,22 @@
<div class="app">
<header class="top">
<div class="brand">
<strong>교각 설계</strong>
<span id="project-line" class="muted">프로젝트 미지정</span>
<strong>Pierzainer</strong>
<span>교각 설계</span>
<span id="project-line" class="proj">프로젝트 미지정</span>
</div>
<nav class="steps" aria-label="단계">
<span class="step current" aria-current="step">① 형상 생성 <em id="step1-status">미생성</em></span>
<span class="step" aria-disabled="true">② 형상계획 <em>예정</em></span>
<span class="step" aria-disabled="true">② 형상계획 <em id="step2-status">예정</em></span>
<span class="step" aria-disabled="true">③ 철근배근 <em>예정</em></span>
</nav>
<div class="actions">
<button id="open-import" class="btn" type="button">엑셀 불러오기</button>
<button id="open-project" class="btn" type="button">프로젝트 열기</button>
<button id="save-project" class="btn" type="button" disabled>저장 (Ctrl+S)</button>
<button id="regen" class="btn primary" type="button" disabled>선택 교각 형상 생성</button>
<span id="save-status" class="savest">저장 전</span>
<button id="save-project" class="btn-s" type="button" disabled title="프로젝트 파일 저장 (Ctrl+S)">저장</button>
<button id="open-import" class="btn-s" type="button">엑셀 불러오기</button>
<button id="open-project" class="btn-s" type="button">프로젝트 열기</button>
<button id="regen" class="btn-p" type="button" disabled>선택 교각 형상 생성</button>
<input id="project-file" type="file" accept=".json" hidden />
<span id="save-status" class="muted">저장 전</span>
</div>
</header>
@@ -36,15 +37,34 @@
<main class="grid">
<aside class="panel piers" aria-labelledby="pier-title">
<h2 id="pier-title">교각 목록</h2>
<p id="pier-title" class="lbl">교각 목록</p>
<div class="pier-tools">
<label>형식
<select id="type-filter"></select>
</label>
<button id="select-all" class="btn small" type="button">전체 선택</button>
<button id="select-all" class="lnk" type="button">전체 선택</button>
</div>
<div class="phead" aria-hidden="true"><span></span><span>교각</span><span>상태</span></div>
<ul id="pier-items" class="pier-items"></ul>
<p id="pier-empty" class="muted">불러온 교각이 없습니다.</p>
<p class="pnote">시트 1장 = 교각 1기입니다. 오류가 난 교각만 건너뛰고 나머지는 생성합니다.</p>
<div class="bulk">
<b id="bulk-count">선택 0기</b>
<span class="grow"></span>
<button id="bulk-copy" class="btn-o" type="button" disabled title="2단계에서 구현">속성 복사…</button>
<button id="bulk-regen" class="btn-o" type="button" disabled>선택 교각 다시 생성</button>
</div>
<section class="pier-input" aria-labelledby="input-title">
<p id="input-title" class="lbl">입력값</p>
<dl id="inputs" class="kv wide"></dl>
<section class="edit-card" aria-labelledby="edit-title">
<h3 id="edit-title">코핑·말뚝 입력 수정</h3>
<div id="edit-fields"></div>
<p id="edit-summary" class="muted small"></p>
<button id="edit-regen" class="btn primary" type="button" disabled>다시 생성 · 변경 0</button>
</section>
</section>
</aside>
<section class="panel viewer" aria-labelledby="viewer-title">
@@ -86,16 +106,6 @@
</aside>
</main>
<section class="panel inputs" aria-labelledby="input-title">
<h2 id="input-title">입력값</h2>
<dl id="inputs" class="kv wide"></dl>
<section class="edit-card" aria-labelledby="edit-title">
<h3 id="edit-title">코핑·말뚝 입력 수정</h3>
<div id="edit-fields"></div>
<p id="edit-summary" class="muted small"></p>
<button id="edit-regen" class="btn primary" type="button" disabled>다시 생성 · 변경 0</button>
</section>
</section>
</div>
<dialog id="import-dialog" aria-labelledby="dlg-title">
@@ -187,6 +197,55 @@
</footer>
</dialog>
<dialog id="save-dialog" aria-labelledby="sv-title">
<header class="dlg-head">
<h2 id="sv-title">프로젝트 정보 · 저장</h2>
<button id="sv-close" class="btn small" type="button">닫기</button>
</header>
<div class="dlg-body">
<div class="dlg-col">
<section>
<h3>프로젝트 정보</h3>
<label class="field">프로젝트명 · 필수
<input id="sv-name" type="text" required />
</label>
<label class="field">교량명
<input id="sv-bridge" type="text" />
</label>
<label class="field">발주처
<input id="sv-client" type="text" />
</label>
<label class="field">작성자
<input id="sv-author" type="text" />
</label>
<label class="field">좌표계
<input id="sv-crs" type="text" value="국토좌표계 (x = 동, y = 북)" readonly />
</label>
<label class="field">메모
<textarea id="sv-memo" rows="3"></textarea>
</label>
</section>
</div>
<div class="dlg-col">
<section>
<h3>프로젝트 파일로 저장</h3>
<p>파일 이름 <code id="sv-file"></code></p>
<h4>파일에 담기는 내용</h4>
<ul class="rules">
<li>프로젝트 정보와 엑셀 입력값 (교각·IP·받침)</li>
<li>교각별 기본값과 현재 입력 (기본값 대비 변경 내역)</li>
<li>3D 형상은 담지 않고, 파일을 열 때 입력값으로 다시 생성합니다</li>
</ul>
<p class="muted small">처음 저장할 때만 이 창이 열립니다. 이후에는 헤더의 저장(Ctrl+S)이 같은 파일에 바로 저장합니다.</p>
</section>
</div>
</div>
<footer class="dlg-foot">
<button id="sv-cancel" class="btn" type="button">취소</button>
<button id="sv-save" class="btn primary" type="button">저장</button>
</footer>
</dialog>
<script type="module" src="/src/main.ts"></script>
</body>
</html>