feat(824-1): M02 왼쪽 「내 기계」 · 「내 품목」 → 「개인관리」 컨테이너(단추 「기계」 · 「자재」) · 「구조물 조합」 을 「일위대가」 바로 아래로

- 페이지 제목 「개인관리 › 기계」 · 「개인관리 › 자재」 · 동작 · 저장 그대로

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

M02_MasterTemplete/M02_MasterTemplete_UI_Side.ts

@@ -1,7 +1,7 @@
 /* =============================================================================
  * M02_MasterTemplete_UI_Side.ts
  * 마스터 템플릿 좌측 패널 차례(716-3 · 717-2a) — 「단가산출」(층 단추 따로 · 기본 개인 · `UI_Side_Sangeun`) › 「일위대가」(층 단추 따로 · 2단 폴더 나무 · `UI_Side_Precombo` ·
- * 50-3 · 134-3) › 「내 기계」 · 「내 품목」(821-3 · 개인 층 · 펼치면 가운데 화면) › 「구조물 조합」(층 단추 · 나무) › 수평 구분선 › 「일위대가 불러오기」(구조물 조합 층 ·
+ * 50-3 · 134-3) › 「구조물 조합」(층 단추 · 나무) › 「개인관리」(824-1 · 단추 「기계」 · 「자재」 · 가운데 화면) › 수평 구분선 › 「일위대가 불러오기」(구조물 조합 층 ·
  * `Hopyo_Side` · 324-4) › 「도면 양식」(새로 · 본떠 · 지우기).
  * 구조물 옵션 정의는 M01 로 옮김(716-1).
  * 도면 양식 = 시스템 관리자면 늘(마스터 층 것 · 구조물 조합 층과 무관 · 720-4).
@@ -157,17 +157,16 @@ export function buildSide(opt: SideOptions): SideHandle {
     getOpen: opt.getOpen,
   });
   const sangeunSec = section(L("M02_SangeunTitle"), sangeun.body);
-  // 내 기계 · 내 품목(821-3) — 자기 개인 층 · 펼치면 가운데 화면(목록 · 양식)
-  const hint = (key: "Side_Hint" | "Items_Side_Hint"): HTMLElement =>
-    createEmpty({ text: mt(key), small: true });
-  const myMachSec = openOnExpand(section(mt("Title"), hint("Side_Hint")), async () => {
+  // 개인관리(824-1) — 단추 「기계」 · 「자재」(821-3 · 자기 개인 층) · 누르면 가운데 화면(목록 · 양식)
+  const myMachBtn = createButton({ label: mt("Title"), variant: "ghost", size: "sm" });
+  myMachBtn.addEventListener("click", async () => {
     if (!(await opt.confirmLeave())) return;
     let mark = (_d: boolean): void => {};
     const node = buildMyMachineView({ owner: null, setDirty: (d) => mark(d) });
-    mark = opt.showView(mt("Title"), node);
+    mark = opt.showView(mt("Crumb_Machine"), node);
   });
-  myMachSec.dataset.myMachines = "";
-  const myItemsSec = openOnExpand(section(mt("Items_Title"), hint("Items_Side_Hint")), async () => {
+  const myItemsBtn = createButton({ label: mt("Items_Title"), variant: "ghost", size: "sm" });
+  myItemsBtn.addEventListener("click", async () => {
     if (!(await opt.confirmLeave())) return;
     const node = buildMyItemsView({
       owner: null,
@@ -184,8 +183,13 @@ export function buildSide(opt: SideOptions): SideHandle {
         });
       },
     });
-    opt.showView(mt("Items_Title"), node);
+    opt.showView(mt("Crumb_Items"), node);
   });
+  const personalSec = section(
+    mt("Personal_Title"),
+    el("div", { className: "m02-side__row", children: [myMachBtn, myItemsBtn] }),
+  );
+  personalSec.dataset.myMachines = "";
   // 실무자료로 일위대가를 만들었음(확인 창 · 엑셀 보기 창) → 목록 다시 · 이 패널이 내려갔으면 듣기 끝
   const onBuilt = (): void =>
     precombo.body.isConnected
@@ -205,9 +209,8 @@ export function buildSide(opt: SideOptions): SideHandle {
     children: [
       sangeunSec,
       precomboSec,
-      myMachSec,
-      myItemsSec,
       summary,
+      personalSec,
       createDivider(),
       section(hopyo.title, hopyo.body),
       drawing,

M02_MasterTemplete/M02_MasterTemplete_UI_Style.css

@@ -16,6 +16,11 @@
   gap: var(--spacing-4);
 }
 
+/* 개인관리(824-1) — 제목 아래 단추 줄 띄움 */
+[data-my-machines] > .m02-side__row {
+  margin-top: var(--spacing-12);
+}
+
 /* 일위대가 조합 서고 목록표(51-4) — 표 꼴은 M01 목록(`m01-master__grid`) · 첫 칸 = 고름 */
 .m01-master__grid .m02-lib__pick {
   width: 2.5rem;

M02_MasterTemplete/M02_MyItems_View.ts

@@ -28,7 +28,7 @@ export function buildMyItemsView(opt: MyItemsViewOptions): HTMLElement {
   const uses = createFindList({ placeholder: mt("Open_Sk") });
   uses.root.hidden = true;
   const table = createDataTable({
-    caption: mt("Items_Title"),
+    caption: mt("Crumb_Items"),
     columns: [
       { key: "이름", label: mt("Name"), width: 200 },
       { key: "규격", label: mt("Spec"), width: 140 },

M02_MasterTemplete/M02_MyMachine_Text.ts

@@ -4,8 +4,11 @@
  * ========================================================================== */
 
 const TEXT = {
-  Title: "내 기계",
-  Items_Title: "내 품목",
+  Personal_Title: "개인관리",
+  Title: "기계",
+  Items_Title: "자재",
+  Crumb_Machine: "개인관리 › 기계",
+  Crumb_Items: "개인관리 › 자재",
   New: "새 기계",
   Copy_Title: "복사해 내 기계로",
   Find: "이름 · 규격 · 키로 찾기",
@@ -38,8 +41,6 @@ const TEXT = {
   No_Uses: "쓰는 단가산출 없음",
   Leave_Ask: "저장 안 한 고침을 버리고 닫을까?",
   Mine: "내 기계",
-  Side_Hint: "펼치면 가운데에 목록 · 양식",
-  Items_Side_Hint: "펼치면 가운데에 모아 보기(읽기)",
   Won: "원",
   Labor: "노",
   Material: "재",

M02_MasterTemplete/M02_MyMachine_View.ts

@@ -1,6 +1,6 @@
 /* =============================================================================
  * M02_MyMachine_View.ts
- * M02 「내 기계」 화면(PLAN 821-3 · 요구서 796 3 장) — 좌측 「내 기계」 칸을 펼치면 가운데에 뜸(개인 층).
+ * M02 「내 기계」 화면(PLAN 821-3 · 요구서 796 3 장) — 좌측 「개인관리」 › [기계] 단추로 가운데에 뜸(개인 층).
  *   목록 = 이름 · 규격 · 방식 · 시간당 경비(서버 셈) · 쓰는 곳 수 · 넣은 날 · 고친 날 · 찾기 · [새 기계]
  *   줄 누름 = 양식 한 장(`M02_MyMachine_Form`) · [목록] = 저장 안 한 고침이면 물음 · 저장 · 지우기 뒤 목록 다시
  * ========================================================================== */
@@ -33,7 +33,7 @@ export function buildMyMachineView(opt: MyMachineViewOptions): HTMLElement {
   const hint = createText("");
   const fail = el("div");
   const table = createDataTable({
-    caption: mt("Title"),
+    caption: mt("Crumb_Machine"),
     columns: [
       { key: "이름", label: mt("Name"), width: 180 },
       { key: "규격", label: mt("Spec"), width: 120 },