fix(WEB): 견적 개소 목록 테이블 확장 및 견적서 미리보기 개선
LocationListPanel: - 개소 목록 테이블 컬럼 확장 (층, 부호, 사이즈, 제품, 수량) - 수정/삭제 버튼 추가 - 테이블 헤더 스타일 변경 (어두운 배경) - 선택 행 스타일 변경 (blue → orange) QuotePreviewContent: - 공급자 정보 테이블 확장 (대표자, FAX, 종목 추가) - 품종 → 종류 라벨 변경 - 소계/할인율 행 레이아웃 개선 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -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>
|
||||
))
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user