Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 40 Next »

폼(Form)은 사용자가 정보를 입력하거나 선택 할 수 있도록, 입력형 기본 컴포넌트를 컨트롤 엘리먼트(control elements)로 사용하고 있다. 데이터 범위 관리 기능, 데이터 수집, 검증 및 스타일 기능을 포함하고 있다.

Setup

1. Create New

폼 컴포넌트를 추가하면 다음과 같이 기본 셋팅 화면이 출력된다. Data를 입력 받을 Target Type, Form Type, 타이틀 입력, 자동 저장, API와 Parent ID 사용 여부를 설정 할 수 있다.

  • Auto Save : 일정 간격으로 편집 중 내용을 자동 저장하는 기능

  • Form Type : 등록폼, 수정폼, 상세뷰 3가지 타입 제공

NEED CHECK Use Sub Tab

TIP Use Sub Tab

When we turn on the “Enable Tab Fields” will display and it filter with value types are PART,PARTS,REFERENCE,REFERENCES,PARENT,REFERENCED,CHILDREN 

2. Set Target Type

Option Detail

폼 옵션 설정 영역의 Tab 메뉴별 상세 내용은 다음과 같다.

  • Events : 버튼 설정 영역

  • Function : 폼에 적용 가능한 기능 설정 영역

  • Style : 기본적으로 셋팅된 폼 스타일 변경 또는 커스터 마이징 스타일 등을 설정하는 영역

Events Option

1. Event Buttons

이벤트 버튼 목록과 함께 버튼 위치와 정렬 설정 옵션이 출력된다.

  • Enable List Event Buttons : 이벤트 버튼 목록(Create, Reset, Recall, Update, Delete, List)

  • Event Buttons Position : 버튼 위치 선택(Top, Bottom, Both)

  • Event Buttons Align : 버튼 정렬 선택(Left, Center, Right)

NEW TBD Enable List Event Buttons [Reset], [Recall]

TIP Event Buttons for Form

- Reset : 폼에 입력된 데이터를 모두 초기화

- Recall : 가장 최근 저장된 데이터를 불러와 폼에 출력

2. Use Extra Buttons NEED CHECK

제공하는 이벤트 버튼 외에 추가로 버튼을 생성하여 사용할 수 있다. Extra Buttons{ON}으로 설정하면 하단에 Extra Button Table 영역이 출력된다. (plus) 아이콘을 클릭하고 원하는 버튼 컴포넌트를 추가할 수 있다.

단, 테이블 리스트와는 달리 폼(Form)에서 사용되는 Extra Buttons은 테이블 영역 외부에 배치 되며, 기본 이벤트 버튼과 마찬가지로 버튼 위치와 정렬을 선택 할 수 있다.

  • Use Same Line : 기본 이벤트 버튼과 함께 엑스트라 버튼을 같은 라인에 배치하는 기능이다.

  • Extra Buttons Position : 버튼 위치 선택(Top, Bottom, Both)

  • Extra Buttons Align : 버튼 정렬 선택(Left, Center, Right)

Function Option

1. History

Style Option

1. Size

폼 사이즈 선택(Small, Default, Large)

2. Layout

폼 엘리먼트들의 레이아웃 스타일 선택(Vertical, Horizontal, Inline) NEED CHECK "INLINE"

3. Elements Arrange NEW

폼 구성 요소 배열 스타일 선택(1 per line, 2 per line)

1 Per Line : 1 줄에 최대 1개 엘리먼트씩 배열

2 Per Line : 1 줄에 최대 2개 엘리먼트씩 배열

4. Bordered

폼 보더 노출/비노출 설정

5. Hide Title CHANGE "SHOW TITLE"

폼 타이틀 노출/비노출 설정

6. Field Size / Field Gutter NEED CHECK

https://ant.design/components/grid/#components-grid-demo-gutter

7. Custom Title Style

폼 타이블 스타일을 설정하는 기능으로 Title Style Set이 출력된다.

8. Custom Card Style

엘리먼트 나열 형태를 카드 스타일로 변경 할 수 있다. Card Style Set으로 설정한다.

  • No labels