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 54 Next »

셋팅화면

1. Create New

테이블 리스트 컴포넌트의 첫 셋팅 화면은 다음과 같다.

  • Target Node Type : 노드 타입을 선택하고, 데이터 연동 및 API사용 여부 설정

  • Table Title : 테이블명 입력 필드, 테이블명 노출 여부 설정

2. Set NodeType

노드타입을 선택하면 설정 옵션이 다음과 같이 출력된다.

3. Option Detail

각각의 옵션 상세 내용은 다음과 같다.

셋팅내용

Basic Set

기본 테이블은 Title, Table, Pagination, Event Buttons 4가지 엘리먼트로 구성되어 있다.

 

1. Table Field, Data

  • Target Node Type : 타겟 노드 타입

    • Enable List Fields : 테이블 필드 Value를 선택하여 테이블 생성 > List Field Instance Slot 테이블 셋팅

  • Data Sync : 연관 데이터 자동 설정

  • Use API : API 사용 여부

    • URL

    • Parameters

 

> List Field Instance Slot

 

 

2. Table Title

 

 

 

3. Pagination

  • Show Pagination

    • Pagination Position = {Top, Bottom, Both} NEED CHECK top 적용 안됨, Default값 필요(미설정 > bottom)

    • Pagination Align = {Left, Center, Right} NEW 페이지네이션에도 정렬 기능 필요(Default = right)

    • Show Total Count{ON/OFF}

 

 

4. Event Buttons

 

> List Button Instance Slot

 

 

 

 

ASIS Pagination과 Event Buttons 2가지 모두 ON일 경우, 서로 다른 라인에 배치됨

 TBD Pagination과 Event Buttons 2가지 모두 ON일 경우, 동일 라인에 배치하는 신규 옵션 추후 필요!

 

EX 백오피스 예시 화면

동일 라인 Align사용

다른 라인 Align사용

 

 

 

 

Function Set

기본 테이블에 Search, Draggable, Editable, Grouping, Summary 5가지 기능을 적용할 수 있다.

 

 

1. Search

NEED CHECK 검색바만 사용하고 싶은 경우 설정 없음, 검색 옵션 아래와 같이 변경 필요

  • Show Search{ON/OFF}

    • NEW SearchBar{ON/OFF}

    • NEW Search Form Filter{ON/OFF}

    • NEW Table Header Search{ON/OFF}

      • Show Sorter{ON/OFF}

      • Show Filter{ON/OFF}

    • Use Search Cache : 필드 필터와 폼검색 캐시 저장 사용

 

검색바{ON}, 폼서치 검색{ON}

검색바{ON}, 테이블 헤더 검색{ON}

 

 

  • Connect SearchForm : 검색 이력 저장, 동일한 검색 매개 변수가 들어 올 경우 검색

NEED CHECK Connect SearchForm{ON}설정 시

 

 > Search Field Instance Slot

> Search Form Field Instance Slot

 

 

 

2. Drag Sort

  • Draggable{ON/OFF}

    • NEW Use Drag icon{ON/OFF}

NEED CHECK 드래그 테이블은 Search, Pagination 기능과 함께 사용 할 수 없는지 확인 필요

ANT DESIGN 사용자가 드래그 사용 가능 여부를 쉽게 알 수 있도록 icon이 추가된 2번 타입 추가 제안

1번 Drag sorting (현재)

NEW 2번 Drag sorting with handler

 

 

3. Data Edit

  • Editable{ON/OFF}

    • NEW Editable Type = {Cells, Rows}

 

ANT DESIGN 2가지 에디팅 기능 ( NEEDCHECK 현재 2번만 있음, BUT 에디팅 기능 사용 불가 )

1번 Editable Cells

2번 Editable Rows

 

4. Field Grouping

List Field Instance Slot 테이블 셋팅에서 필드 1개씩 개별 셋팅

 

TOBE 그룹핑 여러개를 한번에 확인하며 진행할 수 있는 방법 필요

  • NEW Grouping{ON/OFF}

    • NEW Group Label : 필드 그룹명 텍스트 입력

    • NEW Select Fields : 그룹핑 할 필드 선택(다중선택)

Grouping table head

EX 5개의 테이블 필드가 있는 테이블 그룹핑

Fileds = {Name, Age, Street, Building, Door No.}

 

Group Lable = Field_1, Field_2, …

  1. Block = Building, Door No

  2. Address = Street, Block

  3. Other = Age, Address

 

EX 그룹핑 셋팅 제안 UI

  1. 그룹핑 ON 초기 화면

2. 그룹핑 1회 진행 이후 화면

 

5. Data Sum (Summary)

  • Show Summary

    • Enable Summary Fields : Sum 진행 할 테이블 필드 선택

 

데이터 합계 기능{ON}, 적용 필드{공급가, 판매가, 할인가}

 

 

UI Set : Options

 

 

1. Size

NEED CHECK 라지 사이즈가 없으면 삭제( ANT : size )

 

2. Show Empty Data First

 

3. Table Data Select : Radio, Checkbox

NEED CHECK 라디오, 체크박스 기능을 선택형으로 변경 필요

테이블 데이터 선택{Radio}

테이블 데이터 선택{Check}

 

  • moreLinkUrl 입력필드

 

 

5. Table Style

TOBE 테이블 보더/헤더/콜룸 스타일 그룹핑 필요

  • Bordered : Default{ON}

  • Fixed Header : Default{ON}

    • Height : Default = “600”

  • Fixed Columns : Default{ON}

 

 

※ 확인불가

1. show Info Icon{ON/OFF}

NEED CHECK 삭제 예정 확인 필요

>> “new”는 Field선택해서 텍스트 앞쪽에 아이콘 표시하는 기능으로 변경

  • NEW : 신규 등록 컨텐츠 존재시 신규 아이콘 표시

  • FILE : 파일첨부가 되어있는 컨텐츠에 아이콘 표시

2. Custom{ON/OFF}

NEED CHECK 삭제 예정 확인 필요

  • Top Field

  • Top Button API

  • Bottom Button Title

  • Bottom Button URL

  • Bottom Button API

  • Add Event Columns{Manage, Remove, Both}

  • Property Key

  • Property Field

  • Limit

  • Form Type

  • Show Search Time

 

 

4. List Scroll, List Search Form 등등(총6개)

NEED CHECK

  • List Scroll{ON/OFF} : NEED CHECK 스트롤 사용 여부 결정 OR Horizontal 스트롤 사용 여부??

  • List Scroll Height{ON/OFF} : NEED CHECK Vertical 스크롤 사용여부?? or 높이값 입력 필요????

  • List Search Form Field Size 입력필드

  • List Search Form Field Gutter 입력필드

  • List Default PageSize 입력필드

  • List Show PageSize Changer{ON/OFF}

 

5. Personalized Columns : 용도 확인 필요

NEED CHECK 테이블 필드 Show, 계정별 권한 부여하는 기능, 사용법 확인 필요 > LINK 프로젝트에서 권한 부여

 

6. Custom Card Style : 기능 실행X, 확인불가

 

Slot Set

1. List Field Instance Slot

: 1-2. 테이블 필드, 데이터

2. List Button Instance Slot

: 1-4. 이벤트 버튼

3. Search Field Instance Slot

: 2-1. 검색과 필터 > 검색바

4. Search Form Field Instance Slot

: 2-1. 검색과 필터 > 필터/쏠팅

 

 

 

  • No labels