대시보드 페이지
DashboardPage핵심 수치를 한눈에 보여주는 화면입니다. 위쪽 제목 아래로 지표 카드가 늘어서고, 그 밑에 요약 카드와 옆쪽 보조 패널이 놓입니다.
가져오기
tsx
import { DashboardPage } from "@tissue-ui/layout-react";미리보기
지표 + 본문
위쪽에 핵심 수치 카드를 늘어놓고 아래에 요약을 둡니다.
대시보드
매출₩12.4M+12%
주문284주간
활성 사용자1,284
최근 활동
지난 7일 요약 …
옆 보조 패널 포함
본문 옆에 할 일·알림 같은 보조 패널을 함께 보여줍니다.
운영 현황
대기7
처리 중12
완료128
처리량 추이
최근 30일 …
본문에 카드 그리드
본문 자리에 여러 요약 카드를 격자로 놓아 한 화면에 모읍니다.
분석
방문8,204+3%
가입312주간
유입 경로
검색 · 소셜 · 직접
인기 페이지
/pricing · /docs
기기
모바일 62% · 데스크톱 38%
지역
서울 · 부산 · 대구
슬롯 (4)
자리마다 넣을 수 있는 요소가 아래에 있습니다. 파란색은 눌러서 컴포넌트 문서로 갈 수 있고, 회색은 실제 컴포넌트가 아니라 직접 만들거나 다른 패키지에서 가져와 채우는 자리입니다.
metrics지표선택여러 개layout: grid
aside옆 패널선택여러 개layout: column
어떤 자리에 무엇을 넣을 수 있는지는
LAYOUT_MANIFEST 에 정리돼 있습니다. 코드에서 확인하려면 isElementAllowed(아키타입, 슬롯, 요소) 함수를 쓰세요.