(김준회) 리치텍스트에디터 (결재템플릿을 위한 공통컴포넌트), command-menu 에러 수정, 결재 템플릿 관리, 결재선 관리, ECC RFQ+PR Item 수신시 비즈니스테이블(ProcurementRFQ) 데이터 적재, WSDL 오류 수정

10 files changed, 1680 insertions, 0 deletions

diff --git a/lib/approval-line/service.ts b/lib/approval-line/service.ts
new file mode 100644
index 00000000..3000e25f
--- /dev/null
+++ b/lib/approval-line/service.ts
@@ -0,0 +1,341 @@
+'use server';
+
+import db from '@/db/db';
+import {
+  and,
+  asc,
+  count,
+  desc,
+  eq,
+  ilike,
+  or,
+} from 'drizzle-orm';
+
+import { sql } from 'drizzle-orm';
+import { approvalLines } from '@/db/schema/knox/approvals';
+
+import { filterColumns } from '@/lib/filter-columns';
+
+// ---------------------------------------------
+// Types
+// ---------------------------------------------
+
+export type ApprovalLine = typeof approvalLines.$inferSelect;
+
+export interface ApprovalLineWithUsage extends ApprovalLine {
+  templateCount: number; // 사용 중인 템플릿 수
+}
+
+// ---------------------------------------------
+// List & read helpers
+// ---------------------------------------------
+
+interface ListInput {
+  page: number;
+  perPage: number;
+  search?: string;
+  filters?: Record<string, unknown>[];
+  joinOperator?: 'and' | 'or';
+  sort?: Array<{ id: string; desc: boolean }>;
+}
+
+export async function getApprovalLineList(input: ListInput) {
+  const offset = (input.page - 1) * input.perPage;
+
+  /* ------------------------------------------------------------------
+   * WHERE 절 구성
+   * ----------------------------------------------------------------*/
+  const advancedWhere = filterColumns({
+    table: approvalLines,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    filters: (input.filters ?? []) as any,
+    joinOperator: (input.joinOperator ?? 'and') as 'and' | 'or',
+  });
+
+  // 전역 검색 (name, description)
+  let globalWhere;
+  if (input.search) {
+    const s = `%${input.search}%`;
+    globalWhere = or(
+      ilike(approvalLines.name, s),
+      ilike(approvalLines.description, s),
+    );
+  }
+
+  const conditions = [];
+  if (advancedWhere) conditions.push(advancedWhere);
+  if (globalWhere) conditions.push(globalWhere);
+
+  const where =
+    conditions.length === 0
+      ? undefined
+      : conditions.length === 1
+        ? conditions[0]
+        : and(...conditions);
+
+  /* ------------------------------------------------------------------
+   * ORDER BY 절 구성
+   * ----------------------------------------------------------------*/
+  let orderBy;
+  try {
+    orderBy = input.sort && input.sort.length > 0
+      ? input.sort
+          .map((item) => {
+            if (!item || !item.id || typeof item.id !== 'string') return null;
+            if (!(item.id in approvalLines)) return null;
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            const col = approvalLines[item.id];
+            return item.desc ? desc(col) : asc(col);
+          })
+          .filter((v): v is Exclude<typeof v, null> => v !== null)
+      : [desc(approvalLines.updatedAt)];
+  } catch {
+    orderBy = [desc(approvalLines.updatedAt)];
+  }
+
+  /* ------------------------------------------------------------------
+   * 데이터 조회
+   * ----------------------------------------------------------------*/
+  const data = await db
+    .select()
+    .from(approvalLines)
+    .where(where)
+    .orderBy(...orderBy)
+    .limit(input.perPage)
+    .offset(offset);
+
+  const totalResult = await db
+    .select({ count: count() })
+    .from(approvalLines)
+    .where(where);
+
+  const total = totalResult[0]?.count ?? 0;
+  const pageCount = Math.ceil(total / input.perPage);
+
+  return {
+    data,
+    pageCount,
+  };
+}
+
+// ----------------------------------------------------
+// Simple list for options (id, name)
+// ----------------------------------------------------
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export async function getApprovalLineOptions(category?: string): Promise<Array<{ id: string; name: string; aplns: any[]; category: string | null }>> {
+  const where = category
+    ? eq(approvalLines.category, category)
+    : undefined;
+  const rows = await db
+    .select({ id: approvalLines.id, name: approvalLines.name, aplns: approvalLines.aplns, category: approvalLines.category })
+    .from(approvalLines)
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    .where(where as any)
+    .orderBy(asc(approvalLines.name));
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  return rows as Array<{ id: string; name: string; aplns: any[]; category: string | null }>;
+}
+
+// ----------------------------------------------------
+// Distinct categories for filter
+// ----------------------------------------------------
+export async function getApprovalLineCategories(): Promise<string[]> {
+  const rows = await db
+    .select({ category: approvalLines.category })
+    .from(approvalLines)
+    .where(sql`${approvalLines.category} IS NOT NULL AND ${approvalLines.category} <> ''`)
+    .groupBy(approvalLines.category)
+    .orderBy(asc(approvalLines.category));
+  return rows.map((r) => r.category!).filter(Boolean);
+}
+
+// ----------------------------------------------------
+// Server Action for fetching options by category
+// ----------------------------------------------------
+export async function getApprovalLineOptionsAction(category?: string) {
+  try {
+    const data = await getApprovalLineOptions(category)
+    return { success: true, data }
+  } catch (error) {
+    return { success: false, error: error instanceof Error ? error.message : '조회에 실패했습니다.' }
+  }
+}
+
+// ----------------------------------------------------
+// Server Action for fetching distinct categories
+// ----------------------------------------------------
+export async function getApprovalLineCategoriesAction() {
+  try {
+    const data = await getApprovalLineCategories()
+    return { success: true, data }
+  } catch (error) {
+    return { success: false, error: error instanceof Error ? error.message : '카테고리 조회에 실패했습니다.' }
+  }
+}
+
+// ----------------------------------------------------
+// Get single approval line
+// ----------------------------------------------------
+export async function getApprovalLine(id: string): Promise<ApprovalLine | null> {
+  const [line] = await db
+    .select()
+    .from(approvalLines)
+    .where(eq(approvalLines.id, id))
+    .limit(1);
+
+  return line || null;
+}
+
+// ----------------------------------------------------
+// Create approval line
+// ----------------------------------------------------
+interface CreateInput {
+  name: string;
+  description?: string;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  aplns: any[]; // 결재선 구성 (JSON)
+  createdBy: number;
+}
+
+export async function createApprovalLine(data: CreateInput): Promise<ApprovalLine> {
+  // 중복 이름 체크
+  const existing = await db
+    .select({ id: approvalLines.id })
+    .from(approvalLines)
+    .where(eq(approvalLines.name, data.name))
+    .limit(1);
+
+  if (existing.length > 0) {
+    throw new Error('이미 존재하는 결재선 이름입니다.');
+  }
+
+  const [newLine] = await db
+    .insert(approvalLines)
+    .values({
+      name: data.name,
+      description: data.description,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      aplns: data.aplns as any,
+      createdBy: data.createdBy,
+    })
+    .returning();
+
+  return newLine;
+}
+
+// ----------------------------------------------------
+// Update approval line
+// ----------------------------------------------------
+interface UpdateInput {
+  name?: string;
+  description?: string;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  aplns?: any[]; // 결재선 구성 (JSON)
+  updatedBy: number;
+}
+
+export async function updateApprovalLine(id: string, data: UpdateInput): Promise<ApprovalLine> {
+  const existing = await getApprovalLine(id);
+  if (!existing) throw new Error('결재선을 찾을 수 없습니다.');
+
+  // 이름 중복 체크 (자신 제외)
+  if (data.name && data.name !== existing.name) {
+    const duplicate = await db
+      .select({ id: approvalLines.id })
+      .from(approvalLines)
+      .where(
+        and(
+          eq(approvalLines.name, data.name),
+          eq(approvalLines.id, id)
+        )
+      )
+      .limit(1);
+
+    if (duplicate.length > 0) {
+      throw new Error('이미 존재하는 결재선 이름입니다.');
+    }
+  }
+
+  // 결재선 업데이트
+  await db
+    .update(approvalLines)
+    .set({
+      name: data.name ?? existing.name,
+      description: data.description ?? existing.description,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      aplns: (data.aplns as any) ?? (existing.aplns as any),
+      updatedAt: new Date(),
+    })
+    .where(eq(approvalLines.id, id));
+
+  const result = await getApprovalLine(id);
+  if (!result) throw new Error('업데이트된 결재선을 조회할 수 없습니다.');
+  return result;
+}
+
+// ----------------------------------------------------
+// Server Actions
+// ----------------------------------------------------
+export async function updateApprovalLineAction(id: string, data: UpdateInput) {
+  try {
+    const updated = await updateApprovalLine(id, data)
+    return { success: true, data: updated }
+  } catch (error) {
+    return {
+      success: false,
+      error: error instanceof Error ? error.message : '업데이트에 실패했습니다.'
+    }
+  }
+}
+
+// ----------------------------------------------------
+// Duplicate approval line
+// ----------------------------------------------------
+export async function duplicateApprovalLine(
+  id: string,
+  newName: string,
+  createdBy: number,
+): Promise<{ success: boolean; error?: string; data?: ApprovalLine }> {
+  try {
+    const existing = await getApprovalLine(id)
+    if (!existing) return { success: false, error: '결재선을 찾을 수 없습니다.' }
+
+    // 새 결재선 생성
+    const duplicated = await createApprovalLine({
+      name: newName,
+      description: existing.description ? `${existing.description} (복사본)` : undefined,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      aplns: existing.aplns as any,
+      createdBy,
+    })
+
+    return { success: true, data: duplicated }
+  } catch (error) {
+    return { success: false, error: error instanceof Error ? error.message : '복제에 실패했습니다.' }
+  }
+}
+
+// ----------------------------------------------------
+// Delete (soft delete X -> 실제 삭제)
+// ----------------------------------------------------
+export async function deleteApprovalLine(id: string): Promise<{ success: boolean; error?: string }> {
+  try {
+    await db.delete(approvalLines).where(eq(approvalLines.id, id));
+    return { success: true };
+  } catch (error) {
+    return {
+      success: false,
+      error: error instanceof Error ? error.message : '삭제에 실패했습니다.',
+    };
+  }
+}
+
+// ----------------------------------------------------
+// Get approval line usage (템플릿에서 사용 중인지 확인)
+// ----------------------------------------------------
+export async function getApprovalLineUsage(): Promise<{ templateCount: number }> {
+  // 현재는 approvalLines가 템플릿과 직접 연결되지 않으므로 0 반환
+  // 추후 템플릿에서 결재선을 참조하는 구조로 변경 시 실제 사용량 계산
+  return { templateCount: 0 };
+} 
\ No newline at end of file
diff --git a/lib/approval-line/table/approval-line-table-columns.tsx b/lib/approval-line/table/approval-line-table-columns.tsx
new file mode 100644
index 00000000..5b35b92c
--- /dev/null
+++ b/lib/approval-line/table/approval-line-table-columns.tsx
@@ -0,0 +1,197 @@
+"use client"
+
+import * as React from "react"
+import { ColumnDef } from "@tanstack/react-table"
+import { Badge } from "@/components/ui/badge"
+import { Button } from "@/components/ui/button"
+import { Checkbox } from "@/components/ui/checkbox"
+import { DataTableColumnHeader } from "@/components/data-table/data-table-column-header"
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu"
+import { type ApprovalLine } from "../service"
+import { formatApprovalLine } from "../utils/format"
+import { formatDate } from "@/lib/utils"
+import { MoreHorizontal, Copy, Edit, Trash2 } from "lucide-react"
+
+interface GetColumnsProps {
+  setRowAction: React.Dispatch<React.SetStateAction<{
+    type: "update" | "delete" | "duplicate";
+    row: { original: ApprovalLine };
+  } | null>>;
+}
+
+
+export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<ApprovalLine>[] {
+  return [
+    {
+      id: "select",
+      header: ({ table }) => (
+        <Checkbox
+          checked={
+            table.getIsAllPageRowsSelected() ||
+            (table.getIsSomePageRowsSelected() && "indeterminate")
+          }
+          onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
+          aria-label="Select all"
+          className="translate-y-[2px]"
+        />
+      ),
+      cell: ({ row }) => (
+        <Checkbox
+          checked={row.getIsSelected()}
+          onCheckedChange={(value) => row.toggleSelected(!!value)}
+          aria-label="Select row"
+          className="translate-y-[2px]"
+        />
+      ),
+      enableSorting: false,
+      enableHiding: false,
+    },
+    {
+      accessorKey: "name",
+      header: ({ column }) => (
+        <DataTableColumnHeader column={column} title="결재선 이름" />
+      ),
+      cell: ({ row }) => {
+        return (
+          <div className="flex space-x-2">
+            <span className="max-w-[500px] truncate font-medium">
+              {row.getValue("name")}
+            </span>
+          </div>
+        )
+      },
+    },
+    {
+      accessorKey: "description",
+      header: ({ column }) => (
+        <DataTableColumnHeader column={column} title="설명" />
+      ),
+      cell: ({ row }) => {
+        return (
+          <div className="flex space-x-2">
+            <span className="max-w-[500px] truncate">
+              {row.getValue("description") || "-"}
+            </span>
+          </div>
+        )
+      },
+    },
+    {
+      accessorKey: "aplns",
+      header: ({ column }) => (
+        <DataTableColumnHeader column={column} title="결재선" />
+      ),
+      cell: ({ row }) => {
+        const aplns = row.getValue("aplns") as unknown as Array<{
+          seq: string;
+          name?: string;
+          emailAddress?: string;
+          role: string;
+        }>;
+        const approvalLineText = formatApprovalLine(aplns);
+        
+        return (
+          <div className="flex space-x-2">
+            <div className="flex flex-col gap-1">
+              <div className="max-w-[400px] truncate text-sm">
+                {approvalLineText}
+                <Badge variant="secondary" className="w-fit">
+                  {aplns?.length || 0}명
+                </Badge>
+              </div>
+            </div>
+          </div>
+        )
+      },
+    },
+    {
+      accessorKey: "createdAt",
+      header: ({ column }) => (
+        <DataTableColumnHeader column={column} title="생성일" />
+      ),
+      cell: ({ row }) => {
+        return (
+          <div className="flex space-x-2">
+            <span className="max-w-[500px] truncate">
+              {formatDate(row.getValue("createdAt"))}
+            </span>
+          </div>
+        )
+      },
+    },
+    {
+      accessorKey: "updatedAt",
+      header: ({ column }) => (
+        <DataTableColumnHeader column={column} title="수정일" />
+      ),
+      cell: ({ row }) => {
+        return (
+          <div className="flex space-x-2">
+            <span className="max-w-[500px] truncate">
+              {formatDate(row.getValue("updatedAt"))}
+            </span>
+          </div>
+        )
+      },
+    },
+    {
+      id: "actions",
+      cell: ({ row }) => {
+
+        return (
+          <DropdownMenu>
+            <DropdownMenuTrigger asChild>
+              <Button
+                aria-label="Open menu"
+                variant="ghost"
+                className="flex size-8 p-0 data-[state=open]:bg-muted"
+              >
+                <MoreHorizontal className="size-4" aria-hidden="true" />
+              </Button>
+            </DropdownMenuTrigger>
+            <DropdownMenuContent align="end" className="w-40">
+              <DropdownMenuItem
+                onClick={() => {
+                  setRowAction({ type: "update", row });
+                }}
+              >
+                <Edit className="mr-2 size-4" aria-hidden="true" />
+                수정하기
+              </DropdownMenuItem>
+
+              <DropdownMenuItem
+                onClick={() => {
+                  setRowAction({ type: "duplicate", row });
+                }}
+              >
+                <Copy className="mr-2 size-4" aria-hidden="true" />
+                복제하기
+              </DropdownMenuItem>
+
+              <DropdownMenuSeparator />
+
+              <DropdownMenuItem
+                onClick={() => {
+                  setRowAction({ type: "delete", row });
+                }}
+                className="text-destructive focus:text-destructive"
+              >
+                <Trash2 className="mr-2 size-4" aria-hidden="true" />
+                삭제하기
+              </DropdownMenuItem>
+            </DropdownMenuContent>
+          </DropdownMenu>
+        );
+      },
+      enableSorting: false,
+      enableHiding: false,
+      size: 80,
+    },
+  ]
+} 
\ No newline at end of file
diff --git a/lib/approval-line/table/approval-line-table-toolbar-actions.tsx b/lib/approval-line/table/approval-line-table-toolbar-actions.tsx
new file mode 100644
index 00000000..6b6600fe
--- /dev/null
+++ b/lib/approval-line/table/approval-line-table-toolbar-actions.tsx
@@ -0,0 +1,73 @@
+"use client"
+
+import * as React from "react"
+import { type Table } from "@tanstack/react-table"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { DataTableViewOptions } from "@/components/data-table/data-table-view-options"
+import { Plus, Download, Upload } from "lucide-react"
+import { type ApprovalLine } from "../service"
+
+interface ApprovalLineTableToolbarActionsProps {
+  table: Table<ApprovalLine>
+  onCreateLine: () => void
+}
+
+export function ApprovalLineTableToolbarActions({
+  table,
+  onCreateLine,
+}: ApprovalLineTableToolbarActionsProps) {
+  const isFiltered = table.getState().columnFilters.length > 0
+
+  return (
+    <div className="flex items-center justify-between">
+      <div className="flex flex-1 items-center space-x-2">
+        <Input
+          placeholder="결재선 검색..."
+          value={(table.getColumn("name")?.getFilterValue() as string) ?? ""}
+          onChange={(event) =>
+            table.getColumn("name")?.setFilterValue(event.target.value)
+          }
+          className="h-8 w-[150px] lg:w-[250px]"
+        />
+        {isFiltered && (
+          <Button
+            variant="ghost"
+            onClick={() => table.resetColumnFilters()}
+            className="h-8 px-2 lg:px-3"
+          >
+            초기화
+          </Button>
+        )}
+      </div>
+      <div className="flex items-center space-x-2">
+        <Button
+          variant="outline"
+          size="sm"
+          className="ml-auto hidden h-8 lg:flex"
+        >
+          <Upload className="mr-2 h-4 w-4" />
+          가져오기
+        </Button>
+        <Button
+          variant="outline"
+          size="sm"
+          className="ml-auto hidden h-8 lg:flex"
+        >
+          <Download className="mr-2 h-4 w-4" />
+          내보내기
+        </Button>
+        <DataTableViewOptions table={table} />
+        <Button
+          variant="outline"
+          size="sm"
+          className="ml-auto h-8"
+          onClick={onCreateLine}
+        >
+          <Plus className="mr-2 h-4 w-4" />
+          결재선 생성
+        </Button>
+      </div>
+    </div>
+  )
+} 
\ No newline at end of file
diff --git a/lib/approval-line/table/approval-line-table.tsx b/lib/approval-line/table/approval-line-table.tsx
new file mode 100644
index 00000000..21b9972c
--- /dev/null
+++ b/lib/approval-line/table/approval-line-table.tsx
@@ -0,0 +1,130 @@
+"use client";
+
+import * as React from 'react';
+import { useDataTable } from '@/hooks/use-data-table';
+import { DataTable } from '@/components/data-table/data-table';
+import { DataTableAdvancedToolbar } from '@/components/data-table/data-table-advanced-toolbar';
+import type {
+  DataTableAdvancedFilterField,
+  DataTableFilterField,
+  DataTableRowAction,
+} from '@/types/table';
+
+import { getColumns } from './approval-line-table-columns';
+import { getApprovalLineList } from '../service';
+import { type ApprovalLine } from '../service';
+import { ApprovalLineTableToolbarActions } from './approval-line-table-toolbar-actions';
+import { CreateApprovalLineSheet } from './create-approval-line-sheet';
+import { UpdateApprovalLineSheet } from './update-approval-line-sheet';
+import { DuplicateApprovalLineSheet } from './duplicate-approval-line-sheet';
+import { DeleteApprovalLineDialog } from './delete-approval-line-dialog';
+
+interface ApprovalLineTableProps {
+  promises: Promise<[
+    Awaited<ReturnType<typeof getApprovalLineList>>,
+  ]>;
+}
+
+export function ApprovalLineTable({ promises }: ApprovalLineTableProps) {
+  const [{ data, pageCount }] = React.use(promises);
+
+  const [rowAction, setRowAction] = 
+    React.useState<DataTableRowAction<ApprovalLine> | null>(null);
+
+  const [showCreateSheet, setShowCreateSheet] = React.useState(false);
+
+  const columns = React.useMemo(
+    () => getColumns({ setRowAction }),
+    [setRowAction]
+  );
+
+  // 기본 & 고급 필터 필드
+  const filterFields: DataTableFilterField<ApprovalLine>[] = [];
+  const advancedFilterFields: DataTableAdvancedFilterField<ApprovalLine>[] = [
+    {
+      id: 'name',
+      label: '결재선 이름',
+      type: 'text',
+    },
+    {
+      id: 'description',
+      label: '설명',
+      type: 'text',
+    },
+    {
+      id: 'createdAt',
+      label: '생성일',
+      type: 'date',
+    },
+    {
+      id: 'updatedAt',
+      label: '수정일',
+      type: 'date',
+    },
+  ];
+
+  const { table } = useDataTable({
+    data,
+    columns,
+    pageCount,
+    filterFields,
+    enablePinning: true,
+    enableAdvancedFilter: true,
+    initialState: {
+      sorting: [{ id: 'updatedAt', desc: true }],
+      columnPinning: { right: ['actions'] },
+    },
+    getRowId: (row) => String(row.id),
+    shallow: false,
+    clearOnDefault: true,
+  });
+
+  return (
+    <>
+      <DataTable table={table}>
+        <DataTableAdvancedToolbar
+          table={table}
+          filterFields={advancedFilterFields}
+          shallow={false}
+        >
+          <ApprovalLineTableToolbarActions
+            table={table}
+            onCreateLine={() => setShowCreateSheet(true)}
+          />
+        </DataTableAdvancedToolbar>
+      </DataTable>
+
+      {/* 새 결재선 생성 Sheet */}
+      <CreateApprovalLineSheet
+        open={showCreateSheet}
+        onOpenChange={setShowCreateSheet}
+      />
+
+      {/* 결재선 수정 Sheet */}
+      <UpdateApprovalLineSheet
+        open={rowAction?.type === "update"}
+        onOpenChange={() => setRowAction(null)}
+        line={rowAction?.type === "update" ? rowAction.row.original : null}
+      />
+
+      {/* 결재선 복제 Sheet */}
+      <DuplicateApprovalLineSheet
+        open={rowAction?.type === "duplicate"}
+        onOpenChange={() => setRowAction(null)}
+        line={rowAction?.type === "duplicate" ? rowAction.row.original : null}
+      />
+
+      {/* 결재선 삭제 Dialog */}
+      <DeleteApprovalLineDialog
+        open={rowAction?.type === "delete"}
+        onOpenChange={() => setRowAction(null)}
+        lines={rowAction?.type === "delete" ? [rowAction.row.original] : []}
+        showTrigger={false}
+        onSuccess={() => {
+          setRowAction(null)
+          // 테이블 새로고침은 server action에서 자동으로 처리됨
+        }}
+      />
+    </>
+  );
+} 
\ No newline at end of file
diff --git a/lib/approval-line/table/create-approval-line-sheet.tsx b/lib/approval-line/table/create-approval-line-sheet.tsx
new file mode 100644
index 00000000..fdc8cc64
--- /dev/null
+++ b/lib/approval-line/table/create-approval-line-sheet.tsx
@@ -0,0 +1,224 @@
+"use client"
+
+import * as React from "react"
+import { useForm } from "react-hook-form"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { Button } from "@/components/ui/button"
+import {
+  Sheet,
+  SheetContent,
+  SheetDescription,
+  SheetHeader,
+  SheetTitle,
+} from "@/components/ui/sheet"
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+import { Separator } from "@/components/ui/separator"
+import { toast } from "sonner"
+import { Loader2 } from "lucide-react"
+import { createApprovalLine } from "../service"
+import { type ApprovalLineFormData, ApprovalLineSchema } from "../validations"
+import { ApprovalLineSelector } from "@/components/knox/approval/ApprovalLineSelector"
+import { OrganizationManagerSelector, type OrganizationManagerItem } from "@/components/common/organization/organization-manager-selector"
+import { useSession } from "next-auth/react"
+
+interface CreateApprovalLineSheetProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+}
+
+export function CreateApprovalLineSheet({ open, onOpenChange }: CreateApprovalLineSheetProps) {
+  const { data: session } = useSession();
+  const [isSubmitting, setIsSubmitting] = React.useState(false);
+
+  // 고유 ID 생성 함수 (조직 관리자 추가 시 사용)
+  const generateUniqueId = () => `apln-${Date.now()}-${Math.random().toString(36).slice(2, 11)}`;
+
+  const form = useForm<ApprovalLineFormData>({
+    resolver: zodResolver(ApprovalLineSchema),
+    defaultValues: {
+      name: "",
+      description: "",
+      aplns: [
+        // 기안자는 항상 첫 번째로 고정 (플레이스홀더)
+        {
+          id: generateUniqueId(),
+          epId: undefined,
+          userId: undefined,
+          emailAddress: undefined,
+          name: "기안자",
+          deptName: undefined,
+          role: "0",
+          seq: "0",
+          opinion: "",
+        },
+      ],
+    },
+  });
+
+  const aplns = form.watch("aplns");
+
+  // 조직 관리자 추가 (공용 선택기 외 보조 입력 경로)
+  const addOrganizationManagers = (managers: OrganizationManagerItem[]) => {
+    const next = [...aplns];
+    const uniqueSeqs = Array.from(new Set(next.map((a) => parseInt(a.seq))));
+    const maxSeq = uniqueSeqs.length ? Math.max(...uniqueSeqs) : 0;
+
+    managers.forEach((manager, idx) => {
+      const exists = next.findIndex((a) => a.epId === manager.managerId);
+      if (exists === -1) {
+        const newSeqNum = Math.max(1, maxSeq + 1 + idx);
+        const newSeq = newSeqNum.toString();
+        next.push({
+          id: generateUniqueId(),
+          epId: manager.managerId,
+          userId: undefined,
+          emailAddress: undefined,
+          name: manager.managerName,
+          deptName: manager.departmentName,
+          role: "1",
+          seq: newSeq,
+          opinion: "",
+        });
+      }
+    });
+
+    form.setValue("aplns", next, { shouldDirty: true });
+  };
+
+  const onSubmit = async (data: ApprovalLineFormData) => {
+    setIsSubmitting(true);
+    try {
+      if (!session?.user?.id) {
+        toast.error("로그인이 필요합니다.");
+        return;
+      }
+
+      await createApprovalLine({
+        name: data.name,
+        description: data.description,
+        aplns: data.aplns,
+        createdBy: Number(session.user.id),
+      });
+
+      toast.success("결재선이 성공적으로 생성되었습니다.");
+      form.reset();
+      onOpenChange(false);
+    } catch {
+      toast.error("결재선 생성 중 오류가 발생했습니다.");
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  return (
+    <Sheet open={open} onOpenChange={onOpenChange}>
+      <SheetContent className="w-full sm:max-w-4xl overflow-y-auto">
+        <SheetHeader>
+          <SheetTitle>결재선 생성</SheetTitle>
+          <SheetDescription>
+            새로운 결재선을 생성합니다. 결재자를 추가하고 순서를 조정할 수 있습니다.
+          </SheetDescription>
+        </SheetHeader>
+
+        <div className="mt-6">
+          <Form {...form}>
+            <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
+              {/* 기본 정보 */}
+              <div className="space-y-4">
+                <FormField
+                  control={form.control}
+                  name="name"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>결재선 이름 *</FormLabel>
+                      <FormControl>
+                        <Input placeholder="결재선 이름을 입력하세요" {...field} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+
+                <FormField
+                  control={form.control}
+                  name="description"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>설명</FormLabel>
+                      <FormControl>
+                        <Textarea placeholder="결재선에 대한 설명을 입력하세요" {...field} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+              </div>
+
+              <Separator />
+
+              {/* 결재 경로 */}
+              <div className="space-y-4">
+                <h3 className="text-lg font-semibold">결재 경로</h3>
+
+                <ApprovalLineSelector
+                  value={aplns}
+                  onChange={(next) => form.setValue("aplns", next, { shouldDirty: true })}
+                  placeholder="결재자를 검색하세요..."
+                  domainFilter={{ type: "exclude", domains: ["partners"] }}
+                  maxSelections={10}
+                />
+
+                {/* 조직 관리자 추가 (선택 사항) */}
+                {/* <div className="p-4 border border-dashed border-gray-300 rounded-lg">
+                  <div className="mb-2">
+                    <label className="text-sm font-medium text-gray-700">조직 관리자로 추가</label>
+                    <p className="text-xs text-gray-500">조직별 책임자를 검색하여 추가하세요</p>
+                  </div>
+                  <OrganizationManagerSelector
+                    selectedManagers={[]}
+                    onManagersChange={addOrganizationManagers}
+                    placeholder="조직 관리자를 검색하세요..."
+                    maxSelections={10}
+                  />
+                </div> */}
+              </div>
+
+              <Separator />
+
+              {/* 제출 버튼 */}
+              <div className="flex justify-end space-x-3">
+                <Button
+                  type="button"
+                  variant="outline"
+                  onClick={() => onOpenChange(false)}
+                  disabled={isSubmitting}
+                >
+                  취소
+                </Button>
+                <Button type="submit" disabled={isSubmitting}>
+                  {isSubmitting ? (
+                    <>
+                      <Loader2 className="w-4 h-4 mr-2 animate-spin" />
+                      생성 중...
+                    </>
+                  ) : (
+                    "결재선 생성"
+                  )}
+                </Button>
+              </div>
+            </form>
+          </Form>
+        </div>
+      </SheetContent>
+    </Sheet>
+  )
+} 
\ No newline at end of file
diff --git a/lib/approval-line/table/delete-approval-line-dialog.tsx b/lib/approval-line/table/delete-approval-line-dialog.tsx
new file mode 100644
index 00000000..aa1d8949
--- /dev/null
+++ b/lib/approval-line/table/delete-approval-line-dialog.tsx
@@ -0,0 +1,168 @@
+"use client"
+
+import * as React from "react"
+import { Button } from "@/components/ui/button"
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog"
+import { Badge } from "@/components/ui/badge"
+import { toast } from "sonner"
+import { Loader2, Trash2, AlertTriangle } from "lucide-react"
+import { deleteApprovalLine, getApprovalLineUsage } from "../service"
+import { type ApprovalLine } from "../service"
+
+interface DeleteApprovalLineDialogProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  lines: ApprovalLine[]
+  showTrigger?: boolean
+  onSuccess?: () => void
+}
+
+export function DeleteApprovalLineDialog({
+  open,
+  onOpenChange,
+  lines,
+  showTrigger = true,
+  onSuccess,
+}: DeleteApprovalLineDialogProps) {
+  const [isDeleting, setIsDeleting] = React.useState(false)
+  const [usageInfo, setUsageInfo] = React.useState<{ templateCount: number } | null>(null)
+
+  // 사용량 정보 조회
+  React.useEffect(() => {
+    if (open && lines.length === 1) {
+      getApprovalLineUsage(lines[0].id).then(setUsageInfo)
+    }
+  }, [open, lines])
+
+  const handleDelete = async () => {
+    setIsDeleting(true)
+
+    try {
+      const deletePromises = lines.map((line) => deleteApprovalLine(line.id))
+      const results = await Promise.all(deletePromises)
+
+      const successCount = results.filter((r) => r.success).length
+      const errorCount = results.length - successCount
+
+      if (successCount > 0) {
+        toast.success(`${successCount}개의 결재선이 삭제되었습니다.`)
+        onSuccess?.()
+        onOpenChange(false)
+      }
+
+      if (errorCount > 0) {
+        toast.error(`${errorCount}개의 결재선 삭제에 실패했습니다.`)
+      }
+    } catch (error) {
+      toast.error("삭제 중 오류가 발생했습니다.")
+    } finally {
+      setIsDeleting(false)
+    }
+  }
+
+  const isSingleLine = lines.length === 1
+  const line = isSingleLine ? lines[0] : null
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle className="flex items-center gap-2">
+            <Trash2 className="h-5 w-5 text-destructive" />
+            결재선 삭제
+          </DialogTitle>
+          <DialogDescription>
+            {isSingleLine
+              ? `"${line?.name}" 결재선을 삭제하시겠습니까?`
+              : `${lines.length}개의 결재선을 삭제하시겠습니까?`}
+          </DialogDescription>
+        </DialogHeader>
+
+        <div className="space-y-4">
+          {/* 사용량 정보 표시 */}
+          {isSingleLine && usageInfo && (
+            <div className="p-4 bg-yellow-50 border border-yellow-200 rounded-lg">
+              <div className="flex items-center gap-2 text-yellow-700">
+                <AlertTriangle className="w-4 h-4" />
+                <span className="font-medium">사용 중인 결재선</span>
+              </div>
+              <p className="text-sm text-yellow-600 mt-1">
+                이 결재선은 {usageInfo.templateCount}개의 템플릿에서 사용되고 있습니다.
+              </p>
+            </div>
+          )}
+
+          {/* 삭제할 결재선 목록 */}
+          <div className="space-y-2">
+            <h4 className="text-sm font-medium">삭제할 결재선:</h4>
+            <div className="space-y-2 max-h-40 overflow-y-auto">
+              {lines.map((line) => (
+                <div
+                  key={line.id}
+                  className="flex items-center justify-between p-3 border rounded-lg"
+                >
+                  <div className="flex-1">
+                    <div className="font-medium">{line.name}</div>
+                    {line.description && (
+                      <div className="text-sm text-gray-500">
+                        {line.description}
+                      </div>
+                    )}
+                    <div className="text-xs text-gray-400 mt-1">
+                      결재자 {(line.aplns as any[])?.length || 0}명
+                    </div>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </div>
+
+          {/* 경고 메시지 */}
+          <div className="p-4 bg-red-50 border border-red-200 rounded-lg">
+            <div className="flex items-center gap-2 text-red-700">
+              <AlertTriangle className="w-4 h-4" />
+              <span className="font-medium">주의</span>
+            </div>
+            <p className="text-sm text-red-600 mt-1">
+              삭제된 결재선은 복구할 수 없습니다. 이 작업은 되돌릴 수 없습니다.
+            </p>
+          </div>
+        </div>
+
+        <DialogFooter>
+          <Button
+            variant="outline"
+            onClick={() => onOpenChange(false)}
+            disabled={isDeleting}
+          >
+            취소
+          </Button>
+          <Button
+            variant="destructive"
+            onClick={handleDelete}
+            disabled={isDeleting}
+          >
+            {isDeleting ? (
+              <>
+                <Loader2 className="w-4 h-4 mr-2 animate-spin" />
+                삭제 중...
+              </>
+            ) : (
+              <>
+                <Trash2 className="w-4 h-4 mr-2" />
+                삭제
+              </>
+            )}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+} 
\ No newline at end of file
diff --git a/lib/approval-line/table/duplicate-approval-line-sheet.tsx b/lib/approval-line/table/duplicate-approval-line-sheet.tsx
new file mode 100644
index 00000000..0bb3ab2c
--- /dev/null
+++ b/lib/approval-line/table/duplicate-approval-line-sheet.tsx
@@ -0,0 +1,206 @@
+"use client"
+
+import * as React from "react"
+import { useForm } from "react-hook-form"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { z } from "zod"
+import { Button } from "@/components/ui/button"
+import {
+  Sheet,
+  SheetContent,
+  SheetDescription,
+  SheetHeader,
+  SheetTitle,
+} from "@/components/ui/sheet"
+import {
+  Form,
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+import { toast } from "sonner"
+import { Loader2, Copy } from "lucide-react"
+import { duplicateApprovalLine } from "../service"
+import { type ApprovalLine } from "../service"
+import { useSession } from "next-auth/react"
+
+const duplicateSchema = z.object({
+  name: z.string().min(1, "결재선 이름은 필수입니다"),
+  description: z.string().optional(),
+})
+
+type DuplicateFormData = z.infer<typeof duplicateSchema>
+
+interface DuplicateApprovalLineSheetProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  line: ApprovalLine | null
+}
+
+export function DuplicateApprovalLineSheet({
+  open,
+  onOpenChange,
+  line,
+}: DuplicateApprovalLineSheetProps) {
+  const { data: session } = useSession()
+  const [isSubmitting, setIsSubmitting] = React.useState(false)
+
+  const form = useForm<DuplicateFormData>({
+    resolver: zodResolver(duplicateSchema),
+    defaultValues: {
+      name: line ? `${line.name} (복사본)` : "",
+      description: line?.description ? `${line.description} (복사본)` : "",
+    },
+  })
+
+  // line이 변경될 때 폼 초기화
+  React.useEffect(() => {
+    if (line) {
+      form.reset({
+        name: `${line.name} (복사본)`,
+        description: line.description ? `${line.description} (복사본)` : "",
+      })
+    }
+  }, [line, form])
+
+  const onSubmit = async (data: DuplicateFormData) => {
+    if (!line || !session?.user?.id) {
+      toast.error("복제할 결재선이 없거나 로그인이 필요합니다.")
+      return
+    }
+
+    setIsSubmitting(true)
+
+    try {
+      const result = await duplicateApprovalLine(
+        line.id,
+        data.name,
+        session.user.id
+      )
+
+      if (result.success) {
+        toast.success("결재선이 성공적으로 복제되었습니다.")
+        form.reset()
+        onOpenChange(false)
+      } else {
+        toast.error(result.error || "복제에 실패했습니다.")
+      }
+    } catch (error) {
+      toast.error("복제 중 오류가 발생했습니다.")
+    } finally {
+      setIsSubmitting(false)
+    }
+  }
+
+  if (!line) return null
+
+  return (
+    <Sheet open={open} onOpenChange={onOpenChange}>
+      <SheetContent>
+        <SheetHeader>
+          <SheetTitle className="flex items-center gap-2">
+            <Copy className="h-5 w-5" />
+            결재선 복제
+          </SheetTitle>
+          <SheetDescription>
+            "{line.name}" 결재선을 복제하여 새로운 결재선을 만듭니다.
+          </SheetDescription>
+        </SheetHeader>
+
+        <div className="mt-6">
+          <Form {...form}>
+            <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
+              {/* 원본 정보 표시 */}
+              <div className="p-4 bg-gray-50 border rounded-lg">
+                <h4 className="font-medium text-sm mb-2">원본 결재선 정보</h4>
+                <div className="space-y-2 text-sm">
+                  <div>
+                    <span className="font-medium">이름:</span> {line.name}
+                  </div>
+                  {line.description && (
+                    <div>
+                      <span className="font-medium">설명:</span> {line.description}
+                    </div>
+                  )}
+                  <div>
+                    <span className="font-medium">결재자:</span> {(line.aplns as any[])?.length || 0}명
+                  </div>
+                </div>
+              </div>
+
+              {/* 새 결재선 정보 */}
+              <div className="space-y-4">
+                <FormField
+                  control={form.control}
+                  name="name"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>새 결재선 이름 *</FormLabel>
+                      <FormControl>
+                        <Input placeholder="새 결재선 이름을 입력하세요" {...field} />
+                      </FormControl>
+                      <FormDescription>
+                        원본과 구분할 수 있는 이름을 입력하세요.
+                      </FormDescription>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+
+                <FormField
+                  control={form.control}
+                  name="description"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>설명</FormLabel>
+                      <FormControl>
+                        <Textarea
+                          placeholder="새 결재선에 대한 설명을 입력하세요"
+                          {...field}
+                        />
+                      </FormControl>
+                      <FormDescription>
+                        선택사항입니다. 결재선의 용도나 특징을 설명할 수 있습니다.
+                      </FormDescription>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+              </div>
+
+              {/* 제출 버튼 */}
+              <div className="flex justify-end space-x-3">
+                <Button
+                  type="button"
+                  variant="outline"
+                  onClick={() => onOpenChange(false)}
+                  disabled={isSubmitting}
+                >
+                  취소
+                </Button>
+                <Button type="submit" disabled={isSubmitting}>
+                  {isSubmitting ? (
+                    <>
+                      <Loader2 className="w-4 h-4 mr-2 animate-spin" />
+                      복제 중...
+                    </>
+                  ) : (
+                    <>
+                      <Copy className="w-4 h-4 mr-2" />
+                      결재선 복제
+                    </>
+                  )}
+                </Button>
+              </div>
+            </form>
+          </Form>
+        </div>
+      </SheetContent>
+    </Sheet>
+  )
+} 
\ No newline at end of file
diff --git a/lib/approval-line/table/update-approval-line-sheet.tsx b/lib/approval-line/table/update-approval-line-sheet.tsx
new file mode 100644
index 00000000..efc720de
--- /dev/null
+++ b/lib/approval-line/table/update-approval-line-sheet.tsx
@@ -0,0 +1,264 @@
+"use client"
+
+import * as React from "react"
+import { useForm } from "react-hook-form"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { Button } from "@/components/ui/button"
+import {
+  Sheet,
+  SheetContent,
+  SheetDescription,
+  SheetHeader,
+  SheetTitle,
+} from "@/components/ui/sheet"
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+import { Separator } from "@/components/ui/separator"
+import { toast } from "sonner"
+import { Loader2, Edit } from "lucide-react"
+import { updateApprovalLine, type ApprovalLine } from "../service"
+import { type ApprovalLineFormData, ApprovalLineSchema } from "../validations"
+import { OrganizationManagerSelector, type OrganizationManagerItem } from "@/components/common/organization/organization-manager-selector"
+import { useSession } from "next-auth/react"
+import { ApprovalLineSelector } from "@/components/knox/approval/ApprovalLineSelector"
+
+interface UpdateApprovalLineSheetProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  line: ApprovalLine | null
+}
+
+// 최소 형태의 Apln 아이템 타입 (line.aplns JSON 구조 대응)
+interface MinimalAplnItem {
+  id: string
+  epId?: string
+  userId?: string
+  emailAddress?: string
+  name?: string
+  deptName?: string
+  role: "0" | "1" | "2" | "3" | "4" | "7" | "9"
+  seq: string
+  opinion?: string
+  [key: string]: unknown
+}
+
+export function UpdateApprovalLineSheet({ open, onOpenChange, line }: UpdateApprovalLineSheetProps) {
+  const { data: session } = useSession();
+  const [isSubmitting, setIsSubmitting] = React.useState(false);
+
+  // 고유 ID 생성 함수 (조직 관리자 추가 시 사용)
+  const generateUniqueId = () => `apln-${Date.now()}-${Math.random().toString(36).slice(2, 11)}`;
+
+  const form = useForm<ApprovalLineFormData>({
+    resolver: zodResolver(ApprovalLineSchema),
+    defaultValues: {
+      name: "",
+      description: "",
+      aplns: [],
+    },
+  });
+
+  // line이 변경될 때 폼 초기화
+  React.useEffect(() => {
+    if (line) {
+      const existingAplns = (line.aplns as unknown as MinimalAplnItem[]) || [];
+      
+      // 기안자가 없으면 추가
+      const hasDraft = existingAplns.some((a) => String(a.seq) === "0");
+      let nextAplns: MinimalAplnItem[] = existingAplns;
+      
+      if (!hasDraft) {
+        nextAplns = [
+          {
+            id: generateUniqueId(),
+            epId: undefined,
+            userId: undefined,
+            emailAddress: undefined,
+            name: "기안자",
+            deptName: undefined,
+            role: "0",
+            seq: "0",
+            opinion: "",
+          },
+          ...existingAplns,
+        ];
+      }
+      
+      form.reset({
+        name: line.name,
+        description: line.description || "",
+        aplns: nextAplns as ApprovalLineFormData["aplns"],
+      });
+    }
+  }, [line, form]);
+
+  const aplns = form.watch("aplns");
+
+  // 조직 관리자 추가 (공용 선택기 외 보조 입력 경로)
+  const addOrganizationManagers = (managers: OrganizationManagerItem[]) => {
+    const next = [...aplns];
+    const uniqueSeqs = Array.from(new Set(next.map((a) => parseInt(a.seq))));
+    const maxSeq = uniqueSeqs.length ? Math.max(...uniqueSeqs) : 0;
+
+    managers.forEach((manager, idx) => {
+      const exists = next.findIndex((a) => a.epId === manager.managerId);
+      if (exists === -1) {
+        const newSeqNum = Math.max(1, maxSeq + 1 + idx);
+        const newSeq = newSeqNum.toString();
+        next.push({
+          id: generateUniqueId(),
+          epId: manager.managerId,
+          userId: undefined,
+          emailAddress: undefined,
+          name: manager.managerName,
+          deptName: manager.departmentName,
+          role: "1",
+          seq: newSeq,
+          opinion: "",
+        });
+      }
+    });
+
+    form.setValue("aplns", next, { shouldDirty: true });
+  };
+
+  const onSubmit = async (data: ApprovalLineFormData) => {
+    if (!line || !session?.user?.id) {
+      toast.error("수정할 결재선이 없거나 로그인이 필요합니다.");
+      return;
+    }
+
+    setIsSubmitting(true);
+    try {
+      await updateApprovalLine(line.id, {
+        name: data.name,
+        description: data.description,
+        aplns: data.aplns,
+        updatedBy: Number(session.user.id),
+      });
+
+      toast.success("결재선이 성공적으로 수정되었습니다.");
+      onOpenChange(false);
+    } catch {
+      toast.error("결재선 수정 중 오류가 발생했습니다.");
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  if (!line) return null;
+
+  return (
+    <Sheet open={open} onOpenChange={onOpenChange}>
+      <SheetContent className="w-full sm:max-w-4xl overflow-y-auto">
+        <SheetHeader>
+          <SheetTitle className="flex items-center gap-2">
+            <Edit className="h-5 w-5" />
+            결재선 수정
+          </SheetTitle>
+          <SheetDescription>
+            &quot;{line.name}&quot; 결재선을 수정합니다. 결재자를 추가하고 순서를 조정할 수 있습니다.
+          </SheetDescription>
+        </SheetHeader>
+
+        <div className="mt-6">
+          <Form {...form}>
+            <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
+              {/* 기본 정보 */}
+              <div className="space-y-4">
+                <FormField
+                  control={form.control}
+                  name="name"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>결재선 이름 *</FormLabel>
+                      <FormControl>
+                        <Input placeholder="결재선 이름을 입력하세요" {...field} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+
+                <FormField
+                  control={form.control}
+                  name="description"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>설명</FormLabel>
+                      <FormControl>
+                        <Textarea placeholder="결재선에 대한 설명을 입력하세요" {...field} />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+              </div>
+
+              <Separator />
+
+              {/* 결재 경로 */}
+              <div className="space-y-4">
+                <h3 className="text-lg font-semibold">결재 경로</h3>
+
+                <ApprovalLineSelector
+                  value={aplns}
+                  onChange={(next) => form.setValue("aplns", next, { shouldDirty: true })}
+                      placeholder="결재자를 검색하세요..."
+                      domainFilter={{ type: "exclude", domains: ["partners"] }}
+                      maxSelections={10}
+                    />
+
+                {/* 조직 관리자 추가 (선택 사항) */}
+                  {/* <div className="p-4 border border-dashed border-gray-300 rounded-lg">
+                    <div className="mb-2">
+                      <label className="text-sm font-medium text-gray-700">조직 관리자로 추가</label>
+                      <p className="text-xs text-gray-500">조직별 책임자를 검색하여 추가하세요</p>
+                    </div>
+                    <OrganizationManagerSelector
+                      selectedManagers={[]}
+                      onManagersChange={addOrganizationManagers}
+                      placeholder="조직 관리자를 검색하세요..."
+                      maxSelections={10}
+                    />
+                  </div> */}
+              </div>
+
+              <Separator />
+
+              {/* 제출 버튼 */}
+              <div className="flex justify-end space-x-3">
+                <Button
+                  type="button"
+                  variant="outline"
+                  onClick={() => onOpenChange(false)}
+                  disabled={isSubmitting}
+                >
+                  취소
+                </Button>
+                <Button type="submit" disabled={isSubmitting}>
+                  {isSubmitting ? (
+                    <>
+                      <Loader2 className="w-4 h-4 mr-2 animate-spin" />
+                      수정 중...
+                    </>
+                  ) : (
+                    "결재선 수정"
+                  )}
+                </Button>
+              </div>
+            </form>
+          </Form>
+        </div>
+      </SheetContent>
+    </Sheet>
+  )
+} 
\ No newline at end of file
diff --git a/lib/approval-line/utils/format.ts b/lib/approval-line/utils/format.ts
new file mode 100644
index 00000000..d74c7d1e
--- /dev/null
+++ b/lib/approval-line/utils/format.ts
@@ -0,0 +1,53 @@
+export interface SimpleApln {
+  seq: string
+  name?: string
+  emailAddress?: string
+  role: string
+}
+
+export function formatApprovalLine(aplns: SimpleApln[]): string {
+  if (!aplns || aplns.length === 0) return '결재자 없음'
+
+  const roleMap: Record<string, string> = {
+    '0': '기안',
+    '1': '결재',
+    '2': '합의',
+    '3': '후결',
+    '4': '병렬합의',
+    '7': '병렬결재',
+    '9': '통보',
+  }
+
+  const groupedBySeq = aplns.reduce<Record<string, SimpleApln[]>>((groups, apln) => {
+    const seq = apln.seq
+    if (!groups[seq]) groups[seq] = []
+    groups[seq].push(apln)
+    return groups
+  }, {})
+
+  const sortedSeqs = Object.keys(groupedBySeq).sort((a, b) => parseInt(a) - parseInt(b))
+
+  return sortedSeqs
+    .map((seq) => {
+      const group = groupedBySeq[seq]
+      const isParallel = group.length > 1 || group.some((apln) => apln.role === '4' || apln.role === '7')
+      if (isParallel) {
+        const parallelMembers = group
+          .map((apln) => {
+            const name = apln.name || apln.emailAddress || '이름없음'
+            const role = roleMap[apln.role] || '알수없음'
+            return `${name}(${role})`
+          })
+          .join(', ')
+        return `[${parallelMembers}]`
+      } else {
+        const apln = group[0]
+        const name = apln.name || apln.emailAddress || '이름없음'
+        const role = roleMap[apln.role] || '알수없음'
+        return `${name}(${role})`
+      }
+    })
+    .join(' → ')
+}
+
+
diff --git a/lib/approval-line/validations.ts b/lib/approval-line/validations.ts
new file mode 100644
index 00000000..4f55454a
--- /dev/null
+++ b/lib/approval-line/validations.ts
@@ -0,0 +1,24 @@
+import { z } from 'zod';
+import { SearchParamsApprovalTemplateCache } from '@/lib/approval-template/validations';
+
+// 결재선 검색 파라미터 스키마 (기존 템플릿 검증 스키마 재사용)
+export const SearchParamsApprovalLineCache = SearchParamsApprovalTemplateCache;
+
+// 결재선 생성/수정 스키마
+export const ApprovalLineSchema = z.object({
+  name: z.string().min(1, '결재선 이름은 필수입니다'),
+  description: z.string().optional(),
+  aplns: z.array(z.object({
+    id: z.string(),
+    epId: z.string().optional(),
+    userId: z.string().optional(),
+    emailAddress: z.string().email('유효한 이메일 주소를 입력해주세요').optional(),
+    name: z.string().optional(),
+    deptName: z.string().optional(),
+    role: z.enum(['0', '1', '2', '3', '4', '7', '9']),
+    seq: z.string(),
+    opinion: z.string().optional()
+  })).min(1, '최소 1개의 결재 경로가 필요합니다'),
+});
+
+export type ApprovalLineFormData = z.infer<typeof ApprovalLineSchema>; 
\ No newline at end of file