...
EPA 사이트 메인 화면으로 돌아가 좌측 [도구]에서 i-AUD Designer를 클릭 합니다.
저장한 엑셀 파일을 마우스로 끌어 i-AUD Designer 도구 창 위에 놓습니다.
엑셀 보고서가 웹 화면에 그대로 반영된 것을 확인할 수 있습니다.
변환된 엑셀 화면이 웹 브라우저의 화면 크기에 맞게 자동으로 조정되도록 설정합니다.
웹으로 변환된 보고서를 선택하고 우측 속성 창 > Docking 영역 Left, Right, Bottom에 체크 합니다.
Border에서 Line Type을 'None'으로 설정하면 디자이너 화면에서 보고서의 테두리가 표시되지 않도록 설정 할 수 있습니다.
Step 5. 조회 조건 설정하기
- 연도별로 손익계산서를 웹에서 확인하기 위한 '년도' 조회 조건을 배치하고 설정해 보겠습니다.
- 조회할 연도를 선택할 수 있도록 '기준연도' 라벨과 달력을 배치한 뒤, 클릭 했을 때 데이터를 갱신할 수 있도록 '조회' 버튼을 추가합니다.
- 상단 UI Bot > Label을 클릭한 뒤 우측 속성 창 > Text 혹은 키보드 F2를 눌러 내용을 '기준연도'로 변경합니다.
- 달력을 배치하겠습니다.
- UI Bot > Calendar > Year를 클릭하고 알맞은 위치에 배치합니다.
- 이 때, 배치한 달력 컴포넌트의 'Name'을 엑셀에서 '이름정의'한 변수명과 동일하게 설정하면 달력에서 선택한 값이 조회 조건으로 사용됩니다.
- InitDate는 보고서를 처음 열었을 때 값을 설정할 수 있습니다.
- 마지막으로 '조회' 버튼을 배치해 보겠습니다.
- UI Bot > Button을 클릭하고 알맞은 위치에 배치합니다.
- 라벨과 마찬가지로 버튼의 Text를 '조회'로 수정한 뒤, Style에서 서식을 변경합니다.
이 때, BoxStyle을 활용하면 저장된 스타일을 빠르게 적용할 수 있습니다.
- '조회' 버튼을 클릭 했을 때, 설정한 날짜 변수 값으로 데이터가 갱신되도록 이벤트를 설정해 보겠습니다.
- 상단 Process Bot을 클릭해 Objects 목록에서 'Button'을 더블 클릭합니다.
Activities 탭으로 이동하여 'Refresh' 동작을 더블 클릭합니다.
'Button'을 클릭했을 때 'Refresh' 동작이 실행되도록 프로세스봇 창에 배치된 'Button'을 선택 후 마우스로 끌어 'Refresh' 동작에 연결합니다.
Refresh 모듈의 상세 버튼을 클릭한 뒤, 갱신할 컴포넌트로 'MXGrid'를 선택합니다.
(엑셀을 웹 화면에 끌어다 놓으면 MX-Grid 컴포넌트가 생성됩니다.)
이번에는 아래의 차트에 원하는 색상으로 표현되도록 색상 모듈을 연결합니다.
색상을 적용할 차트를 Objects 목록 에서 더블클릭 합니다.
-
'차트'가 데이터와 연결 되었을 때 '[Chart] 차트 색상 팔렛트 지정하기' 동작이 실행되도록 프로세스봇 창에 배치된 차트에 'OnDataBindEnd'을 선택 후 마우스로 끌어 '[Chart] 차트 색상 팔렛트 지정하기' 동작에 연결합니다.
[Chart] 차트 색상 팔렛트 지정하기' 모듈의 상세 버튼을 클릭한 뒤, 적용할 차트와 색상 값을 입력합니다.
* 색상값 : #195BAF, #2797FA, #66D8BD, #E2E6EA, #F98A45
- 프로세스봇을 저장하고 닫습니다.
- 보고서 설정이 완료되었습니다.
Step 6. 보고서 저장하기
- 완성된 보고서를 내 폴더에 저장합니다.
- EPA 사이트 메인 화면 좌측 [메뉴] > [개인]을 선택합니다.
- '돋보기' 버튼을 클릭해 보고서 목록을 새로 고침 하면 저장된 보고서를 확인할 수 있습니다.
- 연도를 바꾸고 '조회' 버튼을 클릭하면 데이터가 갱신 되는 것을 확인할 수 있습니다.
- 완성된 보고서를 내 폴더에 저장합니다.