refactor: 대시보드 통계처리현황 표준화 수정

[as] WIP: 설치인가 버튼 로직

[as] WIP: 설치인가 버튼 로직

.gitignore

@@ -29,4 +29,5 @@ settings.json
 .agent
 
 apps/**/tsconfig.tsbuildinfo
+packages/**/tsconfig.tsbuildinfo
 logs/

apps/_template/package.json

@@ -19,7 +19,7 @@
     "@tanstack/react-table": "^8.21.2",
     "axios": "^1.8.1",
     "dayjs": "^1.11.13",
-    "next": "15.3.8",
+    "next": "15.5.18",
     "react-hook-form": "^7.54.2",
     "zod": "^3.24.2"
   },
@@ -33,4 +33,4 @@
     "tailwindcss": "^3.4.14",
     "typescript": "^5.7.2"
   }
-}
+}

apps/_template/tsconfig.json

@@ -19,11 +19,15 @@
       }
     ],
     "paths": {
-      "@/*": ["./src/*"],
-      "@common/components": ["../../packages/common/components/dist/"],
-      "@common/network": ["../../packages/common/network/"]
+      "@/*": ["./src/*"]
     }
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
-  "exclude": ["node_modules"]
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    "../../packages/common/types/**/*.d.ts"
+  ],
+  "exclude": ["node_modules", ".next", "dist", "coverage", "storybook-static", "public"]
 }

apps/as/app/(with-base-layout)/design-cnstn/[id]/edit/page.tsx

@@ -0,0 +1,10 @@
+import { DesignEditPage } from "@/pages/design-cnstn";
+
+interface PageProps {
+  params: Promise<{ id: string }>;
+}
+
+export default async function Page({ params }: PageProps) {
+  const { id } = await params;
+  return <DesignEditPage id={id} />;
+}

apps/as/app/(with-base-layout)/design-cnstn/[id]/page.tsx

@@ -0,0 +1,10 @@
+import { DesignViewPage } from "@/pages/design-cnstn";
+
+interface PageProps {
+  params: Promise<{ id: string }>;
+}
+
+export default async function Page({ params }: PageProps) {
+  const { id } = await params;
+  return <DesignViewPage id={id} />;
+}

apps/as/app/(with-base-layout)/design-cnstn/page.tsx

@@ -0,0 +1,3 @@
+import { DesignListPage } from "@/pages/design-cnstn";
+
+export default DesignListPage;

apps/as/app/(with-base-layout)/design-cnstn/regist/page.tsx

@@ -0,0 +1,12 @@
+import { DesignRegistPage } from "@/pages/design-cnstn";
+import { parseTaskSeComCdFromApi } from "@/pages/design-cnstn/lib/design-cnstn-regist-schema";
+
+interface PageProps {
+  searchParams: Promise<{ taskSeComCd?: string }>;
+}
+
+export default async function Page({ searchParams }: PageProps) {
+  const params = await searchParams;
+  const taskSeComCd = parseTaskSeComCdFromApi(params.taskSeComCd);
+  return <DesignRegistPage taskSeComCd={taskSeComCd.length ? taskSeComCd : undefined} />;
+}

apps/as/app/(with-base-layout)/fnrs-cnsltn/[id]/edit/page.tsx

@@ -0,0 +1,10 @@
+import { FnrsEditPage } from "@/pages/fnrs-cnsltn";
+
+interface PageProps {
+  params: Promise<{ id: string }>;
+}
+
+export default async function Page({ params }: PageProps) {
+  const { id } = await params;
+  return <FnrsEditPage id={id} />;
+}

apps/as/app/(with-base-layout)/fnrs-cnsltn/[id]/page.tsx

@@ -0,0 +1,10 @@
+import { FnrsViewPage } from "@/pages/fnrs-cnsltn";
+
+interface PageProps {
+  params: Promise<{ id: string }>;
+}
+
+export default async function Page({ params }: PageProps) {
+  const { id } = await params;
+  return <FnrsViewPage id={id} />;
+}

apps/as/app/(with-base-layout)/fnrs-cnsltn/page.tsx

@@ -0,0 +1,3 @@
+import { FnrsListPage } from "@/pages/fnrs-cnsltn";
+
+export default FnrsListPage;

apps/as/app/(with-base-layout)/fnrs-cnsltn/regist/page.tsx

@@ -0,0 +1,12 @@
+import { FnrsRegistPage } from "@/pages/fnrs-cnsltn";
+import { parseTaskSeComCdFromApi } from "@/pages/fnrs-cnsltn/lib/fnrs-cnsltn-regist-schema";
+
+interface PageProps {
+  searchParams: Promise<{ taskSeComCd?: string }>;
+}
+
+export default async function Page({ searchParams }: PageProps) {
+  const params = await searchParams;
+  const taskSeComCd = parseTaskSeComCdFromApi(params.taskSeComCd);
+  return <FnrsRegistPage taskSeComCd={taskSeComCd.length ? taskSeComCd : undefined} />;
+}

apps/as/app/(with-base-layout)/instl-sncn/[id]/edit/page.tsx

@@ -0,0 +1,10 @@
+import { InstlEditPage } from "@/pages/instl-sncn";
+
+interface InstlSncnEditRouteProps {
+  params: Promise<{ id: string }>;
+}
+
+export default async function Page({ params }: InstlSncnEditRouteProps) {
+  const { id } = await params;
+  return <InstlEditPage id={id} />;
+}

apps/as/app/(with-base-layout)/instl-sncn/[id]/modify/page.tsx

@@ -1,10 +0,0 @@
-import { CnfmModifyPage } from "@/pages/instl-sncn";
-
-export default async function InstlSncnModifyPage({
-  params,
-}: {
-  params: Promise<{ id: string }>;
-}) {
-  const { id } = await params;
-  return <CnfmModifyPage id={id} />;
-}

apps/as/app/(with-base-layout)/instl-sncn/[id]/page.tsx

@@ -1,10 +1,6 @@
-import { CnfmViewPage } from "@/pages/instl-sncn";
-
-export default async function InstlSncnViewPage({
-  params,
-}: {
-  params: Promise<{ id: string }>;
-}) {
-  const { id } = await params;
-  return <CnfmViewPage id={id} />;
-}
+import { InstlViewPage } from "@/pages/instl-sncn";
+
+export default async function InstlSncnDetailPage({ params }: { params: Promise<{ id: string }> }) {
+  const { id } = await params;
+  return <InstlViewPage id={id} />;
+}

apps/as/app/(with-base-layout)/instl-sncn/page.tsx

@@ -1,3 +1,3 @@
-import { CnfmListPage } from "@/pages/instl-sncn";
-
-export default CnfmListPage;
+import { InstlListPage } from "@/pages/instl-sncn";
+
+export default InstlListPage;

apps/as/app/(with-base-layout)/instl-sncn/regist/page.tsx

@@ -0,0 +1,14 @@
+import { InstlRegistPage } from "@/pages/instl-sncn";
+
+interface InstlSncnRegistRouteProps {
+  searchParams: Promise<{ taskSeComCd?: string }>;
+}
+
+export default async function Page({ searchParams }: InstlSncnRegistRouteProps) {
+  const params = await searchParams;
+  const taskSeComCd = params.taskSeComCd
+    ? params.taskSeComCd.split(",").filter(Boolean)
+    : undefined;
+
+  return <InstlRegistPage taskSeComCd={taskSeComCd} />;
+}

apps/as/app/(with-base-layout)/instl-sncn/register/page.tsx

@@ -1,5 +0,0 @@
-import { CnfmRegistPage } from "@/pages/instl-sncn";
-
-export default function Page(props: any) {
-	return <CnfmRegistPage {...props} />;
-}

apps/as/app/(with-base-layout)/rvw-mnpw-mng/page.tsx

@@ -0,0 +1 @@
+export { RvwMnpwMngPage as default } from "@/pages/rvw-mnpw-mng";

apps/as/app/api/proxy/[...url]/route.ts

@@ -5,6 +5,7 @@ import {
   ACCESS_TOKEN,
   AUTH_USER_ID,
   CLAIM_NAME,
+  COOKIE_DOMAIN,
   REFRESH_TOKEN,
   SERVER_API_URL,
   SITE_ID,
@@ -20,6 +21,10 @@ async function handler(
     "Content-Type": "application/json",
     "X-Site-Id": SITE_ID,
   };
+  const deviceId = request.headers.get("X-Device-Id");
+  if (deviceId) {
+    headers["X-Device-Id"] = deviceId;
+  }
   let body = {};
   const isRefreshHandler = params.url.includes("refresh");
 
@@ -39,27 +44,13 @@ async function handler(
     }
 
     const targetUrl = `${SERVER_API_URL}/${params.url.join("/")}`;
-    console.log(`[Proxy API] ${method} ${params.url.join("/")} -> ${targetUrl}`);
-    console.log(`[Proxy API] Headers:`, headers);
-    if (!isRefreshHandler) {
-      console.log(`[Proxy API] Body:`, body);
-    }
-
     const result = await fetch(targetUrl, {
       method,
       headers,
       body: JSON.stringify(body),
     });
 
-    console.log(`[Proxy API] Response Status: ${result.status}`);
-    console.log(`[Proxy API] Response Headers:`, {
-      [ACCESS_TOKEN]: result.headers.get(ACCESS_TOKEN),
-      [REFRESH_TOKEN]: result.headers.get(REFRESH_TOKEN) ? '***hidden***' : undefined,
-      [AUTH_USER_ID]: result.headers.get(AUTH_USER_ID),
-    });
-
     if (!result.ok) {
-      console.error(`[Proxy API] Request failed with status ${result.status}`);
       return NextResponse.json({ message: "Invalid Credentials" }, { status: 401 });
     }
 
@@ -68,24 +59,16 @@ async function handler(
     const userId = result.headers.get(AUTH_USER_ID);
 
     if (accessToken && userId) {
-      console.log(`[Proxy API] Login successful for user: ${userId}`);
       const response = NextResponse.json({
         [ACCESS_TOKEN]: accessToken,
         [AUTH_USER_ID]: userId,
       });
 
-      const forwardedHost = request.headers.get("x-forwarded-host");
-      const host = request.headers.get("host");
-      const actualHost = forwardedHost || host || new URL(request.url).hostname.toString();
-
-      // 운영 환경에서 domain 설정
-      const domain = actualHost.includes("hasuon.or.kr") ? ".hasuon.or.kr" : actualHost;
-
       if (refreshToken) {
         cookieStore.set(REFRESH_TOKEN, refreshToken, {
           httpOnly: true,
           sameSite: "strict",
-          domain: domain,
+          domain: COOKIE_DOMAIN,
           path: "/",
         });
       }

apps/as/docs/fnrs-cnsltn-vs-instl-sncn-diff.md

@@ -0,0 +1,367 @@
+# 재원협의(fnrs-cnsltn) vs 설치인가(instl-sncn) 차이 분석
+
+| 항목      | 내용                                                                          |
+| --------- | ----------------------------------------------------------------------------- |
+| 작성일    | 2026-07-09                                                                    |
+| 기준 구현 | `fnrs-cnsltn` (추가 요구사항 반영 완료)                                       |
+| 비교 대상 | `instl-sncn`                                                                  |
+| 목적      | 두 페이지의 동작·구조 차이를 정리하고, 설치인가 정렬 시 이식 대상을 명확히 함 |
+
+---
+
+## 1. 요약
+
+두 모듈은 **동일한 PBADMS(공공행정 지원) 업무 패턴**을 따르는 형제 페이지다.
+
+공통 흐름:
+
+```
+목록 → TaskSe 선택 후 신청 → 저장(SV) → 신청완료(ST)
+  → 환경청제출(LE) → 기술검토 → 검토결과 회신(EP)
+  → 인가승인(TA) → 고시(TB)
+```
+
+| 구분          | fnrs-cnsltn       | instl-sncn       |
+| ------------- | ----------------- | ---------------- |
+| 업무명        | 재원협의          | 설치인가         |
+| 문서번호      | `fnrsCnsltnDocNo` | `instlSncnDocNo` |
+| docSeComCd    | `FNRS`            | `INSTL`          |
+| 라우트        | `/fnrs-cnsltn/*`  | `/instl-sncn/*`  |
+| pages 파일 수 | 39                | 32               |
+
+**결론:** `fnrs-cnsltn`이 추가 요구사항이 반영된 기준(reference) 구현이고, `instl-sncn`은 동일 골격이지만 보완요청·결재선 편집·등록/수정 폼 완성도 등에서 미반영·TODO·단순화 상태다.
+
+---
+
+## 2. 파일/폴더 구조
+
+### 2-1. fnrs-cnsltn에만 존재
+
+| 경로                                         | 역할                      |
+| -------------------------------------------- | ------------------------- |
+| `ui/sections/fnrs-shar-section.tsx`          | 재원분담 조회 섹션        |
+| `ui/sections/supplement-demand-section.tsx`  | 보완요청 이력 섹션        |
+| `ui/components/sortable-prgrs-stts-row.tsx`  | 결재선 DnD 편집 행        |
+| `ui/components/sortable-apln-picker-row.tsx` | 결재선 템플릿 피커 DnD 행 |
+| `ui/components/aprvr-picker-dialog.tsx`      | 결재자 선택 다이얼로그    |
+| `ui/components/elapr-apln-picker-grid.tsx`   | 결재선 편집 그리드        |
+| `ui/components/elapr-tmplt-select-table.tsx` | 결재서식 선택 테이블      |
+| `model/reviewer-option.ts`                   | 결재자 옵션 타입          |
+
+### 2-2. instl-sncn에만 존재
+
+| 경로                                   | 역할                | 비고                                       |
+| -------------------------------------- | ------------------- | ------------------------------------------ |
+| `ui/sections/history-info-section.tsx` | 등록/수정 이력 표시 | **어디에서도 import되지 않음 (dead code)** |
+
+### 2-3. 공통 구조
+
+```
+index.ts
+ui/
+  {list,view,form,regist,edit}-page.tsx
+  sections/  (basic-info, contact, scale, cost, checklist, attachments, tech-review)
+  components/ (floating-action-buttons, elapr-approval-dialog, elapr-tmplt-picker-dialog, checklist-task-panel)
+lib/   button-config, save-payload-utils, form-data-mapper, regist-schema, checklist/review utils
+model/ columns.tsx, view-types.ts
+```
+
+App Router도 동일: `page.tsx`, `regist/page.tsx`, `[id]/page.tsx`, `[id]/edit/page.tsx`
+
+---
+
+## 3. 목록 페이지
+
+### 3-1. 검색 필터
+
+| 항목               | fnrs-cnsltn                               | instl-sncn                        |
+| ------------------ | ----------------------------------------- | --------------------------------- |
+| 시도/시군구 API    | `@/entities/adstdstr`                     | 동일                              |
+| 지역 검색 파라미터 | **`admdstCd`** (시군구 우선, 없으면 시도) | **`sidoComCd` + `sggComCd`** 분리 |
+| "전체" 옵션        | `ALL_SELECT_VALUE = "__ALL__"` SelectItem | 없음 (placeholder만)              |
+| 구분 CodeSelect    | `upCd="INSTL"` ※                          | `upCd="INSTL"`                    |
+| 사업명             | 동일                                      | 동일                              |
+
+> ※ fnrs 목록의 구분 필터가 `INSTL` 코드를 사용 중이며, TaskSePickerDialog는 `codeUpCd="FNRS"`를 쓴다. **불일치 가능성**이 있어 확인이 필요하다.
+
+### 3-2. 정렬·페이지네이션
+
+| 항목                     | fnrs-cnsltn            | instl-sncn                            |
+| ------------------------ | ---------------------- | ------------------------------------- |
+| 기본 sort (list-page)    | `fnrsCnsltnDocNo,desc` | `instlSncnDocNo,desc`                 |
+| fallback sort (list.tsx) | `fnrsCnsltnDocNo,desc` | **`regDt,desc`** (list-page와 불일치) |
+| 페이지 크기              | 10                     | 10                                    |
+| URL 동기화               | 없음 (`useState` 로컬) | 없음                                  |
+
+### 3-3. 테이블 컬럼
+
+`model/columns.tsx` 로직은 사실상 동일하다. DTO 타입명만 다르다.
+
+컬럼: 시도, 시군구, 사업명, 업무구분, 담당자, 해당기관, 진행상황, 신청일
+
+### 3-4. 행 클릭·신청
+
+| 항목         | fnrs-cnsltn                                                        | instl-sncn         |
+| ------------ | ------------------------------------------------------------------ | ------------------ |
+| 행 클릭      | **조건부 라우팅**: `SV`/`SL` + 등록자 본인 → `/edit`, 그 외 → view | **항상 view**      |
+| useUserStore | 사용                                                               | 미사용             |
+| 신청 버튼    | TaskSePickerDialog `codeUpCd="FNRS"`                               | `codeUpCd="INSTL"` |
+
+```46:54:apps/as/src/pages/fnrs-cnsltn/ui/fnrs-list.tsx
+  const handleRowClick = (row: FnrsCnsltnMngResponseDto) => {
+    const canEdit =
+      (row.prgrsSttsComCd === "SV" || row.prgrsSttsComCd === "SL") &&
+      row.rgtr === userInfo?.userUnqId;
+
+    router.push(
+      canEdit ? `/fnrs-cnsltn/${row.fnrsCnsltnDocNo}/edit` : `/fnrs-cnsltn/${row.fnrsCnsltnDocNo}`,
+    );
+  };
+```
+
+---
+
+## 4. 상세(View) 페이지
+
+### 4-1. 섹션 구성
+
+| 섹션                            | fnrs-cnsltn                                | instl-sncn                 |
+| ------------------------------- | ------------------------------------------ | -------------------------- |
+| BasicInfo                       | 환경청구분, 확정예산사업번호, 예산신청연도 | **사업구분(`sncnSeCdNm`)** |
+| ContactInfo                     | 동일 패턴                                  | 동일                       |
+| BusinessScale / Cost            | 동일                                       | 동일                       |
+| **FnrsShar (재원분담)**         | **있음**                                   | **없음** (도메인 고유)     |
+| Checklist                       | 동일                                       | 동일                       |
+| Attachments                     | 동일                                       | 동일                       |
+| **SupplementDemand (보완요청)** | **있음**                                   | **없음**                   |
+| TechReviewOpinion               | 동일                                       | 동일                       |
+| HistoryInfo                     | 없음                                       | 파일만 존재, view 미연결   |
+| FloatingActionButtons           | `docSeComCd="FNRS"`                        | `docSeComCd="INSTL"`       |
+
+### 4-2. 데이터 훅
+
+| 항목      | fnrs-cnsltn                  | instl-sncn           |
+| --------- | ---------------------------- | -------------------- |
+| 상세 훅   | `useFnrsCnsltnMng`           | `useInstlSncnDetail` |
+| 에러 판정 | `isError \|\| !data?.detDto` | `isError \|\| !data` |
+| 로딩      | Skeleton                     | Skeleton             |
+
+---
+
+## 5. 등록/수정(Form) 페이지
+
+### 5-1. 폼 완성도
+
+| 항목          | fnrs-cnsltn                       | instl-sncn      |
+| ------------- | --------------------------------- | --------------- |
+| 저장(SV)      | O                                 | O (SV 고정)     |
+| 신청완료(ST)  | O (edit 모드)                     | **없음**        |
+| 삭제          | O (edit 모드, `useConfirm`)       | **없음**        |
+| 재원분담 섹션 | `FnrsSharFormSection` + 잔액 검증 | 없음            |
+| 저장 후 이동  | **`/edit` 유지**                  | **view로 이동** |
+| 목록 버튼     | `/fnrs-cnsltn` 고정               | `router.back()` |
+
+### 5-2. 기본정보 Form 필드
+
+| 필드              | fnrs             | instl                                   |
+| ----------------- | ---------------- | --------------------------------------- |
+| taskSe 코드       | `FNRS`           | `INSTL`                                 |
+| 사업구분          | 없음             | **`sncnSeComCd` (SNCNSE 라디오, 필수)** |
+| BnsPicker 연동    | bizNm ~ bizCn    | + **`bgtBizCd`, `bgtAplyYr`**           |
+| 재이용(RE) 조건부 | rtlztnFclt / Usg | 동일                                    |
+
+### 5-3. Schema
+
+| 항목                | fnrs                | instl          |
+| ------------------- | ------------------- | -------------- |
+| 관리 객체           | `fnrsCnsltnMng`     | `instlSncnMng` |
+| 예산 필드           | `cfmtnBgtBizNo`     | `bgtBizCd`     |
+| 재원분담            | `fnrsSharList` 배열 | 없음           |
+| sharAtchFileGroupId | 있음                | 없음           |
+| privacyConsent      | 있음                | 있음           |
+
+### 5-4. Edit 페이지 래퍼
+
+| 항목               | fnrs                            | instl                           |
+| ------------------ | ------------------------------- | ------------------------------- |
+| 로딩 Skeleton      | 있음                            | **없음**                        |
+| 데이터 없음 메시지 | "상세 정보를 찾을 수 없습니다." | "수정 대상을 찾을 수 없습니다." |
+
+---
+
+## 6. FloatingActionButtons / 결재 / 보완
+
+### 6-1. FAB 동작 차이
+
+공통: 역할×상태 기반 버튼(`button-config.ts`), checklist 진행률 검증, elapr pending approval 체크
+
+| 기능                            | fnrs-cnsltn                                             | instl-sncn                                              |
+| ------------------------------- | ------------------------------------------------------- | ------------------------------------------------------- |
+| 보완완료 (`splmntCmptn`)        | **`submitSupplement` API 연동**                         | **`// TODO` stub**                                      |
+| 보완요청 (`dmndSplmnt`)         | **`buildSupplementReqPayload` + `submitReqSupplement`** | **`// TODO` stub** (문자열만 전달)                      |
+| 검토완료 (`rvwCmptn`)           | `techReViewSaveCd: "SV"` 후 **결재 다이얼로그 오픈**    | `techReViewSaveCd: "CP"`, **다이얼로그 없이 즉시 완료** |
+| 검토자지정                      | `buildElaprPrgrsSttsListFromAplnRows(aplnRows)`         | `buildElaprPrgrsSttsListFromApln(aplnPage.content)`     |
+| atrzAprv / atrzRply / grndsChck | TODO handler                                            | TODO handler                                            |
+
+```576:617:apps/as/src/pages/instl-sncn/ui/components/floating-action-buttons.tsx
+async function handleSplmntCmptn(context: ActionHandlerContext): Promise<void> {
+  // TODO: 보완완료 API 호출
+  context.onSuccess?.();
+}
+// ...
+async function handleDmndSplmnt(context: ActionHandlerContext): Promise<void> {
+  // TODO: 보완요청 API 호출
+  context.onSuccess?.();
+}
+```
+
+### 6-2. ElaprApprovalDialog (가장 큰 UX 격차)
+
+| 항목             | fnrs (419줄)                                           | instl (231줄)                    |
+| ---------------- | ------------------------------------------------------ | -------------------------------- |
+| 결재선 표시      | DnD sortable 편집 테이블                               | **읽기 전용** 테이블             |
+| 결재선 추가/저장 | **지원** (`usePrgrsSttsRows`, `useSaveElaprPrgrsStts`) | 없음                             |
+| 결재자 변경      | **AprvrPickerDialog**                                  | 없음                             |
+| 전결 체크박스    | **있음** (`finalApprovalYn`)                           | 없음                             |
+| 반려 사유        | API에 `rjctRsn` 전달                                   | UI는 있으나 **payload에 미전달** |
+| 저장 전 검증     | `hasUnsavedPrgrsSttsChanges`                           | 없음                             |
+
+### 6-3. ElaprTmpltPickerDialog
+
+| 항목            | fnrs                                                                 | instl                   |
+| --------------- | -------------------------------------------------------------------- | ----------------------- |
+| UI              | 2-pane: 서식 테이블 + **결재선 편집 그리드**                         | 단일 테이블 + 선택 버튼 |
+| docSeComCd 필터 | `FNRS`                                                               | `INSTL`                 |
+| onConfirm       | `{ tmplt, aplnRows }` 편집 결과                                      | `onSelect(tmplt)`만     |
+| 검증            | `validateAllRowsForSave`, `validateAtrzOrder`, `validateUniqueSeqNo` | 없음                    |
+
+---
+
+## 7. Entity / API / Hook
+
+### 7-1. Service 메서드
+
+| 메서드                  | fnrs                        | instl     |
+| ----------------------- | --------------------------- | --------- |
+| 목록                    | `findPage`                  | `getPage` |
+| 상세                    | `findById`                  | `getById` |
+| saveApply               | O                           | O         |
+| techReview              | O                           | O         |
+| changePrgrsSttsComCd    | O                           | O         |
+| remove                  | O                           | O         |
+| **submitSupplement**    | **O** (`/submitsupplement`) | **X**     |
+| **submitReqSupplement** | **O** (`/reqsupplement`)    | **X**     |
+
+### 7-2. 상세 DTO 확장
+
+**fnrs 추가 필드**
+
+- `fnrsSharList`, `sharAtchFileList`
+- `splmntDmndList` (typed)
+
+**instl 추가 필드**
+
+- `sncnSeComCd` / `sncnSeCdNm` (인가구분)
+- `bgtBizCd` (예산사업코드)
+- `rtlztnFcltSeComNm`, `rtlztnUsgSeComNm`
+- `splmntDmndList` 타입은 base에 존재하나 view/API 미연결
+- `instlSncnRegionService` (시도/시군구 — 목록은 adstdstr 사용, 미활용)
+
+### 7-3. save-payload-utils
+
+| 함수                             | fnrs             | instl     |
+| -------------------------------- | ---------------- | --------- |
+| buildSavePayload                 | + `fnrsSharList` | shar 없음 |
+| buildTechReviewReplyPayload      | O                | O         |
+| **buildSupplementReqPayload**    | **O**            | **X**     |
+| **buildSupplementSubmitPayload** | **O**            | **X**     |
+
+---
+
+## 8. 비즈니스 도메인 차이
+
+| 영역           | fnrs-cnsltn                               | instl-sncn               |
+| -------------- | ----------------------------------------- | ------------------------ |
+| 업무 코드      | `FNRS`                                    | `INSTL`                  |
+| TaskSe         | FNRS 하위                                 | INSTL 하위               |
+| 고시 버튼 라벨 | "재원협의 고시"                           | "설치인가 고시"          |
+| 재원분담       | **핵심 도메인** (`fnrs-shar-se`)          | 해당 없음                |
+| 인가구분       | 없음                                      | **`SNCNSE` 코드 (필수)** |
+| 예산 식별      | `cfmtnBgtBizNo`                           | `bgtBizCd`               |
+| 진행상태 코드  | SV, ST, LE, ER, TE, EP, TA, TB, SL, TP 등 | **동일 세트 공유**       |
+| 역할 매핑      | ROLE_USER05/04/03/01                      | 동일                     |
+
+---
+
+## 9. fnrs-cnsltn에만 있는 기능 (추가 요구사항 후보)
+
+instl-sncn 정렬 시 **우선 이식 대상**:
+
+1. 목록 행 클릭 조건부 edit 라우팅 (`SV`/`SL` + 등록자)
+2. 보완요청 전체 플로우 — view 섹션, payload builder, API, FAB handler
+3. 보완완료 API 연동 (`submitSupplement`)
+4. 등록/수정 폼 완성 — 신청완료, 삭제, 저장 후 edit 유지
+5. 결재선 DnD 편집형 `ElaprApprovalDialog` (+ aprvr-picker, sortable rows)
+6. 결재선 편집형 `ElaprTmpltPickerDialog` (+ apln grid, validation)
+7. 검토완료 → 결재 다이얼로그 연계 흐름
+8. 검색 필터 "전체" 옵션 및 `admdstCd` 통합 방식 (백엔드 API에 맞게)
+9. Edit 페이지 로딩 Skeleton
+10. entity에 supplement API/hooks 추가
+
+---
+
+## 10. instl-sncn에만 있는 기능 (유지 필요)
+
+1. **`sncnSeComCd` (사업구분/인가구분)** — 도메인 고유
+2. **`bgtBizCd` / `bgtAplyYr`** BnsPicker 연동
+3. **`history-info-section.tsx`** — 구현만 있고 view 미연결 (활성화 또는 삭제 결정 필요)
+4. entity **`instlSncnRegionService`** — 목록은 adstdstr 사용 중이라 중복/레거시 가능
+5. **`INSTL_SNCN_REGISTER_SELECTION_KEY`** sessionStorage 키
+
+---
+
+## 11. 동일·거의 동일 패턴
+
+| 영역                                                  | 동일도                |
+| ----------------------------------------------------- | --------------------- |
+| App Router 4-route 구조                               | 100%                  |
+| `button-config.ts` 역할×상태 매트릭스                 | ~99% (액션명만 다름)  |
+| `columns.tsx` 진행상황 Badge                          | ~100%                 |
+| checklist / contact / scale / cost / attachments 섹션 | ~95% (import 경로만)  |
+| review-step-utils 로직                                | ~100% (상수명만 다름) |
+| TaskSePickerDialog 신청 플로우                        | 100%                  |
+| FAB 전체 구조·대부분 handler                          | ~85%                  |
+| checklist-form-state, business-cost-utils             | 거의 동일             |
+| shared widgets (`@/widgets/pbadms-sprt`)              | 동일                  |
+
+---
+
+## 12. instl-sncn 정렬 권장 우선순위
+
+| 우선순위 | 항목                                                    | 근거                         |
+| -------- | ------------------------------------------------------- | ---------------------------- |
+| P0       | 보완요청/보완완료 API + UI                              | fnrs 완전 구현 vs instl TODO |
+| P0       | ElaprApprovalDialog 고도화                              | 결재선 편집·전결·반려사유    |
+| P0       | ElaprTmpltPickerDialog 2-pane                           | 검토자지정 품질              |
+| P1       | Form 신청완료/삭제 + 저장 후 edit 유지                  | 등록 UX parity               |
+| P1       | 목록 행 클릭 edit 라우팅                                | fnrs 추가 요구사항           |
+| P1       | 검토완료 → 결재 다이얼로그 연계                         | 흐름 통일                    |
+| P2       | sort fallback 불일치 수정 (`regDt` vs `instlSncnDocNo`) | instl 내부 버그성            |
+| P2       | history-info-section 연결 또는 삭제                     | dead code 정리               |
+| P3       | URL search params 동기화                                | 양쪽 모두 미구현 (공통 개선) |
+
+---
+
+## 13. 참고 코드 위치
+
+| 주제                         | 경로                                                         |
+| ---------------------------- | ------------------------------------------------------------ |
+| 목록 edit 라우팅 (fnrs)      | `pages/fnrs-cnsltn/ui/fnrs-list.tsx`                         |
+| 목록 항상 view (instl)       | `pages/instl-sncn/ui/instl-list.tsx`                         |
+| view 추가 섹션 (fnrs)        | `pages/fnrs-cnsltn/ui/fnrs-view-page.tsx`                    |
+| FAB 보완 TODO (instl)        | `pages/instl-sncn/ui/components/floating-action-buttons.tsx` |
+| 결재 다이얼로그 (fnrs)       | `pages/fnrs-cnsltn/ui/components/elapr-approval-dialog.tsx`  |
+| 결재 다이얼로그 (instl)      | `pages/instl-sncn/ui/components/elapr-approval-dialog.tsx`   |
+| 폼 완성도 (fnrs)             | `pages/fnrs-cnsltn/ui/fnrs-form-page.tsx`                    |
+| 폼 단순화 (instl)            | `pages/instl-sncn/ui/instl-form-page.tsx`                    |
+| supplement API (fnrs entity) | `entities/fnrs-cnsltn/api/fnrs-cnsltn-service.ts`            |

apps/as/docs/review-manpower-management/SPEC.md

@@ -0,0 +1,370 @@
+# 화면설계서: 검토인력관리
+
+## 1. 기본 정보
+
+| 항목       | 내용                                         |
+| ---------- | -------------------------------------------- |
+| 버전       | 0.2                                          |
+| 프로세스명 | UI설계                                       |
+| 화면명     | 검토인력관리                                 |
+| 화면 유형  | [v] 조회 [v] 입력 [ ] 수정 [v] 삭제 [ ] 출력 |
+| 메뉴 경로  | 디지털행정지원 > 사이트관리 > 검토인력관리   |
+
+---
+
+## 2. 화면 목적
+
+조직도에서 **한 명의 사용자**를 선택한 뒤, 결재 단계(접수·검토·승인·최종승인)별 **인원 배치** 영역에 즉시 등록한다. 등록·목록 갱신은 별도 저장 버튼 없이 **[선택 인원 배치]** 클릭 시 `rvw-mnpw` API로 바로 반영한다. 좌측 조직도는 CMS 조직·사용자 트리 API를, 우측 배치 목록은 검토인력관리 API를 사용한다.
+
+---
+
+## 3. 화면 구성
+
+### 3-1. 전체 레이아웃
+
+```
+┌──────────────────────────────────────────────────────────────────────────────────────────────────┐
+│  페이지 타이틀: 검토인력관리              브레드크럼: 디지털행정지원 > 사이트관리 > 검토인력관리 │
+├─────────────────────────────────┬──────────────────────────────────────────────────────────────────┤
+│  [영역 A] 조직도                │  [영역 B] 인원 배치 (결재구분별 4블록, 세로 스택)                │
+│  제목: 조직도                   │                                                                  │
+│  [A-1] 검색:                    │  ┌─ [B-1] 접수 ───────────── count ─ [선택 인원 배치] ─┐         │
+│  [성명·부서 검색] [조회][초기화]│  │  (배치 목록 또는 빈 상태 문구)                       │        │
+│  선택 안내:                     │  └──────────────────────────────────────────────────────┘        │
+│  "선택된 인원: {이름}           │  ┌─ [B-2] 검토 ───────────── count ─ [선택 인원 배치] ──┐        │
+│   ({부서} / {직급})"            │  └──────────────────────────────────────────────────────┘        │
+│  [A-2] 조직 트리 + 사용자 행    │  ┌─ [B-3] 승인 ───────────── count ─ [선택 인원 배치] ──┐        │
+│  ┌────────────────────┐         │  └──────────────────────────────────────────────────────┘        │
+│  │ 조직 트리 + 사용자 │         │  ┌─ [B-4] 최종승인 ───────── count ─ [선택 인원 배치] ──┐        │
+│  │ (단일 선택 강조)   │         │  └──────────────────────────────────────────────────────┘        │
+│  └────────────────────┘         │                                                                  │
+└─────────────────────────────────┴──────────────────────────────────────────────────────────────────┘
+```
+
+### 3-2. 화면 데이터 흐름
+
+```
+BEGIN
+
+  // 최초 진입
+  CALL userOgnzService.findOgnzUserTree()
+  DISPLAY 조직도 트리 (영역 A)
+
+  CALL rvwMnpwMngService.findPage({ size: 충분히 큰 값 })   // 또는 atrzSeComCd별 분할 조회
+  GROUP BY atrzSeComCd
+  DISPLAY 인원 배치 4블록 (영역 B-1 ~ B-4) + 건수 뱃지
+
+  // 영역 A-1: 조직도 검색 (클라이언트 필터 — 서버 API 없음)
+  ON [조회] 버튼 CLICK / 검색 폼 SUBMIT DO
+      SET displayTree = filterOgnzUserTree(원본트리, keyword)
+      SET expandedOgnzSnIds = collectExpandedOgnzSnIds(displayTree)   // 매칭 노드 자동 펼침
+      DISPLAY 필터된 트리 (영역 A-2)
+  END ON
+
+  ON [초기화] 버튼 CLICK DO
+      RESET keyword = ""
+      RESET displayTree = 원본트리
+      RESET expandedOgnzSnIds = 빈 Set (또는 기본 접힘)
+      DISPLAY 전체 트리 (영역 A-2)
+  END ON
+
+  // 영역 A-2: 사용자 단일 선택
+  ON 조직도 사용자 행 CLICK DO
+      VALIDATE 동일 행 재클릭이 아닌 경우만 변경
+      SET selectedPerson = { userUuid, userNm, ognzSn, ognzNm, jbgdSeCd, ... }
+      DISPLAY "선택된 인원: {userNm} ({ognzNm} / {직급명})"
+  END ON
+
+  // 영역 B-k: 선택 인원 즉시 배치
+  ON [B-k] [선택 인원 배치] 버튼 CLICK DO
+      VALIDATE selectedPerson 존재
+      SET targetAtrzSeComCd = 블록 k 에 매핑된 결재구분 코드 (§4-2 표)
+      CALL rvwMnpwMngService.save({
+        atrzSeComCd: targetAtrzSeComCd,
+        ognzSn: selectedPerson.ognzSn,
+        userUuid: selectedPerson.userUuid
+      })
+      ON 성공 DO
+          CALL rvwMnpwMngService.findPage (또는 해당 블록 목록만 갱신)
+          DISPLAY [B-k] 배치 목록·건수 뱃지 갱신
+          TOAST "배치되었습니다."
+      END ON
+      ON 실패(이미 존재) DO
+          TOAST (백엔드 메시지 연동)
+      END ON
+  END ON
+
+  // 영역 B-k: 배치 인원 제거 (UI 상 삭제 UX — 스크린샷 미표기, API는 제공됨)
+  ON 배치 인원 [삭제] / [제거] CLICK DO
+      CONFIRM "해당 인원을 배치에서 제거하시겠습니까?"
+      CALL rvwMnpwMngService.delete(atrzSeComCd, ognzSn, userUuid)
+      CALL rvwMnpwMngService.findPage
+      DISPLAY [B-k] 목록·뱃지 갱신
+  END ON
+
+END
+```
+
+---
+
+## 4. 영역 A — 조직도
+
+### 4-1. 표시·상호작용
+
+| 요소             | 내용                                                                  |
+| ---------------- | --------------------------------------------------------------------- |
+| 섹션 제목        | 조직도                                                                |
+| 검색 폼 (A-1)    | 성명·부서 키워드 입력 + **[조회]** + **[초기화]** — §4-3              |
+| 선택 안내 문구   | `선택된 인원: {userNm} ({ognzNm} / {직급표시})` — 미선택 시 안내 문구 |
+| 트리 (A-2)       | 본부 → 팀 계층 + 팀 소속 사용자 목록 (`displayTree` 기준 표시)        |
+| 선택 규칙        | **사용자 1명만** 선택 가능 (라디오형 단일 선택)                       |
+| 선택 시각 피드백 | 선택된 사용자 행 강조(배경·테두리)                                    |
+| 로딩/오류/빈값   | Skeleton / 오류 문구 / "등록된 조직/사용자가 없습니다."               |
+| 검색 결과 없음   | 필터 후 매칭 노드·사용자 0건. "조회된 인원이 없습니다." 문구 노출     |
+
+### 4-2. 조직도 데이터 매핑
+
+| UI 표시         | 트리 DTO 필드 (`OgnzUserTreeResponseDto`) | 비고                                      |
+| --------------- | ----------------------------------------- | ----------------------------------------- |
+| 조직명          | `ognzNm`                                  | 접기/펼치기 노드                          |
+| 사용자명        | `users[].userNm`                          | 클릭 시 선택                              |
+| 부서(안내 문구) | `ognzNm` (소속 팀 노드)                   | 선택 시 `selectedPerson.ognzNm`           |
+| 직급(안내 문구) | `users[].jbgdSeCd` 또는 `jbpsSeCd`        | 공통코드 라벨 변환                        |
+| 저장용 조직 SN  | `ognzSn`                                  | 사용자가 속한 **리프/팀 노드**의 `ognzSn` |
+| 저장용 사용자   | `users[].userUnqId`                       | API body `userUuid`로 전달 (§6-3)         |
+
+### 4-3. 조직도 검색 (영역 A-1)
+
+결재선 관리 `AprvrPickerDialog`와 동일한 **클라이언트 사이드 필터** 패턴을 사용한다. 별도 검색 API는 없으며, `useOgnzUserTree`로 받은 **원본 트리**를 `filterOgnzUserTree`로 가공해 `displayTree`에 반영한다.
+
+#### 필드 정의
+
+| 표시명         | 입력 유형 | 필수 | 기본값 | API 파라미터 매핑 | 비고                                      |
+| -------------- | --------- | ---- | ------ | ----------------- | ----------------------------------------- |
+| 성명·부서 검색 | Text      | N    | (빈값) | — (클라이언트만)  | `placeholder="성명·부서 검색"`            |
+| 조회           | Button    | —    | —      | —                 | `type="submit"` — 폼 제출 시 필터 적용    |
+| 초기화         | Button    | —    | —      | —                 | `type="button"` — 키워드·트리·펼침 초기화 |
+
+#### 필터 규칙 (`filterOgnzUserTree`)
+
+| 대상             | 매칭 조건                                             |
+| ---------------- | ----------------------------------------------------- |
+| 조직명           | `ognzNm`에 키워드 포함 (대소문자 무시)                |
+| 사용자명         | `userNm`에 키워드 포함 (대소문자 무시)                |
+| 조직 매칭 시     | 해당 노드 **소속 사용자 전원** 유지                   |
+| 사용자만 매칭 시 | 매칭 사용자만 남기고 상위 조직 노드는 유지(경로 보존) |
+| 하위 조직        | 재귀 필터 — 자식·손자 노드 매칭 시 상위도 표시        |
+| 키워드 빈값      | 원본 트리 전체 반환                                   |
+
+#### 조회 후 트리 펼침 (`collectExpandedOgnzSnIds`)
+
+- **[조회]** 성공 후 필터 결과 트리의 **모든 노드** `ognzSn`을 `expandedOgnzSnIds`에 넣어 자동 펼침
+- 검색 결과에서 사용자·하위 조직을 바로 확인할 수 있도록 함
+
+#### 초기화 동작
+
+| 상태                | 초기화 후 값                            |
+| ------------------- | --------------------------------------- |
+| `keyword`           | `""`                                    |
+| `displayTree`       | `useOgnzUserTree` 원본 `data`           |
+| `expandedOgnzSnIds` | `new Set()` (전체 접힘)                 |
+| `selectedPerson`    | **유지** — 검색 초기화와 선택 해제 분리 |
+
+#### 버튼
+
+| 버튼명 | 동작                                                      |
+| ------ | --------------------------------------------------------- |
+| 조회   | `filterOgnzUserTree(data, keyword)` → `displayTree` 갱신  |
+| 초기화 | 키워드·표시 트리·펼침 상태 리셋 (§3-2 `ON [초기화]` 블록) |
+
+---
+
+## 5. 영역 B — 인원 배치
+
+### 5-1. 블록 공통
+
+| 요소               | 내용                                              |
+| ------------------ | ------------------------------------------------- |
+| 블록 제목          | 접수 / 검토 / 승인 / 최종승인                     |
+| 건수 뱃지          | 해당 `atrzSeComCd`에 배치된 인원 수               |
+| 액션 버튼          | **[선택 인원 배치]** — 클릭 시 즉시 `save` (§3-2) |
+| 빈 상태            | "배치된 인원이 없습니다."                         |
+| 배치 목록(있을 때) | 인원명·부서·직급 등                               |
+
+### 5-2. 결재구분 ↔ 블록 매핑
+
+| 블록 | UI 제목  | `atrzSeComCd` | 비고                                                           |
+| ---- | -------- | ------------- | -------------------------------------------------------------- |
+| B-1  | 접수     | `ATRZ00`      | 결재선 관리 `ATRZ_RECEIVER_CD`와 동일                          |
+| B-2  | 검토     | `ATRZ01`      | 결재선 `ATRZ_REVIEWER_1_CD`. `ATRZ02` 별도 블록 여부 — **TBD** |
+| B-3  | 승인     | `ATRZ03`      | 결재선 `ATRZ_APPROVER_CD`                                      |
+| B-4  | 최종승인 | `ATRZ99`      | 결재선 `ATRZ_FINAL_CD`                                         |
+
+공통코드 마스터 `ATRZSE` / 화면 셀렉트용 `ATRZSECD`와 정합성은 배포 환경 코드표로 최종 확인.
+
+### 5-3. 배치 목록 항목 (표시)
+
+| 표시명   | Field (응답 DTO) | 비고                         |
+| -------- | ---------------- | ---------------------------- |
+| 사용자명 | `userUuidNm`     | `@CodeName` 미적용 시 TBD    |
+| 결재구분 | `atrzSeComCdNm`  | 블록 제목과 중복 — 생략 가능 |
+| 조직 SN  | `ognzSn`         | 삭제 API path에 사용         |
+| 사용자   | `userUuid`       | 삭제 API path에 사용         |
+
+### 5-4. 버튼
+
+| 버튼명         | 위치        | 동작                              |
+| -------------- | ----------- | --------------------------------- |
+| 선택 인원 배치 | 각 B-k 헤더 | `save` 후 목록·뱃지 갱신 (§3-2)   |
+| 제거           | 목록 항목   | `delete` 후 목록·뱃지 갱신 (§3-2) |
+
+### 5-5. 검증·제약
+
+| 규칙          | 내용                                                                |
+| ------------- | ------------------------------------------------------------------- |
+| 선택 필수     | `[선택 인원 배치]` 시 `selectedPerson` 없으면 버튼 비활성 또는 안내 |
+| 단일 선택     | 조직도에서 사용자 1명만 `selectedPerson` 유지                       |
+| 중복 등록     | 동일 PK `(atrzSeComCd, ognzSn, userUuid)` 재등록 시 서버 오류       |
+| 다건 배치     | 동일 블록에 서로 다른 사용자·조직은 **복수 행** 가능 (PK가 다름)    |
+| 결재구분 변경 | 본 화면 주 흐름은 `save`만                                          |
+
+---
+
+## 6. API/DTO 명세
+
+### 6-1. 공통
+
+| 항목          | 내용                                                          |
+| ------------- | ------------------------------------------------------------- |
+| 인증          | JWT (`Authorization` 헤더)                                    |
+| 페이징        | Spring `Pageable`: `page`, `size`, `sort` → `PageResponse<T>` |
+| 프론트 엔티티 | `@/entities/user-organization`, `@/entities/rvw-mnpw`         |
+
+### 6-2. 조직·사용자 트리 (영역 A) — `user-ognz`
+
+| 항목        | 내용                            |
+| ----------- | ------------------------------- |
+| 서비스      | `cms-service`                   |
+| Base prefix | `/cms-service/api/v1/user-ognz` |
+
+| 기능             | Method | URL         | Request DTO | Response DTO                | API                                |
+| ---------------- | ------ | ----------- | ----------- | --------------------------- | ---------------------------------- |
+| 조직·사용자 트리 | GET    | `/treeuser` | —           | `OgnzUserTreeResponseDto[]` | `userOgnzService.findOgnzUserTree` |
+
+**`OgnzUserTreeResponseDto`**: `ognzSn`, `upOgnzSn`, `ognzNm`, `users[]`, `children[]`
+
+**`OgnzUserTreeUserDto`**: `userUnqId`, `userNm`, `jbpsSeCd`, `jbgdSeCd`
+
+**React Query**: `useOgnzUserTree`
+
+### 6-3. 검토인력관리 (영역 B) — `rvw-mnpw`
+
+| 항목        | 내용                                  |
+| ----------- | ------------------------------------- |
+| 서비스      | `as-service`                          |
+| Base prefix | `/as-service/api/v1/rvw-mnpw`         |
+| ENDPOINT    | `ENDPOINT.AS_COMMON_SERVICE.RVW_MNPW` |
+
+| 기능            | Method | URL                                  | Request DTO / Query              | Response DTO                  | API                          |
+| --------------- | ------ | ------------------------------------ | -------------------------------- | ----------------------------- | ---------------------------- |
+| 목록 조회       | GET    | `/`                                  | `RvwMnpwMngSearchDto` + Pageable | `Page<RvwMnpwMngResponseDto>` | `rvwMnpwMngService.findPage` |
+| 상세 조회       | GET    | `/{atrzSeComCd}/{ognzSn}/{userUuid}` | Path                             | `RvwMnpwMngResponseDto`       | `rvwMnpwMngService.findById` |
+| 등록(즉시 배치) | POST   | `/`                                  | `RvwMnpwMngSaveRequestDto`       | `RvwMnpwMngResponseDto` (201) | `rvwMnpwMngService.save`     |
+| 결재구분 변경   | PUT    | `/{atrzSeComCd}/{ognzSn}/{userUuid}` | `RvwMnpwMngUpdateRequestDto`     | `RvwMnpwMngResponseDto`       | `rvwMnpwMngService.update`   |
+| 삭제            | DELETE | `/{atrzSeComCd}/{ognzSn}/{userUuid}` | Path                             | `string`                      | `rvwMnpwMngService.delete`   |
+
+**`RvwMnpwMngSearchDto`**: `atrzSeComCd?`, `ognzSn?`, `userUuid?` + `page`, `size`, `sort`
+
+**`RvwMnpwMngSaveRequestDto`**: `atrzSeComCd*`, `ognzSn*`, `userUuid*`
+
+**`RvwMnpwMngUpdateRequestDto`**: `newAtrzSeComCd*` — 본 화면 기본 흐름에서는 미사용
+
+**`RvwMnpwMngResponseDto`**: `atrzSeComCd`, `atrzSeComCdNm?`, `ognzSn`, `userUuid`, `userUuidNm?`, `rgtr?`, `regDt?`
+
+### 6-4. 조직도 ↔ 검토인력 필드 매핑 (저장 시)
+
+| 조직도 (`OgnzUserTreeUserDto` + 노드) | `RvwMnpwMngSaveRequestDto` | 비고                  |
+| ------------------------------------- | -------------------------- | --------------------- |
+| (블록 k의 `atrzSeComCd`)              | `atrzSeComCd`              | §5-2 표               |
+| 소속 팀 `ognzSn`                      | `ognzSn`                   |                       |
+| `userUnqId`                           | `userUuid`                 | 문자열(UUID)로 직렬화 |
+
+---
+
+## 7. UI 구현 가이드
+
+### 7-1. 기술 스택·원칙
+
+- **공통 컴포넌트**: `@common/components` (`Button`, `Badge`, `Card` 또는 섹션 레이아웃)
+- **데이터**: React Query — `useOgnzUserTree`, `useRvwMnpwMngPage`, `useSaveRvwMnpwMng`, `useDeleteRvwMnpwMng`
+- **상태**: `selectedPerson`(단일), `keyword`, `displayTree`, `expandedOgnzSnIds`, 블록별 배치 목록(서버 데이터 파생)
+- **조직도 검색**: `filterOgnzUserTree`, `collectExpandedOgnzSnIds` (`widgets/ognz-user-tree/lib` 또는 페이지 `lib`)
+- **저장 UX**: 별도 화면 저장 없음 — **[선택 인원 배치]** = `save` mutation 즉시 호출
+- **조직도 UI**: 결재선 관리 `ognz-user-tree.tsx`를 **widgets**로 승격해 공통화
+
+### 7-2. 모듈·파일 배치(제안)
+
+| 구분     | 경로                                                                               |
+| -------- | ---------------------------------------------------------------------------------- |
+| 라우트   | `apps/as/app/(with-base-layout)/rvw-mnpw-mng/page.tsx`                             |
+| 페이지   | `apps/as/src/pages/rvw-mnpw-mng/`                                                  |
+| UI       | `.../ui/rvw-mnpw-mng-page.tsx`, `rvw-mnpw-assignment-panel.tsx` 등                 |
+| model    | `.../model/selected-ognz-user.ts`, `rvw-mnpw-block-config.ts` (`atrzSeComCd` 상수) |
+| lib      | `.../lib/group-rvw-mnpw-by-atrz-se.ts` (목록 → B-1~B-4 분배)                       |
+| **위젯** | `apps/as/src/widgets/ognz-user-tree/` — 아래 이전 대상                             |
+| 엔티티   | `entities/user-organization/`, `entities/rvw-mnpw/` (구현 완료)                    |
+
+#### widgets/ognz-user-tree 이전 (결재선 → 공통)
+
+| 현재 (결재선 관리)                                     | 이전 후 (widgets)                                                                    |
+| ------------------------------------------------------ | ------------------------------------------------------------------------------------ |
+| `pages/approval-line-management/ui/ognz-user-tree.tsx` | `widgets/ognz-user-tree/ui/ognz-user-tree.tsx`                                       |
+| `pages/.../ui/ognz-user-tree-node.tsx`                 | `widgets/ognz-user-tree/ui/ognz-user-tree-node.tsx`                                  |
+| `pages/.../model/reviewer-option.ts`                   | `widgets/ognz-user-tree/model/selected-ognz-user.ts` (이름·필드 확장: `ognzSn` 필수) |
+| `pages/.../lib/filter-ognz-user-tree.ts`               | `widgets/ognz-user-tree/lib/filter-ognz-user-tree.ts` (**필수** — 검색 공통화)       |
+| `widgets/ognz-user-tree/index.ts`                      | `OgnzUserTree`, `OgnzUserTreeNode`, 타입 export                                      |
+
+결재선 `AprvrPickerDialog`는 `@/widgets/ognz-user-tree` import로 교체. 검토인력관리 페이지는 **인라인 조직도**(다이얼로그 없음)로 동일 위젯 사용.
+
+**`SelectedOgnzUser`** — `ReviewerOption` 확장:
+
+```typescript
+export interface SelectedOgnzUser {
+  userUuid: string; // OgnzUserTreeUserDto.userUnqId
+  userNm: string;
+  ognzSn: number;
+  ognzNm: string;
+  jbgdSeCd?: string;
+  jbpsSeCd?: string;
+}
+```
+
+### 7-3. 영역별 UI 매핑
+
+| 영역 | 주요 UI                                                              |
+| ---- | -------------------------------------------------------------------- |
+| A-1  | 검색 폼 (`Input` + 조회/초기화) — `AprvrPickerDialog` 90~103행 패턴  |
+| A-2  | `OgnzUserTree(nodes={displayTree})` + 선택 안내 + `useOgnzUserTree`  |
+| B-k  | 제목·Badge(count)·`선택 인원 배치`·배치 목록(또는 empty)             |
+| 공통 | 페이지 헤더·브레드크럼·2열 레이아웃 (`grid` / `flex`, 모바일은 스택) |
+
+### 7-4. 다이얼로그·라우팅
+
+| 항목       | 내용                                |
+| ---------- | ----------------------------------- |
+| 다이얼로그 | **없음** (조직도 인라인, 즉시 저장) |
+| 라우팅     | 메뉴 `검토인력관리` 단일 페이지     |
+
+### 7-5. 데이터 흐름(구현 요약)
+
+- **진입**: `useOgnzUserTree` → `displayTree = data` + `useRvwMnpwMngPage({ page: 0, size: N })` → 4패널.
+- **검색**: `keyword` 로컬 상태 → **[조회]** 시 `filterOgnzUserTree` + `collectExpandedOgnzSnIds` → `OgnzUserTree`에 `displayTree` 전달.
+- **초기화**: `keyword`·`displayTree`·`expandedOgnzSnIds` 리셋 (`selectedPerson` 유지).
+- **선택**: 트리 `onSelect` → `selectedPerson` (반드시 `ognzSn` 포함).
+- **배치**: `useSaveRvwMnpwMng().mutate({ atrzSeComCd, ognzSn, userUuid })` → `onSuccess`에서 `rvw-mnpw` query invalidate.
+- **삭제**: 목록 항목에서 `useDeleteRvwMnpwMng` — UI 확정 후 연결.
+
+### 7-6. 미확정 / 검증 필요
+
+- [ ] `ATRZ02`(검토2) 별도 블록 필요 여부
+- [ ] 권한(역할별 CRUD)

apps/as/next-env.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="next" />
-/// <reference types="next/image-types/global" />
-/// <reference types="next/navigation-types/compat/navigation" />
-
-// NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

apps/as/next.config.ts

@@ -1,6 +1,7 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
+  output: "standalone",
   reactStrictMode: true,
   transpilePackages: ["@common/assets"],
 };

apps/as/package.json

@@ -20,14 +20,16 @@
     "@faker-js/faker": "^9.9.0",
     "@frontend-opensource/use-react-hooks": "^1.1.4",
     "@hookform/resolvers": "^4.1.3",
+    "@radix-ui/react-tooltip": "^1.2.8",
     "@tanstack/react-query": "^5.75.5",
     "@tanstack/react-query-devtools": "^5.75.5",
     "@tanstack/react-table": "^8.21.2",
     "axios": "^1.8.1",
+    "class-variance-authority": "^0.7.1",
     "dayjs": "^1.11.13",
     "js-cookie": "^3.0.5",
     "lucide-react": "^0.474.0",
-    "next": "15.3.8",
+    "next": "15.5.18",
     "react-hook-form": "^7.54.2",
     "tus-js-client": "^4.3.1",
     "zod": "^3.24.2"

apps/as/src/app/layouts/base-layout.tsx

@@ -7,6 +7,7 @@ import { useQueryClient } from "@tanstack/react-query";
 
 import { useMenuStore } from "@/shared/lib";
 import { PageLayout } from "@/shared/ui/page-layout";
+import { authService } from "@/entities/auth";
 import type { MenuItem } from "@/entities/menu";
 import { BaseLayout } from "@common/components";
 
@@ -32,6 +33,7 @@ export function BaseLayoutWrapper({ children }: BaseLayoutWrapperProps) {
   return (
     <BaseLayout
       queryClient={queryClient}
+      authService={authService}
       currentPath={pathname ?? ""}
       handleMenuClick={handleMenuClick}
     >

apps/as/src/app/providers/index.tsx

@@ -27,7 +27,9 @@ export function Providers({ children }: ProvidersProps) {
           </AuthWrapper>
         </ConfirmProvider>
       </StoreProvider>
-      <ReactQueryDevtools initialIsOpen={false} />
+      <div style={{ fontSize: "1.4rem" }}>
+        <ReactQueryDevtools initialIsOpen={false} />
+      </div>
     </QueryClientProvider>
   );
 }

apps/as/src/entities/acntg/api/acntg-service.ts

@@ -2,15 +2,17 @@ import { client } from "@/shared/api";
 import { ENDPOINT } from "@/shared/config";
 import type { PageResponse } from "@/shared/model";
 
-import type {
-  AcntgSeMngResponseDto,
-  AcntgSeMngSaveRequestDto,
-  AcntgSeMngSearchDto,
-  AcntgSeMngService,
-  AcntgSeMngTreeDto,
+import {
+  ACNTG_SE_SAVE_MODE,
+  type AcntgSeMngPutRequestDto,
+  type AcntgSeMngResponseDto,
+  type AcntgSeMngSaveRequestDto,
+  type AcntgSeMngSearchDto,
+  type AcntgSeMngService,
+  type AcntgSeMngTreeDto,
 } from "../model/acntg-interface";
 
-const BASE = ENDPOINT.AS_COMMON_SERVICE.ACNTG_SE;
+const BASE = ENDPOINT.AS_SERVICE.ACNTG_SE;
 
 async function findAll(params: AcntgSeMngSearchDto): Promise<PageResponse<AcntgSeMngResponseDto>> {
   const response = await client.get<PageResponse<AcntgSeMngResponseDto>>(BASE, { params });
@@ -27,13 +29,17 @@ async function findById(acntgSeCd: string): Promise<AcntgSeMngResponseDto> {
   return response.data;
 }
 
-async function save(body: AcntgSeMngSaveRequestDto): Promise<string> {
-  const response = await client.post<string>(BASE, body);
+async function saveMulti(body: AcntgSeMngSaveRequestDto[]): Promise<AcntgSeMngResponseDto[]> {
+  const response = await client.post<AcntgSeMngResponseDto[]>(BASE, body);
   return response.data;
 }
 
-async function update(acntgSeCd: string, body: AcntgSeMngSaveRequestDto): Promise<string> {
-  const response = await client.put<string>(`${BASE}/${acntgSeCd}`, body);
+async function update(acntgSeCd: string, body: AcntgSeMngPutRequestDto): Promise<string> {
+  const response = await client.put<string>(`${BASE}/${acntgSeCd}`, {
+    ...body,
+    acntgSeCd,
+    mode: ACNTG_SE_SAVE_MODE.UPDATE,
+  });
   return response.data;
 }
 
@@ -46,7 +52,7 @@ export const acntgSeMngService = {
   findAll,
   findTree,
   findById,
-  save,
+  saveMulti,
   update,
   delete: deleteAcntgSeCd,
 } satisfies AcntgSeMngService;

apps/as/src/entities/acntg/api/queries.ts

@@ -2,11 +2,15 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 
 import { ENDPOINT } from "@/shared/config";
 
-import type { AcntgSeMngSaveRequestDto, AcntgSeMngSearchDto } from "../model/acntg-interface";
+import type {
+  AcntgSeMngPutRequestDto,
+  AcntgSeMngSaveRequestDto,
+  AcntgSeMngSearchDto,
+} from "../model/acntg-interface";
 
 import { acntgSeMngService } from "./acntg-service";
 
-const acntgSeMngBaseKey = [ENDPOINT.AS_COMMON_SERVICE.ACNTG_SE] as const;
+const acntgSeMngBaseKey = [ENDPOINT.AS_SERVICE.ACNTG_SE] as const;
 
 export function useAcntgSeMngPage(params: AcntgSeMngSearchDto) {
   return useQuery({
@@ -31,11 +35,11 @@ export function useAcntgSeMng(acntgSeCd: string | null | undefined) {
   });
 }
 
-export function useSaveAcntgSeMng() {
+export function useSaveMultiAcntgSeMng() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: (body: AcntgSeMngSaveRequestDto) => acntgSeMngService.save(body),
+    mutationFn: (body: AcntgSeMngSaveRequestDto[]) => acntgSeMngService.saveMulti(body),
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: acntgSeMngBaseKey });
     },
@@ -46,7 +50,7 @@ export function useUpdateAcntgSeMng() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: ({ acntgSeCd, body }: { acntgSeCd: string; body: AcntgSeMngSaveRequestDto }) =>
+    mutationFn: ({ acntgSeCd, body }: { acntgSeCd: string; body: AcntgSeMngPutRequestDto }) =>
       acntgSeMngService.update(acntgSeCd, body),
     onSuccess: (_data, { acntgSeCd }) => {
       queryClient.invalidateQueries({ queryKey: acntgSeMngBaseKey });

apps/as/src/entities/acntg/index.ts

@@ -4,7 +4,7 @@ export {
   useAcntgSeMngPage,
   useAcntgSeMngTree,
   useDeleteAcntgSeMng,
-  useSaveAcntgSeMng,
+  useSaveMultiAcntgSeMng,
   useUpdateAcntgSeMng,
 } from "./api/queries";
 export type {
@@ -13,5 +13,7 @@ export type {
   AcntgSeMngSearchDto,
   AcntgSeMngService,
   AcntgSeMngTreeDto,
+  AcntgSeSaveMode,
   BizCstTreeDto,
 } from "./model/acntg-interface";
+export { ACNTG_SE_SAVE_MODE } from "./model/acntg-interface";

apps/as/src/entities/acntg/model/acntg-interface.ts

@@ -1,5 +1,13 @@
 import type { PageableParams, PageResponse } from "@/shared/model";
 
+export const ACNTG_SE_SAVE_MODE = {
+  CREATE: "C",
+  UPDATE: "U",
+  DELETE: "D",
+} as const;
+
+export type AcntgSeSaveMode = (typeof ACNTG_SE_SAVE_MODE)[keyof typeof ACNTG_SE_SAVE_MODE];
+
 /** 백엔드 AcntgSeMngResponseDto */
 export interface AcntgSeMngResponseDto {
   acntgSeCd: string;
@@ -8,6 +16,7 @@ export interface AcntgSeMngResponseDto {
   cdLvNo: number;
   useYn: string;
   expln?: string;
+  sortSeq?: number;
   rgtr?: string;
   rgtrNm?: string;
   mdfr?: string;
@@ -24,6 +33,18 @@ export interface AcntgSeMngSearchDto extends PageableParams {
 
 /** 백엔드 AcntgSeMngSaveRequestDto */
 export interface AcntgSeMngSaveRequestDto {
+  acntgSeCd: string;
+  mode: AcntgSeSaveMode;
+  acntgSeCdNm: string;
+  upAcntgSeCd?: string;
+  cdLvNo: number;
+  useYn?: string;
+  expln?: string;
+  sortSeq?: number;
+}
+
+/** PUT /{acntgSeCd} 요청 (mode는 서비스에서 U로 설정) */
+export interface AcntgSeMngPutRequestDto {
   acntgSeCd: string;
   acntgSeCdNm: string;
   upAcntgSeCd?: string;
@@ -61,7 +82,7 @@ export interface AcntgSeMngService {
   findAll(params: AcntgSeMngSearchDto): Promise<PageResponse<AcntgSeMngResponseDto>>;
   findTree(): Promise<AcntgSeMngTreeDto[]>;
   findById(acntgSeCd: string): Promise<AcntgSeMngResponseDto>;
-  save(body: AcntgSeMngSaveRequestDto): Promise<string>;
-  update(acntgSeCd: string, body: AcntgSeMngSaveRequestDto): Promise<string>;
+  saveMulti(body: AcntgSeMngSaveRequestDto[]): Promise<AcntgSeMngResponseDto[]>;
+  update(acntgSeCd: string, body: AcntgSeMngPutRequestDto): Promise<string>;
   delete(acntgSeCd: string): Promise<string>;
 }

apps/as/src/entities/adstdstr/api/adstdstr-service.ts

@@ -0,0 +1,26 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+
+import type {
+  CmCdAdstDstrComboResponseDto,
+  CmCdAdstDstrService,
+} from "../model/adstdstr-interface";
+
+const BASE = ENDPOINT.AS_SERVICE.ADSTDSTR;
+
+async function findSidoCombo(): Promise<CmCdAdstDstrComboResponseDto[]> {
+  const response = await client.get<CmCdAdstDstrComboResponseDto[]>(`${BASE}/sido`);
+  return response.data;
+}
+
+async function findGugunCombo(sido: string): Promise<CmCdAdstDstrComboResponseDto[]> {
+  const response = await client.get<CmCdAdstDstrComboResponseDto[]>(`${BASE}/gugun`, {
+    params: { sido },
+  });
+  return response.data;
+}
+
+export const cmCdAdstDstrService = {
+  findSidoCombo,
+  findGugunCombo,
+} satisfies CmCdAdstDstrService;

apps/as/src/entities/adstdstr/api/queries.ts

@@ -0,0 +1,22 @@
+import { useQuery } from "@tanstack/react-query";
+
+import { ENDPOINT } from "@/shared/config";
+
+import { cmCdAdstDstrService } from "./adstdstr-service";
+
+const cmCdAdstDstrBaseKey = [ENDPOINT.AS_SERVICE.ADSTDSTR] as const;
+
+export function useFindSidoCombo() {
+  return useQuery({
+    queryKey: [...cmCdAdstDstrBaseKey, "findSidoCombo"],
+    queryFn: () => cmCdAdstDstrService.findSidoCombo(),
+  });
+}
+
+export function useFindGugunCombo(sido: string) {
+  return useQuery({
+    queryKey: [...cmCdAdstDstrBaseKey, "findGugunCombo", sido],
+    queryFn: () => cmCdAdstDstrService.findGugunCombo(sido),
+    enabled: Boolean(sido),
+  });
+}

apps/as/src/entities/adstdstr/index.ts

@@ -0,0 +1,6 @@
+export { cmCdAdstDstrService } from "./api/adstdstr-service";
+export { useFindGugunCombo, useFindSidoCombo } from "./api/queries";
+export type {
+  CmCdAdstDstrComboResponseDto,
+  CmCdAdstDstrService,
+} from "./model/adstdstr-interface";

apps/as/src/entities/adstdstr/model/adstdstr-interface.ts

@@ -0,0 +1,11 @@
+/** 백엔드 CmCdAdstDstrComboResponseDto */
+export interface CmCdAdstDstrComboResponseDto {
+  adstDstrCd: string;
+  adstDstrNm: string;
+}
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface CmCdAdstDstrService {
+  findSidoCombo(): Promise<CmCdAdstDstrComboResponseDto[]>;
+  findGugunCombo(sido: string): Promise<CmCdAdstDstrComboResponseDto[]>;
+}

apps/as/src/entities/attach/api/attach-service.ts

@@ -0,0 +1,22 @@
+import { AxiosResponse } from "axios";
+
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+
+import type { AttachService } from "../model/attach-interface";
+
+async function deleteAttachmentByAtflId(atflId: string): Promise<void> {
+  if (!atflId) return;
+  await client.delete(`${ENDPOINT.ATTACH_SERVICE.ATTACHMENTS}/${atflId}`);
+}
+
+async function downloadAttachmentByAtflCd(atflCd: string): Promise<AxiosResponse> {
+  return await client.get<Blob>(`${ENDPOINT.ATTACH_SERVICE.DOWNLOAD}/${atflCd}`, {
+    responseType: "blob",
+  });
+}
+
+export const attachService = {
+  deleteAttachmentByAtflId,
+  downloadAttachmentByAtflCd,
+} satisfies AttachService;

apps/as/src/entities/attach/api/queries.ts

@@ -0,0 +1,39 @@
+import { useMutation } from "@tanstack/react-query";
+
+import { ENDPOINT } from "@/shared/config";
+
+import { parseFilenameFromResponse } from "../lib/parse-filename-from-response";
+
+import { attachService } from "./attach-service";
+
+const attachBaseKey = [ENDPOINT.ATTACH_SERVICE.ATTACHMENTS] as const;
+const attachDownloadBaseKey = [ENDPOINT.ATTACH_SERVICE.DOWNLOAD] as const;
+
+export function useDeleteAttachment() {
+  return useMutation({
+    mutationKey: [...attachBaseKey, "delete"],
+    mutationFn: (atflId: string) => attachService.deleteAttachmentByAtflId(atflId),
+  });
+}
+
+export function useDownloadAttachmentByAtflCd() {
+  return useMutation({
+    mutationKey: [...attachDownloadBaseKey, "download"],
+    mutationFn: async (atflCd: string) => {
+      const response = await attachService.downloadAttachmentByAtflCd(atflCd);
+      const filename = parseFilenameFromResponse(response);
+
+      const blob = new Blob([response.data]);
+      const url = window.URL.createObjectURL(blob);
+      const link = document.createElement("a");
+
+      link.href = url;
+      link.download = filename;
+      document.body.appendChild(link);
+      link.click();
+
+      window.URL.revokeObjectURL(url);
+      document.body.removeChild(link);
+    },
+  });
+}

apps/as/src/entities/attach/index.ts

@@ -0,0 +1,3 @@
+export { attachService } from "./api/attach-service";
+export { useDeleteAttachment, useDownloadAttachmentByAtflCd } from "./api/queries";
+export type { Attach, AttachService } from "./model/attach-interface";

apps/as/src/entities/attach/lib/parse-filename-from-response.ts

@@ -0,0 +1,11 @@
+import type { AxiosResponse } from "axios";
+
+export function parseFilenameFromResponse(response: AxiosResponse): string {
+  const contentDisposition = response.headers["content-disposition"];
+  if (!contentDisposition) return "download";
+
+  const filenameMatch = contentDisposition.match(/filename\*=UTF-8''([^;]+)/);
+  if (!filenameMatch?.[1]) return "download";
+
+  return decodeURIComponent(filenameMatch[1]);
+}

apps/as/src/entities/attach/model/attach-interface.ts

@@ -0,0 +1,22 @@
+import { AxiosResponse } from "axios";
+
+/** 백엔드 AtflMngResponseDto */
+export interface Attach {
+  atflCd: string;
+  atflSn: number;
+  atflId: string;
+  physFileNm: string;
+  orgnlFileNm: string;
+  atflFlieSz: number;
+  atflType: string;
+  dwnldNocs: number;
+  delYn: string;
+  lnkgDmnId: string;
+  lnkgDmnNm: string;
+  regDt: string;
+}
+
+export interface AttachService {
+  deleteAttachmentByAtflId: (atflId: string) => Promise<void>;
+  downloadAttachmentByAtflCd: (atflCd: string) => Promise<AxiosResponse>;
+}

apps/as/src/entities/auth/api/auth-service.ts

@@ -1,13 +1,20 @@
 import { ACCESS_TOKEN, AUTH_USER_ID, CLAIM_NAME, ENDPOINT } from "@/shared/config";
-import { getRemainingMs } from "@common/auth";
+import {
+  type AuthPayload,
+  type AuthService,
+  clearDeviceId,
+  getOrCreateDeviceId,
+} from "@common/auth";
 
-import { clearAuthToken, setToken, setupRefreshTimer } from "../lib/token-manager";
-import type { AuthPayload, AuthService } from "../model/auth-interface";
+import { clearRefreshTimer, setToken, tokenManager } from "../lib/token-manager";
 
 async function login(payload: AuthPayload): Promise<void> {
   const response = await fetch(`/api/proxy${ENDPOINT.USER_SERVICE.LOGIN}`, {
     method: "POST",
-    headers: { "Content-Type": "application/json" },
+    headers: {
+      "Content-Type": "application/json",
+      "X-Device-Id": getOrCreateDeviceId(),
+    },
     body: JSON.stringify(payload),
   });
 
@@ -23,10 +30,10 @@ async function login(payload: AuthPayload): Promise<void> {
   setToken(CLAIM_NAME, accessToken);
   setToken(AUTH_USER_ID, tokenId);
 
-  const remainingMs = getRemainingMs(accessToken);
-  if (remainingMs > 0) {
-    setupRefreshTimer(silentRefresh, remainingMs);
-  }
+  // const remainingMs = getRemainingMs(accessToken);
+  // if (remainingMs > 0) {
+  //   setupRefreshTimer(silentRefresh, remainingMs);
+  // }
 }
 
 async function silentRefresh(): Promise<void> {
@@ -34,6 +41,9 @@ async function silentRefresh(): Promise<void> {
   try {
     const response = await fetch(`/api/proxy${ENDPOINT.USER_SERVICE.SILENT_REFRESH}`, {
       method: "PUT",
+      headers: {
+        "X-Device-Id": getOrCreateDeviceId(),
+      },
     });
 
     const data = await response.json();
@@ -52,13 +62,13 @@ async function silentRefresh(): Promise<void> {
     setToken(CLAIM_NAME, accessToken);
     setToken(AUTH_USER_ID, tokenId);
 
-    const remainingMs = getRemainingMs(accessToken);
-    if (remainingMs > 0) {
-      setupRefreshTimer(silentRefresh, remainingMs);
-    }
+    // const remainingMs = getRemainingMs(accessToken);
+    // if (remainingMs > 0) {
+    //   setupRefreshTimer(silentRefresh, remainingMs);
+    // }
   } catch (error) {
     console.error(`[silentRefresh] Failed at ${new Date().toISOString()}`, error);
-    clearAuthToken();
+    tokenManager.clearAuthToken();
     if (typeof window !== "undefined") {
       window.dispatchEvent(new CustomEvent("auth:logout"));
     }
@@ -66,7 +76,9 @@ async function silentRefresh(): Promise<void> {
 }
 
 async function logout(): Promise<void> {
-  clearAuthToken();
+  tokenManager.clearAuthToken();
+  clearDeviceId();
+
   if (typeof window !== "undefined") {
     window.dispatchEvent(new CustomEvent("auth:logout"));
   }
@@ -75,5 +87,6 @@ async function logout(): Promise<void> {
 export const authService: AuthService = {
   login,
   silentRefresh,
+  declineSessionExtend: clearRefreshTimer,
   logout,
 };

apps/as/src/entities/auth/lib/token-manager.ts

@@ -8,7 +8,7 @@ export const {
   setToken,
   removeToken,
   setupRefreshTimer,
-  clearAuthToken,
+  clearRefreshTimer,
   getAccessToken,
   getRefreshToken,
   getUserId,

apps/as/src/entities/auth/model/auth-interface.ts

@@ -1,10 +0,0 @@
-export interface AuthPayload {
-  userId: string;
-  password: string;
-}
-
-export interface AuthService {
-  login(payload: AuthPayload): Promise<void>;
-  silentRefresh(): Promise<void>;
-  logout(): Promise<void>;
-}

apps/as/src/entities/bns-if/api/bns-if-service.ts

@@ -0,0 +1,47 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+
+import { buildBnsSearchDto } from "../lib/build-bns-search-dto";
+import type {
+  BnsDetailResponseWrapperDto,
+  BnsIfService,
+  BnsListResponseWrapperDto,
+  BnsSearchDto,
+  EmCodeListResponseDto,
+} from "../model/bns-if-interface";
+
+const BASE = ENDPOINT.AS_SERVICE.BNS_IF;
+
+async function getBnsList(params: BnsSearchDto): Promise<BnsListResponseWrapperDto> {
+  const response = await client.get<BnsListResponseWrapperDto>(`${BASE}/bns`, {
+    params: buildBnsSearchDto(params),
+  });
+  return response.data;
+}
+
+async function getBnsDetail(
+  gbn: string,
+  yr: string,
+  seqNo: string,
+): Promise<BnsDetailResponseWrapperDto> {
+  const response = await client.get<BnsDetailResponseWrapperDto>(`${BASE}/bns/detail`, {
+    params: { gbn, yr, seqNo },
+  });
+  return response.data;
+}
+
+async function getEmCodeList(
+  dpmCd?: string,
+  lclgvrnmntCd?: string,
+): Promise<EmCodeListResponseDto> {
+  const response = await client.get<EmCodeListResponseDto>(`${BASE}/emCodeList`, {
+    params: { dpmCd, lclgvrnmntCd },
+  });
+  return response.data;
+}
+
+export const bnsIfService = {
+  getBnsList,
+  getBnsDetail,
+  getEmCodeList,
+} satisfies BnsIfService;

apps/as/src/entities/bns-if/api/queries.ts

@@ -0,0 +1,33 @@
+import { keepPreviousData, useQuery } from "@tanstack/react-query";
+
+import { ENDPOINT } from "@/shared/config";
+
+import type { BnsSearchDto } from "../model/bns-if-interface";
+
+import { bnsIfService } from "./bns-if-service";
+
+const bnsIfBaseKey = [ENDPOINT.AS_SERVICE.BNS_IF] as const;
+
+export function useBnsList(params: BnsSearchDto, options?: { enabled?: boolean }) {
+  return useQuery({
+    queryKey: [...bnsIfBaseKey, "getBnsList", params],
+    queryFn: () => bnsIfService.getBnsList(params),
+    enabled: options?.enabled,
+    placeholderData: keepPreviousData,
+  });
+}
+
+export function useBnsDetail(gbn: string, yr: string, seqNo: string) {
+  return useQuery({
+    queryKey: [...bnsIfBaseKey, "getBnsDetail", gbn, yr, seqNo],
+    queryFn: () => bnsIfService.getBnsDetail(gbn, yr, seqNo),
+    enabled: Boolean(gbn && yr && seqNo),
+  });
+}
+
+export function useEmCodeList(dpmCd?: string, lclgvrnmntCd?: string) {
+  return useQuery({
+    queryKey: [...bnsIfBaseKey, "getEmCodeList", dpmCd, lclgvrnmntCd],
+    queryFn: () => bnsIfService.getEmCodeList(dpmCd, lclgvrnmntCd),
+  });
+}

apps/as/src/entities/bns-if/index.ts

@@ -0,0 +1,13 @@
+export { bnsIfService } from "./api/bns-if-service";
+export { useBnsDetail, useBnsList, useEmCodeList } from "./api/queries";
+export { buildBnsSearchDto } from "./lib/build-bns-search-dto";
+export type {
+  BnsDetailResponseDto,
+  BnsDetailResponseWrapperDto,
+  BnsIfService,
+  BnsListResponseDto,
+  BnsListResponseWrapperDto,
+  BnsSearchDto,
+  EmCodeItemDto,
+  EmCodeListResponseDto,
+} from "./model/bns-if-interface";

apps/as/src/entities/bns-if/lib/build-bns-search-dto.ts

@@ -0,0 +1,20 @@
+import type { BnsSearchDto } from "../model/bns-if-interface";
+
+export function buildBnsSearchDto(input: {
+  cPage: number;
+  searchStartYear?: string;
+  searchSido?: string;
+  searchGugun?: string;
+}): BnsSearchDto {
+  const dto: BnsSearchDto = { cPage: input.cPage };
+
+  const year = input.searchStartYear?.trim();
+  const sido = input.searchSido?.trim();
+  const gugun = input.searchGugun?.trim();
+
+  if (year) dto.searchStartYear = year;
+  if (sido) dto.searchSido = sido;
+  if (gugun) dto.searchGugun = gugun;
+
+  return dto;
+}

apps/as/src/entities/bns-if/model/bns-if-interface.ts

@@ -0,0 +1,125 @@
+/** 백엔드 BnsSearchDto */
+export interface BnsSearchDto {
+  searchStartYear?: string;
+  cPage: number;
+  searchSido?: string;
+  searchGugun?: string;
+}
+
+/** 백엔드 BnsListResponseWrapperDto */
+export interface BnsListResponseWrapperDto {
+  list: BnsListResponseDto[];
+  cnt: number;
+}
+
+/** 백엔드 BnsListResponseDto */
+export interface BnsListResponseDto {
+  cPage: number;
+  gbn: number;
+  chk: number;
+  seqNo: string;
+  rgnNm: string;
+  sido: string;
+  gugun: string;
+  bzCd: string;
+  bzNm: string;
+  yr: string;
+  strtYr: string;
+  edYr: string;
+  totBzamt: string;
+}
+
+/** 백엔드 BnsDetailResponseWrapperDto */
+export interface BnsDetailResponseWrapperDto {
+  saup: unknown;
+  detail: BnsDetailResponseDto;
+}
+
+/** 백엔드 BnsDetailResponseDto */
+export interface BnsDetailResponseDto {
+  cPage: number;
+  seqNo: string;
+  confBzCd: string;
+  chngDgr: string;
+  yr: string;
+  sido: string;
+  gugun: string;
+  rvbsnNm: string;
+  lgbsnNm: string;
+  mdmbsnNm: string;
+  lclgvrnmntNm: string;
+  accKdNm: string;
+  bzKdNm: string;
+  untBzNm: string;
+  dtlBzNm: string;
+  mevBzNm: string;
+  ddtlBzNm: string;
+  strtYr: string;
+  edYr: string;
+  aidRt: string;
+  bzStatus: string;
+  bzCd: string;
+  bzNm: string;
+  bzLoc: string;
+  efflWqltStndrdNm: string;
+  goalYear: string;
+  bssProm: string;
+  uppPlan: string;
+  techInsp: string;
+  bssCont: string;
+  rmk: string;
+  inflBscFctNm: string;
+  inflBscFctCd: string;
+  trtMtd: string;
+  swrExtns: string;
+  swrChng: string;
+  swrRnvt: string;
+  totFamNum: string;
+  pumpCnt: string;
+  rvWbsn: string;
+  rvText: string;
+  imprvExpctFlw: string;
+  imprvExpctWqlt: string;
+  trtplntPlEfflWqlt: string;
+  wqltAvg: string;
+  wqltHgh: string;
+  wqltLow: string;
+  stdCost: string;
+  bzEtc: string;
+  bscFctCd: string;
+  bscFctNm: string;
+  fctCpc: string;
+  fctCpcAfr: string;
+  trtDstrArea: string;
+  trtDstrAreaAfr: string;
+  swrTrtPopl: string;
+  swrTrtPoplAfr: string;
+  adstPopl: string;
+}
+
+/** 백엔드 EmCodeItemDto */
+export interface EmCodeItemDto {
+  code: string;
+  data: string;
+  upCode: string;
+}
+
+/** 백엔드 EmCodeListResponseDto */
+export interface EmCodeListResponseDto {
+  rvbsnList: EmCodeItemDto[];
+  lgbsnList: EmCodeItemDto[];
+  mdmbsnList: EmCodeItemDto[];
+  accList: EmCodeItemDto[];
+  bzList: EmCodeItemDto[];
+  untList: EmCodeItemDto[];
+  dtlList: EmCodeItemDto[];
+  mevList: EmCodeItemDto[];
+  ddtlList: EmCodeItemDto[];
+}
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface BnsIfService {
+  getBnsList(params: BnsSearchDto): Promise<BnsListResponseWrapperDto>;
+  getBnsDetail(gbn: string, yr: string, seqNo: string): Promise<BnsDetailResponseWrapperDto>;
+  getEmCodeList(dpmCd?: string, lclgvrnmntCd?: string): Promise<EmCodeListResponseDto>;
+}

apps/as/src/entities/cklst/api/cklst-artcl-service.ts

@@ -11,33 +11,25 @@ import type {
   CklstArtclUpdateRequest,
 } from "../model/cklst-artcl-interface";
 
+const BASE = ENDPOINT.AS_SERVICE.CKLST_ARTCL;
+
 async function findPage(params: CklstArtclSearchParams): Promise<PageResponse<CklstArtcl>> {
-  const response = await client.get<PageResponse<CklstArtcl>>(
-    ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_ARTCL,
-    { params },
-  );
+  const response = await client.get<PageResponse<CklstArtcl>>(BASE, { params });
   return response.data;
 }
 
 async function findByCklstSn(cklstSn: number): Promise<CklstArtcl[]> {
-  const response = await client.get<CklstArtcl[]>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_ARTCL}/by-cklst/${cklstSn}`,
-  );
+  const response = await client.get<CklstArtcl[]>(`${BASE}/by-cklst/${cklstSn}`);
   return response.data;
 }
 
 async function findById(cklstArtclSn: number, cklstSn: number): Promise<CklstArtcl> {
-  const response = await client.get<CklstArtcl>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_ARTCL}/${cklstArtclSn}/${cklstSn}`,
-  );
+  const response = await client.get<CklstArtcl>(`${BASE}/${cklstArtclSn}/${cklstSn}`);
   return response.data;
 }
 
 async function create(body: CklstArtclSaveRequest): Promise<CklstArtclId> {
-  const response = await client.post<CklstArtclId>(
-    ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_ARTCL,
-    body,
-  );
+  const response = await client.post<CklstArtclId>(BASE, body);
   return response.data;
 }
 
@@ -46,17 +38,12 @@ async function update(
   cklstSn: number,
   body: CklstArtclUpdateRequest,
 ): Promise<CklstArtclId> {
-  const response = await client.put<CklstArtclId>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_ARTCL}/${cklstArtclSn}/${cklstSn}`,
-    body,
-  );
+  const response = await client.put<CklstArtclId>(`${BASE}/${cklstArtclSn}/${cklstSn}`, body);
   return response.data;
 }
 
 async function remove(cklstArtclSn: number, cklstSn: number): Promise<CklstArtclId> {
-  const response = await client.delete<CklstArtclId>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_ARTCL}/${cklstArtclSn}/${cklstSn}`,
-  );
+  const response = await client.delete<CklstArtclId>(`${BASE}/${cklstArtclSn}/${cklstSn}`);
   return response.data;
 }
 

apps/as/src/entities/cklst/api/cklst-mng-service.ts

@@ -11,40 +11,39 @@ import type {
   CklstTreeSearchParams,
 } from "../model/cklst-mng-interface";
 
+const BASE = ENDPOINT.AS_SERVICE.CKLST;
+
 async function findPage(params: CklstMngSearchParams): Promise<PageResponse<CklstMng>> {
-  const response = await client.get<PageResponse<CklstMng>>(ENDPOINT.AS_CHECKLIST_SERVICE.CKLST, {
+  const response = await client.get<PageResponse<CklstMng>>(BASE, {
     params,
   });
   return response.data;
 }
 
 async function findById(cklstSn: number): Promise<CklstMng> {
-  const response = await client.get<CklstMng>(`${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST}/${cklstSn}`);
+  const response = await client.get<CklstMng>(`${BASE}/${cklstSn}`);
   return response.data;
 }
 
 async function findTree(params: CklstTreeSearchParams): Promise<CklstTreeNode[]> {
-  const response = await client.get<CklstTreeNode[]>(`${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST}/list/tree`, {
+  const response = await client.get<CklstTreeNode[]>(`${BASE}/list/tree`, {
     params,
   });
   return response.data;
 }
 
 async function create(body: CklstMngSaveRequest): Promise<number> {
-  const response = await client.post<number>(ENDPOINT.AS_CHECKLIST_SERVICE.CKLST, body);
+  const response = await client.post<number>(BASE, body);
   return response.data;
 }
 
 async function update(cklstSn: number, body: CklstMngSaveRequest): Promise<number> {
-  const response = await client.put<number>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST}/${cklstSn}`,
-    body,
-  );
+  const response = await client.put<number>(`${BASE}/${cklstSn}`, body);
   return response.data;
 }
 
 async function remove(cklstSn: number): Promise<number> {
-  const response = await client.delete<number>(`${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST}/${cklstSn}`);
+  const response = await client.delete<number>(`${BASE}/${cklstSn}`);
   return response.data;
 }
 

apps/as/src/entities/cklst/api/cklst-rvw-service.ts

@@ -11,18 +11,15 @@ import type {
   CklstRvwUpdateRequest,
 } from "../model/cklst-rvw-interface";
 
+const BASE = ENDPOINT.AS_SERVICE.CKLST_RVW;
+
 async function findPage(params: CklstRvwSearchParams): Promise<PageResponse<CklstRvw>> {
-  const response = await client.get<PageResponse<CklstRvw>>(
-    ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_RVW,
-    { params },
-  );
+  const response = await client.get<PageResponse<CklstRvw>>(BASE, { params });
   return response.data;
 }
 
 async function findByArtcl(cklstSn: number, cklstArtclSn: number): Promise<CklstRvw[]> {
-  const response = await client.get<CklstRvw[]>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_RVW}/by-artcl/${cklstSn}/${cklstArtclSn}`,
-  );
+  const response = await client.get<CklstRvw[]>(`${BASE}/by-artcl/${cklstSn}/${cklstArtclSn}`);
   return response.data;
 }
 
@@ -31,17 +28,12 @@ async function findById(
   cklstArtclSn: number,
   cklstSn: number,
 ): Promise<CklstRvw> {
-  const response = await client.get<CklstRvw>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_RVW}/${cklstRvwSn}/${cklstArtclSn}/${cklstSn}`,
-  );
+  const response = await client.get<CklstRvw>(`${BASE}/${cklstRvwSn}/${cklstArtclSn}/${cklstSn}`);
   return response.data;
 }
 
 async function create(body: CklstRvwSaveRequest): Promise<CklstRvwId> {
-  const response = await client.post<CklstRvwId>(
-    ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_RVW,
-    body,
-  );
+  const response = await client.post<CklstRvwId>(BASE, body);
   return response.data;
 }
 
@@ -52,7 +44,7 @@ async function update(
   body: CklstRvwUpdateRequest,
 ): Promise<CklstRvwId> {
   const response = await client.put<CklstRvwId>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_RVW}/${cklstRvwSn}/${cklstArtclSn}/${cklstSn}`,
+    `${BASE}/${cklstRvwSn}/${cklstArtclSn}/${cklstSn}`,
     body,
   );
   return response.data;
@@ -64,7 +56,7 @@ async function remove(
   cklstSn: number,
 ): Promise<CklstRvwId> {
   const response = await client.delete<CklstRvwId>(
-    `${ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_RVW}/${cklstRvwSn}/${cklstArtclSn}/${cklstSn}`,
+    `${BASE}/${cklstRvwSn}/${cklstArtclSn}/${cklstSn}`,
   );
   return response.data;
 }

apps/as/src/entities/cklst/api/queries.ts

@@ -18,9 +18,9 @@ import { cklstArtclService } from "./cklst-artcl-service";
 import { cklstMngService } from "./cklst-mng-service";
 import { cklstRvwService } from "./cklst-rvw-service";
 
-const cklstMngBaseKey = [ENDPOINT.AS_CHECKLIST_SERVICE.CKLST] as const;
-const cklstArtclBaseKey = [ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_ARTCL] as const;
-const cklstRvwBaseKey = [ENDPOINT.AS_CHECKLIST_SERVICE.CKLST_RVW] as const;
+const cklstMngBaseKey = [ENDPOINT.AS_SERVICE.CKLST] as const;
+const cklstArtclBaseKey = [ENDPOINT.AS_SERVICE.CKLST_ARTCL] as const;
+const cklstRvwBaseKey = [ENDPOINT.AS_SERVICE.CKLST_RVW] as const;
 
 export function useCklstMngPage(params: CklstMngSearchParams) {
   return useQuery({

apps/as/src/entities/cklst/model/cklst-mng-interface.ts

@@ -24,6 +24,8 @@ export interface CklstTreeNode {
   rvwCn: string;
   bchckUseYn: "Y" | "N";
   sortSeq: number;
+  // optional: backend may include the taskSeComCd per node
+  taskSeComCd?: string;
 }
 
 export interface CklstTreeSearchParams {

apps/as/src/entities/cnstp/api/cnstp-service.ts

@@ -2,15 +2,17 @@ import { client } from "@/shared/api";
 import { ENDPOINT } from "@/shared/config";
 import type { PageResponse } from "@/shared/model";
 
-import type {
-  CnstpSeMngResponseDto,
-  CnstpSeMngSaveRequestDto,
-  CnstpSeMngSearchDto,
-  CnstpSeMngService,
-  CnstpSeMngTreeDto,
+import {
+  CNSTP_SE_SAVE_MODE,
+  type CnstpSeMngPutRequestDto,
+  type CnstpSeMngResponseDto,
+  type CnstpSeMngSaveRequestDto,
+  type CnstpSeMngSearchDto,
+  type CnstpSeMngService,
+  type CnstpSeMngTreeDto,
 } from "../model/cnstp-interface";
 
-const BASE = ENDPOINT.AS_COMMON_SERVICE.CNSTP_SE;
+const BASE = ENDPOINT.AS_SERVICE.CNSTP_SE;
 
 async function findAll(params: CnstpSeMngSearchDto): Promise<PageResponse<CnstpSeMngResponseDto>> {
   const response = await client.get<PageResponse<CnstpSeMngResponseDto>>(BASE, { params });
@@ -27,13 +29,17 @@ async function findById(cnstpSeCd: string): Promise<CnstpSeMngResponseDto> {
   return response.data;
 }
 
-async function save(body: CnstpSeMngSaveRequestDto): Promise<string> {
-  const response = await client.post<string>(BASE, body);
+async function saveMulti(body: CnstpSeMngSaveRequestDto[]): Promise<CnstpSeMngResponseDto[]> {
+  const response = await client.post<CnstpSeMngResponseDto[]>(BASE, body);
   return response.data;
 }
 
-async function update(cnstpSeCd: string, body: CnstpSeMngSaveRequestDto): Promise<string> {
-  const response = await client.put<string>(`${BASE}/${cnstpSeCd}`, body);
+async function update(cnstpSeCd: string, body: CnstpSeMngPutRequestDto): Promise<string> {
+  const response = await client.put<string>(`${BASE}/${cnstpSeCd}`, {
+    ...body,
+    cnstpSeCd,
+    mode: CNSTP_SE_SAVE_MODE.UPDATE,
+  });
   return response.data;
 }
 
@@ -46,7 +52,7 @@ export const cnstpSeMngService = {
   findAll,
   findTree,
   findById,
-  save,
+  saveMulti,
   update,
   delete: deleteCnstpSeCd,
 } satisfies CnstpSeMngService;

apps/as/src/entities/cnstp/api/queries.ts

@@ -2,11 +2,15 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 
 import { ENDPOINT } from "@/shared/config";
 
-import type { CnstpSeMngSaveRequestDto, CnstpSeMngSearchDto } from "../model/cnstp-interface";
+import type {
+  CnstpSeMngPutRequestDto,
+  CnstpSeMngSaveRequestDto,
+  CnstpSeMngSearchDto,
+} from "../model/cnstp-interface";
 
 import { cnstpSeMngService } from "./cnstp-service";
 
-const cnstpSeMngBaseKey = [ENDPOINT.AS_COMMON_SERVICE.CNSTP_SE] as const;
+const cnstpSeMngBaseKey = [ENDPOINT.AS_SERVICE.CNSTP_SE] as const;
 
 export function useCnstpSeMngPage(params: CnstpSeMngSearchDto) {
   return useQuery({
@@ -31,11 +35,11 @@ export function useCnstpSeMng(cnstpSeCd: string | null | undefined) {
   });
 }
 
-export function useSaveCnstpSeMng() {
+export function useSaveMultiCnstpSeMng() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: (body: CnstpSeMngSaveRequestDto) => cnstpSeMngService.save(body),
+    mutationFn: (body: CnstpSeMngSaveRequestDto[]) => cnstpSeMngService.saveMulti(body),
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: cnstpSeMngBaseKey });
     },
@@ -46,7 +50,7 @@ export function useUpdateCnstpSeMng() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: ({ cnstpSeCd, body }: { cnstpSeCd: string; body: CnstpSeMngSaveRequestDto }) =>
+    mutationFn: ({ cnstpSeCd, body }: { cnstpSeCd: string; body: CnstpSeMngPutRequestDto }) =>
       cnstpSeMngService.update(cnstpSeCd, body),
     onSuccess: (_data, { cnstpSeCd }) => {
       queryClient.invalidateQueries({ queryKey: cnstpSeMngBaseKey });

apps/as/src/entities/cnstp/index.ts

@@ -4,7 +4,7 @@ export {
   useCnstpSeMngPage,
   useCnstpSeMngTree,
   useDeleteCnstpSeMng,
-  useSaveCnstpSeMng,
+  useSaveMultiCnstpSeMng,
   useUpdateCnstpSeMng,
 } from "./api/queries";
 export type {
@@ -14,4 +14,6 @@ export type {
   CnstpSeMngSearchDto,
   CnstpSeMngService,
   CnstpSeMngTreeDto,
+  CnstpSeSaveMode,
 } from "./model/cnstp-interface";
+export { CNSTP_SE_SAVE_MODE } from "./model/cnstp-interface";

apps/as/src/entities/cnstp/model/cnstp-interface.ts

@@ -1,5 +1,13 @@
 import type { PageableParams, PageResponse } from "@/shared/model";
 
+export const CNSTP_SE_SAVE_MODE = {
+  CREATE: "C",
+  UPDATE: "U",
+  DELETE: "D",
+} as const;
+
+export type CnstpSeSaveMode = (typeof CNSTP_SE_SAVE_MODE)[keyof typeof CNSTP_SE_SAVE_MODE];
+
 /** 백엔드 CnstpSeMngResponseDto */
 export interface CnstpSeMngResponseDto {
   cnstpSeCd: string;
@@ -8,6 +16,7 @@ export interface CnstpSeMngResponseDto {
   cdLvNo: number;
   useYn: string;
   expln?: string;
+  sortSeq?: number;
   rgtr?: string;
   rgtrNm?: string;
   mdfr?: string;
@@ -24,6 +33,18 @@ export interface CnstpSeMngSearchDto extends PageableParams {
 
 /** 백엔드 CnstpSeMngSaveRequestDto */
 export interface CnstpSeMngSaveRequestDto {
+  cnstpSeCd: string;
+  mode: CnstpSeSaveMode;
+  cnstpSeCdNm?: string;
+  upCnstpCd?: string;
+  cdLvNo?: number;
+  useYn?: string;
+  expln?: string;
+  sortSeq?: number;
+}
+
+/** PUT /{cnstpSeCd} 요청 (mode는 서비스에서 U로 설정) */
+export interface CnstpSeMngPutRequestDto {
   cnstpSeCd: string;
   cnstpSeCdNm?: string;
   upCnstpCd?: string;
@@ -61,7 +82,7 @@ export interface CnstpSeMngService {
   findAll(params: CnstpSeMngSearchDto): Promise<PageResponse<CnstpSeMngResponseDto>>;
   findTree(): Promise<CnstpSeMngTreeDto[]>;
   findById(cnstpSeCd: string): Promise<CnstpSeMngResponseDto>;
-  save(body: CnstpSeMngSaveRequestDto): Promise<string>;
-  update(cnstpSeCd: string, body: CnstpSeMngSaveRequestDto): Promise<string>;
+  saveMulti(body: CnstpSeMngSaveRequestDto[]): Promise<CnstpSeMngResponseDto[]>;
+  update(cnstpSeCd: string, body: CnstpSeMngPutRequestDto): Promise<string>;
   delete(cnstpSeCd: string): Promise<string>;
 }

apps/as/src/entities/code/ui/code-select.tsx

@@ -18,13 +18,7 @@ interface CodeSelectProps extends React.ComponentPropsWithoutRef<typeof Select>
   className?: string;
 }
 
-function CodeSelect({
-  upCd,
-  useYn,
-  placeholder = "선택",
-  className,
-  ...props
-}: CodeSelectProps) {
+function CodeSelect({ upCd, useYn, placeholder = "선택", className, ...props }: CodeSelectProps) {
   const listQuery = useCodeList(useYn ? undefined : upCd);
   const listByUseYnQuery = useCodeListByUseYn(useYn ? upCd : undefined, useYn ?? "");
 
@@ -34,7 +28,7 @@ function CodeSelect({
   return (
     <Select {...props} disabled={props.disabled || isLoading}>
       <SelectTrigger className={cn("w-[12rem]", className)}>
-        <SelectValue placeholder={isLoading ? "로딩 중…" : placeholder} />
+        <SelectValue placeholder={placeholder} />
       </SelectTrigger>
       <SelectContent>
         {codes?.map((item) => (

apps/as/src/entities/design-cnstn/api/design-cnstn-biz-cst-service.ts

@@ -0,0 +1,58 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type { PageResponse } from "@/shared/model";
+
+import type {
+  DesignCnstnBizCstId,
+  DesignCnstnBizCstResponseDto,
+  DesignCnstnBizCstSaveRequestDto,
+  DesignCnstnBizCstSearchDto,
+  DesignCnstnBizCstService,
+  DesignCnstnBizCstUpdateRequestDto,
+} from "../model/design-cnstn-biz-cst-interface";
+
+const BASE = ENDPOINT.AS_SERVICE.DESIGN_CNSTN_BIZ_CST;
+
+async function findPage(
+  searchDto: DesignCnstnBizCstSearchDto,
+): Promise<PageResponse<DesignCnstnBizCstResponseDto>> {
+  const response = await client.get<PageResponse<DesignCnstnBizCstResponseDto>>(BASE, {
+    params: searchDto,
+  });
+  return response.data;
+}
+
+async function findById(
+  designCnstnDocNo: string,
+  acntgSeCd: string,
+): Promise<DesignCnstnBizCstResponseDto> {
+  const response = await client.get<DesignCnstnBizCstResponseDto>(
+    `${BASE}/${designCnstnDocNo}/${acntgSeCd}`,
+  );
+  return response.data;
+}
+
+async function save(body: DesignCnstnBizCstSaveRequestDto): Promise<DesignCnstnBizCstId> {
+  const response = await client.post<DesignCnstnBizCstId>(BASE, body);
+  return response.data;
+}
+
+async function update(
+  designCnstnDocNo: string,
+  acntgSeCd: string,
+  body: DesignCnstnBizCstUpdateRequestDto,
+): Promise<void> {
+  await client.put<void>(`${BASE}/${designCnstnDocNo}/${acntgSeCd}`, body);
+}
+
+async function deleteDesignCnstnBizCst(designCnstnDocNo: string, acntgSeCd: string): Promise<void> {
+  await client.delete<void>(`${BASE}/${designCnstnDocNo}/${acntgSeCd}`);
+}
+
+export const designCnstnBizCstService = {
+  findPage,
+  findById,
+  save,
+  update,
+  delete: deleteDesignCnstnBizCst,
+} satisfies DesignCnstnBizCstService;

apps/as/src/entities/design-cnstn/api/design-cnstn-biz-scl-service.ts

@@ -0,0 +1,58 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type { PageResponse } from "@/shared/model";
+
+import type {
+  DesignCnstnBizSclId,
+  DesignCnstnBizSclResponseDto,
+  DesignCnstnBizSclSaveRequestDto,
+  DesignCnstnBizSclSearchDto,
+  DesignCnstnBizSclService,
+  DesignCnstnBizSclUpdateRequestDto,
+} from "../model/design-cnstn-biz-scl-interface";
+
+const BASE = ENDPOINT.AS_SERVICE.DESIGN_CNSTN_BIZ_SCL;
+
+async function findPage(
+  searchDto: DesignCnstnBizSclSearchDto,
+): Promise<PageResponse<DesignCnstnBizSclResponseDto>> {
+  const response = await client.get<PageResponse<DesignCnstnBizSclResponseDto>>(BASE, {
+    params: searchDto,
+  });
+  return response.data;
+}
+
+async function findById(
+  designCnstnDocNo: string,
+  cnstpSeCd: string,
+): Promise<DesignCnstnBizSclResponseDto> {
+  const response = await client.get<DesignCnstnBizSclResponseDto>(
+    `${BASE}/${designCnstnDocNo}/${cnstpSeCd}`,
+  );
+  return response.data;
+}
+
+async function save(body: DesignCnstnBizSclSaveRequestDto): Promise<DesignCnstnBizSclId> {
+  const response = await client.post<DesignCnstnBizSclId>(BASE, body);
+  return response.data;
+}
+
+async function update(
+  designCnstnDocNo: string,
+  cnstpSeCd: string,
+  body: DesignCnstnBizSclUpdateRequestDto,
+): Promise<void> {
+  await client.put<void>(`${BASE}/${designCnstnDocNo}/${cnstpSeCd}`, body);
+}
+
+async function deleteDesignCnstnBizScl(designCnstnDocNo: string, cnstpSeCd: string): Promise<void> {
+  await client.delete<void>(`${BASE}/${designCnstnDocNo}/${cnstpSeCd}`);
+}
+
+export const designCnstnBizSclService = {
+  findPage,
+  findById,
+  save,
+  update,
+  delete: deleteDesignCnstnBizScl,
+} satisfies DesignCnstnBizSclService;

apps/as/src/entities/design-cnstn/api/design-cnstn-esntl-atch-file-service.ts

@@ -0,0 +1,63 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type { PageResponse } from "@/shared/model";
+
+import type {
+  DesignCnstnEsntlAtchFileId,
+  DesignCnstnEsntlAtchFileResponseDto,
+  DesignCnstnEsntlAtchFileSaveRequestDto,
+  DesignCnstnEsntlAtchFileSearchDto,
+  DesignCnstnEsntlAtchFileService,
+  DesignCnstnEsntlAtchFileUpdateRequestDto,
+} from "../model/design-cnstn-esntl-atch-file-interface";
+
+const BASE = ENDPOINT.AS_SERVICE.DESIGN_CNSTN_ESNTL_ATCH_FILE;
+
+async function findPage(
+  searchDto: DesignCnstnEsntlAtchFileSearchDto,
+): Promise<PageResponse<DesignCnstnEsntlAtchFileResponseDto>> {
+  const response = await client.get<PageResponse<DesignCnstnEsntlAtchFileResponseDto>>(BASE, {
+    params: searchDto,
+  });
+  return response.data;
+}
+
+async function findById(
+  designCnstnDocNo: string,
+  esntlAtchFileId: string,
+): Promise<DesignCnstnEsntlAtchFileResponseDto> {
+  const response = await client.get<DesignCnstnEsntlAtchFileResponseDto>(
+    `${BASE}/${designCnstnDocNo}/${esntlAtchFileId}`,
+  );
+  return response.data;
+}
+
+async function save(
+  body: DesignCnstnEsntlAtchFileSaveRequestDto,
+): Promise<DesignCnstnEsntlAtchFileId> {
+  const response = await client.post<DesignCnstnEsntlAtchFileId>(BASE, body);
+  return response.data;
+}
+
+async function update(
+  designCnstnDocNo: string,
+  esntlAtchFileId: string,
+  body: DesignCnstnEsntlAtchFileUpdateRequestDto,
+): Promise<void> {
+  await client.put<void>(`${BASE}/${designCnstnDocNo}/${esntlAtchFileId}`, body);
+}
+
+async function deleteDesignCnstnEsntlAtchFile(
+  designCnstnDocNo: string,
+  esntlAtchFileId: string,
+): Promise<void> {
+  await client.delete<void>(`${BASE}/${designCnstnDocNo}/${esntlAtchFileId}`);
+}
+
+export const designCnstnEsntlAtchFileService = {
+  findPage,
+  findById,
+  save,
+  update,
+  delete: deleteDesignCnstnEsntlAtchFile,
+} satisfies DesignCnstnEsntlAtchFileService;

apps/as/src/entities/design-cnstn/api/design-cnstn-mng-service.ts

@@ -0,0 +1,61 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type { PageResponse } from "@/shared/model";
+
+import type {
+  DesignCnstnApplySaveRequestDto,
+  DesignCnstnMngDetResponseDto,
+  DesignCnstnMngResponseDto,
+  DesignCnstnMngSaveRequestDto,
+  DesignCnstnMngSearchDto,
+  DesignCnstnMngService,
+  DesignCnstnMngUpdateRequestDto,
+} from "../model/design-cnstn-mng-interface";
+
+const BASE = ENDPOINT.AS_SERVICE.DESIGN_CNSTN;
+
+async function findPage(
+  searchDto: DesignCnstnMngSearchDto,
+): Promise<PageResponse<DesignCnstnMngResponseDto>> {
+  const response = await client.get<PageResponse<DesignCnstnMngResponseDto>>(BASE, {
+    params: searchDto,
+  });
+  return response.data;
+}
+
+async function findById(id: string): Promise<DesignCnstnMngDetResponseDto> {
+  const response = await client.get<DesignCnstnMngDetResponseDto>(`${BASE}/${id}`);
+  return response.data;
+}
+
+async function save(body: DesignCnstnMngSaveRequestDto): Promise<string> {
+  const response = await client.post<string>(BASE, body);
+  return response.data;
+}
+
+async function saveApply(body: DesignCnstnApplySaveRequestDto): Promise<string> {
+  const response = await client.post<string>(`${BASE}/save-apply`, body);
+  return response.data;
+}
+
+async function update(id: string, body: DesignCnstnMngUpdateRequestDto): Promise<void> {
+  await client.put<void>(`${BASE}/${id}`, body);
+}
+
+async function techReview(id: string, body: DesignCnstnApplySaveRequestDto): Promise<void> {
+  await client.post<void>(`${BASE}/${id}/tech-review`, body);
+}
+
+async function deleteDesignCnstnMng(id: string): Promise<void> {
+  await client.delete<void>(`${BASE}/${id}`);
+}
+
+export const designCnstnMngService = {
+  findPage,
+  findById,
+  save,
+  saveApply,
+  update,
+  techReview,
+  delete: deleteDesignCnstnMng,
+} satisfies DesignCnstnMngService;

apps/as/src/entities/design-cnstn/api/design-cnstn-rvw-opnn-service.ts

@@ -0,0 +1,61 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type { PageResponse } from "@/shared/model";
+
+import type {
+  DesignCnstnRvwOpnnId,
+  DesignCnstnRvwOpnnResponseDto,
+  DesignCnstnRvwOpnnSaveRequestDto,
+  DesignCnstnRvwOpnnSearchDto,
+  DesignCnstnRvwOpnnService,
+  DesignCnstnRvwOpnnUpdateRequestDto,
+} from "../model/design-cnstn-rvw-opnn-interface";
+
+const BASE = ENDPOINT.AS_SERVICE.DESIGN_CNSTN_RVW_OPNN;
+
+async function findPage(
+  searchDto: DesignCnstnRvwOpnnSearchDto,
+): Promise<PageResponse<DesignCnstnRvwOpnnResponseDto>> {
+  const response = await client.get<PageResponse<DesignCnstnRvwOpnnResponseDto>>(BASE, {
+    params: searchDto,
+  });
+  return response.data;
+}
+
+async function findById(
+  designCnstnDocNo: string,
+  rvwOpnnSn: number,
+): Promise<DesignCnstnRvwOpnnResponseDto> {
+  const response = await client.get<DesignCnstnRvwOpnnResponseDto>(
+    `${BASE}/${designCnstnDocNo}/${rvwOpnnSn}`,
+  );
+  return response.data;
+}
+
+async function save(body: DesignCnstnRvwOpnnSaveRequestDto): Promise<DesignCnstnRvwOpnnId> {
+  const response = await client.post<DesignCnstnRvwOpnnId>(BASE, body);
+  return response.data;
+}
+
+async function update(
+  designCnstnDocNo: string,
+  rvwOpnnSn: number,
+  body: DesignCnstnRvwOpnnUpdateRequestDto,
+): Promise<void> {
+  await client.put<void>(`${BASE}/${designCnstnDocNo}/${rvwOpnnSn}`, body);
+}
+
+async function deleteDesignCnstnRvwOpnn(
+  designCnstnDocNo: string,
+  rvwOpnnSn: number,
+): Promise<void> {
+  await client.delete<void>(`${BASE}/${designCnstnDocNo}/${rvwOpnnSn}`);
+}
+
+export const designCnstnRvwOpnnService = {
+  findPage,
+  findById,
+  save,
+  update,
+  delete: deleteDesignCnstnRvwOpnn,
+} satisfies DesignCnstnRvwOpnnService;

apps/as/src/entities/design-cnstn/api/queries.ts

@@ -0,0 +1,411 @@
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+
+import { ENDPOINT } from "@/shared/config";
+
+import type {
+  DesignCnstnBizCstSaveRequestDto,
+  DesignCnstnBizCstSearchDto,
+  DesignCnstnBizCstUpdateRequestDto,
+} from "../model/design-cnstn-biz-cst-interface";
+import type {
+  DesignCnstnBizSclSaveRequestDto,
+  DesignCnstnBizSclSearchDto,
+  DesignCnstnBizSclUpdateRequestDto,
+} from "../model/design-cnstn-biz-scl-interface";
+import type {
+  DesignCnstnEsntlAtchFileSaveRequestDto,
+  DesignCnstnEsntlAtchFileSearchDto,
+  DesignCnstnEsntlAtchFileUpdateRequestDto,
+} from "../model/design-cnstn-esntl-atch-file-interface";
+import type {
+  DesignCnstnApplySaveRequestDto,
+  DesignCnstnMngSaveRequestDto,
+  DesignCnstnMngSearchDto,
+  DesignCnstnMngUpdateRequestDto,
+} from "../model/design-cnstn-mng-interface";
+import type {
+  DesignCnstnRvwOpnnSaveRequestDto,
+  DesignCnstnRvwOpnnSearchDto,
+  DesignCnstnRvwOpnnUpdateRequestDto,
+} from "../model/design-cnstn-rvw-opnn-interface";
+
+import { designCnstnBizCstService } from "./design-cnstn-biz-cst-service";
+import { designCnstnBizSclService } from "./design-cnstn-biz-scl-service";
+import { designCnstnEsntlAtchFileService } from "./design-cnstn-esntl-atch-file-service";
+import { designCnstnMngService } from "./design-cnstn-mng-service";
+import { designCnstnRvwOpnnService } from "./design-cnstn-rvw-opnn-service";
+
+export const designCnstnMngBaseKey = [ENDPOINT.AS_SERVICE.DESIGN_CNSTN] as const;
+export const designCnstnBizCstBaseKey = [ENDPOINT.AS_SERVICE.DESIGN_CNSTN_BIZ_CST] as const;
+export const designCnstnBizSclBaseKey = [ENDPOINT.AS_SERVICE.DESIGN_CNSTN_BIZ_SCL] as const;
+export const designCnstnEsntlAtchFileBaseKey = [
+  ENDPOINT.AS_SERVICE.DESIGN_CNSTN_ESNTL_ATCH_FILE,
+] as const;
+export const designCnstnRvwOpnnBaseKey = [ENDPOINT.AS_SERVICE.DESIGN_CNSTN_RVW_OPNN] as const;
+
+/* ─── DesignCnstnMng ─── */
+
+export function useDesignCnstnMngPage(params: DesignCnstnMngSearchDto) {
+  return useQuery({
+    queryKey: [...designCnstnMngBaseKey, "findPage", params],
+    queryFn: () => designCnstnMngService.findPage(params),
+  });
+}
+
+export function useDesignCnstnMng(id: string | null | undefined) {
+  return useQuery({
+    queryKey: [...designCnstnMngBaseKey, "findById", id],
+    queryFn: () => designCnstnMngService.findById(id!),
+    enabled: Boolean(id),
+  });
+}
+
+export function useSaveDesignCnstnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: DesignCnstnMngSaveRequestDto) => designCnstnMngService.save(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useSaveApplyDesignCnstnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: DesignCnstnApplySaveRequestDto) => designCnstnMngService.saveApply(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useUpdateDesignCnstnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({ id, body }: { id: string; body: DesignCnstnMngUpdateRequestDto }) =>
+      designCnstnMngService.update(id, body),
+    onSuccess: (_data, { id }) => {
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...designCnstnMngBaseKey, "findById", id],
+      });
+    },
+  });
+}
+
+export function useTechReviewDesignCnstnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({ id, body }: { id: string; body: DesignCnstnApplySaveRequestDto }) =>
+      designCnstnMngService.techReview(id, body),
+    onSuccess: (_data, { id }) => {
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...designCnstnMngBaseKey, "findById", id],
+      });
+    },
+  });
+}
+
+export function useDeleteDesignCnstnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (id: string) => designCnstnMngService.delete(id),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+/* ─── DesignCnstnBizCst ─── */
+
+export function useDesignCnstnBizCstPage(params: DesignCnstnBizCstSearchDto) {
+  return useQuery({
+    queryKey: [...designCnstnBizCstBaseKey, "findPage", params],
+    queryFn: () => designCnstnBizCstService.findPage(params),
+  });
+}
+
+export function useDesignCnstnBizCst(
+  designCnstnDocNo: string | null | undefined,
+  acntgSeCd: string | null | undefined,
+) {
+  return useQuery({
+    queryKey: [...designCnstnBizCstBaseKey, "findById", designCnstnDocNo, acntgSeCd],
+    queryFn: () => designCnstnBizCstService.findById(designCnstnDocNo!, acntgSeCd!),
+    enabled: Boolean(designCnstnDocNo && acntgSeCd),
+  });
+}
+
+export function useSaveDesignCnstnBizCst() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: DesignCnstnBizCstSaveRequestDto) => designCnstnBizCstService.save(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnBizCstBaseKey });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useUpdateDesignCnstnBizCst() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      designCnstnDocNo,
+      acntgSeCd,
+      body,
+    }: {
+      designCnstnDocNo: string;
+      acntgSeCd: string;
+      body: DesignCnstnBizCstUpdateRequestDto;
+    }) => designCnstnBizCstService.update(designCnstnDocNo, acntgSeCd, body),
+    onSuccess: (_data, { designCnstnDocNo, acntgSeCd }) => {
+      queryClient.invalidateQueries({ queryKey: designCnstnBizCstBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...designCnstnBizCstBaseKey, "findById", designCnstnDocNo, acntgSeCd],
+      });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useDeleteDesignCnstnBizCst() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      designCnstnDocNo,
+      acntgSeCd,
+    }: {
+      designCnstnDocNo: string;
+      acntgSeCd: string;
+    }) => designCnstnBizCstService.delete(designCnstnDocNo, acntgSeCd),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnBizCstBaseKey });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+/* ─── DesignCnstnBizScl ─── */
+
+export function useDesignCnstnBizSclPage(params: DesignCnstnBizSclSearchDto) {
+  return useQuery({
+    queryKey: [...designCnstnBizSclBaseKey, "findPage", params],
+    queryFn: () => designCnstnBizSclService.findPage(params),
+  });
+}
+
+export function useDesignCnstnBizScl(
+  designCnstnDocNo: string | null | undefined,
+  cnstpSeCd: string | null | undefined,
+) {
+  return useQuery({
+    queryKey: [...designCnstnBizSclBaseKey, "findById", designCnstnDocNo, cnstpSeCd],
+    queryFn: () => designCnstnBizSclService.findById(designCnstnDocNo!, cnstpSeCd!),
+    enabled: Boolean(designCnstnDocNo && cnstpSeCd),
+  });
+}
+
+export function useSaveDesignCnstnBizScl() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: DesignCnstnBizSclSaveRequestDto) => designCnstnBizSclService.save(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnBizSclBaseKey });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useUpdateDesignCnstnBizScl() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      designCnstnDocNo,
+      cnstpSeCd,
+      body,
+    }: {
+      designCnstnDocNo: string;
+      cnstpSeCd: string;
+      body: DesignCnstnBizSclUpdateRequestDto;
+    }) => designCnstnBizSclService.update(designCnstnDocNo, cnstpSeCd, body),
+    onSuccess: (_data, { designCnstnDocNo, cnstpSeCd }) => {
+      queryClient.invalidateQueries({ queryKey: designCnstnBizSclBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...designCnstnBizSclBaseKey, "findById", designCnstnDocNo, cnstpSeCd],
+      });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useDeleteDesignCnstnBizScl() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      designCnstnDocNo,
+      cnstpSeCd,
+    }: {
+      designCnstnDocNo: string;
+      cnstpSeCd: string;
+    }) => designCnstnBizSclService.delete(designCnstnDocNo, cnstpSeCd),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnBizSclBaseKey });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+/* ─── DesignCnstnEsntlAtchFile ─── */
+
+export function useDesignCnstnEsntlAtchFilePage(params: DesignCnstnEsntlAtchFileSearchDto) {
+  return useQuery({
+    queryKey: [...designCnstnEsntlAtchFileBaseKey, "findPage", params],
+    queryFn: () => designCnstnEsntlAtchFileService.findPage(params),
+  });
+}
+
+export function useDesignCnstnEsntlAtchFile(
+  designCnstnDocNo: string | null | undefined,
+  esntlAtchFileId: string | null | undefined,
+) {
+  return useQuery({
+    queryKey: [
+      ...designCnstnEsntlAtchFileBaseKey,
+      "findById",
+      designCnstnDocNo,
+      esntlAtchFileId,
+    ],
+    queryFn: () =>
+      designCnstnEsntlAtchFileService.findById(designCnstnDocNo!, esntlAtchFileId!),
+    enabled: Boolean(designCnstnDocNo && esntlAtchFileId),
+  });
+}
+
+export function useSaveDesignCnstnEsntlAtchFile() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: DesignCnstnEsntlAtchFileSaveRequestDto) =>
+      designCnstnEsntlAtchFileService.save(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnEsntlAtchFileBaseKey });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useUpdateDesignCnstnEsntlAtchFile() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      designCnstnDocNo,
+      esntlAtchFileId,
+      body,
+    }: {
+      designCnstnDocNo: string;
+      esntlAtchFileId: string;
+      body: DesignCnstnEsntlAtchFileUpdateRequestDto;
+    }) => designCnstnEsntlAtchFileService.update(designCnstnDocNo, esntlAtchFileId, body),
+    onSuccess: (_data, { designCnstnDocNo, esntlAtchFileId }) => {
+      queryClient.invalidateQueries({ queryKey: designCnstnEsntlAtchFileBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [
+          ...designCnstnEsntlAtchFileBaseKey,
+          "findById",
+          designCnstnDocNo,
+          esntlAtchFileId,
+        ],
+      });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useDeleteDesignCnstnEsntlAtchFile() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      designCnstnDocNo,
+      esntlAtchFileId,
+    }: {
+      designCnstnDocNo: string;
+      esntlAtchFileId: string;
+    }) => designCnstnEsntlAtchFileService.delete(designCnstnDocNo, esntlAtchFileId),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnEsntlAtchFileBaseKey });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+/* ─── DesignCnstnRvwOpnn ─── */
+
+export function useDesignCnstnRvwOpnnPage(params: DesignCnstnRvwOpnnSearchDto) {
+  return useQuery({
+    queryKey: [...designCnstnRvwOpnnBaseKey, "findPage", params],
+    queryFn: () => designCnstnRvwOpnnService.findPage(params),
+  });
+}
+
+export function useDesignCnstnRvwOpnn(
+  designCnstnDocNo: string | null | undefined,
+  rvwOpnnSn: number | null | undefined,
+) {
+  return useQuery({
+    queryKey: [...designCnstnRvwOpnnBaseKey, "findById", designCnstnDocNo, rvwOpnnSn],
+    queryFn: () => designCnstnRvwOpnnService.findById(designCnstnDocNo!, rvwOpnnSn!),
+    enabled: Boolean(designCnstnDocNo && rvwOpnnSn != null),
+  });
+}
+
+export function useSaveDesignCnstnRvwOpnn() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: DesignCnstnRvwOpnnSaveRequestDto) => designCnstnRvwOpnnService.save(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnRvwOpnnBaseKey });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useUpdateDesignCnstnRvwOpnn() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      designCnstnDocNo,
+      rvwOpnnSn,
+      body,
+    }: {
+      designCnstnDocNo: string;
+      rvwOpnnSn: number;
+      body: DesignCnstnRvwOpnnUpdateRequestDto;
+    }) => designCnstnRvwOpnnService.update(designCnstnDocNo, rvwOpnnSn, body),
+    onSuccess: (_data, { designCnstnDocNo, rvwOpnnSn }) => {
+      queryClient.invalidateQueries({ queryKey: designCnstnRvwOpnnBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...designCnstnRvwOpnnBaseKey, "findById", designCnstnDocNo, rvwOpnnSn],
+      });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}
+
+export function useDeleteDesignCnstnRvwOpnn() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      designCnstnDocNo,
+      rvwOpnnSn,
+    }: {
+      designCnstnDocNo: string;
+      rvwOpnnSn: number;
+    }) => designCnstnRvwOpnnService.delete(designCnstnDocNo, rvwOpnnSn),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: designCnstnRvwOpnnBaseKey });
+      queryClient.invalidateQueries({ queryKey: designCnstnMngBaseKey });
+    },
+  });
+}

apps/as/src/entities/design-cnstn/index.ts

@@ -0,0 +1,88 @@
+export { designCnstnBizCstService } from "./api/design-cnstn-biz-cst-service";
+export { designCnstnBizSclService } from "./api/design-cnstn-biz-scl-service";
+export { designCnstnEsntlAtchFileService } from "./api/design-cnstn-esntl-atch-file-service";
+export { designCnstnMngService } from "./api/design-cnstn-mng-service";
+export { designCnstnRvwOpnnService } from "./api/design-cnstn-rvw-opnn-service";
+export {
+  designCnstnBizCstBaseKey,
+  designCnstnBizSclBaseKey,
+  designCnstnEsntlAtchFileBaseKey,
+  designCnstnMngBaseKey,
+  designCnstnRvwOpnnBaseKey,
+  useDeleteDesignCnstnBizCst,
+  useDeleteDesignCnstnBizScl,
+  useDeleteDesignCnstnEsntlAtchFile,
+  useDeleteDesignCnstnMng,
+  useDeleteDesignCnstnRvwOpnn,
+  useDesignCnstnBizCst,
+  useDesignCnstnBizCstPage,
+  useDesignCnstnBizScl,
+  useDesignCnstnBizSclPage,
+  useDesignCnstnEsntlAtchFile,
+  useDesignCnstnEsntlAtchFilePage,
+  useDesignCnstnMng,
+  useDesignCnstnMngPage,
+  useDesignCnstnRvwOpnn,
+  useDesignCnstnRvwOpnnPage,
+  useSaveApplyDesignCnstnMng,
+  useSaveDesignCnstnBizCst,
+  useSaveDesignCnstnBizScl,
+  useSaveDesignCnstnEsntlAtchFile,
+  useSaveDesignCnstnMng,
+  useSaveDesignCnstnRvwOpnn,
+  useTechReviewDesignCnstnMng,
+  useUpdateDesignCnstnBizCst,
+  useUpdateDesignCnstnBizScl,
+  useUpdateDesignCnstnEsntlAtchFile,
+  useUpdateDesignCnstnMng,
+  useUpdateDesignCnstnRvwOpnn,
+} from "./api/queries";
+export type {
+  DesignCnstnBizCstId,
+  DesignCnstnBizCstResponseDto,
+  DesignCnstnBizCstSaveRequestDto,
+  DesignCnstnBizCstSearchDto,
+  DesignCnstnBizCstService,
+  DesignCnstnBizCstUpdateRequestDto,
+} from "./model/design-cnstn-biz-cst-interface";
+export type {
+  DesignCnstnBizSclId,
+  DesignCnstnBizSclResponseDto,
+  DesignCnstnBizSclSaveRequestDto,
+  DesignCnstnBizSclSearchDto,
+  DesignCnstnBizSclService,
+  DesignCnstnBizSclUpdateRequestDto,
+} from "./model/design-cnstn-biz-scl-interface";
+export type {
+  DesignCnstnEsntlAtchFileId,
+  DesignCnstnEsntlAtchFileResponseDto,
+  DesignCnstnEsntlAtchFileSaveRequestDto,
+  DesignCnstnEsntlAtchFileSearchDto,
+  DesignCnstnEsntlAtchFileService,
+  DesignCnstnEsntlAtchFileUpdateRequestDto,
+} from "./model/design-cnstn-esntl-atch-file-interface";
+export type {
+  AtflMngClientResponseDto,
+  BizCstItem,
+  BizCstTreeDto,
+  BizSclTreeDto,
+  BzScaleItem,
+  DesignCnstnApplySaveRequestDto,
+  DesignCnstnMngDetResponseDto,
+  DesignCnstnMngResponseDto,
+  DesignCnstnMngSaveRequestDto,
+  DesignCnstnMngSearchDto,
+  DesignCnstnMngService,
+  DesignCnstnMngUpdateRequestDto,
+  DesignCnstnRvwOpnnResponseDto,
+  DesignCnstnRvwOpnnSaveRequestDto,
+  ElaprDocPrgrsClientResponseDto,
+  EsntlAtchFileItem,
+  EsntlAtchFileMngTreeResponseDto,
+} from "./model/design-cnstn-mng-interface";
+export type {
+  DesignCnstnRvwOpnnId,
+  DesignCnstnRvwOpnnSearchDto,
+  DesignCnstnRvwOpnnService,
+  DesignCnstnRvwOpnnUpdateRequestDto,
+} from "./model/design-cnstn-rvw-opnn-interface";

apps/as/src/entities/design-cnstn/model/design-cnstn-biz-cst-interface.ts

@@ -0,0 +1,54 @@
+import type { PageableParams, PageResponse } from "@/shared/model";
+
+/** 백엔드 DesignCnstnBizCstId */
+export interface DesignCnstnBizCstId {
+  designCnstnMng: string;
+  acntgSeCd: string;
+}
+
+/** 백엔드 DesignCnstnBizCstSaveRequestDto */
+export interface DesignCnstnBizCstSaveRequestDto {
+  designCnstnDocNo: string;
+  acntgSeCd: string;
+  bscPlanAmt?: number;
+  bgtRfltAmt?: number;
+  tstmDesignAmt?: number;
+}
+
+/** 백엔드 DesignCnstnBizCstUpdateRequestDto */
+export interface DesignCnstnBizCstUpdateRequestDto {
+  bscPlanAmt?: number;
+  bgtRfltAmt?: number;
+  tstmDesignAmt?: number;
+}
+
+/** 백엔드 DesignCnstnBizCstSearchDto + Pageable */
+export interface DesignCnstnBizCstSearchDto extends PageableParams {
+  designCnstnDocNo?: string;
+  acntgSeCd?: string;
+}
+
+/** 백엔드 DesignCnstnBizCstResponseDto */
+export interface DesignCnstnBizCstResponseDto {
+  designCnstnDocNo: string;
+  acntgSeCd: string;
+  bscPlanAmt?: number;
+  bgtRfltAmt?: number;
+  tstmDesignAmt?: number;
+  regDt?: string;
+}
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface DesignCnstnBizCstService {
+  findPage(
+    searchDto: DesignCnstnBizCstSearchDto,
+  ): Promise<PageResponse<DesignCnstnBizCstResponseDto>>;
+  findById(designCnstnDocNo: string, acntgSeCd: string): Promise<DesignCnstnBizCstResponseDto>;
+  save(body: DesignCnstnBizCstSaveRequestDto): Promise<DesignCnstnBizCstId>;
+  update(
+    designCnstnDocNo: string,
+    acntgSeCd: string,
+    body: DesignCnstnBizCstUpdateRequestDto,
+  ): Promise<void>;
+  delete(designCnstnDocNo: string, acntgSeCd: string): Promise<void>;
+}

apps/as/src/entities/design-cnstn/model/design-cnstn-biz-scl-interface.ts

@@ -0,0 +1,54 @@
+import type { PageableParams, PageResponse } from "@/shared/model";
+
+/** 백엔드 DesignCnstnBizSclId */
+export interface DesignCnstnBizSclId {
+  designCnstnMng: string;
+  cnstpSeCd: string;
+}
+
+/** 백엔드 DesignCnstnBizSclSaveRequestDto */
+export interface DesignCnstnBizSclSaveRequestDto {
+  designCnstnDocNo: string;
+  cnstpSeCd: string;
+  bscPlanQty?: number;
+  bgtRfltQty?: number;
+  tstmDesignQty?: number;
+}
+
+/** 백엔드 DesignCnstnBizSclUpdateRequestDto */
+export interface DesignCnstnBizSclUpdateRequestDto {
+  bscPlanQty?: number;
+  bgtRfltQty?: number;
+  tstmDesignQty?: number;
+}
+
+/** 백엔드 DesignCnstnBizSclSearchDto + Pageable */
+export interface DesignCnstnBizSclSearchDto extends PageableParams {
+  designCnstnDocNo?: string;
+  cnstpSeCd?: string;
+}
+
+/** 백엔드 DesignCnstnBizSclResponseDto */
+export interface DesignCnstnBizSclResponseDto {
+  designCnstnDocNo: string;
+  cnstpSeCd: string;
+  bscPlanQty?: number;
+  bgtRfltQty?: number;
+  tstmDesignQty?: number;
+  regDt?: string;
+}
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface DesignCnstnBizSclService {
+  findPage(
+    searchDto: DesignCnstnBizSclSearchDto,
+  ): Promise<PageResponse<DesignCnstnBizSclResponseDto>>;
+  findById(designCnstnDocNo: string, cnstpSeCd: string): Promise<DesignCnstnBizSclResponseDto>;
+  save(body: DesignCnstnBizSclSaveRequestDto): Promise<DesignCnstnBizSclId>;
+  update(
+    designCnstnDocNo: string,
+    cnstpSeCd: string,
+    body: DesignCnstnBizSclUpdateRequestDto,
+  ): Promise<void>;
+  delete(designCnstnDocNo: string, cnstpSeCd: string): Promise<void>;
+}

apps/as/src/entities/design-cnstn/model/design-cnstn-esntl-atch-file-interface.ts

@@ -0,0 +1,51 @@
+import type { PageableParams, PageResponse } from "@/shared/model";
+
+/** 백엔드 DesignCnstnEsntlAtchFileId */
+export interface DesignCnstnEsntlAtchFileId {
+  designCnstnMng: string;
+  esntlAtchFileId: string;
+}
+
+/** 백엔드 DesignCnstnEsntlAtchFileSaveRequestDto */
+export interface DesignCnstnEsntlAtchFileSaveRequestDto {
+  designCnstnDocNo: string;
+  esntlAtchFileId: string;
+  atchFileGroupId?: string;
+}
+
+/** 백엔드 DesignCnstnEsntlAtchFileUpdateRequestDto */
+export interface DesignCnstnEsntlAtchFileUpdateRequestDto {
+  atchFileGroupId?: string;
+}
+
+/** 백엔드 DesignCnstnEsntlAtchFileSearchDto + Pageable */
+export interface DesignCnstnEsntlAtchFileSearchDto extends PageableParams {
+  designCnstnDocNo?: string;
+  esntlAtchFileId?: string;
+}
+
+/** 백엔드 DesignCnstnEsntlAtchFileResponseDto */
+export interface DesignCnstnEsntlAtchFileResponseDto {
+  designCnstnDocNo: string;
+  esntlAtchFileId: string;
+  atchFileGroupId?: string;
+  regDt?: string;
+}
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface DesignCnstnEsntlAtchFileService {
+  findPage(
+    searchDto: DesignCnstnEsntlAtchFileSearchDto,
+  ): Promise<PageResponse<DesignCnstnEsntlAtchFileResponseDto>>;
+  findById(
+    designCnstnDocNo: string,
+    esntlAtchFileId: string,
+  ): Promise<DesignCnstnEsntlAtchFileResponseDto>;
+  save(body: DesignCnstnEsntlAtchFileSaveRequestDto): Promise<DesignCnstnEsntlAtchFileId>;
+  update(
+    designCnstnDocNo: string,
+    esntlAtchFileId: string,
+    body: DesignCnstnEsntlAtchFileUpdateRequestDto,
+  ): Promise<void>;
+  delete(designCnstnDocNo: string, esntlAtchFileId: string): Promise<void>;
+}

apps/as/src/entities/design-cnstn/model/design-cnstn-mng-interface.ts

@@ -0,0 +1,124 @@
+import type {
+  BizCstSaveBase,
+  BzScaleSaveBase,
+  EsntlAtchFileSaveBase,
+  PageableParams,
+  PageResponse,
+  PbadmsApplySaveHeader,
+  PbadmsMngDetResponseBase,
+} from "@/shared/model";
+
+import type {
+  DesignCnstnRvwOpnnResponseDto,
+  DesignCnstnRvwOpnnSaveRequestDto,
+} from "./design-cnstn-rvw-opnn-interface";
+
+export type {
+  DesignCnstnRvwOpnnResponseDto,
+  DesignCnstnRvwOpnnSaveRequestDto,
+} from "./design-cnstn-rvw-opnn-interface";
+export type {
+  AtflMngClientResponseDto,
+  BizCstTreeDto,
+  BizSclTreeDto,
+  ElaprDocPrgrsClientResponseDto,
+  EsntlAtchFileMngTreeResponseDto,
+} from "@/shared/model";
+
+/** 백엔드 DesignCnstnMngSaveRequestDto */
+export interface DesignCnstnMngSaveRequestDto {
+  designCnstnDocNo?: string;
+  admdstCd?: string;
+  envoSeComCd?: string;
+  taskSeComCd?: string;
+  bizNm?: string;
+  bizBgngYr?: string;
+  bizEndYr?: string;
+  bizCn?: string;
+  aplcntNm?: string;
+  aplcntMblTelno?: string;
+  aplcntOgdpNm?: string;
+  aplcntEmlAddr?: string;
+  dsgnrNm?: string;
+  dsgnrTelno?: string;
+  dsgnrOgdpNm?: string;
+  dsgnrEmlAddr?: string;
+  atchFileGroupId?: string;
+  prgrsSttsComCd?: string;
+}
+
+/** 백엔드 DesignCnstnMngUpdateRequestDto */
+export type DesignCnstnMngUpdateRequestDto = Omit<DesignCnstnMngSaveRequestDto, "designCnstnDocNo">;
+
+/** 백엔드 DesignCnstnMngSearchDto + Pageable */
+export interface DesignCnstnMngSearchDto extends PageableParams {
+  designCnstnDocNo?: string;
+  admdstCd?: string;
+  envoSeComCd?: string;
+  taskSeComCd?: string;
+  bizNm?: string;
+  bizBgngYr?: string;
+  bizEndYr?: string;
+  bizCn?: string;
+  aplcntNm?: string;
+  aplcntMblTelno?: string;
+  aplcntOgdpNm?: string;
+  aplcntEmlAddr?: string;
+  dsgnrNm?: string;
+  dsgnrTelno?: string;
+  dsgnrOgdpNm?: string;
+  dsgnrEmlAddr?: string;
+  atchFileGroupId?: string;
+}
+
+interface DesignCnstnMngResponseExtension {
+  designCnstnDocNo: string;
+  envoSeCdNm?: string;
+  taskSeCdNm?: string;
+  prgrsSttsCdNm?: string;
+  regDt?: string;
+  rgtr?: string;
+  rgtrNm?: string;
+  mdfcnDt?: string;
+  sido?: string;
+  gugun?: string;
+}
+
+/** 백엔드 DesignCnstnMngResponseDto */
+export type DesignCnstnMngResponseDto = Omit<DesignCnstnMngSaveRequestDto, "designCnstnDocNo"> &
+  DesignCnstnMngResponseExtension;
+
+/** 백엔드 DesignCnstnApplySaveRequestDto.BzScaleItem */
+export type BzScaleItem = BzScaleSaveBase;
+
+/** 백엔드 DesignCnstnApplySaveRequestDto.BizCstItem */
+export type BizCstItem = BizCstSaveBase;
+
+/** 백엔드 DesignCnstnApplySaveRequestDto.EsntlAtchFileItem */
+export type EsntlAtchFileItem = EsntlAtchFileSaveBase;
+
+/** 백엔드 DesignCnstnMngDetResponseDto */
+export type DesignCnstnMngDetResponseDto = PbadmsMngDetResponseBase<
+  DesignCnstnMngResponseDto,
+  DesignCnstnRvwOpnnResponseDto
+>;
+
+/** 백엔드 DesignCnstnApplySaveRequestDto */
+export interface DesignCnstnApplySaveRequestDto extends PbadmsApplySaveHeader {
+  designCnstnMng: DesignCnstnMngSaveRequestDto;
+  bzScaleList?: BzScaleItem[];
+  bizCstList?: BizCstItem[];
+  esntlAtchFileList?: EsntlAtchFileItem[];
+  rvwOpnnList?: DesignCnstnRvwOpnnSaveRequestDto[];
+}
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface DesignCnstnMngService {
+  findPage(searchDto: DesignCnstnMngSearchDto): Promise<PageResponse<DesignCnstnMngResponseDto>>;
+  findById(id: string): Promise<DesignCnstnMngDetResponseDto>;
+  save(body: DesignCnstnMngSaveRequestDto): Promise<string>;
+  saveApply(body: DesignCnstnApplySaveRequestDto): Promise<string>;
+  update(id: string, body: DesignCnstnMngUpdateRequestDto): Promise<void>;
+  techReview(id: string, body: DesignCnstnApplySaveRequestDto): Promise<void>;
+  delete(id: string): Promise<void>;
+}

apps/as/src/entities/design-cnstn/model/design-cnstn-rvw-opnn-interface.ts

@@ -0,0 +1,59 @@
+import type { PageableParams, PageResponse, RvwOpnnResponseExtension } from "@/shared/model";
+
+/** 백엔드 DesignCnstnRvwOpnnId */
+export interface DesignCnstnRvwOpnnId {
+  designCnstnMng: string;
+  rvwOpnnSn: number;
+}
+
+/** 백엔드 DesignCnstnRvwOpnnSaveRequestDto */
+export interface DesignCnstnRvwOpnnSaveRequestDto {
+  designCnstnDocNo: string;
+  rvwOpnnSn?: number;
+  opnrSeComCd?: string;
+  opnrNm?: string;
+  rvwRsltCn?: string;
+  rvwRsltAnmlyYn?: string;
+  atchFileGroupId?: string;
+}
+
+/** 백엔드 DesignCnstnRvwOpnnUpdateRequestDto */
+export interface DesignCnstnRvwOpnnUpdateRequestDto {
+  opnrSeComCd?: string;
+  opnrNm?: string;
+  rvwRsltCn?: string;
+  rvwRsltAnmlyYn?: string;
+  atchFileGroupId?: string;
+}
+
+/** 백엔드 DesignCnstnRvwOpnnSearchDto + Pageable */
+export interface DesignCnstnRvwOpnnSearchDto extends PageableParams {
+  designCnstnDocNo?: string;
+  opnrNm?: string;
+  opnrSeComCd?: string;
+  rvwRsltCn?: string;
+  rvwRsltAnmlyYn?: string;
+  atchFileGroupId?: string;
+}
+
+/** 백엔드 DesignCnstnRvwOpnnResponseDto */
+export type DesignCnstnRvwOpnnResponseDto = Partial<
+  Pick<DesignCnstnRvwOpnnSaveRequestDto, "designCnstnDocNo" | "rvwOpnnSn">
+> &
+  Omit<DesignCnstnRvwOpnnSaveRequestDto, "designCnstnDocNo" | "rvwOpnnSn"> &
+  RvwOpnnResponseExtension;
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface DesignCnstnRvwOpnnService {
+  findPage(
+    searchDto: DesignCnstnRvwOpnnSearchDto,
+  ): Promise<PageResponse<DesignCnstnRvwOpnnResponseDto>>;
+  findById(designCnstnDocNo: string, rvwOpnnSn: number): Promise<DesignCnstnRvwOpnnResponseDto>;
+  save(body: DesignCnstnRvwOpnnSaveRequestDto): Promise<DesignCnstnRvwOpnnId>;
+  update(
+    designCnstnDocNo: string,
+    rvwOpnnSn: number,
+    body: DesignCnstnRvwOpnnUpdateRequestDto,
+  ): Promise<void>;
+  delete(designCnstnDocNo: string, rvwOpnnSn: number): Promise<void>;
+}

apps/as/src/entities/elapr/api/elapr-dmnd-service.ts

@@ -0,0 +1,67 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type { PageResponse } from "@/shared/model";
+
+import type {
+  ElaprDmndResponseDto,
+  ElaprDmndSaveRequestDto,
+  ElaprDmndSearchDto,
+  ElaprDmndService,
+  ElaprDocPrgrsResponseDto,
+} from "../model/elapr-dmnd-interface";
+
+const BASE = ENDPOINT.AS_ELAPR_SERVICE.ELAPR_DMND;
+
+async function findPage(params: ElaprDmndSearchDto): Promise<PageResponse<ElaprDmndResponseDto>> {
+  const response = await client.get<PageResponse<ElaprDmndResponseDto>>(BASE, { params });
+  return response.data;
+}
+
+async function findById(elaprDmndId: string): Promise<ElaprDmndResponseDto> {
+  const response = await client.get<ElaprDmndResponseDto>(`${BASE}/${elaprDmndId}`);
+  return response.data;
+}
+
+async function save(body: ElaprDmndSaveRequestDto): Promise<ElaprDmndResponseDto> {
+  const response = await client.post<ElaprDmndResponseDto>(BASE, body);
+  return response.data;
+}
+
+async function update(
+  elaprDmndId: string,
+  body: ElaprDmndSaveRequestDto,
+): Promise<ElaprDmndResponseDto> {
+  const response = await client.put<ElaprDmndResponseDto>(`${BASE}/${elaprDmndId}`, body);
+  return response.data;
+}
+
+async function updateStatus(
+  elaprDmndId: string,
+  atrzSttsComCd: string,
+): Promise<ElaprDmndResponseDto> {
+  const response = await client.put<ElaprDmndResponseDto>(`${BASE}/${elaprDmndId}/status`, null, {
+    params: { atrzSttsComCd },
+  });
+  return response.data;
+}
+
+async function remove(elaprDmndId: string): Promise<void> {
+  await client.delete(`${BASE}/${elaprDmndId}`);
+}
+
+async function findDocPrgrsByDocNo(elaprDocNo: string): Promise<ElaprDocPrgrsResponseDto[]> {
+  const response = await client.get<ElaprDocPrgrsResponseDto[]>(
+    `${BASE}/sanc/docprgrs/${elaprDocNo}`,
+  );
+  return response.data;
+}
+
+export const elaprDmndService = {
+  findPage,
+  findById,
+  save,
+  update,
+  updateStatus,
+  remove,
+  findDocPrgrsByDocNo,
+} satisfies ElaprDmndService;

apps/as/src/entities/elapr/api/elapr-prgrs-stts-service.ts

@@ -0,0 +1,104 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type { PageResponse } from "@/shared/model";
+
+import type {
+  ElaprApproverChangeRequestDto,
+  ElaprApproverInsertRequestDto,
+  ElaprPrgrsSttsMyDocSearchParams,
+  ElaprPrgrsSttsResponseDto,
+  ElaprPrgrsSttsSaveRequestDto,
+  ElaprPrgrsSttsService,
+  ElaprProcessRequestDto,
+} from "../model/elapr-prgrs-stts-interface";
+
+const BASE = ENDPOINT.AS_ELAPR_SERVICE.ELAPR_PRGRS_STTS;
+
+async function findAllByDmndId(elaprDmndId?: string): Promise<ElaprPrgrsSttsResponseDto[]> {
+  const response = await client.get<ElaprPrgrsSttsResponseDto[]>(BASE, {
+    params: elaprDmndId ? { elaprDmndId } : undefined,
+  });
+  return response.data;
+}
+
+async function findById(elaprPrgrsId: string): Promise<ElaprPrgrsSttsResponseDto> {
+  const response = await client.get<ElaprPrgrsSttsResponseDto>(`${BASE}/${elaprPrgrsId}`);
+  return response.data;
+}
+
+async function save(
+  requestDtos: ElaprPrgrsSttsSaveRequestDto[],
+): Promise<ElaprPrgrsSttsResponseDto[]> {
+  const response = await client.post<ElaprPrgrsSttsResponseDto[]>(BASE, requestDtos);
+  return response.data;
+}
+
+async function process(
+  elaprPrgrsId: string,
+  body: ElaprProcessRequestDto,
+): Promise<ElaprPrgrsSttsResponseDto> {
+  const response = await client.put<ElaprPrgrsSttsResponseDto>(
+    `${BASE}/${elaprPrgrsId}/process`,
+    body,
+  );
+  return response.data;
+}
+
+async function processByDocNoAndAprvrUuid(
+  elaprDocNo: string,
+  aprvrUuid: string,
+  body: ElaprProcessRequestDto,
+): Promise<ElaprPrgrsSttsResponseDto> {
+  const response = await client.put<ElaprPrgrsSttsResponseDto>(
+    `${BASE}/doc/${elaprDocNo}/aprvr/${aprvrUuid}/process`,
+    body,
+  );
+  return response.data;
+}
+
+async function deletePrgrsStts(elaprPrgrsId: string): Promise<void> {
+  await client.delete(`${BASE}/${elaprPrgrsId}`);
+}
+
+async function updateApprover(
+  elaprPrgrsId: string,
+  body: ElaprApproverChangeRequestDto,
+): Promise<ElaprPrgrsSttsResponseDto> {
+  const response = await client.put<ElaprPrgrsSttsResponseDto>(
+    `${BASE}/${elaprPrgrsId}/approver`,
+    body,
+  );
+  return response.data;
+}
+
+async function insertApprover(
+  elaprDmndId: string,
+  body: ElaprApproverInsertRequestDto,
+): Promise<ElaprPrgrsSttsResponseDto> {
+  const response = await client.post<ElaprPrgrsSttsResponseDto>(
+    `${BASE}/${elaprDmndId}/approver/insert`,
+    body,
+  );
+  return response.data;
+}
+
+async function findMyElaperDocList(
+  params: ElaprPrgrsSttsMyDocSearchParams,
+): Promise<PageResponse<ElaprPrgrsSttsResponseDto>> {
+  const response = await client.get<PageResponse<ElaprPrgrsSttsResponseDto>>(`${BASE}/my/doc`, {
+    params,
+  });
+  return response.data;
+}
+
+export const elaprPrgrsSttsService = {
+  findAllByDmndId,
+  findById,
+  save,
+  process,
+  processByDocNoAndAprvrUuid,
+  delete: deletePrgrsStts,
+  updateApprover,
+  insertApprover,
+  findMyElaperDocList,
+} satisfies ElaprPrgrsSttsService;

apps/as/src/entities/elapr/api/queries.ts

@@ -8,6 +8,14 @@ import type {
   ElaprAplnSaveRequest,
   ElaprAplnUpdateRequest,
 } from "../model/elapr-apln-interface";
+import type { ElaprDmndSaveRequestDto, ElaprDmndSearchDto } from "../model/elapr-dmnd-interface";
+import type {
+  ElaprApproverChangeRequestDto,
+  ElaprApproverInsertRequestDto,
+  ElaprPrgrsSttsMyDocSearchParams,
+  ElaprPrgrsSttsSaveRequestDto,
+  ElaprProcessRequestDto,
+} from "../model/elapr-prgrs-stts-interface";
 import type {
   ElaprTmpltSaveRequest,
   ElaprTmpltSearchParams,
@@ -15,10 +23,19 @@ import type {
 } from "../model/elapr-tmplt-interface";
 
 import { elaprAplnService } from "./elapr-apln-service";
+import { elaprDmndService } from "./elapr-dmnd-service";
+import { elaprPrgrsSttsService } from "./elapr-prgrs-stts-service";
 import { elaprTmpltService } from "./elapr-tmplt-service";
 
 const elaprTmpltBaseKey = [ENDPOINT.AS_ELAPR_SERVICE.ELAPR_TMPLT] as const;
 const elaprAplnBaseKey = [ENDPOINT.AS_ELAPR_SERVICE.ELAPR_APLN] as const;
+const elaprDmndBaseKey = [ENDPOINT.AS_ELAPR_SERVICE.ELAPR_DMND] as const;
+const elaprPrgrsSttsBaseKey = [ENDPOINT.AS_ELAPR_SERVICE.ELAPR_PRGRS_STTS] as const;
+
+function invalidateElaprPrgrsSttsQueries(queryClient: ReturnType<typeof useQueryClient>) {
+  queryClient.invalidateQueries({ queryKey: elaprPrgrsSttsBaseKey });
+  queryClient.invalidateQueries({ queryKey: elaprDmndBaseKey });
+}
 
 export function useElaprTmpltPage(params: ElaprTmpltSearchParams) {
   return useQuery({
@@ -50,13 +67,8 @@ export function useUpdateElaprTmplt() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: ({
-      elaprTmpltId,
-      body,
-    }: {
-      elaprTmpltId: string;
-      body: ElaprTmpltUpdateRequest;
-    }) => elaprTmpltService.update(elaprTmpltId, body),
+    mutationFn: ({ elaprTmpltId, body }: { elaprTmpltId: string; body: ElaprTmpltUpdateRequest }) =>
+      elaprTmpltService.update(elaprTmpltId, body),
     onSuccess: (_data, { elaprTmpltId }) => {
       queryClient.invalidateQueries({ queryKey: elaprTmpltBaseKey });
       queryClient.invalidateQueries({
@@ -99,12 +111,8 @@ export function useSaveMultiElaprApln() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: ({
-      body,
-    }: {
-      body: ElaprAplnSaveRequest[];
-      elaprTmpltId: string;
-    }) => elaprAplnService.saveMulti(body),
+    mutationFn: ({ body }: { body: ElaprAplnSaveRequest[]; elaprTmpltId: string }) =>
+      elaprAplnService.saveMulti(body),
     onSuccess: (_data, { elaprTmpltId }) => {
       queryClient.invalidateQueries({ queryKey: elaprAplnBaseKey });
       queryClient.invalidateQueries({
@@ -118,13 +126,8 @@ export function useUpdateElaprApln() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: ({
-      aplnId,
-      body,
-    }: {
-      aplnId: string;
-      body: ElaprAplnUpdateRequest;
-    }) => elaprAplnService.update(aplnId, body),
+    mutationFn: ({ aplnId, body }: { aplnId: string; body: ElaprAplnUpdateRequest }) =>
+      elaprAplnService.update(aplnId, body),
     onSuccess: (_data, { body, aplnId }) => {
       queryClient.invalidateQueries({ queryKey: elaprAplnBaseKey });
       queryClient.invalidateQueries({
@@ -141,12 +144,8 @@ export function useDeleteElaprApln() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: ({
-      aplnId,
-    }: {
-      aplnId: string;
-      elaprTmpltId: string;
-    }) => elaprAplnService.remove(aplnId),
+    mutationFn: ({ aplnId }: { aplnId: string; elaprTmpltId: string }) =>
+      elaprAplnService.remove(aplnId),
     onSuccess: (_data, { elaprTmpltId }) => {
       queryClient.invalidateQueries({ queryKey: elaprAplnBaseKey });
       queryClient.invalidateQueries({
@@ -160,12 +159,8 @@ export function useReorderElaprApln() {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: ({
-      body,
-    }: {
-      body: ElaprAplnReorderRequest;
-      elaprTmpltId: string;
-    }) => elaprAplnService.reorder(body),
+    mutationFn: ({ body }: { body: ElaprAplnReorderRequest; elaprTmpltId: string }) =>
+      elaprAplnService.reorder(body),
     onSuccess: (_data, { elaprTmpltId }) => {
       queryClient.invalidateQueries({ queryKey: elaprAplnBaseKey });
       queryClient.invalidateQueries({
@@ -174,3 +169,194 @@ export function useReorderElaprApln() {
     },
   });
 }
+
+export function useElaprDmndPage(params: ElaprDmndSearchDto) {
+  return useQuery({
+    queryKey: [...elaprDmndBaseKey, "findPage", params],
+    queryFn: () => elaprDmndService.findPage(params),
+  });
+}
+
+export function useElaprDmnd(elaprDmndId: string | null | undefined) {
+  return useQuery({
+    queryKey: [...elaprDmndBaseKey, "findById", elaprDmndId],
+    queryFn: () => elaprDmndService.findById(elaprDmndId!),
+    enabled: Boolean(elaprDmndId),
+  });
+}
+
+export function useElaprDocPrgrsByDocNo(elaprDocNo: string | null | undefined) {
+  return useQuery({
+    queryKey: [...elaprDmndBaseKey, "findDocPrgrsByDocNo", elaprDocNo],
+    queryFn: () => elaprDmndService.findDocPrgrsByDocNo(elaprDocNo!),
+    enabled: Boolean(elaprDocNo),
+  });
+}
+
+export function useSaveElaprDmnd() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: (body: ElaprDmndSaveRequestDto) => elaprDmndService.save(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: elaprDmndBaseKey });
+    },
+  });
+}
+
+export function useUpdateElaprDmnd() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: ({ elaprDmndId, body }: { elaprDmndId: string; body: ElaprDmndSaveRequestDto }) =>
+      elaprDmndService.update(elaprDmndId, body),
+    onSuccess: (_data, { elaprDmndId }) => {
+      queryClient.invalidateQueries({ queryKey: elaprDmndBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...elaprDmndBaseKey, "findById", elaprDmndId],
+      });
+    },
+  });
+}
+
+export function useUpdateElaprDmndStatus() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: ({ elaprDmndId, atrzSttsComCd }: { elaprDmndId: string; atrzSttsComCd: string }) =>
+      elaprDmndService.updateStatus(elaprDmndId, atrzSttsComCd),
+    onSuccess: (_data, { elaprDmndId }) => {
+      queryClient.invalidateQueries({ queryKey: elaprDmndBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...elaprDmndBaseKey, "findById", elaprDmndId],
+      });
+    },
+  });
+}
+
+export function useRemoveElaprDmnd() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: (elaprDmndId: string) => elaprDmndService.remove(elaprDmndId),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: elaprDmndBaseKey });
+    },
+  });
+}
+
+export function useElaprPrgrsSttsByDmndId(elaprDmndId: string | null | undefined) {
+  return useQuery({
+    queryKey: [...elaprPrgrsSttsBaseKey, "findAllByDmndId", elaprDmndId],
+    queryFn: () => elaprPrgrsSttsService.findAllByDmndId(elaprDmndId!),
+    enabled: Boolean(elaprDmndId),
+  });
+}
+
+export function useElaprPrgrsStts(elaprPrgrsId: string | null | undefined) {
+  return useQuery({
+    queryKey: [...elaprPrgrsSttsBaseKey, elaprPrgrsId],
+    queryFn: () => elaprPrgrsSttsService.findById(elaprPrgrsId!),
+    enabled: Boolean(elaprPrgrsId),
+  });
+}
+
+export function useElaprPrgrsSttsMyDocPage(params: ElaprPrgrsSttsMyDocSearchParams) {
+  return useQuery({
+    queryKey: [...elaprPrgrsSttsBaseKey, "findMyElaperDocList", params],
+    queryFn: () => elaprPrgrsSttsService.findMyElaperDocList(params),
+  });
+}
+
+export function useSaveElaprPrgrsStts() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: (requestDtos: ElaprPrgrsSttsSaveRequestDto[]) =>
+      elaprPrgrsSttsService.save(requestDtos),
+    onSuccess: () => {
+      invalidateElaprPrgrsSttsQueries(queryClient);
+    },
+  });
+}
+
+export function useProcessElaprPrgrsStts() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: ({
+      elaprPrgrsId,
+      body,
+    }: {
+      elaprPrgrsId: string;
+      body: ElaprProcessRequestDto;
+    }) => elaprPrgrsSttsService.process(elaprPrgrsId, body),
+    onSuccess: () => {
+      invalidateElaprPrgrsSttsQueries(queryClient);
+    },
+  });
+}
+
+export function useProcessElaprPrgrsSttsByDoc() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: ({
+      elaprDocNo,
+      aprvrUuid,
+      body,
+    }: {
+      elaprDocNo: string;
+      aprvrUuid: string;
+      body: ElaprProcessRequestDto;
+    }) => elaprPrgrsSttsService.processByDocNoAndAprvrUuid(elaprDocNo, aprvrUuid, body),
+    onSuccess: () => {
+      invalidateElaprPrgrsSttsQueries(queryClient);
+    },
+  });
+}
+
+export function useDeleteElaprPrgrsStts() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: (elaprPrgrsId: string) => elaprPrgrsSttsService.delete(elaprPrgrsId),
+    onSuccess: () => {
+      invalidateElaprPrgrsSttsQueries(queryClient);
+    },
+  });
+}
+
+export function useUpdateElaprPrgrsSttsApprover() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: ({
+      elaprPrgrsId,
+      body,
+    }: {
+      elaprPrgrsId: string;
+      body: ElaprApproverChangeRequestDto;
+    }) => elaprPrgrsSttsService.updateApprover(elaprPrgrsId, body),
+    onSuccess: () => {
+      invalidateElaprPrgrsSttsQueries(queryClient);
+    },
+  });
+}
+
+export function useInsertElaprPrgrsSttsApprover() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: ({
+      elaprDmndId,
+      body,
+    }: {
+      elaprDmndId: string;
+      body: ElaprApproverInsertRequestDto;
+    }) => elaprPrgrsSttsService.insertApprover(elaprDmndId, body),
+    onSuccess: () => {
+      invalidateElaprPrgrsSttsQueries(queryClient);
+    },
+  });
+}

apps/as/src/entities/elapr/index.ts

@@ -1,33 +1,122 @@
-export { elaprAplnService } from "./api/elapr-apln-service";
-export { elaprTmpltService } from "./api/elapr-tmplt-service";
-export {
-  useCreateElaprTmplt,
-  useDeleteElaprApln,
-  useDeleteElaprTmplt,
-  useElaprApln,
-  useElaprAplnPage,
-  useElaprTmplt,
-  useElaprTmpltPage,
-  useReorderElaprApln,
-  useSaveMultiElaprApln,
-  useUpdateElaprApln,
-  useUpdateElaprTmplt,
-} from "./api/queries";
-export {
-  ELAPR_APLN_SAVE_MODE,
-  type ElaprApln,
-  type ElaprAplnListParams,
-  type ElaprAplnReorderItem,
-  type ElaprAplnReorderRequest,
-  type ElaprAplnSaveMode,
-  type ElaprAplnSaveRequest,
-  type ElaprAplnService,
-  type ElaprAplnUpdateRequest,
-} from "./model/elapr-apln-interface";
-export type {
-  ElaprTmplt,
-  ElaprTmpltSaveRequest,
-  ElaprTmpltSearchParams,
-  ElaprTmpltService,
-  ElaprTmpltUpdateRequest,
-} from "./model/elapr-tmplt-interface";
+export { elaprAplnService } from "./api/elapr-apln-service";
+export { elaprDmndService } from "./api/elapr-dmnd-service";
+export { elaprPrgrsSttsService } from "./api/elapr-prgrs-stts-service";
+export { elaprTmpltService } from "./api/elapr-tmplt-service";
+export {
+  useCreateElaprTmplt,
+  useDeleteElaprApln,
+  useDeleteElaprPrgrsStts,
+  useDeleteElaprTmplt,
+  useElaprApln,
+  useElaprAplnPage,
+  useElaprDmnd,
+  useElaprDmndPage,
+  useElaprDocPrgrsByDocNo,
+  useElaprPrgrsStts,
+  useElaprPrgrsSttsByDmndId,
+  useElaprPrgrsSttsMyDocPage,
+  useElaprTmplt,
+  useElaprTmpltPage,
+  useInsertElaprPrgrsSttsApprover,
+  useProcessElaprPrgrsStts,
+  useProcessElaprPrgrsSttsByDoc,
+  useRemoveElaprDmnd,
+  useReorderElaprApln,
+  useSaveElaprDmnd,
+  useSaveElaprPrgrsStts,
+  useSaveMultiElaprApln,
+  useUpdateElaprApln,
+  useUpdateElaprDmnd,
+  useUpdateElaprDmndStatus,
+  useUpdateElaprPrgrsSttsApprover,
+  useUpdateElaprTmplt,
+} from "./api/queries";
+export {
+  assignAtrzSeqNumbers,
+  buildSaveMultiPayload,
+  hasUnsavedChanges,
+} from "./lib/apln-save-utils";
+export {
+  getVisibleRows,
+  validateAllRowsForSave,
+  validateAplnRow,
+  validateAtrzOrder,
+  validateUniqueSeqNo,
+} from "./lib/apln-validators";
+export {
+  findCurrentUserPendingApprovalRequest,
+  hasCurrentUserPendingApprovalRequest,
+} from "./lib/approval-request-utils";
+export {
+  APPROVER_STATUS_MAP,
+  type ApproverStatusConfig,
+  getApproverStatus,
+  sortByAtrzSeqNo,
+} from "./lib/approval-utils";
+export {
+  buildElaprPrgrsSttsListFromApln,
+  buildElaprPrgrsSttsListFromAplnRows,
+} from "./lib/dmnd-save-utils";
+export type { ElaprPrgrsSttsRow } from "./lib/prgrs-stts-save-utils";
+export {
+  assignPrgrsSttsAtrzSeqNumbers,
+  buildPrgrsSttsSavePayload,
+  hasUnsavedPrgrsSttsChanges,
+  isPrgrsSttsRowEditable,
+  PRGRS_STTS_WAITING_CD,
+  validateAllPrgrsSttsRows,
+  validatePrgrsSttsRow,
+} from "./lib/prgrs-stts-save-utils";
+export { createDraftRowKey, useAplnRows } from "./lib/use-apln-rows";
+export { useDndSensors } from "./lib/use-dnd-sensors";
+export { usePrgrsSttsRows } from "./lib/use-prgrs-stts-rows";
+export {
+  ELAPR_APLN_SAVE_MODE,
+  type ElaprApln,
+  type ElaprAplnListParams,
+  type ElaprAplnReorderItem,
+  type ElaprAplnReorderRequest,
+  type ElaprAplnSaveMode,
+  type ElaprAplnSaveRequest,
+  type ElaprAplnService,
+  type ElaprAplnUpdateRequest,
+} from "./model/elapr-apln-interface";
+export type { ElaprAplnRow } from "./model/elapr-apln-row-types";
+export type {
+  ElaprDmndResponseDto,
+  ElaprDmndSaveRequestDto,
+  ElaprDmndSearchDto,
+  ElaprDmndService,
+  ElaprDocPrgrsResponseDto,
+} from "./model/elapr-dmnd-interface";
+export type {
+  ElaprApproverChangeRequestDto,
+  ElaprApproverInsertRequestDto,
+  ElaprPrgrsSttsMyDocSearchParams,
+  ElaprPrgrsSttsResponseDto,
+  ElaprPrgrsSttsSaveMode,
+  ElaprPrgrsSttsSaveRequestDto,
+  ElaprPrgrsSttsSearchDto,
+  ElaprPrgrsSttsService,
+  ElaprProcessRequestDto,
+} from "./model/elapr-prgrs-stts-interface";
+export { ELAPR_PRGRS_STTS_SAVE_MODE } from "./model/elapr-prgrs-stts-interface";
+export type {
+  ElaprTmplt,
+  ElaprTmpltSaveRequest,
+  ElaprTmpltSearchParams,
+  ElaprTmpltService,
+  ElaprTmpltUpdateRequest,
+} from "./model/elapr-tmplt-interface";
+export type { ReviewerOption } from "./model/reviewer-option";
+export { AprvrPickerDialog } from "./ui/aprvr-picker-dialog";
+export { ElaprAplnPickerGrid } from "./ui/elapr-apln-picker-grid";
+export { ElaprApprovalDialog } from "./ui/elapr-approval-dialog";
+export { ElaprDocPrgrsStatus } from "./ui/elapr-doc-prgrs-status";
+export {
+  type ElaprTmpltPickerConfirmPayload,
+  ElaprTmpltPickerDialog,
+} from "./ui/elapr-tmplt-picker-dialog";
+export { ElaprTmpltSelectTable } from "./ui/elapr-tmplt-select-table";
+export { SortableAplnPickerRow } from "./ui/sortable-apln-picker-row";
+export { SortablePrgrsSttsRow } from "./ui/sortable-prgrs-stts-row";

apps/as/src/entities/elapr/lib/apln-save-utils.ts

@@ -1,8 +1,16 @@
-import { ELAPR_APLN_SAVE_MODE, type ElaprApln, type ElaprAplnSaveRequest } from "@/entities/elapr";
+import {
+  ELAPR_APLN_SAVE_MODE,
+  type ElaprApln,
+  type ElaprAplnSaveRequest,
+} from "../model/elapr-apln-interface";
+import type { ElaprAplnRow } from "../model/elapr-apln-row-types";
 
-import { assignAtrzSeqNumbers } from "./assign-atrz-seq";
-import { getVisibleRows } from "./validators";
-import type { ElaprAplnRow } from "../model/apln-row-types";
+import { getVisibleRows } from "./apln-validators";
+
+/** 그리드 행 순서(1-based)로 결재순서번호 일괄 채번 */
+export function assignAtrzSeqNumbers(rows: ElaprAplnRow[]): ElaprAplnRow[] {
+  return rows.map((row, index) => ({ ...row, atrzSeqNo: index + 1 }));
+}
 
 function rowDiffersFromServer(row: ElaprAplnRow, serverRow: ElaprApln): boolean {
   return (
@@ -22,6 +30,25 @@ function shouldIncludeUpdate(row: ElaprAplnRow, serverRows: ElaprApln[]): boolea
   return rowDiffersFromServer(row, serverRow);
 }
 
+export function hasUnsavedChanges(rows: ElaprAplnRow[], serverRows: ElaprApln[]): boolean {
+  if (rows.some((row) => row.isDeleted && row.aplnId)) return true;
+  if (rows.some((row) => row.isNew && !row.isDeleted)) return true;
+
+  const visibleWithSeq = assignAtrzSeqNumbers(getVisibleRows(rows));
+
+  for (const row of visibleWithSeq) {
+    if (row.isNew) continue;
+    if (!row.aplnId) continue;
+    if (row.isDirty) return true;
+
+    const serverRow = serverRows.find((s) => s.aplnId === row.aplnId);
+    if (!serverRow) continue;
+    if (rowDiffersFromServer(row, serverRow)) return true;
+  }
+
+  return false;
+}
+
 export function buildSaveMultiPayload(
   rows: ElaprAplnRow[],
   elaprTmpltId: string,

apps/as/src/entities/elapr/lib/apln-validators.ts

@@ -1,26 +1,19 @@
-import type { ElaprAplnRow } from "../model/apln-row-types";
+import type { ElaprAplnRow } from "../model/elapr-apln-row-types";
 
-export const ATRZ_RECEIVER_CD = "ATRZ00";
-export const ATRZ_REVIEWER_1_CD = "ATRZ01";
-export const ATRZ_REVIEWER_2_CD = "ATRZ02";
-export const ATRZ_APPROVER_CD = "ATRZ03";
-export const ATRZ_FINAL_CD = "ATRZ99";
+const ATRZ_FINAL_CD = "ATRZ99";
+
+interface AtrzOrderValidateRow {
+  atrzSeComCd?: string;
+  isDeleted?: boolean;
+}
 
 export function getVisibleRows(rows: ElaprAplnRow[]): ElaprAplnRow[] {
   return rows.filter((row) => !row.isDeleted);
 }
 
 /** 접수자·최종승인자 위치·중복 검증 (최종 저장 시점) */
-export function validateAtrzOrder(rows: ElaprAplnRow[]): string | null {
-  const visibleRows = getVisibleRows(rows);
-
-  const receiverCount = visibleRows.filter((row) => row.atrzSeComCd === ATRZ_RECEIVER_CD).length;
-  if (receiverCount === 0) {
-    return "접수자는 반드시 등록해야 합니다.";
-  }
-  if (receiverCount > 1) {
-    return "접수자는 한 명만 등록할 수 있습니다.";
-  }
+export function validateAtrzOrder(rows: AtrzOrderValidateRow[]): string | null {
+  const visibleRows = rows.filter((row) => !row.isDeleted);
 
   const finalCount = visibleRows.filter((row) => row.atrzSeComCd === ATRZ_FINAL_CD).length;
   if (finalCount === 0) {
@@ -30,10 +23,6 @@ export function validateAtrzOrder(rows: ElaprAplnRow[]): string | null {
     return "최종승인자는 한 명만 등록할 수 있습니다.";
   }
 
-  if (receiverCount === 1 && visibleRows[0]?.atrzSeComCd !== ATRZ_RECEIVER_CD) {
-    return "접수자는 결재선 첫 번째에 배치해야 합니다.";
-  }
-
   if (finalCount === 1) {
     const lastRow = visibleRows[visibleRows.length - 1];
     if (lastRow?.atrzSeComCd !== ATRZ_FINAL_CD) {

apps/as/src/entities/elapr/lib/approval-request-utils.ts

@@ -0,0 +1,23 @@
+import type { ElaprDocPrgrsResponseDto } from "../model/elapr-dmnd-interface";
+
+export function hasCurrentUserPendingApprovalRequest(
+  list: ElaprDocPrgrsResponseDto[],
+  currentUserUuid: string | undefined,
+): boolean {
+  if (!currentUserUuid) return false;
+
+  return list.some(
+    (row) => row.aprvrUuid === currentUserUuid && row.atrzPrgrsSttsComCd === "ATRZ_PRGRS_002",
+  );
+}
+
+export function findCurrentUserPendingApprovalRequest(
+  list?: ElaprDocPrgrsResponseDto[],
+  currentUserUuid?: string | undefined,
+): ElaprDocPrgrsResponseDto | undefined {
+  if (!currentUserUuid) return undefined;
+
+  return list?.find(
+    (row) => row.aprvrUuid === currentUserUuid && row.atrzPrgrsSttsComCd === "ATRZ_PRGRS_002",
+  );
+}

apps/as/src/entities/elapr/lib/approval-utils.ts

@@ -0,0 +1,29 @@
+import type { ElaprDocPrgrsClientResponseDto } from "@/shared/model";
+
+export interface ApproverStatusConfig {
+  label: string;
+  badgeClass: string;
+}
+
+export const APPROVER_STATUS_MAP: Record<string, ApproverStatusConfig> = {
+  ATRZ_PRGRS_001: { label: "대기", badgeClass: "bg-gray-100 text-gray-700" },
+  ATRZ_PRGRS_002: { label: "요청", badgeClass: "bg-yellow-100 text-yellow-700" },
+  ATRZ_PRGRS_003: { label: "승인", badgeClass: "bg-green-100 text-green-700" },
+  ATRZ_PRGRS_004: { label: "반려", badgeClass: "bg-red-100 text-red-700" },
+  ATRZ_PRGRS_999: { label: "결재안함", badgeClass: "bg-blue-100 text-blue-700" },
+};
+
+export function sortByAtrzSeqNo(
+  list: ElaprDocPrgrsClientResponseDto[],
+): ElaprDocPrgrsClientResponseDto[] {
+  return list.slice().sort((a, b) => Number(a.atrzSeqNo ?? 0) - Number(b.atrzSeqNo ?? 0));
+}
+
+export function getApproverStatus(status: string | undefined): ApproverStatusConfig {
+  return (
+    APPROVER_STATUS_MAP[status ?? ""] ?? {
+      label: status || "-",
+      badgeClass: "bg-gray-100 text-gray-700",
+    }
+  );
+}

apps/as/src/entities/elapr/lib/dmnd-save-utils.ts

@@ -0,0 +1,43 @@
+import type { ElaprApln } from "../model/elapr-apln-interface";
+import type { ElaprAplnRow } from "../model/elapr-apln-row-types";
+import type { ElaprPrgrsSttsSaveRequestDto } from "../model/elapr-prgrs-stts-interface";
+
+import { getVisibleRows } from "./apln-validators";
+
+function toPrgrsSttsItem(
+  aprvrUuid: string | undefined,
+  atrzSeComCd: string | undefined,
+  atrzSeqNo: number | undefined,
+): ElaprPrgrsSttsSaveRequestDto {
+  if (!aprvrUuid?.trim()) {
+    throw new Error("결재자가 지정되지 않은 행이 있습니다.");
+  }
+  if (!atrzSeComCd?.trim()) {
+    throw new Error("결재구분이 지정되지 않은 행이 있습니다.");
+  }
+  if (atrzSeqNo == null) {
+    throw new Error("결재순서번호가 지정되지 않은 행이 있습니다.");
+  }
+
+  return {
+    aprvrUuid,
+    atrzSeComCd,
+    atrzSeqNo,
+  };
+}
+
+/** 서식 결재선 API 응답 → 기안 요청용 진행상태 목록 */
+export function buildElaprPrgrsSttsListFromApln(
+  items: ElaprApln[],
+): ElaprPrgrsSttsSaveRequestDto[] {
+  return items.map((item) => toPrgrsSttsItem(item.aprvrUuid, item.atrzSeComCd, item.atrzSeqNo));
+}
+
+/** 결재선 그리드 행 → 기안 요청용 진행상태 목록 (서버가 seq 기준 상태 자동 결정) */
+export function buildElaprPrgrsSttsListFromAplnRows(
+  rows: ElaprAplnRow[],
+): ElaprPrgrsSttsSaveRequestDto[] {
+  return getVisibleRows(rows).map((row) =>
+    toPrgrsSttsItem(row.aprvrUuid, row.atrzSeComCd, row.atrzSeqNo),
+  );
+}

apps/as/src/entities/elapr/lib/prgrs-stts-save-utils.ts

@@ -0,0 +1,182 @@
+import {
+  ELAPR_PRGRS_STTS_SAVE_MODE,
+  type ElaprPrgrsSttsSaveRequestDto,
+} from "../model/elapr-prgrs-stts-interface";
+
+export const PRGRS_STTS_WAITING_CD = "ATRZ_PRGRS_001";
+export const PRGRS_STTS_APPROVED_CD = "ATRZ_PRGRS_003";
+
+/** 서버 행 비교용 최소 필드 */
+export interface PrgrsSttsServerRow {
+  elaprPrgrsId?: string;
+  aprvrUuid?: string;
+  atrzSeComCd?: string;
+  atrzSeqNo?: number;
+  dcarbYn?: string;
+}
+
+/** 결재선 그리드 로컬 행 — 진행상태 API 응답 + UI 보조 필드 */
+export interface ElaprPrgrsSttsRow {
+  rowKey: string;
+  elaprPrgrsId?: string;
+  elaprDmndId?: string;
+  aprvrUuid?: string;
+  aprvrNm?: string;
+  atrzSeComCd?: string;
+  atrzSeComNm?: string;
+  atrzSeqNo?: number;
+  atrzPrgrsSttsComCd?: string;
+  atrzPrgrsSttsComNm?: string;
+  rjctRsn?: string | null;
+  ognzNm?: string;
+  jbpsSeNm?: string;
+  jbgdSeNm?: string;
+  dcarbYn?: string;
+  isNew?: boolean;
+  isDirty?: boolean;
+  /** 소프트 삭제 — 최종 저장 시 mode:D */
+  isDeleted?: boolean;
+  /** 수정 취소용 스냅샷 */
+  snapshot?: ElaprPrgrsSttsRow;
+}
+
+export function isPrgrsSttsRowEditable(row: ElaprPrgrsSttsRow): boolean {
+  return row.isNew === true || row.atrzPrgrsSttsComCd === PRGRS_STTS_WAITING_CD;
+}
+
+export function isPrgrsSttsRowDcarbable(row: ElaprPrgrsSttsRow): boolean {
+  return row.atrzPrgrsSttsComCd !== PRGRS_STTS_APPROVED_CD;
+}
+
+function getVisibleRows(rows: ElaprPrgrsSttsRow[]): ElaprPrgrsSttsRow[] {
+  return rows.filter((row) => !row.isDeleted);
+}
+
+/** 그리드 행 순서(1-based)로 결재순서번호 일괄 채번 */
+export function assignPrgrsSttsAtrzSeqNumbers(rows: ElaprPrgrsSttsRow[]): ElaprPrgrsSttsRow[] {
+  return rows.map((row, index) => ({ ...row, atrzSeqNo: index + 1 }));
+}
+
+export function validatePrgrsSttsRow(row: ElaprPrgrsSttsRow): string | null {
+  if (!row.atrzSeComCd?.trim()) {
+    return "결재구분을 선택해 주세요.";
+  }
+  if (!row.aprvrUuid?.trim()) {
+    return "결재자를 선택해 주세요.";
+  }
+  return null;
+}
+
+export function validateAllPrgrsSttsRows(
+  rows: ElaprPrgrsSttsRow[],
+  isEditingLocked: boolean,
+): string | null {
+  if (isEditingLocked) {
+    return "편집 중인 행을 먼저 저장하거나 취소해 주세요.";
+  }
+
+  const visibleRows = getVisibleRows(rows);
+  if (visibleRows.length === 0) {
+    return "저장할 결재선이 없습니다.";
+  }
+
+  for (const row of visibleRows) {
+    const fieldError = validatePrgrsSttsRow(row);
+    if (fieldError) return fieldError;
+  }
+
+  return null;
+}
+
+function rowDiffersFromServer(row: ElaprPrgrsSttsRow, serverRow: PrgrsSttsServerRow): boolean {
+  return (
+    row.aprvrUuid !== serverRow.aprvrUuid ||
+    row.atrzSeComCd !== serverRow.atrzSeComCd ||
+    row.atrzSeqNo !== serverRow.atrzSeqNo ||
+    (row.dcarbYn ?? "N") !== (serverRow.dcarbYn ?? "N")
+  );
+}
+
+function shouldIncludeUpdate(row: ElaprPrgrsSttsRow, serverRows: PrgrsSttsServerRow[]): boolean {
+  if (row.isDirty) return true;
+  if (!row.elaprPrgrsId) return false;
+
+  const serverRow = serverRows.find((s) => s.elaprPrgrsId === row.elaprPrgrsId);
+  if (!serverRow) return false;
+
+  return rowDiffersFromServer(row, serverRow);
+}
+
+export function hasUnsavedPrgrsSttsChanges(
+  rows: ElaprPrgrsSttsRow[],
+  serverRows: PrgrsSttsServerRow[],
+): boolean {
+  if (rows.some((row) => row.isDeleted && row.elaprPrgrsId)) return true;
+  if (rows.some((row) => row.isNew && !row.isDeleted)) return true;
+
+  const visibleWithSeq = assignPrgrsSttsAtrzSeqNumbers(getVisibleRows(rows));
+
+  for (const row of visibleWithSeq) {
+    if (row.isNew) continue;
+    if (!row.elaprPrgrsId) continue;
+    if (row.isDirty) return true;
+
+    const serverRow = serverRows.find((s) => s.elaprPrgrsId === row.elaprPrgrsId);
+    if (!serverRow) continue;
+    if (rowDiffersFromServer(row, serverRow)) return true;
+  }
+
+  return false;
+}
+
+export function buildPrgrsSttsSavePayload(
+  rows: ElaprPrgrsSttsRow[],
+  elaprDmndId: string,
+  serverRows: PrgrsSttsServerRow[],
+): ElaprPrgrsSttsSaveRequestDto[] {
+  const payload: ElaprPrgrsSttsSaveRequestDto[] = [];
+
+  for (const row of rows) {
+    if (row.isDeleted && row.elaprPrgrsId) {
+      payload.push({
+        mode: ELAPR_PRGRS_STTS_SAVE_MODE.DELETE,
+        elaprPrgrsId: row.elaprPrgrsId,
+        elaprDmndId,
+      });
+    }
+  }
+
+  const visibleWithSeq = assignPrgrsSttsAtrzSeqNumbers(getVisibleRows(rows));
+
+  for (const row of visibleWithSeq) {
+    if (row.isNew) {
+      payload.push({
+        mode: ELAPR_PRGRS_STTS_SAVE_MODE.CREATE,
+        elaprDmndId,
+        aprvrUuid: row.aprvrUuid,
+        atrzSeComCd: row.atrzSeComCd,
+        atrzSeqNo: row.atrzSeqNo,
+        atrzPrgrsSttsComCd: row.atrzPrgrsSttsComCd,
+        dcarbYn: row.dcarbYn ?? "N",
+      });
+      continue;
+    }
+
+    if (!row.elaprPrgrsId) continue;
+
+    if (shouldIncludeUpdate(row, serverRows)) {
+      payload.push({
+        mode: ELAPR_PRGRS_STTS_SAVE_MODE.UPDATE,
+        elaprPrgrsId: row.elaprPrgrsId,
+        elaprDmndId,
+        aprvrUuid: row.aprvrUuid,
+        atrzSeComCd: row.atrzSeComCd,
+        atrzSeqNo: row.atrzSeqNo,
+        atrzPrgrsSttsComCd: row.atrzPrgrsSttsComCd,
+        dcarbYn: row.dcarbYn ?? "N",
+      });
+    }
+  }
+
+  return payload;
+}

apps/as/src/entities/elapr/lib/use-apln-rows.ts

@@ -4,12 +4,11 @@ import { useCallback, useEffect, useState } from "react";
 
 import { arrayMove } from "@dnd-kit/sortable";
 
-import type { ElaprApln } from "@/entities/elapr";
+import type { ElaprApln } from "../model/elapr-apln-interface";
+import type { ElaprAplnRow } from "../model/elapr-apln-row-types";
 
-import type { ElaprAplnRow } from "../model/apln-row-types";
-
-import { assignAtrzSeqNumbers } from "./assign-atrz-seq";
-import { getVisibleRows } from "./validators";
+import { assignAtrzSeqNumbers } from "./apln-save-utils";
+import { getVisibleRows } from "./apln-validators";
 
 function toRow(item: ElaprApln): ElaprAplnRow {
   return {
@@ -101,7 +100,13 @@ export function useAplnRows({ elaprTmpltId, serverRows }: UseAplnRowsOptions) {
       return prev.map((row) => {
         if (row.rowKey !== editingRowKey) return row;
         if (row.snapshot) {
-          const { snapshot: _s, isNew: _n, isDirty: _d, isDeleted: _del, ...restored } = row.snapshot;
+          const {
+            snapshot: _s,
+            isNew: _n,
+            isDirty: _d,
+            isDeleted: _del,
+            ...restored
+          } = row.snapshot;
           return { ...restored, isNew: false, isDirty: false, isDeleted: false };
         }
         return { ...row, isDirty: false };
@@ -110,19 +115,16 @@ export function useAplnRows({ elaprTmpltId, serverRows }: UseAplnRowsOptions) {
     setEditingRowKey(null);
   }, [editingRowKey]);
 
-  const commitEdit = useCallback(
-    (rowKey: string) => {
-      setRows((prev) =>
-        prev.map((row) => {
-          if (row.rowKey !== rowKey) return row;
-          const { snapshot: _s, ...committed } = row;
-          return { ...committed, isDirty: true };
-        }),
-      );
-      setEditingRowKey(null);
-    },
-    [],
-  );
+  const commitEdit = useCallback((rowKey: string) => {
+    setRows((prev) =>
+      prev.map((row) => {
+        if (row.rowKey !== rowKey) return row;
+        const { snapshot: _s, ...committed } = row;
+        return { ...committed, isDirty: true };
+      }),
+    );
+    setEditingRowKey(null);
+  }, []);
 
   const markDeleted = useCallback((rowKey: string) => {
     setRows((prev) => {
@@ -158,7 +160,10 @@ export function useAplnRows({ elaprTmpltId, serverRows }: UseAplnRowsOptions) {
 
         const visibleKeys = new Set(reorderedVisible.map((r) => r.rowKey));
         const deletedRows = prev.filter((r) => r.isDeleted);
-        const merged = [...reorderedVisible, ...deletedRows.filter((r) => !visibleKeys.has(r.rowKey))];
+        const merged = [
+          ...reorderedVisible,
+          ...deletedRows.filter((r) => !visibleKeys.has(r.rowKey)),
+        ];
 
         payloadRows = reorderedVisible;
         return merged;

apps/as/src/entities/elapr/lib/use-dnd-sensors.ts

@@ -1,3 +1,5 @@
+"use client";
+
 import { KeyboardSensor, PointerSensor, useSensor, useSensors } from "@dnd-kit/core";
 import { sortableKeyboardCoordinates } from "@dnd-kit/sortable";
 

apps/as/src/entities/elapr/lib/use-prgrs-stts-rows.ts

@@ -0,0 +1,240 @@
+"use client";
+
+import { useCallback, useEffect, useState } from "react";
+
+import { arrayMove } from "@dnd-kit/sortable";
+
+import type { ElaprDocPrgrsClientResponseDto } from "@/shared/model";
+
+import {
+  assignPrgrsSttsAtrzSeqNumbers,
+  type ElaprPrgrsSttsRow,
+  isPrgrsSttsRowEditable,
+  PRGRS_STTS_WAITING_CD,
+} from "./prgrs-stts-save-utils";
+import { createDraftRowKey } from "./use-apln-rows";
+
+function getVisibleRows(rows: ElaprPrgrsSttsRow[]): ElaprPrgrsSttsRow[] {
+  return rows.filter((row) => !row.isDeleted);
+}
+
+function toRow(item: ElaprDocPrgrsClientResponseDto): ElaprPrgrsSttsRow {
+  return {
+    rowKey: item.elaprPrgrsId ?? createDraftRowKey(),
+    elaprPrgrsId: item.elaprPrgrsId,
+    elaprDmndId: item.elaprDmndId,
+    aprvrUuid: item.aprvrUuid,
+    aprvrNm: item.aprvrNm,
+    atrzSeComCd: item.atrzSeComCd,
+    atrzSeComNm: item.atrzSeComNm,
+    atrzSeqNo: item.atrzSeqNo,
+    atrzPrgrsSttsComCd: item.atrzPrgrsSttsComCd,
+    atrzPrgrsSttsComNm: item.atrzPrgrsSttsComNm,
+    rjctRsn: item.rjctRsn,
+    ognzNm: item.ognzNm,
+    jbpsSeNm: item.jbpsSeNm,
+    jbgdSeNm: item.jbgdSeNm,
+    dcarbYn: item.dcarbYn ?? "N",
+    isNew: false,
+    isDirty: false,
+    isDeleted: false,
+  };
+}
+
+interface UsePrgrsSttsRowsOptions {
+  serverRows?: ElaprDocPrgrsClientResponseDto[];
+  elaprDmndId?: string | null;
+}
+
+export function usePrgrsSttsRows({ serverRows, elaprDmndId }: UsePrgrsSttsRowsOptions) {
+  const [rows, setRows] = useState<ElaprPrgrsSttsRow[]>([]);
+  const [editingRowKey, setEditingRowKey] = useState<string | null>(null);
+
+  useEffect(() => {
+    setRows((serverRows ?? []).map(toRow));
+    setEditingRowKey(null);
+  }, [serverRows]);
+
+  const isEditingLocked = editingRowKey != null;
+  const visibleRows = getVisibleRows(rows);
+
+  const addRow = useCallback(() => {
+    if (!elaprDmndId || isEditingLocked) return;
+
+    const rowKey = createDraftRowKey();
+
+    setRows((prev) => [
+      ...prev,
+      {
+        rowKey,
+        elaprDmndId,
+        atrzSeComCd: "",
+        aprvrUuid: "",
+        aprvrNm: "",
+        atrzPrgrsSttsComCd: PRGRS_STTS_WAITING_CD,
+        dcarbYn: "N",
+        isNew: true,
+        isDirty: true,
+        isDeleted: false,
+      },
+    ]);
+    setEditingRowKey(rowKey);
+  }, [elaprDmndId, isEditingLocked]);
+
+  const startEdit = useCallback(
+    (rowKey: string) => {
+      if (isEditingLocked) return;
+
+      const target = rows.find((r) => r.rowKey === rowKey);
+      if (!target || !isPrgrsSttsRowEditable(target)) return;
+
+      setEditingRowKey(rowKey);
+      setRows((prev) =>
+        prev.map((row) => (row.rowKey === rowKey ? { ...row, snapshot: { ...row } } : row)),
+      );
+    },
+    [isEditingLocked, rows],
+  );
+
+  const updateRow = useCallback(
+    (rowKey: string, patch: Partial<ElaprPrgrsSttsRow>) => {
+      if (editingRowKey !== rowKey) return;
+      setRows((prev) =>
+        prev.map((row) => (row.rowKey === rowKey ? { ...row, ...patch, isDirty: true } : row)),
+      );
+    },
+    [editingRowKey],
+  );
+
+  const setDcarbYn = useCallback(
+    (rowKey: string, checked: boolean) => {
+      if (editingRowKey != null && editingRowKey !== rowKey) return;
+
+      setRows((prev) => {
+        const target = prev.find((r) => r.rowKey === rowKey);
+        if (!target || target.isDeleted) return prev;
+
+        const nextYn = checked ? "Y" : "N";
+
+        return prev.map((row) => {
+          if (row.isDeleted) return row;
+
+          if (row.rowKey === rowKey) {
+            if ((row.dcarbYn ?? "N") === nextYn) return row;
+            return { ...row, dcarbYn: nextYn, isDirty: true };
+          }
+
+          if (!checked) return row;
+          if ((row.dcarbYn ?? "N") === "N") return row;
+          return { ...row, dcarbYn: "N", isDirty: true };
+        });
+      });
+    },
+    [editingRowKey],
+  );
+
+  const cancelEdit = useCallback(() => {
+    if (!editingRowKey) return;
+
+    setRows((prev) => {
+      const target = prev.find((r) => r.rowKey === editingRowKey);
+      if (target?.isNew) {
+        return prev.filter((r) => r.rowKey !== editingRowKey);
+      }
+      return prev.map((row) => {
+        if (row.rowKey !== editingRowKey) return row;
+        if (row.snapshot) {
+          const {
+            snapshot: _s,
+            isNew: _n,
+            isDirty: _d,
+            isDeleted: _del,
+            ...restored
+          } = row.snapshot;
+          return { ...restored, isNew: false, isDirty: false, isDeleted: false };
+        }
+        return { ...row, isDirty: false };
+      });
+    });
+    setEditingRowKey(null);
+  }, [editingRowKey]);
+
+  const commitEdit = useCallback((rowKey: string) => {
+    setRows((prev) =>
+      prev.map((row) => {
+        if (row.rowKey !== rowKey) return row;
+        const { snapshot: _s, ...committed } = row;
+        return { ...committed, isDirty: true };
+      }),
+    );
+    setEditingRowKey(null);
+  }, []);
+
+  const markDeleted = useCallback((rowKey: string) => {
+    setRows((prev) => {
+      const target = prev.find((r) => r.rowKey === rowKey);
+      if (!target || !isPrgrsSttsRowEditable(target)) return prev;
+
+      if (target.isNew) {
+        return prev.filter((r) => r.rowKey !== rowKey);
+      }
+
+      return prev.map((row) =>
+        row.rowKey === rowKey ? { ...row, isDeleted: true, isDirty: true } : row,
+      );
+    });
+    setEditingRowKey((key) => (key === rowKey ? null : key));
+  }, []);
+
+  const reorderRows = useCallback(
+    (activeKey: string, overKey: string): ElaprPrgrsSttsRow[] => {
+      if (isEditingLocked) return [];
+
+      let payloadRows: ElaprPrgrsSttsRow[] = [];
+
+      setRows((prev) => {
+        const visible = getVisibleRows(prev);
+        const activeRow = visible.find((r) => r.rowKey === activeKey);
+        const overRow = visible.find((r) => r.rowKey === overKey);
+        if (!activeRow || !overRow) return prev;
+        if (!isPrgrsSttsRowEditable(activeRow) || !isPrgrsSttsRowEditable(overRow)) return prev;
+
+        const oldIndex = visible.findIndex((r) => r.rowKey === activeKey);
+        const newIndex = visible.findIndex((r) => r.rowKey === overKey);
+        if (oldIndex < 0 || newIndex < 0) return prev;
+
+        const reorderedVisible = assignPrgrsSttsAtrzSeqNumbers(
+          arrayMove(visible, oldIndex, newIndex),
+        ).map((row) => (isPrgrsSttsRowEditable(row) ? { ...row, isDirty: true } : row));
+
+        const visibleKeys = new Set(reorderedVisible.map((r) => r.rowKey));
+        const deletedRows = prev.filter((r) => r.isDeleted);
+        const merged = [
+          ...reorderedVisible,
+          ...deletedRows.filter((r) => !visibleKeys.has(r.rowKey)),
+        ];
+
+        payloadRows = reorderedVisible.filter(isPrgrsSttsRowEditable);
+        return merged;
+      });
+
+      return payloadRows;
+    },
+    [isEditingLocked],
+  );
+
+  return {
+    rows,
+    visibleRows,
+    editingRowKey,
+    isEditingLocked,
+    addRow,
+    startEdit,
+    updateRow,
+    setDcarbYn,
+    cancelEdit,
+    commitEdit,
+    markDeleted,
+    reorderRows,
+  };
+}

apps/as/src/entities/elapr/model/elapr-apln-interface.ts

@@ -6,14 +6,14 @@ export const ELAPR_APLN_SAVE_MODE = {
   DELETE: "D",
 } as const;
 
-export type ElaprAplnSaveMode =
-  (typeof ELAPR_APLN_SAVE_MODE)[keyof typeof ELAPR_APLN_SAVE_MODE];
+export type ElaprAplnSaveMode = (typeof ELAPR_APLN_SAVE_MODE)[keyof typeof ELAPR_APLN_SAVE_MODE];
 
 export interface ElaprApln {
   aplnId: string;
   elaprTmpltId: string;
   aprvrUuid?: string;
   aprvrNm?: string;
+  aprvrUserId?: string;
   atrzSeComCd?: string;
   atrzSeComNm?: string;
   atrzSeqNo?: number;

apps/as/src/entities/elapr/model/elapr-apln-row-types.ts

@@ -1,4 +1,4 @@
-import type { ElaprApln } from "@/entities/elapr";
+import type { ElaprApln } from "./elapr-apln-interface";
 
 /** 그리드 로컬 행 — API 응답 + UI 보조 필드 */
 export interface ElaprAplnRow extends Omit<ElaprApln, "aplnId"> {

apps/as/src/entities/elapr/model/elapr-dmnd-interface.ts

@@ -0,0 +1,47 @@
+import type { ElaprDocPrgrsClientResponseDto, PageableParams, PageResponse } from "@/shared/model";
+
+import type { ElaprPrgrsSttsSaveRequestDto } from "./elapr-prgrs-stts-interface";
+
+/** 백엔드 ElaprDmndSaveRequestDto */
+export interface ElaprDmndSaveRequestDto {
+  elaprDocNo: string;
+  dmndTtl: string;
+  dmndCn: string;
+  elaprPrgrsSttsList?: ElaprPrgrsSttsSaveRequestDto[];
+}
+
+/** 백엔드 ElaprDmndResponseDto */
+export interface ElaprDmndResponseDto {
+  elaprDmndId: string;
+  rqstrUuid?: string;
+  elaprDocNo: string;
+  dmndTtl: string;
+  dmndCn: string;
+  atrzSttsComCd: string;
+  atrzSttsComNm?: string;
+  dmndDt?: string;
+  updtDt?: string;
+}
+
+/** 백엔드 ElaprDmndSearchDto + Pageable */
+export interface ElaprDmndSearchDto extends PageableParams {
+  rqstrUuid?: string;
+  atrzSttsComCd?: string;
+  dmndTtl?: string;
+  dmndDtStart?: string;
+  dmndDtEnd?: string;
+}
+
+/** 백엔드 ElaprDocPrgrsResponseDto */
+export type ElaprDocPrgrsResponseDto = ElaprDocPrgrsClientResponseDto;
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface ElaprDmndService {
+  findPage(params: ElaprDmndSearchDto): Promise<PageResponse<ElaprDmndResponseDto>>;
+  findById(elaprDmndId: string): Promise<ElaprDmndResponseDto>;
+  save(body: ElaprDmndSaveRequestDto): Promise<ElaprDmndResponseDto>;
+  update(elaprDmndId: string, body: ElaprDmndSaveRequestDto): Promise<ElaprDmndResponseDto>;
+  updateStatus(elaprDmndId: string, atrzSttsComCd: string): Promise<ElaprDmndResponseDto>;
+  remove(elaprDmndId: string): Promise<void>;
+  findDocPrgrsByDocNo(elaprDocNo: string): Promise<ElaprDocPrgrsResponseDto[]>;
+}

apps/as/src/entities/elapr/model/elapr-prgrs-stts-interface.ts

@@ -0,0 +1,92 @@
+import type { PageableParams, PageResponse } from "@/shared/model";
+
+export const ELAPR_PRGRS_STTS_SAVE_MODE = {
+  CREATE: "C",
+  READ: "R",
+  UPDATE: "U",
+  DELETE: "D",
+} as const;
+
+export type ElaprPrgrsSttsSaveMode =
+  (typeof ELAPR_PRGRS_STTS_SAVE_MODE)[keyof typeof ELAPR_PRGRS_STTS_SAVE_MODE];
+
+/** 백엔드 ElaprPrgrsSttsResponseDto */
+export interface ElaprPrgrsSttsResponseDto {
+  elaprPrgrsId: string;
+  elaprDmndId?: string;
+  aprvrUuid?: string;
+  atrzSeComCd?: string;
+  atrzSeComNm?: string;
+  atrzSeqNo?: number;
+  atrzPrgrsSttsComCd?: string;
+  atrzPrgrsSttsComNm?: string;
+  rjctRsn?: string;
+  atrzDt?: string;
+  dcarbYn?: string;
+}
+
+/** 백엔드 ElaprPrgrsSttsSaveRequestDto */
+export interface ElaprPrgrsSttsSaveRequestDto {
+  mode?: ElaprPrgrsSttsSaveMode;
+  elaprPrgrsId?: string;
+  elaprDmndId?: string;
+  aprvrUuid?: string;
+  atrzSeComCd?: string;
+  atrzSeqNo?: number;
+  atrzPrgrsSttsComCd?: string;
+  dcarbYn?: string;
+}
+
+/** 백엔드 ElaprPrgrsSttsSearchDto */
+export interface ElaprPrgrsSttsSearchDto {
+  atrzSeComCd: string;
+  atrzSeqNo: number;
+  atrzPrgrsSttsComCd?: string;
+}
+
+/** 백엔드 ElaprPrgrsSttsSearchDto + Pageable */
+export interface ElaprPrgrsSttsMyDocSearchParams extends ElaprPrgrsSttsSearchDto, PageableParams {}
+
+/** 백엔드 ElaprProcessRequestDto */
+export interface ElaprProcessRequestDto {
+  atrzPrgrsSttsComCd: string;
+  rjctRsn?: string;
+  finalApprovalYn?: boolean;
+}
+
+/** 백엔드 ElaprApproverChangeRequestDto */
+export interface ElaprApproverChangeRequestDto {
+  aprvrUuid: string;
+}
+
+/** 백엔드 ElaprApproverInsertRequestDto */
+export interface ElaprApproverInsertRequestDto {
+  aprvrUuid: string;
+  atrzSeComCd: string;
+  atrzSeqNo: number;
+}
+
+/** Controller public 메서드명·시그니처와 동일 */
+export interface ElaprPrgrsSttsService {
+  findAllByDmndId(elaprDmndId?: string): Promise<ElaprPrgrsSttsResponseDto[]>;
+  findById(elaprPrgrsId: string): Promise<ElaprPrgrsSttsResponseDto>;
+  save(requestDtos: ElaprPrgrsSttsSaveRequestDto[]): Promise<ElaprPrgrsSttsResponseDto[]>;
+  process(elaprPrgrsId: string, body: ElaprProcessRequestDto): Promise<ElaprPrgrsSttsResponseDto>;
+  processByDocNoAndAprvrUuid(
+    elaprDocNo: string,
+    aprvrUuid: string,
+    body: ElaprProcessRequestDto,
+  ): Promise<ElaprPrgrsSttsResponseDto>;
+  delete(elaprPrgrsId: string): Promise<void>;
+  updateApprover(
+    elaprPrgrsId: string,
+    body: ElaprApproverChangeRequestDto,
+  ): Promise<ElaprPrgrsSttsResponseDto>;
+  insertApprover(
+    elaprDmndId: string,
+    body: ElaprApproverInsertRequestDto,
+  ): Promise<ElaprPrgrsSttsResponseDto>;
+  findMyElaperDocList(
+    params: ElaprPrgrsSttsMyDocSearchParams,
+  ): Promise<PageResponse<ElaprPrgrsSttsResponseDto>>;
+}

apps/as/src/entities/elapr/model/reviewer-option.ts

@@ -0,0 +1,5 @@
+export interface ReviewerOption {
+  uuid: string;
+  name: string;
+  deptNm: string;
+}

apps/as/src/entities/elapr/ui/aprvr-picker-dialog.tsx

@@ -0,0 +1,125 @@
+"use client";
+
+import { RvwMnpwMngResponseDto, useRvwMnpwMngPage } from "@/entities/rvw-mnpw";
+import {
+  Button,
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  Skeleton,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from "@common/components";
+
+import { type ReviewerOption } from "../model/reviewer-option";
+
+const PAGE_SIZE = 500;
+
+interface AprvrPickerDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  atrzSeComCd: string;
+  onSelect: (reviewer: ReviewerOption) => void;
+}
+
+function AprvrPickerDialog({ open, onOpenChange, atrzSeComCd, onSelect }: AprvrPickerDialogProps) {
+  const { data, isPending, isError } = useRvwMnpwMngPage(
+    {
+      atrzSeComCd,
+      page: 0,
+      size: PAGE_SIZE,
+      sort: "userUuidNm,asc",
+    },
+    { enabled: open },
+  );
+
+  const items = data?.content ?? [];
+
+  function fromRvwMnpwMng(item: RvwMnpwMngResponseDto): ReviewerOption {
+    return {
+      uuid: item.userUuid,
+      name: item.userUuidNm ?? "",
+      deptNm: item.ognzNm ?? "",
+    };
+  }
+
+  function handleSelect(item: (typeof items)[number]) {
+    onSelect(fromRvwMnpwMng(item));
+    onOpenChange(false);
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="max-w-[56rem]" aria-describedby={undefined}>
+        <DialogHeader>
+          <DialogTitle>검토인력 선택</DialogTitle>
+        </DialogHeader>
+
+        <div className="h-[36rem] overflow-auto">
+          {isPending ? (
+            <div className="flex flex-col gap-2">
+              <Skeleton className="h-[4rem]" />
+              <Skeleton className="h-[16rem]" />
+            </div>
+          ) : isError ? (
+            <p className="py-8 text-center text-lg text-muted-foreground">
+              검토인력 목록을 불러오지 못했습니다.
+            </p>
+          ) : items.length === 0 ? (
+            <p className="py-8 text-center text-lg text-muted-foreground">
+              배치된 검토인력이 없습니다.
+            </p>
+          ) : (
+            <Table className="w-full">
+              <colgroup>
+                <col width="25%" />
+                <col width="25%" />
+                <col width="15%" />
+                <col width="15%" />
+                <col width="20%" />
+              </colgroup>
+              <TableHeader>
+                <TableRow>
+                  <TableHead>성명</TableHead>
+                  <TableHead>부서</TableHead>
+                  <TableHead>직위</TableHead>
+                  <TableHead>직급</TableHead>
+                  <TableHead>선택</TableHead>
+                </TableRow>
+              </TableHeader>
+              <TableBody>
+                {items.map((item) => (
+                  <TableRow key={`${item.atrzSeComCd}-${item.ognzSn}-${item.userUuid}`}>
+                    <TableCell align="center">{item.userUuidNm || item.userUuid}</TableCell>
+                    <TableCell align="center">{item.ognzNm || "-"}</TableCell>
+                    <TableCell align="center">{item.jbpsSeNm || "-"}</TableCell>
+                    <TableCell align="center">{item.jbgdSeNm || "-"}</TableCell>
+                    <TableCell align="center">
+                      <Button type="button" size="sm" onClick={() => handleSelect(item)}>
+                        선택
+                      </Button>
+                    </TableCell>
+                  </TableRow>
+                ))}
+              </TableBody>
+            </Table>
+          )}
+        </div>
+
+        <DialogFooter>
+          <Button type="button" color="white" onClick={() => onOpenChange(false)}>
+            닫기
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+export { AprvrPickerDialog };

apps/as/src/entities/elapr/ui/elapr-apln-picker-grid.tsx

@@ -0,0 +1,202 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+import { closestCenter, DndContext, type DragEndEvent } from "@dnd-kit/core";
+import { SortableContext, verticalListSortingStrategy } from "@dnd-kit/sortable";
+
+import { useAlertStore } from "@/shared/lib";
+import {
+  Button,
+  Skeleton,
+  Table,
+  TableBody,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from "@common/components";
+
+import { useElaprAplnPage } from "../api/queries";
+import { validateAplnRow } from "../lib/apln-validators";
+import { useAplnRows } from "../lib/use-apln-rows";
+import { useDndSensors } from "../lib/use-dnd-sensors";
+import type { ElaprAplnRow } from "../model/elapr-apln-row-types";
+import type { ReviewerOption } from "../model/reviewer-option";
+
+import { AprvrPickerDialog } from "./aprvr-picker-dialog";
+import { SortableAplnPickerRow } from "./sortable-apln-picker-row";
+
+interface ElaprAplnPickerGridProps {
+  elaprTmpltId: string | null;
+  onRowsChange?: (rows: ElaprAplnRow[]) => void;
+  onEditingLockedChange?: (locked: boolean) => void;
+}
+
+function ElaprAplnPickerGrid({
+  elaprTmpltId,
+  onRowsChange,
+  onEditingLockedChange,
+}: ElaprAplnPickerGridProps) {
+  const [pickerOpen, setPickerOpen] = useState(false);
+  const [pickingRowKey, setPickingRowKey] = useState<string | null>(null);
+
+  const alert = useAlertStore((state) => state.setMessage);
+
+  const aplnQuery = useElaprAplnPage({
+    elaprTmpltId: elaprTmpltId ?? undefined,
+    page: 0,
+    size: 200,
+    sort: "atrzSeqNo,asc",
+  });
+
+  const {
+    rows,
+    visibleRows,
+    editingRowKey,
+    isEditingLocked,
+    addRow,
+    startEdit,
+    updateRow,
+    cancelEdit,
+    commitEdit,
+    markDeleted,
+    reorderRows,
+  } = useAplnRows({
+    elaprTmpltId,
+    serverRows: aplnQuery.data?.content,
+  });
+
+  useEffect(() => {
+    onRowsChange?.(rows);
+  }, [rows, onRowsChange]);
+
+  useEffect(() => {
+    onEditingLockedChange?.(isEditingLocked);
+  }, [isEditingLocked, onEditingLockedChange]);
+
+  const sensors = useDndSensors();
+  const isDisabled = !elaprTmpltId;
+  const pickingRow = pickingRowKey ? rows.find((r) => r.rowKey === pickingRowKey) : undefined;
+
+  function handleDragEnd(event: DragEndEvent) {
+    const { active, over } = event;
+    if (!over || active.id === over.id) return;
+
+    reorderRows(String(active.id), String(over.id));
+  }
+
+  function handleRowChange(row: ElaprAplnRow, patch: Partial<ElaprAplnRow>) {
+    updateRow(row.rowKey, patch);
+  }
+
+  function handleRowSave(row: ElaprAplnRow) {
+    const fieldError = validateAplnRow(row);
+    if (fieldError) {
+      alert(fieldError);
+      return;
+    }
+
+    commitEdit(row.rowKey);
+  }
+
+  function handleRowDelete(row: ElaprAplnRow) {
+    markDeleted(row.rowKey);
+  }
+
+  function handleReviewerSelect(reviewer: ReviewerOption) {
+    if (!pickingRowKey) return;
+    updateRow(pickingRowKey, {
+      aprvrUuid: reviewer.uuid,
+      aprvrNm: reviewer.name,
+    });
+    setPickingRowKey(null);
+  }
+
+  return (
+    <section className="card card-border mx-0 min-h-[32rem] flex-1 pt-0">
+      <div className="card-header flex flex-wrap items-center justify-between gap-3">
+        <h3 className="text-2xl font-semibold">결재선 관리</h3>
+        <div className="flex flex-wrap items-center gap-3">
+          <Button
+            size="sm"
+            type="button"
+            color="green"
+            disabled={isDisabled || isEditingLocked}
+            onClick={addRow}
+          >
+            결재선 추가
+          </Button>
+        </div>
+      </div>
+
+      {aplnQuery.isPending && elaprTmpltId ? (
+        <div className="flex flex-col gap-2">
+          <Skeleton className="h-[4rem]" />
+          <Skeleton className="h-[16rem]" />
+        </div>
+      ) : !elaprTmpltId ? (
+        <p className="py-8 text-center text-lg text-muted-foreground">결재서식을 선택하세요.</p>
+      ) : visibleRows.length === 0 ? (
+        <p className="py-8 text-center text-lg text-muted-foreground">
+          등록된 결재선이 없습니다. [결재선 추가]로 결재자를 등록하세요.
+        </p>
+      ) : (
+        <DndContext sensors={sensors} collisionDetection={closestCenter} onDragEnd={handleDragEnd}>
+          <Table className="w-full">
+            <colgroup>
+              <col width="10%" />
+              <col width="10%" />
+              <col width="10%" />
+              <col width="50%" />
+              <col width="20%" />
+            </colgroup>
+            <TableHeader>
+              <TableRow>
+                <TableHead className="w-10" />
+                <TableHead>결재순서</TableHead>
+                <TableHead>결재구분</TableHead>
+                <TableHead>결재자</TableHead>
+                <TableHead>관리</TableHead>
+              </TableRow>
+            </TableHeader>
+            <TableBody>
+              <SortableContext
+                items={visibleRows.map((r) => r.rowKey)}
+                strategy={verticalListSortingStrategy}
+              >
+                {visibleRows.map((row, index) => (
+                  <SortableAplnPickerRow
+                    key={row.rowKey}
+                    row={row}
+                    displaySeqNo={index + 1}
+                    isEditing={editingRowKey === row.rowKey}
+                    isLocked={isEditingLocked}
+                    dragDisabled={isEditingLocked || !row.atrzSeComCd}
+                    onStartEdit={() => startEdit(row.rowKey)}
+                    onSave={() => handleRowSave(row)}
+                    onCancel={cancelEdit}
+                    onDelete={() => handleRowDelete(row)}
+                    onChange={(patch) => handleRowChange(row, patch)}
+                    onPickAprvr={() => {
+                      setPickingRowKey(row.rowKey);
+                      setPickerOpen(true);
+                    }}
+                  />
+                ))}
+              </SortableContext>
+            </TableBody>
+          </Table>
+        </DndContext>
+      )}
+
+      <AprvrPickerDialog
+        open={pickerOpen}
+        onOpenChange={setPickerOpen}
+        atrzSeComCd={pickingRow?.atrzSeComCd ?? ""}
+        onSelect={handleReviewerSelect}
+      />
+    </section>
+  );
+}
+
+export { ElaprAplnPickerGrid };

apps/as/src/entities/elapr/ui/elapr-approval-dialog.tsx

@@ -0,0 +1,408 @@
+"use client";
+
+import { useState } from "react";
+
+import { closestCenter, DndContext, type DragEndEvent } from "@dnd-kit/core";
+import { SortableContext, verticalListSortingStrategy } from "@dnd-kit/sortable";
+import { useQueryClient } from "@tanstack/react-query";
+import { AxiosError } from "axios";
+
+import { ENDPOINT } from "@/shared/config";
+import { useAlertStore } from "@/shared/lib";
+import {
+  Button,
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  Skeleton,
+  Table,
+  TableBody,
+  TableHead,
+  TableHeader,
+  TableRow,
+  Textarea,
+} from "@common/components";
+
+import { elaprPrgrsSttsService } from "../api/elapr-prgrs-stts-service";
+import { useElaprDocPrgrsByDocNo, useSaveElaprPrgrsStts } from "../api/queries";
+import { validateAtrzOrder } from "../lib/apln-validators";
+import { findCurrentUserPendingApprovalRequest } from "../lib/approval-request-utils";
+import {
+  buildPrgrsSttsSavePayload,
+  hasUnsavedPrgrsSttsChanges,
+  isPrgrsSttsRowEditable,
+  validateAllPrgrsSttsRows,
+  validatePrgrsSttsRow,
+} from "../lib/prgrs-stts-save-utils";
+import { useDndSensors } from "../lib/use-dnd-sensors";
+import { usePrgrsSttsRows } from "../lib/use-prgrs-stts-rows";
+import type { ReviewerOption } from "../model/reviewer-option";
+
+import { AprvrPickerDialog } from "./aprvr-picker-dialog";
+import { SortablePrgrsSttsRow } from "./sortable-prgrs-stts-row";
+
+interface ElaprApprovalDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  elaprDocNo: string;
+  currentUserUuid: string;
+  onSuccess: () => void;
+}
+
+const UNSAVED_PRGRS_STTS_MESSAGE = "결재선 변경 이력이 있습니다.\n결재선 저장을 해 주세요.";
+
+function ElaprApprovalDialog({
+  open,
+  onOpenChange,
+  elaprDocNo,
+  currentUserUuid,
+  onSuccess,
+}: ElaprApprovalDialogProps) {
+  const queryClient = useQueryClient();
+  const alert = useAlertStore((state) => state.setMessage);
+  const [rjctRsn, setRjctRsn] = useState("");
+  const [isProcessing, setIsProcessing] = useState(false);
+  const [pickerOpen, setPickerOpen] = useState(false);
+  const [pickingRowKey, setPickingRowKey] = useState<string | null>(null);
+
+  const { data: elaprDocPrgrsList, isLoading } = useElaprDocPrgrsByDocNo(open ? elaprDocNo : null);
+
+  const elaprDmndId = elaprDocPrgrsList?.[0]?.elaprDmndId;
+
+  const {
+    rows,
+    visibleRows,
+    editingRowKey,
+    isEditingLocked,
+    addRow,
+    startEdit,
+    updateRow,
+    setDcarbYn,
+    cancelEdit,
+    commitEdit,
+    markDeleted,
+    reorderRows,
+  } = usePrgrsSttsRows({
+    serverRows: elaprDocPrgrsList,
+    elaprDmndId,
+  });
+
+  const savePrgrsSttsMutation = useSaveElaprPrgrsStts();
+  const sensors = useDndSensors();
+
+  const currentUserPrgrs = findCurrentUserPendingApprovalRequest(
+    elaprDocPrgrsList,
+    currentUserUuid,
+  );
+  const canApprove = Boolean(currentUserPrgrs?.elaprPrgrsId);
+
+  const pickingRow = pickingRowKey ? rows.find((r) => r.rowKey === pickingRowKey) : undefined;
+  const isBusy = isProcessing || savePrgrsSttsMutation.isPending;
+  const isPrgrsSttsUnsaved = hasUnsavedPrgrsSttsChanges(rows, elaprDocPrgrsList ?? []);
+
+  function handleDragEnd(event: DragEndEvent) {
+    const { active, over } = event;
+    if (!over || active.id === over.id) return;
+
+    reorderRows(String(active.id), String(over.id));
+  }
+
+  function handleRowSave(rowKey: string) {
+    const row = rows.find((r) => r.rowKey === rowKey);
+    if (!row) return;
+
+    const fieldError = validatePrgrsSttsRow(row);
+    if (fieldError) {
+      alert(fieldError);
+      return;
+    }
+
+    commitEdit(rowKey);
+  }
+
+  function handleReviewerSelect(reviewer: ReviewerOption) {
+    if (!pickingRowKey) return;
+    updateRow(pickingRowKey, {
+      aprvrUuid: reviewer.uuid,
+      aprvrNm: reviewer.name,
+      ognzNm: reviewer.deptNm,
+    });
+    setPickingRowKey(null);
+  }
+
+  function assertPrgrsSttsSaved(): boolean {
+    if (isEditingLocked) {
+      alert(UNSAVED_PRGRS_STTS_MESSAGE);
+      return false;
+    }
+
+    if (isPrgrsSttsUnsaved) {
+      alert(UNSAVED_PRGRS_STTS_MESSAGE);
+      return false;
+    }
+
+    return true;
+  }
+
+  async function handleSavePrgrsStts() {
+    if (!elaprDmndId) {
+      alert("결재 요청 정보가 없습니다.");
+      return;
+    }
+
+    const validationError = validateAllPrgrsSttsRows(rows, isEditingLocked);
+    if (validationError) {
+      alert(validationError);
+      return;
+    }
+
+    const orderError = validateAtrzOrder(rows);
+    if (orderError) {
+      alert(orderError);
+      return;
+    }
+
+    const payload = buildPrgrsSttsSavePayload(rows, elaprDmndId, elaprDocPrgrsList ?? []);
+    if (payload.length === 0) {
+      alert("변경된 결재선이 없습니다.");
+      return;
+    }
+
+    setIsProcessing(true);
+    try {
+      await savePrgrsSttsMutation.mutateAsync(payload);
+      alert("결재선이 저장되었습니다.");
+      await queryClient.invalidateQueries({
+        queryKey: [ENDPOINT.AS_ELAPR_SERVICE.ELAPR_DMND, "findDocPrgrsByDocNo", elaprDocNo],
+      });
+      onSuccess();
+    } catch (error: unknown) {
+      let errorMessage = "결재선 저장 중 오류가 발생했습니다.";
+      if (error instanceof AxiosError) {
+        errorMessage = error.response?.data?.message ?? errorMessage;
+      }
+      alert(errorMessage);
+    } finally {
+      setIsProcessing(false);
+    }
+  }
+
+  async function handleApprove() {
+    if (!currentUserPrgrs?.elaprPrgrsId) return;
+    if (!assertPrgrsSttsSaved()) return;
+
+    setIsProcessing(true);
+    try {
+      await elaprPrgrsSttsService.process(currentUserPrgrs.elaprPrgrsId, {
+        atrzPrgrsSttsComCd: "ATRZ_PRGRS_003",
+      });
+      alert("결재가 완료되었습니다.");
+      queryClient.invalidateQueries({
+        queryKey: [ENDPOINT.AS_ELAPR_SERVICE.ELAPR_DMND, "findDocPrgrsByDocNo", elaprDocNo],
+      });
+      onSuccess();
+      onOpenChange(false);
+    } catch (error: unknown) {
+      let errorMessage = "";
+      if (error instanceof AxiosError) {
+        errorMessage = error.response?.data?.message ?? "";
+      } else {
+        errorMessage = "결재 처리 중 오류가 발생했습니다.";
+      }
+      alert(errorMessage);
+    } finally {
+      setIsProcessing(false);
+    }
+  }
+
+  async function handleReject() {
+    if (!currentUserPrgrs?.elaprPrgrsId) return;
+    if (!rjctRsn.trim()) {
+      alert("반려 사유를 입력해주세요.");
+      return;
+    }
+    if (!assertPrgrsSttsSaved()) return;
+
+    setIsProcessing(true);
+    try {
+      await elaprPrgrsSttsService.process(currentUserPrgrs.elaprPrgrsId, {
+        atrzPrgrsSttsComCd: "ATRZ_PRGRS_004",
+        rjctRsn: rjctRsn.trim(),
+      });
+      alert("반려 처리가 완료되었습니다.");
+      queryClient.invalidateQueries({
+        queryKey: [ENDPOINT.AS_ELAPR_SERVICE.ELAPR_DMND, "findDocPrgrsByDocNo", elaprDocNo],
+      });
+      onSuccess();
+      onOpenChange(false);
+    } catch (error: unknown) {
+      let errorMessage = "";
+      if (error instanceof AxiosError) {
+        errorMessage = error.response?.data?.message ?? "";
+      } else {
+        errorMessage = "반려 처리 중 오류가 발생했습니다.";
+      }
+      alert(errorMessage);
+    } finally {
+      setIsProcessing(false);
+    }
+  }
+
+  function handleClose() {
+    setRjctRsn("");
+    setPickingRowKey(null);
+    onOpenChange(false);
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={handleClose}>
+      <DialogContent className="max-w-[72rem]" aria-describedby={undefined}>
+        <DialogHeader>
+          <DialogTitle>전자결재</DialogTitle>
+        </DialogHeader>
+
+        <div className="space-y-6">
+          <div>
+            <div className="mb-3 flex flex-wrap items-center justify-between gap-3">
+              <h4 className="text-xl font-semibold">결재 진행 단계</h4>
+              <div className="flex items-center gap-2">
+                <Button
+                  size="sm"
+                  type="button"
+                  color="white"
+                  disabled={!elaprDmndId || isEditingLocked || isBusy}
+                  onClick={addRow}
+                >
+                  결재선 추가
+                </Button>
+                {elaprDmndId && (
+                  <Button
+                    size="sm"
+                    type="button"
+                    onClick={handleSavePrgrsStts}
+                    disabled={!isPrgrsSttsUnsaved || isEditingLocked || isBusy}
+                  >
+                    결재선 저장
+                  </Button>
+                )}
+              </div>
+            </div>
+
+            {isLoading ? (
+              <div className="space-y-3">
+                <Skeleton className="h-12 w-full" />
+                <Skeleton className="h-32 w-full" />
+              </div>
+            ) : visibleRows.length === 0 ? (
+              <div className="py-8 text-center text-gray-500">
+                {elaprDmndId
+                  ? "등록된 결재선이 없습니다. [결재선 추가]로 결재자를 등록하세요."
+                  : "결재 정보가 없습니다."}
+              </div>
+            ) : (
+              <DndContext
+                sensors={sensors}
+                collisionDetection={closestCenter}
+                onDragEnd={handleDragEnd}
+              >
+                <Table className="w-full">
+                  <colgroup>
+                    <col width="8%" />
+                    <col width="8%" />
+                    <col width="10%" />
+                    <col width="30%" />
+                    <col width="10%" />
+                    <col width="10%" />
+                    <col width="24%" />
+                  </colgroup>
+                  <TableHeader>
+                    <TableRow>
+                      <TableHead className="w-10" />
+                      <TableHead>결재순서</TableHead>
+                      <TableHead>결재구분</TableHead>
+                      <TableHead>결재자</TableHead>
+                      <TableHead>전결자 지정</TableHead>
+                      <TableHead>결재상태</TableHead>
+                      <TableHead>관리</TableHead>
+                    </TableRow>
+                  </TableHeader>
+                  <TableBody>
+                    <SortableContext
+                      items={visibleRows.map((r) => r.rowKey)}
+                      strategy={verticalListSortingStrategy}
+                    >
+                      {visibleRows.map((row, index) => (
+                        <SortablePrgrsSttsRow
+                          key={row.rowKey}
+                          row={row}
+                          displaySeqNo={index + 1}
+                          isEditing={editingRowKey === row.rowKey}
+                          isLocked={isEditingLocked}
+                          dragDisabled={
+                            isEditingLocked || !isPrgrsSttsRowEditable(row) || !row.atrzSeComCd
+                          }
+                          onStartEdit={() => startEdit(row.rowKey)}
+                          onSave={() => handleRowSave(row.rowKey)}
+                          onCancel={cancelEdit}
+                          onDelete={() => markDeleted(row.rowKey)}
+                          onChange={(patch) => updateRow(row.rowKey, patch)}
+                          onPickAprvr={() => {
+                            setPickingRowKey(row.rowKey);
+                            setPickerOpen(true);
+                          }}
+                          onToggleDcarb={(checked) => setDcarbYn(row.rowKey, checked)}
+                        />
+                      ))}
+                    </SortableContext>
+                  </TableBody>
+                </Table>
+              </DndContext>
+            )}
+          </div>
+
+          {canApprove && (
+            <div>
+              <h4 className="mb-3 text-xl font-semibold">반려 의견</h4>
+              <Textarea
+                value={rjctRsn}
+                onChange={(event) => setRjctRsn(event.target.value)}
+                placeholder="반려 시 사유를 입력하세요"
+                rows={4}
+                className="!text-xl"
+              />
+            </div>
+          )}
+        </div>
+
+        <DialogFooter>
+          <div className="flex w-full items-center justify-between">
+            <Button type="button" color="white" onClick={handleClose} disabled={isBusy}>
+              취소
+            </Button>
+            {canApprove && (
+              <div className="flex items-center gap-2">
+                <Button onClick={handleApprove} disabled={isBusy}>
+                  결재
+                </Button>
+                <Button color="red" onClick={handleReject} disabled={isBusy}>
+                  반려
+                </Button>
+              </div>
+            )}
+          </div>
+        </DialogFooter>
+      </DialogContent>
+
+      <AprvrPickerDialog
+        open={pickerOpen}
+        onOpenChange={setPickerOpen}
+        atrzSeComCd={pickingRow?.atrzSeComCd ?? ""}
+        onSelect={handleReviewerSelect}
+      />
+    </Dialog>
+  );
+}
+
+export { ElaprApprovalDialog };

apps/as/src/entities/elapr/ui/elapr-doc-prgrs-status.tsx

@@ -0,0 +1,95 @@
+"use client";
+
+import { Fragment } from "react";
+
+import { ChevronRight } from "lucide-react";
+
+import type { ElaprDocPrgrsClientResponseDto } from "@/shared/model";
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/shared/ui/tooltip";
+import { cn, Skeleton } from "@common/components";
+
+import { useElaprDocPrgrsByDocNo } from "../api/queries";
+import { getApproverStatus, sortByAtrzSeqNo } from "../lib/approval-utils";
+
+const REJECT_STATUS_CD = "ATRZ_PRGRS_004";
+
+interface ElaprDocPrgrsStatusProps {
+  elaprDocNo: string | null | undefined;
+}
+
+function ElaprDocPrgrsStep({ item }: { item: ElaprDocPrgrsClientResponseDto }) {
+  const status = getApproverStatus(item.atrzPrgrsSttsComCd);
+  const isRejected = item.atrzPrgrsSttsComCd === REJECT_STATUS_CD;
+  const rjctRsn = item.rjctRsn?.trim();
+  const metaParts = [item.ognzNm, item.jbpsSeNm].filter(Boolean);
+
+  const statusBadge = (
+    <span
+      className={cn(
+        "inline-flex items-center rounded-sm px-2 py-1 text-lg font-medium",
+        status.badgeClass,
+        isRejected && rjctRsn && "cursor-help underline decoration-dotted underline-offset-4",
+      )}
+    >
+      {status.label}
+    </span>
+  );
+
+  return (
+    <div className="flex min-w-[12rem] flex-1 flex-col items-center gap-3 p-4 text-center">
+      {isRejected && rjctRsn ? (
+        <Tooltip>
+          <TooltipTrigger asChild>{statusBadge}</TooltipTrigger>
+          <TooltipContent sideOffset={4} className="max-w-md whitespace-pre-wrap">
+            {rjctRsn}
+          </TooltipContent>
+        </Tooltip>
+      ) : (
+        statusBadge
+      )}
+      <div className="flex flex-col items-center gap-1">
+        <div className="flex items-center gap-2">
+          <span className="text-xl text-muted-foreground">[{item.atrzSeComNm || "-"}]</span>
+          <span className="text-xl font-semibold">{item.aprvrNm || item.aprvrUuid || "-"}</span>
+        </div>
+        {metaParts.length > 0 && (
+          <span className="text-base text-gray-500">{metaParts.join(" · ")}</span>
+        )}
+      </div>
+    </div>
+  );
+}
+
+function ElaprDocPrgrsStatus({ elaprDocNo }: ElaprDocPrgrsStatusProps) {
+  const { data, isLoading } = useElaprDocPrgrsByDocNo(elaprDocNo);
+  const steps = sortByAtrzSeqNo(data ?? []);
+
+  if (isLoading) {
+    return (
+      <div className="flex items-center gap-3 px-4 py-6">
+        <Skeleton className="h-24 flex-1 rounded-sm" />
+        <Skeleton className="h-24 flex-1 rounded-sm" />
+        <Skeleton className="h-24 flex-1 rounded-sm" />
+      </div>
+    );
+  }
+
+  if (steps.length === 0) {
+    return <div className="py-8 text-center text-xl text-gray-500">결재 정보가 없습니다.</div>;
+  }
+
+  return (
+    <div className="flex flex-wrap items-stretch justify-start gap-4 overflow-x-auto">
+      {steps.map((item, index) => (
+        <Fragment key={item.elaprPrgrsId ?? `${item.atrzSeqNo}-${item.aprvrUuid ?? index}`}>
+          <div className="flex items-center">
+            {index > 0 && <ChevronRight className="size-8 text-muted-foreground" />}
+          </div>
+          <ElaprDocPrgrsStep item={item} />
+        </Fragment>
+      ))}
+    </div>
+  );
+}
+
+export { ElaprDocPrgrsStatus };

apps/as/src/entities/elapr/ui/elapr-tmplt-picker-dialog.tsx

@@ -0,0 +1,166 @@
+"use client";
+
+import { useCallback, useState } from "react";
+
+import { useAlertStore } from "@/shared/lib";
+import {
+  Button,
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@common/components";
+
+import { useElaprTmpltPage } from "../api/queries";
+import {
+  getVisibleRows,
+  validateAllRowsForSave,
+  validateAtrzOrder,
+  validateUniqueSeqNo,
+} from "../lib/apln-validators";
+import type { ElaprAplnRow } from "../model/elapr-apln-row-types";
+import type { ElaprTmplt } from "../model/elapr-tmplt-interface";
+
+import { ElaprAplnPickerGrid } from "./elapr-apln-picker-grid";
+import { ElaprTmpltSelectTable } from "./elapr-tmplt-select-table";
+
+const PAGE_SIZE = 100;
+
+interface ElaprTmpltPickerConfirmPayload {
+  tmplt: ElaprTmplt;
+  aplnRows: ElaprAplnRow[];
+}
+
+interface ElaprTmpltPickerDialogProps {
+  open: boolean;
+  onClose: () => void;
+  docSeComCd: string;
+  onSelect?: (tmplt: ElaprTmplt) => void;
+  onConfirm?: (payload: ElaprTmpltPickerConfirmPayload) => void;
+}
+
+function ElaprTmpltPickerDialog({
+  open,
+  onClose,
+  docSeComCd,
+  onSelect,
+  onConfirm,
+}: ElaprTmpltPickerDialogProps) {
+  const alert = useAlertStore((state) => state.setMessage);
+  const [selectedTmplt, setSelectedTmplt] = useState<ElaprTmplt | null>(null);
+  const [aplnRows, setAplnRows] = useState<ElaprAplnRow[]>([]);
+  const [isEditingLocked, setIsEditingLocked] = useState(false);
+
+  const tmpltQuery = useElaprTmpltPage({
+    page: 0,
+    size: PAGE_SIZE,
+    sort: "regDt,desc",
+    docSeComCd,
+  });
+
+  const handleRowsChange = useCallback((rows: ElaprAplnRow[]) => {
+    setAplnRows(rows);
+  }, []);
+
+  const handleEditingLockedChange = useCallback((locked: boolean) => {
+    setIsEditingLocked(locked);
+  }, []);
+
+  function handleSelectTmplt(tmplt: ElaprTmplt | null) {
+    setSelectedTmplt(tmplt);
+    setAplnRows([]);
+    setIsEditingLocked(false);
+  }
+
+  function handleOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      setSelectedTmplt(null);
+      setAplnRows([]);
+      setIsEditingLocked(false);
+      onClose();
+    }
+  }
+
+  function handleConfirm() {
+    if (!selectedTmplt) {
+      alert("결재서식을 선택해 주세요.");
+      return;
+    }
+
+    const rowsError = validateAllRowsForSave(aplnRows, isEditingLocked);
+    if (rowsError) {
+      alert(rowsError);
+      return;
+    }
+
+    const orderError = validateAtrzOrder(aplnRows);
+    if (orderError) {
+      alert(orderError);
+      return;
+    }
+
+    const seqError = validateUniqueSeqNo(aplnRows);
+    if (seqError) {
+      alert(seqError);
+      return;
+    }
+
+    const visibleRows = getVisibleRows(aplnRows);
+
+    const payload: ElaprTmpltPickerConfirmPayload = {
+      tmplt: selectedTmplt,
+      aplnRows: visibleRows,
+    };
+
+    if (onConfirm) {
+      onConfirm(payload);
+    } else {
+      onSelect?.(selectedTmplt);
+    }
+
+    setSelectedTmplt(null);
+    setAplnRows([]);
+    setIsEditingLocked(false);
+    onClose();
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={handleOpenChange}>
+      <DialogContent className="max-w-[120rem]" aria-describedby={undefined}>
+        <DialogHeader>
+          <DialogTitle>결재선 선택</DialogTitle>
+        </DialogHeader>
+
+        <div className="flex gap-6">
+          <ElaprTmpltSelectTable
+            query={tmpltQuery}
+            selectedTmpltId={selectedTmplt?.elaprTmpltId ?? null}
+            onSelectTmplt={handleSelectTmplt}
+          />
+          <ElaprAplnPickerGrid
+            elaprTmpltId={selectedTmplt?.elaprTmpltId ?? null}
+            onRowsChange={handleRowsChange}
+            onEditingLockedChange={handleEditingLockedChange}
+          />
+        </div>
+
+        <DialogFooter>
+          <Button type="button" color="white" onClick={() => handleOpenChange(false)}>
+            닫기
+          </Button>
+          <Button
+            type="button"
+            disabled={!selectedTmplt || isEditingLocked}
+            onClick={handleConfirm}
+          >
+            확인
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+export { ElaprTmpltPickerDialog };
+export type { ElaprTmpltPickerConfirmPayload };

apps/as/src/entities/elapr/ui/elapr-tmplt-select-table.tsx

@@ -0,0 +1,97 @@
+"use client";
+
+import { useEffect, useMemo, useState } from "react";
+
+import type { UseQueryResult } from "@tanstack/react-query";
+import { createColumnHelper, getCoreRowModel, type RowSelectionState } from "@tanstack/react-table";
+
+import { useDataTable } from "@/shared/lib";
+import type { PageResponse } from "@/shared/model";
+import { Skeleton } from "@common/components";
+
+import type { ElaprTmplt } from "../model/elapr-tmplt-interface";
+
+const columnHelper = createColumnHelper<ElaprTmplt>();
+
+interface ElaprTmpltSelectTableProps {
+  query: UseQueryResult<PageResponse<ElaprTmplt>>;
+  selectedTmpltId: string | null;
+  onSelectTmplt: (tmplt: ElaprTmplt | null) => void;
+}
+
+function ElaprTmpltSelectTable({
+  query,
+  selectedTmpltId,
+  onSelectTmplt,
+}: ElaprTmpltSelectTableProps) {
+  const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
+
+  useEffect(() => {
+    if (selectedTmpltId) {
+      setRowSelection({ [selectedTmpltId]: true });
+    } else {
+      setRowSelection({});
+    }
+  }, [selectedTmpltId]);
+
+  const columns = useMemo(
+    () => [
+      columnHelper.accessor("elaprTmpltNm", {
+        header: "결재서식명",
+        meta: { align: "left" },
+      }),
+    ],
+    [],
+  );
+
+  const { tableComponent } = useDataTable({
+    query,
+    tableOptions: {
+      columns,
+      state: { rowSelection },
+      enableRowSelection: true,
+      enableMultiRowSelection: false,
+      getRowId: (row) => row.elaprTmpltId,
+      onRowSelectionChange: (updater) => {
+        const next = typeof updater === "function" ? updater(rowSelection) : updater;
+        setRowSelection(next);
+        const selectedId = Object.keys(next)[0];
+        if (!selectedId) {
+          onSelectTmplt(null);
+          return;
+        }
+        const selected = query.data?.content.find((t) => t.elaprTmpltId === selectedId);
+        onSelectTmplt(selected ?? null);
+      },
+      getCoreRowModel: getCoreRowModel(),
+    },
+    dataTableOptions: {
+      onRowClick: (row) => {
+        setRowSelection({ [row.elaprTmpltId]: true });
+        onSelectTmplt(row);
+      },
+    },
+  });
+
+  return (
+    <section className="card card-border mx-0 min-h-[32rem] flex-[0.5] bg-background pt-0">
+      <div className="card-header h-[4.6rem]">
+        <h3 className="text-2xl font-semibold">전자결재서식</h3>
+      </div>
+      {query.isPending && (
+        <div className="flex flex-col gap-2 p-4">
+          <Skeleton className="h-[4rem]" />
+          <Skeleton className="h-[16rem]" />
+        </div>
+      )}
+      {query.isError && (
+        <p className="py-8 text-center text-lg text-muted-foreground">
+          결재서식 목록을 불러오지 못했습니다.
+        </p>
+      )}
+      {!query.isPending && !query.isError && tableComponent}
+    </section>
+  );
+}
+
+export { ElaprTmpltSelectTable };

apps/as/src/entities/elapr/ui/sortable-apln-picker-row.tsx

@@ -0,0 +1,153 @@
+"use client";
+
+import { useSortable } from "@dnd-kit/sortable";
+import { CSS } from "@dnd-kit/utilities";
+import { MoveVertical } from "lucide-react";
+
+import { findCodeLabel, useCodeList } from "@/entities/code";
+import {
+  Button,
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+  TableCell,
+  TableRow,
+} from "@common/components";
+
+import type { ElaprAplnRow } from "../model/elapr-apln-row-types";
+
+interface SortableAplnPickerRowProps {
+  row: ElaprAplnRow;
+  displaySeqNo: number;
+  isEditing: boolean;
+  isLocked: boolean;
+  dragDisabled: boolean;
+  onStartEdit: () => void;
+  onSave: () => void;
+  onCancel: () => void;
+  onDelete: () => void;
+  onChange: (patch: Partial<ElaprAplnRow>) => void;
+  onPickAprvr: () => void;
+}
+
+function SortableAplnPickerRow({
+  row,
+  displaySeqNo,
+  isEditing,
+  isLocked,
+  dragDisabled,
+  onStartEdit,
+  onSave,
+  onCancel,
+  onDelete,
+  onChange,
+  onPickAprvr,
+}: SortableAplnPickerRowProps) {
+  const { data: atrzSeCodes } = useCodeList("ATRZSE");
+  const selectableAtrzSeCodes = atrzSeCodes?.filter((code) => code.lwpoCd !== "ATRZ01");
+
+  const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
+    id: row.rowKey,
+    disabled: dragDisabled,
+  });
+
+  const style = {
+    transform: CSS.Transform.toString(transform),
+    transition,
+    opacity: isDragging ? 0.6 : 1,
+  };
+
+  const rowDisabled = isLocked && !isEditing;
+  const atrzSeLabel = row.atrzSeComNm || findCodeLabel(atrzSeCodes, row.atrzSeComCd);
+
+  return (
+    <TableRow ref={setNodeRef} style={style} className={isEditing ? "bg-accent/30" : undefined}>
+      <TableCell align="center" className="w-10">
+        <Button
+          type="button"
+          size="icon"
+          className="cursor-grab !bg-transparent text-muted-foreground disabled:cursor-not-allowed disabled:opacity-40"
+          disabled={dragDisabled}
+          {...attributes}
+          {...listeners}
+          aria-label="순서 변경"
+        >
+          <MoveVertical className="!size-6" />
+        </Button>
+      </TableCell>
+      <TableCell align="center">{displaySeqNo}</TableCell>
+      <TableCell align="center">
+        {isEditing ? (
+          <Select
+            value={row.atrzSeComCd ?? ""}
+            onValueChange={(v) =>
+              onChange({ atrzSeComCd: v, atrzSeComNm: findCodeLabel(selectableAtrzSeCodes, v) })
+            }
+          >
+            <SelectTrigger className="min-w-[120px]">
+              <SelectValue placeholder="결재구분" />
+            </SelectTrigger>
+            <SelectContent>
+              {selectableAtrzSeCodes?.map((code) => (
+                <SelectItem key={code.lwpoCd} value={code.lwpoCd}>
+                  {code.lwpoCdNm}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+        ) : (
+          atrzSeLabel || "-"
+        )}
+      </TableCell>
+      <TableCell align="center">
+        <div className="flex items-center justify-center gap-2">
+          <span>{row.aprvrNm || row.aprvrUuid || ""}</span>
+          {isEditing && (
+            <Button type="button" size="sm" onClick={onPickAprvr} disabled={!row.atrzSeComCd}>
+              선택
+            </Button>
+          )}
+        </div>
+      </TableCell>
+      <TableCell align="center">
+        <div className="flex justify-center gap-2">
+          {isEditing ? (
+            <>
+              <Button type="button" size="sm" onClick={onSave}>
+                확인
+              </Button>
+              <Button type="button" size="sm" color="white" onClick={onCancel}>
+                취소
+              </Button>
+            </>
+          ) : (
+            <>
+              <Button
+                type="button"
+                size="sm"
+                color="white"
+                disabled={rowDisabled}
+                onClick={onStartEdit}
+              >
+                수정
+              </Button>
+              <Button
+                type="button"
+                size="sm"
+                color="gray"
+                disabled={rowDisabled}
+                onClick={onDelete}
+              >
+                삭제
+              </Button>
+            </>
+          )}
+        </div>
+      </TableCell>
+    </TableRow>
+  );
+}
+
+export { SortableAplnPickerRow };

apps/as/src/entities/elapr/ui/sortable-prgrs-stts-row.tsx

@@ -0,0 +1,212 @@
+"use client";
+
+import { useSortable } from "@dnd-kit/sortable";
+import { CSS } from "@dnd-kit/utilities";
+import { MoveVertical } from "lucide-react";
+
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/shared/ui/tooltip";
+import { findCodeLabel, useCodeList } from "@/entities/code";
+import {
+  Button,
+  Checkbox,
+  cn,
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+  TableCell,
+  TableRow,
+} from "@common/components";
+
+import { getApproverStatus } from "../lib/approval-utils";
+import {
+  type ElaprPrgrsSttsRow,
+  isPrgrsSttsRowDcarbable,
+  isPrgrsSttsRowEditable,
+} from "../lib/prgrs-stts-save-utils";
+
+interface SortablePrgrsSttsRowProps {
+  row: ElaprPrgrsSttsRow;
+  displaySeqNo: number;
+  isEditing: boolean;
+  isLocked: boolean;
+  dragDisabled: boolean;
+  onStartEdit: () => void;
+  onSave: () => void;
+  onCancel: () => void;
+  onDelete: () => void;
+  onChange: (patch: Partial<ElaprPrgrsSttsRow>) => void;
+  onPickAprvr: () => void;
+  onToggleDcarb: (checked: boolean) => void;
+}
+
+function SortablePrgrsSttsRow({
+  row,
+  displaySeqNo,
+  isEditing,
+  isLocked,
+  dragDisabled,
+  onStartEdit,
+  onSave,
+  onCancel,
+  onDelete,
+  onChange,
+  onPickAprvr,
+  onToggleDcarb,
+}: SortablePrgrsSttsRowProps) {
+  const { data: atrzSeCodes } = useCodeList("ATRZSE");
+  const selectableAtrzSeCodes = atrzSeCodes?.filter((code) => code.lwpoCd !== "ATRZ01");
+
+  const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
+    id: row.rowKey,
+    disabled: dragDisabled,
+  });
+
+  const style = {
+    transform: CSS.Transform.toString(transform),
+    transition,
+    opacity: isDragging ? 0.6 : 1,
+  };
+
+  const isEditable = isPrgrsSttsRowEditable(row);
+  const isDcarbable = isPrgrsSttsRowDcarbable(row);
+  const rowDisabled = isLocked && !isEditing;
+  const atrzSeLabel = row.atrzSeComNm || findCodeLabel(atrzSeCodes, row.atrzSeComCd);
+  const status = getApproverStatus(row.atrzPrgrsSttsComCd);
+  const isRejectedRow = row.atrzPrgrsSttsComCd === "ATRZ_PRGRS_004";
+  const rjctRsn = row.rjctRsn?.trim();
+
+  const statusBadge = (
+    <span
+      className={cn(
+        "inline-flex items-center rounded-sm px-3 py-1.5 text-lg font-semibold",
+        status.badgeClass,
+        isRejectedRow && rjctRsn && "cursor-help underline decoration-dotted underline-offset-4",
+      )}
+    >
+      {status.label}
+    </span>
+  );
+
+  return (
+    <TableRow ref={setNodeRef} style={style} className={isEditing ? "bg-accent/30" : undefined}>
+      <TableCell align="center" className="w-10">
+        {!dragDisabled && (
+          <Button
+            type="button"
+            size="icon"
+            className="cursor-grab !bg-transparent text-muted-foreground disabled:cursor-not-allowed disabled:opacity-40"
+            {...attributes}
+            {...listeners}
+            aria-label="순서 변경"
+          >
+            <MoveVertical className="!size-6" />
+          </Button>
+        )}
+      </TableCell>
+      <TableCell align="center">{displaySeqNo}</TableCell>
+      <TableCell align="center">
+        {isEditing ? (
+          <Select
+            value={row.atrzSeComCd ?? ""}
+            onValueChange={(v) =>
+              onChange({ atrzSeComCd: v, atrzSeComNm: findCodeLabel(selectableAtrzSeCodes, v) })
+            }
+          >
+            <SelectTrigger className="min-w-[120px]">
+              <SelectValue placeholder="결재구분" />
+            </SelectTrigger>
+            <SelectContent>
+              {selectableAtrzSeCodes?.map((code) => (
+                <SelectItem key={code.lwpoCd} value={code.lwpoCd}>
+                  {code.lwpoCdNm}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+        ) : (
+          atrzSeLabel || "-"
+        )}
+      </TableCell>
+      <TableCell align="center">
+        <div className="flex flex-col items-center gap-1">
+          <div className="flex items-center justify-center gap-2">
+            <span>{row.aprvrNm || row.aprvrUuid || "-"}</span>
+            {isEditing && (
+              <Button type="button" size="sm" onClick={onPickAprvr}>
+                선택
+              </Button>
+            )}
+          </div>
+          {!isEditing && (row.ognzNm || row.jbpsSeNm || row.jbgdSeNm) && (
+            <div className="text-base text-gray-500">
+              {row.ognzNm ?? ""}
+              {row.jbpsSeNm ? ` · ${row.jbpsSeNm}` : ""}
+            </div>
+          )}
+        </div>
+      </TableCell>
+      <TableCell align="center">
+        {isDcarbable && !rowDisabled && (
+          <Checkbox
+            checked={row.dcarbYn === "Y"}
+            onCheckedChange={(checked) => onToggleDcarb(checked === true)}
+            aria-label="전결자 지정"
+          />
+        )}
+      </TableCell>
+      <TableCell align="center">
+        {isRejectedRow && rjctRsn ? (
+          <Tooltip>
+            <TooltipTrigger asChild>{statusBadge}</TooltipTrigger>
+            <TooltipContent sideOffset={4} className="max-w-md whitespace-pre-wrap">
+              {rjctRsn}
+            </TooltipContent>
+          </Tooltip>
+        ) : (
+          statusBadge
+        )}
+      </TableCell>
+      <TableCell align="center">
+        <div className="flex justify-center gap-2">
+          {isEditing ? (
+            <>
+              <Button type="button" size="sm" onClick={onSave}>
+                확인
+              </Button>
+              <Button type="button" size="sm" color="white" onClick={onCancel}>
+                취소
+              </Button>
+            </>
+          ) : isEditable ? (
+            <>
+              <Button
+                type="button"
+                size="sm"
+                color="white"
+                disabled={rowDisabled}
+                onClick={onStartEdit}
+              >
+                수정
+              </Button>
+              <Button
+                type="button"
+                size="sm"
+                color="gray"
+                disabled={rowDisabled}
+                onClick={onDelete}
+              >
+                삭제
+              </Button>
+            </>
+          ) : (
+            <span className="text-sm text-muted-foreground">-</span>
+          )}
+        </div>
+      </TableCell>
+    </TableRow>
+  );
+}
+
+export { SortablePrgrsSttsRow };

apps/as/src/entities/esntl/api/esntl-service.ts

@@ -11,50 +11,41 @@ import type {
   EsntlAtchFileMngTreeSearchParams,
 } from "../model/esntl-interface";
 
+const BASE = ENDPOINT.AS_SERVICE.ESNTL_ATCH_FILE;
+
 async function findTree(
   params: EsntlAtchFileMngTreeSearchParams,
 ): Promise<EsntlAtchFileMngTreeResponseDto[]> {
-  const response = await client.get<EsntlAtchFileMngTreeResponseDto[]>(
-    `${ENDPOINT.AS_COMMON_SERVICE.ESNTL_ATCH_FILE}/list/tree`,
-    { params },
-  );
+  const response = await client.get<EsntlAtchFileMngTreeResponseDto[]>(`${BASE}/list/tree`, {
+    params,
+  });
   return response.data;
 }
 
 async function findPage(
   params: EsntlAtchFileMngSearchParams,
 ): Promise<PageResponse<EsntlAtchFileMng>> {
-  const response = await client.get<PageResponse<EsntlAtchFileMng>>(
-    ENDPOINT.AS_COMMON_SERVICE.ESNTL_ATCH_FILE,
-    { params },
-  );
+  const response = await client.get<PageResponse<EsntlAtchFileMng>>(BASE, { params });
   return response.data;
 }
 
 async function findById(esntlAtchFileId: string): Promise<EsntlAtchFileMng> {
-  const response = await client.get<EsntlAtchFileMng>(
-    `${ENDPOINT.AS_COMMON_SERVICE.ESNTL_ATCH_FILE}/${esntlAtchFileId}`,
-  );
+  const response = await client.get<EsntlAtchFileMng>(`${BASE}/${esntlAtchFileId}`);
   return response.data;
 }
 
 async function create(body: EsntlAtchFileMngSaveRequest): Promise<string> {
-  const response = await client.post<string>(ENDPOINT.AS_COMMON_SERVICE.ESNTL_ATCH_FILE, body);
+  const response = await client.post<string>(BASE, body);
   return response.data;
 }
 
 async function update(esntlAtchFileId: string, body: EsntlAtchFileMngSaveRequest): Promise<string> {
-  const response = await client.put<string>(
-    `${ENDPOINT.AS_COMMON_SERVICE.ESNTL_ATCH_FILE}/${esntlAtchFileId}`,
-    body,
-  );
+  const response = await client.put<string>(`${BASE}/${esntlAtchFileId}`, body);
   return response.data;
 }
 
 async function remove(esntlAtchFileId: string): Promise<string> {
-  const response = await client.delete<string>(
-    `${ENDPOINT.AS_COMMON_SERVICE.ESNTL_ATCH_FILE}/${esntlAtchFileId}`,
-  );
+  const response = await client.delete<string>(`${BASE}/${esntlAtchFileId}`);
   return response.data;
 }
 

apps/as/src/entities/esntl/api/queries.ts

@@ -10,7 +10,7 @@ import type {
 
 import { esntlAtchFileMngService } from "./esntl-service";
 
-const esntlAtchFileMngBaseKey = [ENDPOINT.AS_COMMON_SERVICE.ESNTL_ATCH_FILE] as const;
+const esntlAtchFileMngBaseKey = [ENDPOINT.AS_SERVICE.ESNTL_ATCH_FILE] as const;
 
 export function useEsntlAtchFileMngTree(params: EsntlAtchFileMngTreeSearchParams) {
   return useQuery({

apps/as/src/entities/fnrs-cnsltn/api/fnrs-cnsltn-service.ts

@@ -0,0 +1,86 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type { PageResponse } from "@/shared/model";
+
+import type {
+  DocPrgrsUpdateRequestDto,
+  FnrsCnsltnApplySaveRequestDto,
+  FnrsCnsltnMngDetResponseDto,
+  FnrsCnsltnMngResponseDto,
+  FnrsCnsltnMngSaveRequestDto,
+  FnrsCnsltnMngSearchDto,
+  FnrsCnsltnMngService,
+  FnrsCnsltnMngUpdateRequestDto,
+} from "../model/fnrs-cnsltn-interface";
+
+const BASE = ENDPOINT.AS_SERVICE.FNRS_CNSLTN_MNG;
+
+async function findPage(
+  searchDto: FnrsCnsltnMngSearchDto,
+): Promise<PageResponse<FnrsCnsltnMngResponseDto>> {
+  const response = await client.get<PageResponse<FnrsCnsltnMngResponseDto>>(BASE, {
+    params: searchDto,
+  });
+  return response.data;
+}
+
+async function findById(fnrsCnsltnDocNo: string): Promise<FnrsCnsltnMngDetResponseDto> {
+  const response = await client.get<FnrsCnsltnMngDetResponseDto>(`${BASE}/${fnrsCnsltnDocNo}`);
+  return response.data;
+}
+
+async function save(body: FnrsCnsltnMngSaveRequestDto): Promise<string> {
+  const response = await client.post<string>(BASE, body);
+  return response.data;
+}
+
+async function saveApply(body: FnrsCnsltnApplySaveRequestDto): Promise<string> {
+  const response = await client.post<string>(`${BASE}/save-apply`, body);
+  return response.data;
+}
+
+async function update(
+  fnrsCnsltnDocNo: string,
+  body: FnrsCnsltnMngUpdateRequestDto,
+): Promise<string> {
+  const response = await client.put<string>(`${BASE}/${fnrsCnsltnDocNo}`, body);
+  return response.data;
+}
+
+async function techReview(id: string, body: FnrsCnsltnApplySaveRequestDto): Promise<void> {
+  await client.post<void>(`${BASE}/${id}/tech-review`, body);
+}
+
+async function submitSupplement(id: string, body: FnrsCnsltnApplySaveRequestDto): Promise<string> {
+  const response = await client.post<string>(`${BASE}/${id}/submitsupplement`, body);
+  return response.data;
+}
+
+async function submitReqSupplement(
+  id: string,
+  body: FnrsCnsltnApplySaveRequestDto,
+): Promise<string> {
+  const response = await client.post<string>(`${BASE}/${id}/reqsupplement`, body);
+  return response.data;
+}
+
+async function remove(fnrsCnsltnDocNo: string): Promise<void> {
+  await client.delete<void>(`${BASE}/${fnrsCnsltnDocNo}`);
+}
+
+async function changePrgrsSttsComCd(body: DocPrgrsUpdateRequestDto): Promise<void> {
+  await client.post<void>(`${BASE}/doc/updatePrgrsStts`, body);
+}
+
+export const fnrsCnsltnMngService = {
+  findPage,
+  findById,
+  save,
+  saveApply,
+  update,
+  techReview,
+  submitSupplement,
+  submitReqSupplement,
+  remove,
+  changePrgrsSttsComCd,
+} satisfies FnrsCnsltnMngService;

apps/as/src/entities/fnrs-cnsltn/api/queries.ts

@@ -0,0 +1,131 @@
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+
+import { ENDPOINT } from "@/shared/config";
+
+import type {
+  DocPrgrsUpdateRequestDto,
+  FnrsCnsltnApplySaveRequestDto,
+  FnrsCnsltnMngSaveRequestDto,
+  FnrsCnsltnMngSearchDto,
+  FnrsCnsltnMngUpdateRequestDto,
+} from "../model/fnrs-cnsltn-interface";
+
+import { fnrsCnsltnMngService } from "./fnrs-cnsltn-service";
+
+export const fnrsCnsltnMngBaseKey = [ENDPOINT.AS_SERVICE.FNRS_CNSLTN_MNG] as const;
+
+export function useFnrsCnsltnMngPage(params: FnrsCnsltnMngSearchDto) {
+  return useQuery({
+    queryKey: [...fnrsCnsltnMngBaseKey, "findPage", params],
+    queryFn: () => fnrsCnsltnMngService.findPage(params),
+  });
+}
+
+export function useFnrsCnsltnMng(fnrsCnsltnDocNo: string | null | undefined) {
+  return useQuery({
+    queryKey: [...fnrsCnsltnMngBaseKey, "findById", fnrsCnsltnDocNo],
+    queryFn: () => fnrsCnsltnMngService.findById(fnrsCnsltnDocNo!),
+    enabled: Boolean(fnrsCnsltnDocNo),
+  });
+}
+
+export function useSaveFnrsCnsltnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: FnrsCnsltnMngSaveRequestDto) => fnrsCnsltnMngService.save(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: fnrsCnsltnMngBaseKey });
+    },
+  });
+}
+
+export function useSaveApplyFnrsCnsltnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: FnrsCnsltnApplySaveRequestDto) => fnrsCnsltnMngService.saveApply(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: fnrsCnsltnMngBaseKey });
+    },
+  });
+}
+
+export function useUpdateFnrsCnsltnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({
+      fnrsCnsltnDocNo,
+      body,
+    }: {
+      fnrsCnsltnDocNo: string;
+      body: FnrsCnsltnMngUpdateRequestDto;
+    }) => fnrsCnsltnMngService.update(fnrsCnsltnDocNo, body),
+    onSuccess: (_data, { fnrsCnsltnDocNo }) => {
+      queryClient.invalidateQueries({ queryKey: fnrsCnsltnMngBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...fnrsCnsltnMngBaseKey, "findById", fnrsCnsltnDocNo],
+      });
+    },
+  });
+}
+
+export function useTechReviewFnrsCnsltnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({ id, body }: { id: string; body: FnrsCnsltnApplySaveRequestDto }) =>
+      fnrsCnsltnMngService.techReview(id, body),
+    onSuccess: (_data, { id }) => {
+      queryClient.invalidateQueries({ queryKey: fnrsCnsltnMngBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...fnrsCnsltnMngBaseKey, "findById", id],
+      });
+    },
+  });
+}
+
+export function useSubmitSupplementFnrsCnsltnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({ id, body }: { id: string; body: FnrsCnsltnApplySaveRequestDto }) =>
+      fnrsCnsltnMngService.submitSupplement(id, body),
+    onSuccess: (_data, { id }) => {
+      queryClient.invalidateQueries({ queryKey: fnrsCnsltnMngBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...fnrsCnsltnMngBaseKey, "findById", id],
+      });
+    },
+  });
+}
+
+export function useSubmitReqSupplementFnrsCnsltnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({ id, body }: { id: string; body: FnrsCnsltnApplySaveRequestDto }) =>
+      fnrsCnsltnMngService.submitReqSupplement(id, body),
+    onSuccess: (_data, { id }) => {
+      queryClient.invalidateQueries({ queryKey: fnrsCnsltnMngBaseKey });
+      queryClient.invalidateQueries({
+        queryKey: [...fnrsCnsltnMngBaseKey, "findById", id],
+      });
+    },
+  });
+}
+
+export function useDeleteFnrsCnsltnMng() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (fnrsCnsltnDocNo: string) => fnrsCnsltnMngService.remove(fnrsCnsltnDocNo),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: fnrsCnsltnMngBaseKey });
+    },
+  });
+}
+
+export function useChangePrgrsSttsComCd() {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (body: DocPrgrsUpdateRequestDto) => fnrsCnsltnMngService.changePrgrsSttsComCd(body),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: fnrsCnsltnMngBaseKey });
+    },
+  });
+}