다크모드
관리비 화면의 탭 사용법
관리비 화면의 탭은 위치에 따라 역할과 모양이 다릅니다. ✅구현
페이지 제목 바로 아래의 탭
페이지 제목과 업무 정보 아래의 회색 plane 탭은 왼쪽 메뉴에서 선택한 현재 업무 안의 화면만 이동합니다. 왼쪽 메뉴의 형제 업무를 헤더에 다시 표시하지 않습니다.
정기 관리비,중간정산,사용량 입력처럼 하위 화면이 하나인 업무는일반탭 하나만 표시합니다. 다른 업무로 이동할 때는 왼쪽 메뉴를 사용합니다.설정 → 기본 설정에서는일반,연체료,수납을 전환합니다.설정 → 부과 항목에서는일반,그룹을 전환합니다.- 관리비 회차 콘솔에서는
개요,부과,조정,청구,공지,세금계산서,수납,이월,연체료,선수금·가수금,보고서를 하나의 업무 탭 줄에서 이동합니다. - 업무군 경계는 데스크톱에서 가는 구분선으로만 표시하며, 별도의 범위 선택 단계는 만들지 않습니다.
- 선택한 탭은 파란 강조 배경으로 표시됩니다.
- 휴대전화에서는 탭 줄을 좌우로 밀어 이동합니다. 현재 화면의 탭은 진입할 때 탭 줄의 시작 쪽에 자동으로 보입니다.
미구현 배지가 붙고 색이 흐린 탭은 앞으로 제공할 위치를 미리 보여 주는 항목입니다. 마우스를 올리면 미구현 상태를 확인할 수 있으며 눌러도 빈 화면으로 이동하지 않습니다. ⚠️부분
콘텐츠 안의 탭
카드나 작업 영역 안의 회색 plane 탭은 현재 페이지를 떠나지 않고 같은 업무의 보기만 바꿉니다. 페이지 헤더 탭과 같은 기본 구조를 사용하지만, 위치와 라벨이 탐색 범위를 알려 줍니다.
예를 들어 부과 화면의 부과산정, 유닛명세, 계약명세, 멤버명세 보기는 청구 화면의 계약, 유닛, 멤버 보기와 같은 형태를 사용합니다. 회색 탭 plane을 4px 여백의 흰색 pill 표면이 감싸고, 아래 알림·도구·표는 별도의 흰 작업 카드에 표시됩니다. 따라서 보기 전환과 실제 업무 영역을 구분할 수 있고, 작업 카드 헤더에는 화면 제목이나 기능을 추가할 수 있습니다. ✅구현
현재 적용 범위
- ✅ 우리 선도 제품: 관리비 목록의 단일 로컬 탭, 기본 설정·부과 항목 로컬 탭, 관리비 콘솔 공통 탭, 정기 관리비
부과하위 탭 - ✅ 현재 실제 제품 비교 화면: 빌링 목록, 빌링 콘솔, 콘솔
부과하위 탭 - ⚠️ 그 밖의 관리비 하위 화면은 페이지별 대조 순서에 따라 같은 원칙으로 정리합니다.