...

2. Show Empty Data First

노리스트 테이블을 출력

3. Hide Title

...

...

테이블명을 노출/비노출 설정 StatuscolourRedtitleneed check 모든 컴포넌트는 이름(Title, Label)을 가지며, 공통적으로 Option에 “Hide OOO” 기능 추가로 통일 필요

4. Bordered

테이블 보더 노출/비노출 설정

...

• Header Height : 테이블 헤더 높이값 입력 필드

6. Fixed Columns

...

...

테이블의 특정 Col을 고정하는 기능으로, 테이블을 좌후로 스크롤하여도 선택한 Col이 고정되어 보인다.

• Select Fixed Columns Fields

  Status
  colour Yellow title new

  : Fixed Columns을 진행 할 필드를 선택

7. Custom Title Style

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

...

테이블에서 React-DND(Drag And Drop) 정렬 기능으로, 드래그 핸들러도 함께 사용 가능하다.

• Use Drag handler Field

  Status
  colour Yellow title new

  : 드래그 핸들러 아이콘이 출력되는 필드 사용 여부 설정

Status
colour Green title Tip

Drag handler Field

{ON}설정 시 테이블 각각의 Row에 드래그 핸들러 아이콘이 출력되어 사용자가 드래그 정렬 기능을 사용 할 수 있음을 좀 더 쉽게 인지할 수 있도록 한다.

Status
colour RedPurple title need checkant

기능 추가 : Drag sorting with handler

...

2. Editable

테이블 값을 바로 편집할 수 있는 기능으로, 에디팅 아이콘 필드가 테이블 첫번째 열에 추가된다. 에디팅 아이콘을 클릭하면, 해당 Row에 Data를 바로 편집할 수 있다.

3. Summary

써머리 필드 목록이 출력된다. 써머리 할 Value를 선택하면, 해당 필드 최하단에 Data Sum이 테이블 하단에 출력된다.

• Enable Summary Fields : Data Sum을 진행 할 필드 설정

...

테이블 헤더에 있는 필드를 그룹핑하여 보여주는 기능이다. 그룹핑 레벨 목록에서 원하는 레벨을 선택하고 그룹명과 그룹핑 할 필드를 선택한다. 아이콘을 클릭하여 그룹핑 레벨을 추가 할 수 있다.

• Grouping Level : 그룹핑 할 레벨을 셀렉트 박스에서 선택

• Group Label : 그룹명 입력 필드

Select Grouping Fields : 동일한 Level 내에서 그룹핑 할 필드 선택

Enable Table List Fields Grouping

Status
colour Yellow title new

: Enable Table List Fields 에서 선택한 Value 목록이 출력되며, Group Label 에 직접 그룹명을 입력한다.

...

...

6. Show MoreLink

테이블 상단에 [more] 을 추가하여 링크로 더 많은 정보를 사용자에게 전달 할 수 있다.

...

Status
colour Green title Tip

Data Select Field

테이블 첫번째 Col에 데이터 선택 필드가 생성되며, 선택 타입을 2가지로 선택 가능하다.

- Radio : 라디오 버튼 타입으로 데이터 선택 필드 생성, 단일 선택만 허용할 경우 사용

- Checkbox : 체크박스 타입으로 데이터 선택 필드 생성, 다중 선택을 허용할 경우 사용

...

3. Use Same Line

Status
colour Yellow title new

...

자주 쓰이는 CSS 목록에서 원하는 스타일을 선택하는 방법이다.

...

...

To be deleted?

Status
colour Red title need check

...