summaryrefslogtreecommitdiff
path: root/lib
diff options
context:
space:
mode:
Diffstat (limited to 'lib')
-rw-r--r--lib/material-groups/services.ts165
-rw-r--r--lib/material-groups/table/material-group-table-columns.tsx61
-rw-r--r--lib/material-groups/table/material-group-table.tsx178
-rw-r--r--lib/material-groups/validations.ts31
4 files changed, 435 insertions, 0 deletions
diff --git a/lib/material-groups/services.ts b/lib/material-groups/services.ts
new file mode 100644
index 00000000..4b7e9dea
--- /dev/null
+++ b/lib/material-groups/services.ts
@@ -0,0 +1,165 @@
+'use server'
+
+import { and, asc, desc, ilike, or, sql, eq } from 'drizzle-orm';
+import db from '@/db/db';
+import { filterColumns } from "@/lib/filter-columns";
+import { materialSearchView } from "@/db/schema/items";
+
+// 자재그룹 뷰의 컬럼 타입 정의
+type MaterialGroupColumn = keyof typeof materialSearchView.$inferSelect;
+
+export interface GetMaterialGroupsInput {
+ page: number;
+ perPage: number;
+ search?: string;
+ sort: Array<{
+ id: MaterialGroupColumn;
+ desc: boolean;
+ }>;
+ filters?: any[];
+ joinOperator: 'and' | 'or';
+}
+
+/**
+ * 자재그룹 목록을 조회합니다.
+ * materialSearchView를 사용하여 MATKL(자재그룹코드)와 ZZNAME(자재그룹명)의 고유한 조합을 조회
+ */
+export async function getMaterialGroups(input: GetMaterialGroupsInput) {
+ const safePerPage = Math.min(input.perPage, 100);
+
+ try {
+ const offset = (input.page - 1) * safePerPage;
+
+ // 고급 필터링
+ const advancedWhere = filterColumns({
+ table: materialSearchView,
+ filters: (input.filters || []) as any,
+ joinOperator: input.joinOperator,
+ });
+
+ // 전역 검색 - 주요 컬럼들에 대해 검색
+ let globalWhere;
+ if (input.search) {
+ const s = `%${input.search}%`;
+ globalWhere = or(
+ ilike(materialSearchView.materialGroupCode, s), // 자재그룹코드
+ ilike(materialSearchView.materialName, s), // 자재그룹명
+ ilike(materialSearchView.displayText, s), // 표시 텍스트
+ );
+ }
+
+ const finalWhere = and(advancedWhere, globalWhere);
+
+ // 정렬 처리 - 타입 안전하게 처리
+ const orderBy = input.sort.length > 0
+ ? input.sort.map((item) => {
+ const column = materialSearchView[item.id];
+ return item.desc ? desc(column) : asc(column);
+ })
+ : [asc(materialSearchView.materialGroupCode)];
+
+ // 데이터 조회
+ const { data, total } = await db.transaction(async (tx) => {
+ const data = await tx
+ .select({
+ materialGroupCode: materialSearchView.materialGroupCode,
+ materialName: materialSearchView.materialName,
+ displayText: materialSearchView.displayText,
+ })
+ .from(materialSearchView)
+ .where(finalWhere)
+ .orderBy(...orderBy)
+ .offset(offset)
+ .limit(safePerPage);
+
+ const totalResult = await tx
+ .select({
+ count: sql<number>`count(*)`
+ })
+ .from(materialSearchView)
+ .where(finalWhere);
+
+ const total = Number(totalResult[0]?.count) || 0;
+ return { data, total };
+ });
+
+ const pageCount = Math.ceil(total / safePerPage);
+ return { data, pageCount };
+ } catch (err) {
+ console.error('Error in getMaterialGroups:', err);
+ return { data: [], pageCount: 0 };
+ }
+}
+
+/**
+ * 무한 스크롤을 위한 자재그룹 조회 (페이지네이션 없음)
+ */
+export interface GetMaterialGroupsInfiniteInput extends Omit<GetMaterialGroupsInput, 'page' | 'perPage'> {
+ limit?: number; // 무한 스크롤용 추가 옵션
+}
+
+export async function getMaterialGroupsInfinite(input: GetMaterialGroupsInfiniteInput) {
+ try {
+ // 고급 필터링
+ const advancedWhere = filterColumns({
+ table: materialSearchView,
+ filters: (input.filters || []) as any,
+ joinOperator: input.joinOperator || "and",
+ });
+
+ // 전역 검색
+ let globalWhere;
+ if (input.search) {
+ const s = `%${input.search}%`;
+ globalWhere = or(
+ ilike(materialSearchView.materialGroupCode, s),
+ ilike(materialSearchView.materialName, s),
+ ilike(materialSearchView.displayText, s),
+ );
+ }
+
+ const finalWhere = and(advancedWhere, globalWhere);
+
+ // 정렬 처리 - 타입 안전하게 처리
+ const orderBy = input.sort.length > 0
+ ? input.sort.map((item) => {
+ const column = materialSearchView[item.id];
+ return item.desc ? desc(column) : asc(column);
+ })
+ : [asc(materialSearchView.materialGroupCode)];
+
+ // 전체 데이터 조회 (클라이언트에서 가상화 처리)
+ const data = await db
+ .select({
+ materialGroupCode: materialSearchView.materialGroupCode,
+ materialName: materialSearchView.materialName,
+ displayText: materialSearchView.displayText,
+ })
+ .from(materialSearchView)
+ .where(finalWhere)
+ .orderBy(...orderBy);
+
+ return { data };
+ } catch (err) {
+ console.error('Error in getMaterialGroupsInfinite:', err);
+ return { data: [] };
+ }
+}
+
+/**
+ * 특정 자재그룹 상세 정보 조회
+ */
+export async function getMaterialGroupDetail(materialGroupCode: string) {
+ try {
+ const materialGroup = await db
+ .select()
+ .from(materialSearchView)
+ .where(eq(materialSearchView.materialGroupCode, materialGroupCode))
+ .limit(1);
+
+ return materialGroup.length > 0 ? materialGroup[0] : null;
+ } catch (err) {
+ console.error('Error in getMaterialGroupDetail:', err);
+ return null;
+ }
+}
diff --git a/lib/material-groups/table/material-group-table-columns.tsx b/lib/material-groups/table/material-group-table-columns.tsx
new file mode 100644
index 00000000..90df720d
--- /dev/null
+++ b/lib/material-groups/table/material-group-table-columns.tsx
@@ -0,0 +1,61 @@
+"use client"
+
+import * as React from "react"
+import { type ColumnDef } from "@tanstack/react-table"
+
+import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
+
+// MaterialGroup 타입 정의 (서비스에서 반환되는 타입과 일치)
+type MaterialGroup = {
+ materialGroupCode: string | null;
+ materialName: string | null;
+ displayText: string | null;
+}
+
+/**
+ * MaterialGroup 테이블 컬럼 정의
+ */
+export function getColumns(): ColumnDef<MaterialGroup>[] {
+ // ----------------------------------------------------------------
+ // 데이터 컬럼들
+ // ----------------------------------------------------------------
+ const dataColumns: ColumnDef<MaterialGroup>[] = [
+ {
+ accessorKey: "materialGroupCode",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="자재그룹코드" />
+ ),
+ cell: ({ row }) => {
+ const value = row.getValue("materialGroupCode") as string | null
+ return (
+ <div className="font-medium">
+ {value || "-"}
+ </div>
+ )
+ },
+ enableSorting: true,
+ enableHiding: false,
+ },
+ {
+ accessorKey: "materialName",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="자재그룹명" />
+ ),
+ cell: ({ row }) => {
+ const value = row.getValue("materialName") as string | null
+ return (
+ <div className="max-w-[300px] truncate">
+ {value || "-"}
+ </div>
+ )
+ },
+ enableSorting: true,
+ enableHiding: false,
+ },
+ ]
+
+ // ----------------------------------------------------------------
+ // 최종 컬럼 배열
+ // ----------------------------------------------------------------
+ return dataColumns
+}
diff --git a/lib/material-groups/table/material-group-table.tsx b/lib/material-groups/table/material-group-table.tsx
new file mode 100644
index 00000000..21430c4f
--- /dev/null
+++ b/lib/material-groups/table/material-group-table.tsx
@@ -0,0 +1,178 @@
+"use client"
+
+import * as React from "react"
+import type {
+ DataTableAdvancedFilterField,
+ DataTableFilterField,
+} from "@/types/table"
+
+import { useDataTable } from "@/hooks/use-data-table"
+import { DataTable } from "@/components/data-table/data-table"
+import { InfiniteDataTable } from "@/components/data-table/infinite-data-table"
+import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar"
+import { Button } from "@/components/ui/button"
+import { Alert, AlertDescription } from "@/components/ui/alert"
+
+import { getMaterialGroups } from "../services"
+import { getColumns } from "./material-group-table-columns"
+import { ViewModeToggle } from "@/components/data-table/view-mode-toggle"
+
+// MaterialGroup 타입 정의 (서비스에서 반환되는 타입과 일치)
+type MaterialGroup = {
+ materialGroupCode: string | null;
+ materialName: string | null;
+ displayText: string | null;
+}
+
+interface MaterialGroupTableProps {
+ promises?: Promise<
+ [
+ Awaited<ReturnType<typeof getMaterialGroups>>,
+ ]
+ >
+}
+
+export function MaterialGroupTable({ promises }: MaterialGroupTableProps) {
+ // 페이지네이션 모드 데이터
+ const paginationData = promises ? React.use(promises) : null
+ const [{ data = [], pageCount = 0 }] = paginationData || [{ data: [], pageCount: 0 }]
+
+ console.log('MaterialGroupTable data:', data.length, 'material groups')
+
+ const columns = React.useMemo(
+ () => getColumns(),
+ []
+ )
+
+ // 기존 필터 필드들
+ const filterFields: DataTableFilterField<MaterialGroup>[] = [
+ {
+ id: "materialGroupCode",
+ label: "자재그룹코드",
+ },
+ {
+ id: "materialName",
+ label: "자재그룹명",
+ },
+ ]
+
+ const advancedFilterFields: DataTableAdvancedFilterField<MaterialGroup>[] = [
+ {
+ id: "materialGroupCode",
+ label: "자재그룹코드",
+ type: "text",
+ },
+ {
+ id: "materialName",
+ label: "자재그룹명",
+ type: "text",
+ },
+ {
+ id: "displayText",
+ label: "표시텍스트",
+ type: "text",
+ },
+ ]
+
+ // 확장된 useDataTable 훅 사용 (pageSize 기반 자동 전환)
+ const {
+ table,
+ infiniteScroll,
+ isInfiniteMode,
+ handlePageSizeChange,
+ } = useDataTable({
+ data,
+ columns,
+ pageCount,
+ filterFields,
+ enablePinning: true,
+ enableAdvancedFilter: true,
+ initialState: {
+ sorting: [{ id: "materialGroupCode", desc: false }],
+ },
+ getRowId: (originalRow) => String(originalRow.materialGroupCode || 'unknown'),
+ shallow: false,
+ clearOnDefault: true,
+ // 무한 스크롤 설정
+ infiniteScrollConfig: {
+ apiEndpoint: "/api/table/material-groups/infinite",
+ tableName: "material-groups",
+ maxPageSize: 100,
+ },
+ })
+
+ return (
+ <div className="w-full space-y-2.5 overflow-x-auto" style={{maxWidth:'100vw'}}>
+
+ {/* 모드 토글 */}
+ <div className="flex items-center justify-between">
+ <ViewModeToggle
+ isInfiniteMode={isInfiniteMode}
+ onSwitch={handlePageSizeChange}
+ />
+ </div>
+
+ {/* 에러 상태 (무한 스크롤 모드) */}
+ {isInfiniteMode && infiniteScroll?.error && (
+ <Alert variant="destructive">
+ <AlertDescription>
+ 데이터를 불러오는 중 오류가 발생했습니다.
+ <Button
+ variant="link"
+ size="sm"
+ onClick={() => infiniteScroll.reset()}
+ className="ml-2 p-0 h-auto"
+ >
+ 다시 시도
+ </Button>
+ </AlertDescription>
+ </Alert>
+ )}
+
+ {/* 로딩 상태가 아닐 때만 테이블 렌더링 */}
+ {!(isInfiniteMode && infiniteScroll?.isLoading && infiniteScroll?.isEmpty) ? (
+ <>
+ {/* 도구 모음 */}
+ <DataTableAdvancedToolbar
+ table={table}
+ filterFields={advancedFilterFields}
+ shallow={false}
+ />
+
+ {/* 테이블 렌더링 */}
+ {isInfiniteMode ? (
+ // 무한 스크롤 모드: InfiniteDataTable 사용
+ <InfiniteDataTable
+ table={table}
+ hasNextPage={infiniteScroll?.hasNextPage || false}
+ isLoadingMore={infiniteScroll?.isLoadingMore || false}
+ onLoadMore={infiniteScroll?.onLoadMore}
+ totalCount={infiniteScroll?.totalCount}
+ isEmpty={infiniteScroll?.isEmpty || false}
+ compact={false}
+ autoSizeColumns={true}
+ />
+ ) : (
+ // 페이지네이션 모드: DataTable 사용
+ <DataTable
+ table={table}
+ compact={false}
+ autoSizeColumns={true}
+ />
+ )}
+ </>
+ ) : (
+ /* 로딩 스켈레톤 (무한 스크롤 초기 로딩) */
+ <div className="space-y-3">
+ <div className="text-sm text-muted-foreground mb-4">
+ 무한 스크롤 모드로 데이터를 로드하고 있습니다...
+ </div>
+ {Array.from({ length: 10 }).map((_, i) => (
+ <div key={i} className="h-12 w-full bg-muted animate-pulse rounded" />
+ ))}
+ </div>
+ )}
+
+ </div>
+ )
+}
diff --git a/lib/material-groups/validations.ts b/lib/material-groups/validations.ts
new file mode 100644
index 00000000..c379c833
--- /dev/null
+++ b/lib/material-groups/validations.ts
@@ -0,0 +1,31 @@
+import {
+ createSearchParamsCache,
+ parseAsArrayOf,
+ parseAsInteger,
+ parseAsString,
+ parseAsStringEnum,
+} from "nuqs/server"
+import * as z from "zod"
+
+import { getFiltersStateParser, getSortingStateParser } from "@/lib/parsers"
+import { materialSearchView } from "@/db/schema/items"
+
+// MaterialGroup 검색 파라미터 캐시 정의
+export const searchParamsCache = createSearchParamsCache({
+ flags: parseAsArrayOf(z.enum(["advancedTable", "floatingBar"])).withDefault([]),
+ page: parseAsInteger.withDefault(1),
+ perPage: parseAsInteger.withDefault(10),
+
+ // 확장된 타입으로 정렬 파서 사용
+ sort: getSortingStateParser<typeof materialSearchView>().withDefault([
+ { id: "materialGroupCode", desc: false },
+ ]),
+
+ // 고급 필터
+ filters: getFiltersStateParser().withDefault([]),
+ joinOperator: parseAsStringEnum(["and", "or"]).withDefault("and"),
+ search: parseAsString.withDefault(""),
+});
+
+// 타입 내보내기
+export type GetMaterialGroupsSchema = Awaited<ReturnType<typeof searchParamsCache.parse>>;
generated by cgit v1.2.3 (git 2.39.1) at 2025-12-07 23:42:17 +0000