nv-list-body

Quasar panel 컴포넌트를 기반으로 한 커스텀 래퍼로, 검색 결과 정보를 상단에 표시하고, 페이지네이션 수 선택 및 확장/설정 기능을 제공합니다.

Props

이름	타입	기본값	설명
query	Object	{}	현재 페이지 쿼리 데이터입니다.
list	Object	{}	리스트 데이터 (totalCount, dataFrom, dataTo를 포함해야합니다).
grid	Object		그리드 컴포넌트 참조, openConfig 메소드를 호출합니다.
data-per-page-list	Object	{}	페이지 당 항목 수 옵션 리스트입니다.
body-class	String	'vertical-stack height-100'	panel 내부의 body 스타일 클래스 입니다.
config-expand	Boolean	true	확장 버튼 활성화 여부를 설정합니다.
show-header	Boolean	true	상단 헤더 표시 여부를 설정합니다.
view-expand	Boolean	false	기본 확장 여부를 설정합니다.

Slot

이름	설명
(default)	내용 영역
footer-left	하단 왼쪽 영역 (왼쪽 정렬)
footer-center	하단 가운데 영역 (가운데 정렬)
footer-right	하단 오른쪽 영역 (오른쪽 정렬)

기본

<nv-list-body :list="list" :query="query" :dataPerPageList="dataPerPageList" @dataPerPageChanged="retrieve" :grid="$refs.UserGrid" v-if="loaded">
</nv-list-body>

슬롯 추가

content

footer left

footer center

footer right

<nv-list-body :list="list" :query="query" :dataPerPageList="dataPerPageList" @dataPerPageChanged="retrieve" :grid="$refs.UserGrid" v-if="loaded">
    <template #footer-left>
        footer left
    </template>
    <template #footer-center>
        footer center
    </template>
    <template #footer-right>
        footer right
    </template>
</nv-list-body>