쿼리 에러 수정

Reviewed-on: http://39.117.244.52:3000/kjs/ERP-node/pulls/191

backend-node/src/services/tableManagementService.ts

@@ -3071,7 +3071,7 @@ export class TableManagementService {
           ttc.column_name as "columnName",
           COALESCE(cl.column_label, ttc.column_name) as "displayName",
           ttc.input_type as "inputType",
-          COALESCE(ttc.detail_settings, '{}'::jsonb) as "detailSettings",
+          COALESCE(ttc.detail_settings::jsonb, '{}'::jsonb) as "detailSettings",
           ttc.is_nullable as "isNullable",
           ic.data_type as "dataType",
           ttc.company_code as "companyCode"

frontend/app/(main)/screens/[screenId]/page.tsx

@@ -225,12 +225,12 @@ export default function ScreenViewPage() {
         const containerWidth = containerRef.current.offsetWidth;
         const containerHeight = containerRef.current.offsetHeight;
 
-        // 가로/세로 비율 중 작은 것을 선택하여 화면에 맞게 스케일 조정
-        // 하지만 화면이 컨테이너 전체 너비를 차지하도록 하기 위해 가로를 우선시
+        // 가로를 기준으로 스케일 조정 (세로는 스크롤 허용)
+        // ScreenList.tsx와 동일한 방식으로 가로를 꽉 채움
         const scaleX = containerWidth / designWidth;
         const scaleY = containerHeight / designHeight;
-        // 가로를 우선으로 하되, 세로가 넘치지 않도록 제한
-        const newScale = Math.min(scaleX, scaleY);
+        // 가로 기준으로 스케일 설정 (ScreenList와 일관성 유지)
+        const newScale = scaleX;
 
         setScale(newScale);
         // 컨테이너 너비 업데이트

frontend/components/admin/UserFormModal.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import React, { useState, useCallback, useEffect, useMemo } from "react";
-import { ResizableDialog, ResizableDialogContent, ResizableDialogHeader, DialogTitle } from "@/components/ui/resizable-dialog";
+import { ResizableDialog, ResizableDialogContent, ResizableDialogHeader, ResizableDialogTitle } from "@/components/ui/resizable-dialog";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";

frontend/components/admin/UserHistoryModal.tsx

@@ -154,7 +154,7 @@ export function UserHistoryModal({ isOpen, onClose, userId, userName }: UserHist
   return (
     <ResizableDialog open={isOpen} onOpenChange={onClose}>
       <ResizableDialogContent className="flex max-h-[90vh] max-w-6xl flex-col">
-        <DialogHeader className="flex-shrink-0">
+        <ResizableDialogHeader className="flex-shrink-0">
           <ResizableDialogTitle className="flex items-center gap-2">
             <User className="h-5 w-5" />
             사용자 관리 이력

frontend/components/common/AlertModal.tsx

@@ -4,11 +4,11 @@ import React from "react";
 import {
   Dialog,
   DialogContent,
-  
-  
   DialogHeader,
-  
-} from "@/components/ui/resizable-dialog";
+  DialogTitle,
+  DialogDescription,
+  DialogFooter,
+} from "@/components/ui/dialog";
 import { Button } from "@/components/ui/button";
 import { CheckCircle, XCircle, AlertTriangle, Info } from "lucide-react";
 
@@ -76,16 +76,16 @@ export function AlertModal({
         <DialogHeader>
           <div className="mb-2 flex items-center gap-3">
             <IconComponent className={`h-6 w-6 ${config.iconColor}`} />
-            <ResizableDialogTitle className={config.titleColor}>{title}</ResizableDialogTitle>
+            <DialogTitle className={config.titleColor}>{title}</DialogTitle>
           </div>
-          <ResizableDialogDescription className="text-left">{message}</ResizableDialogDescription>
+          <DialogDescription className="text-left">{message}</DialogDescription>
         </DialogHeader>
 
-        <ResizableDialogFooter>
+        <DialogFooter>
           <Button onClick={handleConfirm} className="w-full">
             {confirmText}
           </Button>
-        </ResizableDialogFooter>
+        </DialogFooter>
       </DialogContent>
     </Dialog>
   );

frontend/components/screen/RealtimePreviewDynamic.tsx

@@ -208,8 +208,20 @@ export const RealtimePreviewDynamic: React.FC<RealtimePreviewProps> = ({
     : {};
 
   // 컴포넌트 기본 스타일 - 레이아웃은 항상 맨 아래
-  // 너비 우선순위: style.width > 조건부 100% > size.width (픽셀값)
+  // 너비 우선순위: table-list 100% > style.width > 조건부 100% > size.width (픽셀값)
   const getWidth = () => {
+    // 🔥 최우선: table-list는 항상 100% 사용 (화면 전체를 채움)
+    if (component.componentConfig?.type === "table-list") {
+      console.log("📏 [getWidth] 100% 사용 (table-list 최우선):", {
+        componentId: id,
+        label: component.label,
+        positionX: position.x,
+        hasStyleWidth: !!componentStyle?.width,
+        styleWidth: componentStyle?.width,
+      });
+      return "100%";
+    }
+
     // 1순위: style.width가 있으면 우선 사용 (퍼센트 값)
     if (componentStyle?.width) {
       console.log("✅ [getWidth] style.width 사용:", {
@@ -252,16 +264,6 @@ export const RealtimePreviewDynamic: React.FC<RealtimePreviewProps> = ({
       return width;
     }
 
-    if (component.componentConfig?.type === "table-list") {
-      const width = `${Math.max(size?.width || 120, 120)}px`;
-      console.log("📏 [getWidth] 픽셀 사용 (table-list):", {
-        componentId: id,
-        label: component.label,
-        width,
-      });
-      return width;
-    }
-
     const width = `${size?.width || 100}px`;
     console.log("📏 [getWidth] 픽셀 사용 (기본):", {
       componentId: id,

frontend/components/screen/ScreenDesigner.tsx

@@ -2565,6 +2565,7 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
                   labelColor: "#212121",
                   labelFontWeight: "500",
                   labelMarginBottom: "6px",
+                  width: `${(calculatedGridColumns / (layout.gridSettings?.columns || 12)) * 100}%`, // 퍼센트 너비
                 },
                 componentConfig: {
                   type: componentId, // text-input, number-input 등
@@ -2639,6 +2640,7 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
                 labelColor: "#000000", // 순수한 검정
                 labelFontWeight: "500",
                 labelMarginBottom: "8px",
+                width: `${(calculatedGridColumns / (layout.gridSettings?.columns || 12)) * 100}%`, // 퍼센트 너비
               },
               componentConfig: {
                 type: componentId, // text-input, number-input 등

frontend/components/screen/templates/NumberingRuleTemplate.ts

@@ -76,3 +76,4 @@ export const numberingRuleTemplate = {
 };
 
 
+

frontend/lib/api/numberingRule.ts

@@ -134,3 +134,4 @@ export async function resetSequence(ruleId: string): Promise<ApiResponse<void>>
 }
 
 
+

동적_테이블_접근_시스템_개선_완료.md

@@ -376,3 +376,4 @@ interface TablePermission {
 **이제 테이블을 만들 때마다 코드를 수정할 필요가 없습니다!**
 
 
+