페이지 트리

버전 비교

  • 이 줄이 추가되었습니다.
  • 이 줄이 삭제되었습니다.
  • 서식이 변경되었습니다.

...

정보
title실습 제작 버전 안내

Release No : 7.0.500.20240516


실습 예제 |List-Grid를 이용한 회원 정보 관리 화면

위젯 연결기
width1100
urlhttps://www.youtube.com/watch?v=nDJIPpbTCvY
height600


Step 1. 화면 양식 작성하기


1.1 템플릿 가져오기

템플릿 파일을 활용하여 화면을 제작합니다. 

  1. 포털에서 템플릿 보고서를 오픈한 후, 보고서 우측 상단의 다른 이름으로 저장 버튼을 클릭합니다.
    • 템플릿 위치 : 교육 > 기본 > Template > '4. 회원 관리 화면' 


  2. 보고서를 실습결과 폴더에 저장합니다.


  3. 포털에서 저장한 보고서를 실행하고, 우측 상단의 [보고서 편집] 버튼 클릭하여 i-AUD Designer 창을 실행합니다.


1.2 제목 만들기

  1. 템플릿 상단의 Label을 클릭하여 선택한 후 우측의 속성 편집 영역에서 Text 속성을 설정합니다.
    • Text : 회원 정보 관리


Step 2. List-Grid 속성 변경하기

List-Grid 컨트롤의 속성을 변경합니다.

...

  1. List-Grid 컨트롤을 클릭한 후 우측의 속성 편집 영역에서 그리드의 속성을 설정합니다.
    • DataSource : DS
    • AutoRefresh 활성화


  2. List-Grid의 필드 속성을 설정하기 위해 그리드를 마우스 우 클릭하여 디자인 설정 창을 실행합니다.


  3. 화면에서 사용하지 않을 필드의 표시 설정을 비활성화하여 항목을 숨기기 합니다.
    • C_DAY, C_USER, U_DAY, U_USER 표시 비활성화


  4. ETC를 제외한 모든 항목을 선택 한 후 텍스트 정렬'Center'로 설정합니다.


  5. ETC 항목의 너비를 변경합니다.

    • ETC 너비 : 100 Star

  6. 설정 > 헤더 보기 > Row 체크박스를 해제하여 Row를 숨기기합니다.


  7. 실행 버튼을 클릭하여 List-Grid에 데이터가 정상적으로 출력되는지 확인합니다.


  8. 데이터의 길이에 맞게 필드의 크기를 조정합니다.


Step 3. 버튼 컨트롤 생성하기

보고서에서 CRUD 동작을 설정한 버튼 컨트롤을 생성합니다.

  1. 상단 메뉴 영역에서 UI BOT > Button > Button 을 클릭해 Button 컨트롤을 생성합니다.



  2.  버튼 컨트롤의 속성을 변경합니다.

    • NAME : BTN_RE
    • TEXT : 조회

  3. 버튼 컨트롤의 스타일을 설정합니다.

    • Style : BoxStyle - BUTTON_01



  4. 버튼 컨트롤 위에 마우스 커서를 올렸을 때의 스타일을 설정합니다.

    • Style : MouseOver - MGT_BUTTON

  5. Style 속성을 적용한 Button 컨트롤을 복사하여 상단에 배치합니다.


  6. 생성한 버튼 컨트롤들의 속성을 변경합니다.

    • Name : BTN_ADD, Text : 추가
    • Name : BTN_DEL, Text : 삭제
    • Name : BTN_SV, Text : 저장


  7.  Button 컨트롤들을 마우스로 드래그하여 선택한 뒤, 속성을 일괄 변경합니다.
    • Docking : Right 체크
    • KeepSize 활성화


Step 4. CRUD 설정하기


4.1 실행 계획 디자인

데이터 CRUD를 위해 DB Upload Plan을 설정합니다.

  1. DB Bot > DB Upload Plan을 선택하여 실행 계획 디자인 창을 실행합니다.


  2. 데이터 컨트롤 선택 영역에서 DataGrid를 선택하여 데이터 컨트롤을 연결합니다.


    참고사항
    title참고 : 컬럼 연결

    선택한 데이터 컨트롤에 연결된 테이블과 실행 계획 디자인의 테이블이 동일하면 컬럼 연결은 자동으로 됩니다.

    그렇지 않은 경우 컬럼 연결 셀을 더블 클릭하여 데이터 컨트롤 상의 컬럼과 연결합니다.


  3. 데이터 유형에 맞춰 MBR_NO 컬럼의 Key 유형Primary로 변경합니다. 


  4. 데이터 유형을 변경하여 데이터 생성 및 수정 시 UserCode가 저장되도록 설정합니다.

    • C_USER : UserCode
    • U_USER : UserCode



  5. 신규 데이터만 저장할 컬럼과 업데이트 데이터만 저장할 컬럼의 저장 모드를 변경합니다.

    • C_DAY : Insert Only
    • C_USER : Insert Only
    • U_DAY : Update Only
    • U_USER : Update Only


4.2 Process Bot 설정

  1. 상단의 Process Bot을 클릭하여 프로세스 봇 창을 실행합니다.


  2. 좌측 목록에서 Report(Open)을 선택하고, 우측 동작 목록에서 Module 동작을 드래그하여 배치한 뒤, 더 보기 버튼을 눌러 모듈 설정 창을 실행합니다.


  3. 카테고리 > 기능별 > 데이저 저장 > '데이터 그리드 CRUD 기능(실행 계획)' 모듈을 선택한 후, 세부 옵션을 설정합니다.

    • 1. DataGrid (DataGrid)
    • 2. BTN_ADD
    • 3. BTN_DEL
    • 4. BTN_SV
    • 5. BTN_RE
    • 6. PLAN_1

...