From b12a06766e32e3c76544b1d12bec91653e1fe9db Mon Sep 17 00:00:00 2001 From: 0-Zz-ang Date: Mon, 25 Aug 2025 09:23:30 +0900 Subject: docu-list-rule페이지 수정 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../table/document-class-add-dialog.tsx | 73 +++------------------- .../table/document-class-options-detail-sheet.tsx | 69 ++++++++++++++++++-- .../table/document-class-options-table-columns.tsx | 13 ++++ .../table/document-class-table-columns.tsx | 14 ----- .../document-class/table/document-class-table.tsx | 7 +-- 5 files changed, 86 insertions(+), 90 deletions(-) (limited to 'lib/docu-list-rule/document-class/table') diff --git a/lib/docu-list-rule/document-class/table/document-class-add-dialog.tsx b/lib/docu-list-rule/document-class/table/document-class-add-dialog.tsx index a51b0598..e2cfc39e 100644 --- a/lib/docu-list-rule/document-class/table/document-class-add-dialog.tsx +++ b/lib/docu-list-rule/document-class/table/document-class-add-dialog.tsx @@ -26,19 +26,12 @@ import { FormMessage, } from "@/components/ui/form" import { Input } from "@/components/ui/input" -import { - Select, - SelectContent, - SelectItem, - SelectTrigger, - SelectValue, -} from "@/components/ui/select" + import { createDocumentClassCodeGroup } from "@/lib/docu-list-rule/document-class/service" -import { getProjectLists } from "@/lib/projects/service" +import { useParams } from "next/navigation" const createDocumentClassSchema = z.object({ - projectId: z.string().min(1, "프로젝트는 필수입니다."), value: z.string().min(1, "Value는 필수입니다."), description: z.string().optional(), }) @@ -52,56 +45,27 @@ interface DocumentClassAddDialogProps { export function DocumentClassAddDialog({ onSuccess, }: DocumentClassAddDialogProps) { + const params = useParams() + const projectId = Number(params?.projectId) const [open, setOpen] = React.useState(false) const [isPending, startTransition] = React.useTransition() - const [projects, setProjects] = React.useState>([]) const form = useForm({ resolver: zodResolver(createDocumentClassSchema), defaultValues: { - projectId: "", value: "", description: "", }, mode: "onChange" }) - // 프로젝트 목록 로드 - React.useEffect(() => { - if (open) { - const loadProjects = async () => { - try { - const result = await getProjectLists({ - page: 1, - perPage: 1000, - search: "", - sort: [], - filters: [], - joinOperator: "and", - flags: [], - code: "", - name: "", - type: "" - }) - if (result.data) { - // plant 타입의 프로젝트만 필터링 - const plantProjects = result.data.filter(project => project.type === 'plant') - setProjects(plantProjects) - } - } catch (error) { - console.error("Failed to load projects:", error) - toast.error("프로젝트 목록을 불러오는데 실패했습니다.") - } - } - loadProjects() - } - }, [open]) + async function onSubmit(input: CreateDocumentClassSchema) { startTransition(async () => { try { const result = await createDocumentClassCodeGroup({ - projectId: parseInt(input.projectId), + projectId: projectId, value: input.value, description: input.description, }) @@ -144,30 +108,7 @@ export function DocumentClassAddDialog({
- ( - - 프로젝트 * - - - - )} - /> + String(originalRow.id), }) + // 드래그 종료 핸들러 + const handleDragEnd = React.useCallback(async (event: DragEndEvent) => { + const { active, over } = event + console.log("Drag end event:", { active, over }) + + if (active.id !== over?.id) { + const oldIndex = rawData.data.findIndex((item) => String(item.id) === active.id) + const newIndex = rawData.data.findIndex((item) => String(item.id) === over?.id) + console.log("Indices:", { oldIndex, newIndex }) + + if (oldIndex !== -1 && newIndex !== -1) { + const reorderedData = arrayMove(rawData.data, oldIndex, newIndex) + + // 새로운 순서로 sdq 값 업데이트 + const updatedOptions = reorderedData.map((item, index) => ({ + ...item, + sdq: index + 1 + })) + + // 로컬 상태 먼저 업데이트 + setRawData(prev => ({ ...prev, data: updatedOptions })) + + // 서버에 순서 업데이트 (Combo Box Settings와 같은 방식) + try { + // 모든 항목을 임시 값으로 먼저 업데이트 + for (let i = 0; i < updatedOptions.length; i++) { + const option = updatedOptions[i] + await updateDocumentClassOption({ + id: option.id, + sdq: -(i + 1), // 임시 음수 값 + }) + } + + // 최종 순서로 업데이트 + for (const option of updatedOptions) { + await updateDocumentClassOption({ + id: option.id, + sdq: option.sdq, + }) + } + + toast.success("순서가 성공적으로 변경되었습니다.") + } catch (error) { + console.error("Error updating order:", error) + toast.error("순서 변경 중 오류가 발생했습니다.") + // 에러 시 원래 데이터로 복원 + await refreshData() + } + } + } + }, [rawData.data, refreshData]) + if (!documentClass) return null return ( @@ -122,12 +179,16 @@ export function DocumentClassOptionsDetailSheet({ onSuccess={refreshData} /> - + - + [] = [ + { + accessorKey: "sdq", + enableResizing: true, + header: ({ column }) => ( + + ), + meta: { + excelHeader: "순서", + type: "number", + }, + cell: ({ row }) => row.getValue("sdq") ?? "", + minSize: 50 + }, { accessorKey: "optionCode", enableResizing: true, diff --git a/lib/docu-list-rule/document-class/table/document-class-table-columns.tsx b/lib/docu-list-rule/document-class/table/document-class-table-columns.tsx index ad8494c7..8c391def 100644 --- a/lib/docu-list-rule/document-class/table/document-class-table-columns.tsx +++ b/lib/docu-list-rule/document-class/table/document-class-table-columns.tsx @@ -106,20 +106,6 @@ export function getColumns({ setRowAction, onDetail }: GetColumnsProps): ColumnD // 3) 데이터 컬럼들 // ---------------------------------------------------------------- const dataColumns: ColumnDef[] = [ - { - accessorKey: "projectCode", - enableResizing: true, - enableColumnFilter: true, - header: ({ column }) => ( - - ), - meta: { - excelHeader: "프로젝트 코드", - type: "text", - }, - cell: ({ row }) => row.getValue("projectCode") ?? "", - minSize: 120 - }, { accessorKey: "code", enableResizing: true, diff --git a/lib/docu-list-rule/document-class/table/document-class-table.tsx b/lib/docu-list-rule/document-class/table/document-class-table.tsx index 03855fe1..11ec3a3c 100644 --- a/lib/docu-list-rule/document-class/table/document-class-table.tsx +++ b/lib/docu-list-rule/document-class/table/document-class-table.tsx @@ -59,12 +59,7 @@ export function DocumentClassTable({ promises }: DocumentClassTableProps) { }) - // 컴포넌트 마운트 후 그룹핑 설정 - React.useEffect(() => { - if (rawData[0]?.data && table.getState().grouping.length === 0) { - table.setGrouping(["projectCode"]) - } - }, [table, rawData]) + // 정렬 시 펼쳐진 상태 유지 React.useEffect(() => { -- cgit v1.2.3