e6949bdd67
- 품목 검색 모달에서 컬럼명 대신 라벨명 표시 * ItemSelectionModal에 columnLabels prop 추가 * ModalRepeaterTableComponent에서 columns 설정의 라벨 매핑 생성 * 테이블 헤더에 한글 라벨 표시 (품번, 품명, 규격, 재질 등) - 이미 추가된 품목은 검색 결과에서 완전 제외 * filteredResults로 중복 항목 필터링 * 회색 표시 대신 목록에서 아예 제거 * 사용자 친화적인 안내 메시지 추가 - 수주등록 버튼 크기 및 렌더링 수정 * 기본 크기를 200x40에서 120x40으로 변경 (다른 버튼과 통일) * h-full w-full 클래스 적용하여 컨테이너 크기에 맞게 렌더링 * style prop의 width/height 제거하여 Tailwind 클래스 우선순위 문제 해결 - 수주등록 모달에 판매 유형 및 무역 정보 추가 * 국내/해외 판매 선택 기능 * 해외 판매 시 무역 정보 섹션 표시 (인코텀즈, 결제조건, 통화 등) * 거래처 정보 확장 (담당자, 납품처, 납품장소) - 품목 반복 테이블 컬럼 조정 * 품목번호를 품번으로 변경 * 비고 컬럼 제거 * 규격, 재질 컬럼 추가 * 납품일을 납기일로 변경
129 lines
2.8 KiB
TypeScript
129 lines
2.8 KiB
TypeScript
"use client";
|
|
|
|
import React from "react";
|
|
import { ModalRepeaterTableComponent } from "@/lib/registry/components/modal-repeater-table";
|
|
import type {
|
|
RepeaterColumnConfig,
|
|
CalculationRule,
|
|
} from "@/lib/registry/components/modal-repeater-table";
|
|
|
|
/**
|
|
* 수주 등록 전용 품목 반복 테이블 컴포넌트
|
|
*
|
|
* 이 컴포넌트는 수주 등록 화면 전용이며, 설정이 고정되어 있습니다.
|
|
* 범용 ModalRepeaterTable과 달리 item_info 테이블만 조회하며,
|
|
* 수주 등록에 필요한 컬럼과 계산 공식이 미리 설정되어 있습니다.
|
|
*/
|
|
|
|
interface OrderItemRepeaterTableProps {
|
|
/** 현재 선택된 품목 목록 */
|
|
value: any[];
|
|
/** 품목 목록 변경 시 콜백 */
|
|
onChange: (items: any[]) => void;
|
|
/** 비활성화 여부 */
|
|
disabled?: boolean;
|
|
}
|
|
|
|
// 수주 등록 전용 컬럼 설정 (고정)
|
|
const ORDER_COLUMNS: RepeaterColumnConfig[] = [
|
|
{
|
|
field: "item_number",
|
|
label: "품번",
|
|
editable: false,
|
|
width: "120px",
|
|
},
|
|
{
|
|
field: "item_name",
|
|
label: "품명",
|
|
editable: false,
|
|
width: "180px",
|
|
},
|
|
{
|
|
field: "specification",
|
|
label: "규격",
|
|
editable: false,
|
|
width: "150px",
|
|
},
|
|
{
|
|
field: "material",
|
|
label: "재질",
|
|
editable: false,
|
|
width: "120px",
|
|
},
|
|
{
|
|
field: "quantity",
|
|
label: "수량",
|
|
type: "number",
|
|
editable: true,
|
|
required: true,
|
|
defaultValue: 1,
|
|
width: "100px",
|
|
},
|
|
{
|
|
field: "selling_price",
|
|
label: "단가",
|
|
type: "number",
|
|
editable: true,
|
|
required: true,
|
|
width: "120px",
|
|
},
|
|
{
|
|
field: "amount",
|
|
label: "금액",
|
|
type: "number",
|
|
editable: false,
|
|
calculated: true,
|
|
width: "120px",
|
|
},
|
|
{
|
|
field: "delivery_date",
|
|
label: "납기일",
|
|
type: "date",
|
|
editable: true,
|
|
width: "130px",
|
|
},
|
|
];
|
|
|
|
// 수주 등록 전용 계산 공식 (고정)
|
|
const ORDER_CALCULATION_RULES: CalculationRule[] = [
|
|
{
|
|
result: "amount",
|
|
formula: "quantity * selling_price",
|
|
dependencies: ["quantity", "selling_price"],
|
|
},
|
|
];
|
|
|
|
export function OrderItemRepeaterTable({
|
|
value,
|
|
onChange,
|
|
disabled = false,
|
|
}: OrderItemRepeaterTableProps) {
|
|
return (
|
|
<ModalRepeaterTableComponent
|
|
// 고정 설정 (수주 등록 전용)
|
|
sourceTable="item_info"
|
|
sourceColumns={[
|
|
"item_number",
|
|
"item_name",
|
|
"specification",
|
|
"material",
|
|
"unit",
|
|
"selling_price",
|
|
]}
|
|
sourceSearchFields={["item_name", "item_number", "specification"]}
|
|
modalTitle="품목 검색 및 선택"
|
|
modalButtonText="품목 검색"
|
|
multiSelect={true}
|
|
columns={ORDER_COLUMNS}
|
|
calculationRules={ORDER_CALCULATION_RULES}
|
|
uniqueField="item_number"
|
|
|
|
// 외부에서 제어 가능한 prop
|
|
value={value}
|
|
onChange={onChange}
|
|
disabled={disabled}
|
|
/>
|
|
);
|
|
}
|
|
|