fix(WEB): 견적 개소 목록 테이블 확장 및 견적서 미리보기 개선

LocationListPanel:
- 개소 목록 테이블 컬럼 확장 (층, 부호, 사이즈, 제품, 수량)
- 수정/삭제 버튼 추가
- 테이블 헤더 스타일 변경 (어두운 배경)
- 선택 행 스타일 변경 (blue → orange)

QuotePreviewContent:
- 공급자 정보 테이블 확장 (대표자, FAX, 종목 추가)
- 품종 → 종류 라벨 변경
- 소계/할인율 행 레이아웃 개선

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
유병철
2026-01-27 20:10:48 +09:00
parent a48937ae52
commit 9964ccbc1f
2 changed files with 88 additions and 49 deletions

View File

@@ -9,7 +9,7 @@
"use client";
import { useState, useCallback } from "react";
import { Plus, Upload, Download } from "lucide-react";
import { Plus, Upload, Download, Pencil, Trash2 } from "lucide-react";
import { toast } from "sonner";
import { Button } from "../ui/button";
@@ -455,19 +455,23 @@ export function LocationListPanel({
</div>
</div>
{/* 개소 목록 테이블 (간소화: 부호, 사이즈만) */}
{/* 개소 목록 테이블 */}
<div className="flex-1 overflow-auto">
<Table>
<TableHeader>
<TableRow className="bg-gray-50">
<TableHead className="w-[100px] text-center"></TableHead>
<TableHead className="text-center"></TableHead>
<TableRow className="bg-gray-800 text-white">
<TableHead className="text-center text-white"></TableHead>
<TableHead className="text-center text-white"></TableHead>
<TableHead className="text-center text-white"></TableHead>
<TableHead className="text-center text-white"></TableHead>
<TableHead className="text-center text-white"></TableHead>
{!disabled && <TableHead className="w-[80px] text-center text-white"></TableHead>}
</TableRow>
</TableHeader>
<TableBody>
{locations.length === 0 ? (
<TableRow>
<TableCell colSpan={2} className="text-center text-gray-500 py-8">
<TableCell colSpan={disabled ? 5 : 6} className="text-center text-gray-500 py-8">
</TableCell>
</TableRow>
@@ -476,18 +480,41 @@ export function LocationListPanel({
<TableRow
key={loc.id}
className={`cursor-pointer hover:bg-blue-50 ${
selectedLocationId === loc.id ? "bg-blue-100 border-l-4 border-l-blue-500" : ""
selectedLocationId === loc.id ? "bg-orange-100 border-l-4 border-l-orange-500" : ""
}`}
onClick={() => onSelectLocation(loc.id)}
>
<TableCell className="text-center">
<div className="font-medium text-blue-700">{loc.code}</div>
<div className="text-xs text-gray-500">{loc.productCode}</div>
</TableCell>
<TableCell className="text-center">
<div className="font-medium">{loc.openWidth}X{loc.openHeight}</div>
<div className="text-xs text-gray-500">{loc.floor} · {loc.quantity}</div>
</TableCell>
<TableCell className="text-center">{loc.floor}</TableCell>
<TableCell className="text-center font-medium">{loc.code}</TableCell>
<TableCell className="text-center">{loc.openWidth}X{loc.openHeight}</TableCell>
<TableCell className="text-center">{loc.productCode}</TableCell>
<TableCell className="text-center">{loc.quantity}</TableCell>
{!disabled && (
<TableCell className="text-center">
<div className="flex items-center justify-center gap-1">
<button
onClick={(e) => {
e.stopPropagation();
onSelectLocation(loc.id);
}}
className="p-1 hover:bg-gray-200 rounded"
title="수정"
>
<Pencil className="h-4 w-4 text-gray-600" />
</button>
<button
onClick={(e) => {
e.stopPropagation();
setDeleteTarget(loc.id);
}}
className="p-1 hover:bg-red-100 rounded"
title="삭제"
>
<Trash2 className="h-4 w-4 text-red-500" />
</button>
</div>
</TableCell>
)}
</TableRow>
))
)}