커스텀 앱 스튜디오 (Custom App Studio)¶
커스텀 앱 스튜디오는 Teknora EAM에 내장된 로우코드(Low-Code) 빌더입니다. 코드를 작성하지 않고도 데이터 모델과 목록 화면, 상세 화면을 포함한 완전히 새로운 "앱"을 추가할 수 있으며, 드래그 앤 드롭으로 레이아웃을 구성하고 시스템이 지원하는 11개 언어 중 어느 언어로도 번역할 수 있습니다.
주요 영역¶
화면은 세 영역으로 나뉩니다.
| 영역 | 기능 |
|---|---|
| 상단 바 (필드 유형 팔레트) | 현재 탭에 새 필드를 추가하는 버튼 —— 텍스트, 텍스트영역, 숫자, 날짜, 날짜 및 시간, 예/아니오, 선택, 링크, 테이블, 이미지 |
| 캔버스 (가운데) | 폼의 실시간(WYSIWYG) 미리보기 —— 여기서 보이는 것이 실행 시 사용자가 보게 될 모습과 정확히 동일합니다 |
| 속성 패널 (오른쪽) | 캔버스에서 클릭한 대상에 따라 자동으로 전환됩니다 —— 전체 폼, 탭, 섹션, 또는 필드 |
폼 속성¶
캔버스 위의 "Form Properties" 바를 클릭하면 앱 전체의 속성을 볼 수 있습니다.
- 제목: 앱의 기본 이름(사이드바와 상단 메뉴에 표시됩니다).
- 번역: 앱 이름을 11개 언어 중 원하는 만큼 번역합니다 —— 번역된 언어를 사용하는 사용자에게는 번역된 이름이 자동으로 표시됩니다.
- 아이콘: lucide-react 라이브러리의 아이콘 이름.
- 카테고리: "Custom Applications" 목록에서 앱이 분류되는 방식.
- 폼에 제목 표시줄 표시: 상세 화면 헤더에 앱 이름 + 기본 필드 + 설명 필드를 표시할지 여부를 제어합니다.
- 숨김: 삭제하지 않고 사이드바와 메뉴에서 앱을 숨깁니다.
- 첨부파일 허용: 상세 화면 헤더에 첨부파일 아이콘(📎)을 추가합니다.
- 워크플로우 허용: 현재는 의도를 나타내는 플래그일 뿐입니다 —— 아직 실제 워크플로우 엔진은 연결되어 있지 않습니다.
- 리포트 있음: 상세 화면에서 실제 "Print Reports" 버튼을 활성화하고, Report Designer에서 이 앱을 데이터 소스로 선택할 수 있게 합니다.
- 상태 변경 허용: 실제 상태 변경 시스템(자산 및 작업지시 화면에서 사용하는 것과 동일)을 활성화합니다 —— 상태 값이 나오는 도메인(예: ASSETSTATUS)을 선택하라는 메시지가 표시됩니다.
탭 (Tabs)¶
캔버스에서 아무 탭이나 클릭하여 속성을 편집합니다.
- 이름: 사용자에게 표시되는 탭 레이블.
- 아이콘: 선택 가능한 아이콘 그리드가 있는 드롭다운 —— 이 아이콘은 캔버스의 탭 이름 옆과 실행 시 상세 화면에 표시됩니다.
- 번역: 탭 이름을 원하는 언어로 번역합니다.
- 숨김: 내부 필드는 삭제하지 않고 탭 전체를 상세 화면에서 숨깁니다.
마지막 탭 옆의 "+"를 클릭하여 새 탭을 추가합니다.
섹션 (Sections)¶
각 탭은 섹션(필드 그룹)으로 나뉩니다. 섹션 제목을 클릭하면 다음을 할 수 있습니다.
- 이름을 변경하고 번역합니다.
- 열 개수를 설정합니다(1, 2, 또는 3) —— 이는 대략적인 모양이 아니라 폼이 실제로 구성되는 CSS Grid를 제어합니다.
- 섹션을 삭제합니다 —— 내부 필드는 삭제되지 않고 "미분류" 상태가 됩니다.
필드 (Fields)¶
필드를 클릭하여 다음을 편집합니다.
- 레이블과 필드 이름(필드 이름은 자동 생성되며 수정할 수 없습니다).
- 번역 —— 탭과 같은 원리입니다.
- 필드가 표시되는 탭과 섹션.
- 필수: 실제(네이티브 HTML) 유효성 검사를 활성화합니다 —— 값이 없으면 레코드를 저장할 수 없습니다.
- 목록에 표시: 이 열이 목록 화면에 표시되는지 여부를 제어합니다.
- 기본(Primary): 레코드의 "제목"을 나타내는 기본 필드 —— 본문에 반복되는 대신 상세 화면 헤더에 표시되며, 최초 저장 후에는 잠겨서(수정 불가) 편집할 수 없게 됩니다.
- 읽기 전용(Read Only): 필드가 표시만 되고 수동으로 편집할 수 없습니다 —— Action Script가 제어하는 필드(자동 계산되는 합계 등)에 유용합니다.
필드 유형이 숫자인 경우 추가 옵션이 나타납니다.
- 숫자 형식(Number Format): 정수(기본값), 소수(Float), 또는 통화 —— 소수 또는 통화를 선택하면 브라우저가 "유효하지 않음"으로 표시하지 않고 필드가 소수(450.75 등)를 정상적으로 받아들입니다.
필드 유형¶
단순한 유형(텍스트, 숫자, 날짜, 예/아니오, 목록 선택) 외에 두 가지 고급 유형이 있습니다.
링크 필드 (Link)¶
자유 텍스트 대신 다른 곳의 실제 레코드를 가리키는 필드입니다. 다음 중 하나를 가리키도록 선택할 수 있습니다.
- 도메인: 시스템의 모든 도메인.
- 시스템 테이블: 자산(Assets), 위치(Locations), 품목(Items), 인력(Labors) 등의 실제 테이블.
- 커스텀 객체: 사용자가 만든 다른 커스텀 앱.
"현재 사이트로 결과 필터링" 옵션도 있습니다 —— 활성화하면 검색 결과가 사용자와 동일한 사이트에 속한 결과만 반환합니다.
테이블 필드 (Table)¶
하나의 레코드 내에 여러 행을 추가할 수 있는 필드입니다(자산 화면의 부품 테이블과 유사). 정의하는 방법은 세 가지입니다.
- 열을 수동으로 정의: 자체 열을 추가합니다 —— 각 열은 텍스트/숫자/날짜/예-아니오/목록이거나, 실제 레코드를 가리키는 링크(자산 테이블에서 검색을 여는 "자산" 열 등)일 수도 있습니다.
- 객체에 연결: 테이블이 다른 커스텀 앱의 필드에서 자동으로 열을 가져옵니다.
- 도메인에 연결: 테이블이 특정 도메인의 값에서 행을 추가할 수 있게 합니다.
수동으로 정의한 각 열에는 추가 속성이 있습니다.
- 너비(Width): 상대적인 숫자입니다(ERPNext의 열 시스템과 유사) —— 너비 2인 열은 너비 1인 열보다 두 배의 공간을 차지하며, 고정된 픽셀 수가 아닙니다.
- 읽기 전용: 필드 수준과 같은 원리이지만 열 단위로 적용됩니다 —— 스크립트가 자동으로 계산하는 열(줄 합계 등)에 유용합니다.
- 목록 유형: 쉼표로 구분된 값을 입력하는 "Choices" 상자가 표시됩니다 —— 실행 시 이 열은 해당 값을 가진 드롭다운으로 표시됩니다.
- 숫자 형식: 열이 숫자인 경우 일반 숫자 필드와 마찬가지로 정수/소수/통화를 선택할 수 있습니다.
실전 단계¶
1. 새 커스텀 앱 만들기¶
"Custom Applications" 목록에서 새 앱을 클릭하고 이름과 카테고리를 입력한 다음, 상단 바에서 필드 추가를 시작합니다.
2. 폼 정리하기¶
필드를 드래그하여 순서를 바꾸고, 논리적인 탭과 섹션으로 그룹화하며, 각 섹션의 열 개수를 설정합니다.
3. 번역하기¶
서로 다른 언어를 사용하는 여러 사용자가 봐야 하는 필드/탭/섹션에 대해 "+ Add language"를 클릭하고 필요한 번역을 추가합니다 —— 11개 언어 모두를 번역할 필요는 없으며, 필요한 언어만 선택하면 됩니다.
4. 게시하기¶
완료되면 화면 상단의 Published(게시됨)를 클릭합니다 —— 게시되기 전까지 이 앱은 사용자의 사이드바나 상단 메뉴에 표시되지 않습니다.
5. 권한¶
역할(Roles) 화면에서 새 앱에 대한 읽기/생성/수정/삭제 권한을 추가해야 합니다 —— 각 커스텀 앱은 자동으로 권한 키(custom_<앱_이름>)를 부여받습니다.
게시하기 전에
게시하기 전에 모든 필수 필드(Required)와 기본 필드(Primary)가 올바르게 설정되었는지 확인하세요 —— 사용자가 데이터를 입력하기 시작한 후에 이를 변경하면 혼란을 일으킬 수 있습니다.
돌아가기: 커스텀 애플리케이션 ←








