Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Table of Contents

...

Summary

BackOffice Builder는 32개의 입력 컴포넌트를 제공한다.

No

Component

Description

1

Boolean

0,1 데이터 처리가 필요한 경우 사용 (ex. 토글, 단일 체크박스, Y/N 버튼)

2

AutoComplete

입력 필드의 자동 완성 기능이 필요한 경우 사용

3

Text Input

텍스트 정보를 입력 받을 경우 사용

4

Textarea

멀티 라인 텍스트 인풋 박스로 긴 텍스트 입력이 필요 할 경우 사용

5

TextEditor

텍스트, 이미지, 영상, 표, 목록, 라인, 에디팅 편집 기능이 필요한 경우 사용

6

CodeEditor

코딩 기능이 필요한 경우 사용

7

JsonEditor

코딩 기능 중 Json이 필요한 경우 사용

8

Include

확인 필요

9

Checkbox

여러 데이터의 중복 선택이 필요한 경우 사용

10

Radio

여러 데이터 중 1개만 선택해야 하는 경우 사용

11

Cascader

연관된 데이터 세트에서 쉽게 선택할 수 있도록 다단계 분류가 적용된 셀렉트 박스

12

CascaderMultiple

13

Number

Image RemovedImage Added

14

Select

Image RemovedImage Added

창을 펼쳐 여러 정보를 확인하고 선택해야 하는 경우 사용

15

SelectTree

16

SelectModal

17

Password

18

Color

19

File

20

Image

21

Zipcode

22

Location

23

Map

24

GoogleMap

25

Date

Image RemovedImage Added

날짜 정보를 선택하여 입력해야 하는 경우 사용

26

Date Range

27

Time

Image RemovedImage Added

시간 정보를 선택하여 입력해야 하는 경우 사용

28

Time Range

29

Slider

30

Rate

Image RemovedImage Added

평가 정보를 표시해야 하는 경우 사용

31

Tags

32

HistoryTable

컨테이너와 차이 확인 필요

Common options

입력 컴포넌트는 다음과 같이 공통 옵션을 제공한다.

1. Size

사이즈 옵션은 Small, Default, Large 3가지로 제공한다.

2. Comment/Tooltip

라벨 뒤에 표시되는 툴팁과 Boolean 컴포넌트 하단에 표시되는 코멘트 기능을 제공한다.

...

3. Next Line Label

라벨의 위치를 컴포넌트 옆라인으로 변경 할 수 있다.

...

UI preveiw

...

Preview

1. 숫자형 : Integer

No

Elements

Description

1

Number Input

2

Rate

3

Slider

...

need check

No

Elements

Description

1

File

2

Image

3

ImageEditor

Status
colourRed
title

5. 선택형 : boolean/Reference

Switch, Radio, Select, Cascader, Checkbox, Transfer, Button

title

Image Removed

No

Elements

Description

1

Switch(Boolean)

2

Radio

3

Select

4

Select-Multiple

Status
colourRed
check name

5

Cascader

6

CascaderMultiple

7

Checkbox

8

Transfer

Image Removed

9

Button

...

Common options

입력 컴포넌트는 다음과 같이 공통 옵션을 제공한다.

1. Size

사이즈 옵션은 Small, Default, Large 3가지로 제공한다.

2. Comment/Tooltip

라벨 뒤에 표시되는 툴팁과 Boolean 컴포넌트 하단에 표시되는 코멘트 기능을 제공한다.

...

3. Next Line Label

라벨의 위치를 컴포넌트 옆라인으로 변경 할 수 있다.

...