실습 예제 |List-Grid를 이용한 회원 정보 관리 화면 |
---|
|
Step 1. 화면 양식 작성하기
1.1 템플릿 가져오기
템플릿 파일을 활용하여 화면을 제작합니다.
- 포털에서 템플릿 보고서를 오픈한 후, 보고서 우측 상단의 다른 이름으로 저장 버튼을 클릭합니다.
- 템플릿 위치 : 교육 > 기본 > Template > '4. 회원 관리 화면'
- 보고서를 실습결과 폴더에 저장합니다.
- 포털에서 저장한 보고서를 실행하고, 우측 상단의 [보고서 편집] 버튼 클릭하여 i-AUD Designer 창을 실행합니다.
1.2 제목 만들기
- 템플릿 상단의 Label을 클릭하여 선택한 후 우측의 속성 편집 영역에서 Text 속성을 설정합니다.
- Text : 회원 정보 관리
Step 2. List-Grid 속성 변경하기
List-Grid 컨트롤의 속성을 변경합니다.
- List-Grid 컨트롤을 클릭한 후 우측의 속성 편집 영역에서 그리드의 속성을 설정합니다.
- DataSource : DS
- AutoRefresh 활성화
- List-Grid의 필드 속성을 설정하기 위해 그리드를 마우스 우 클릭하여 디자인 설정 창을 실행합니다.
- 화면에서 사용하지 않을 필드의 표시 설정을 비활성화하여 항목을 숨기기 합니다.
- C_DAY, C_USER, U_DAY, U_USER 표시 비활성화
- ETC를 제외한 모든 항목을 선택 한 후 텍스트 정렬을 'Center'로 설정합니다.
ETC 항목의 너비를 변경합니다.
- ETC 너비 : 100 Star
설정 > 헤더 보기 > Row 체크박스를 해제하여 Row를 숨기기합니다.
- 실행 버튼을 클릭하여 List-Grid에 데이터가 정상적으로 출력되는지 확인합니다.
- 데이터의 길이에 맞게 필드의 크기를 조정합니다.
Step 3. 버튼 컨트롤 생성하기
보고서에서 CRUD 동작을 설정한 버튼 컨트롤을 생성합니다.
상단 메뉴 영역에서 UI BOT > Button > Button 을 클릭해 Button 컨트롤을 생성합니다.
버튼 컨트롤의 속성을 변경합니다.
- NAME : BTN_RE
- TEXT : 조회
버튼 컨트롤의 스타일을 설정합니다.
- Style : BoxStyle - BUTTON_01
버튼 컨트롤 위에 마우스 커서를 올렸을 때의 스타일을 설정합니다.
- Style : MouseOver - MGT_BUTTON
- Style 속성을 적용한 Button 컨트롤을 복사하여 상단에 배치합니다.
생성한 버튼 컨트롤들의 속성을 변경합니다.
- Name : BTN_ADD, Text : 추가
- Name : BTN_DEL, Text : 삭제
- Name : BTN_SV, Text : 저장
- Button 컨트롤들을 마우스로 드래그하여 선택한 뒤, 속성을 일괄 변경합니다.
- Docking : Right 체크
- KeepSize 활성화
Step 4. CRUD 설정하기
4.1 실행 계획 디자인
데이터 CRUD를 위해 DB Upload Plan을 설정합니다.
DB Bot > DB Upload Plan을 선택하여 실행 계획 디자인 창을 실행합니다.
데이터 컨트롤 선택 영역에서 DataGrid를 선택하여 데이터 컨트롤을 연결합니다.
참고 : 컬럼 연결
선택한 데이터 컨트롤에 연결된 테이블과 실행 계획 디자인의 테이블이 동일하면 컬럼 연결은 자동으로 됩니다.
그렇지 않은 경우 컬럼 연결 셀을 더블 클릭하여 데이터 컨트롤 상의 컬럼과 연결합니다.
데이터 유형에 맞춰 MBR_NO 컬럼의 Key 유형을 Primary로 변경합니다.
데이터 유형을 변경하여 데이터 생성 및 수정 시 UserCode가 저장되도록 설정합니다.
- C_USER : UserCode
- U_USER : UserCode
신규 데이터만 저장할 컬럼과 업데이트 데이터만 저장할 컬럼의 저장 모드를 변경합니다.
- C_DAY : Insert Only
- C_USER : Insert Only
- U_DAY : Update Only
- U_USER : Update Only
4.2 Process Bot 설정
- 상단의 Process Bot을 클릭하여 프로세스 봇 창을 실행합니다.
- 좌측 목록에서 Report 를 더블 클릭 합니다.
- Activities 탭을 클릭하고, Modules > 기능별 > 데이터 저장 > '데이터 그리드 CRUD 기능(실행 계획)' 모듈을 더블 클릭합니다.
- '데이터 그리드 CRUD 기능(실행 계획)' 모듈에서 파라미터 설정 아이콘()을 클릭후, 세부 옵션을 설정합니다.
- 1. DataGrid (DataGrid)
- 2. BTN_ADD
- 3. BTN_DEL
- 4. BTN_SV
- 5. BTN_RE
- 6. PLAN_1
저장 후, 보고서가 정상적으로 작동하는지 확인합니다.