Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

BackOffice Builder에서 제공하는 버튼 컴포넌트 종류와 버튼 UI 셋팅 방법을 간략히 소개한다.

...

  1. Link : 특정 링크 오픈

  2. Create : 신규 생성

  3. Delete : 선택 항목 삭제

  4. Save : 설정 내용을 저장

  5. Execute : 선택 내용 실행

  6. Modal : Modal 형태로 간단한 입력폼(답변 등록/수정) 출력

  7. Confirm : 확인창(Feedback)이 Modal 타입으로 출력

  8. Excel : 클릭 시 엑셀 파일 다운로드 실행

  9. UploadExcel : 엑셀 업로드 창이 Modal 타입으로 출력

  10. Select : ??

  11. Download : 다운로드

  12. Call >빌더에서 생성 불가

  13. Call Back Check > 빌더에서 생성불가

Status
colourBlue
titleex
버튼 컴포넌트 생성 화면

Modal

Confirm

Image AddedImage Added

Excel(Download)

UploadExcel

Image AddedImage Added

...

ButtonLink Type

링크 버튼은 특정 URL을 11가지 타입으로 URL 오픈 할 수 있다.

  1. Modal : Modal로 출력

  2. Page : Page로 이동

  3. Window : 새로운 Window 창으로 출력

  4. Page in Component :

  5. Page In Modal

  6. Page In Grid

  7. Close Modal

  8. Set ParentId

  9. Function

  10. Print

  11. PDF

Modal

...

Comfirm

...

Excel(Download)

...

UploadExcel

...

...

UI

ICE4에서는 만들 수 있는 버튼은 총 5가지 유형으로 구분된다.

...

Status
colourRed
titleneedcheck
고스트가 배경 투명 기능이라면, Dashed 스타일과 함께 사용 불가인지 확인 필요

Status
colourRed
titleneed check
Danger Button 칼라 확인 필요

...

Options_04. Icon, Hide Label/Border

...

버튼 컴포넌트 각각의 Feedback 메시지 옵션 사용 가능 여부는 아래와 같다.

Error

No

Component

Success

After Button Event

Before Button Event

Alert( Success | Error )

PopConfirm

Modal

1

Link

X

X

X

O

2

Create

O

O

O

O

3

Delete

O

O

O

O

4

Save

O

O

O

O

5

Execute

O

O

O

O

6

Modal

O

O

O

X

7

Confirm

O

O

O

X

8

Excel(Download)

X

X

X

X

9

UploadExcel

X

X

X

X

10

Select

X

X

X

X

11

Download

X

X

X

X

...

Status
colourRed
titleneedcheck
Alert 옵션 명칭 확인 필요(Ant와 맞지 않음)

Setting

Result

Image RemovedImage Added

https://ant.design/components/popconfirm/

...