From aef6b0c91d9a7729f6080035c0b6f5d86f0d9750 Mon Sep 17 00:00:00 2001 From: Yesol Choi Date: Wed, 28 May 2025 16:48:41 +0900 Subject: [PATCH] =?UTF-8?q?com=20:=20pagination=20=EC=B6=94=EA=B0=80=20?= =?UTF-8?q?=ED=95=98=EA=B8=B0=20,=20=EA=B2=80=EC=83=89=20=EA=B8=B0?= =?UTF-8?q?=EB=8A=A5=EA=B9=8C=EC=A7=80=20=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/app/priceManagement.vue | 71 +++++++++++++++++-------------- 1 file changed, 39 insertions(+), 32 deletions(-) diff --git a/src/pages/app/priceManagement.vue b/src/pages/app/priceManagement.vue index 3320660..fb919e5 100644 --- a/src/pages/app/priceManagement.vue +++ b/src/pages/app/priceManagement.vue @@ -14,8 +14,9 @@ const masks = ref({ }) const totalItems = ref(0) // 전체 아이템 수 -const currentPage = ref(0) // 현재 페이지 +const currentPage = ref(1) // 현재 페이지 const itemsPerPage = 8 +const totalPages = ref(1) const searchParamsList = reactive({ cateCd : '', //분야코드 @@ -38,32 +39,25 @@ const params = reactive({ async function getPriceListData(){ const today = new Date() + searchParamsList.regSdt = new Date().setDate(today.getDate() - 30) + searchParamsList.regEdt = new Date().setDate(today.getDate()) - const before30 = new Date() - before30.setDate(today.getDate() - 30) - - const after30 = new Date() - after30.setDate(today.getDate()) const priceBase = { params:{ - regSdt: formatDatefromObject(before30), - regEdt: formatDatefromObject(after30), - page: Number.parseInt(route.query.page as string) || 1, - row: 10 + regSdt: formatDatefromString(searchParamsList.regSdt), + regEdt: formatDatefromString(searchParamsList.regEdt), + page: 1, + row: itemsPerPage } } const result = await getPriceList(priceBase) params.priceData = result.content //페이지 관련 값 설정 - currentPage.value = result.pageable.pageNumber + 1 totalItems.value = result.totalElements - console.log("currentPage.value",currentPage.value) - console.log("totalItems.value",totalItems.value) + totalPages.value = result.totalPages } -const route = useRoute() -const searchPrice = async () => { - +const searchPrice = async (item) => { const searchParams = { params: { cateCd : searchParamsList.cateCd, //분야코드 @@ -71,20 +65,13 @@ const searchPrice = async () => { regNm : searchParamsList.regNm, //담당자 regSdt: formatDatefromString(searchParamsList.regSdt),//등록시작일 regEdt: formatDatefromString(searchParamsList.regEdt),//등록종료일 - page: Number.parseInt(route.query.page as string) || 1,//페이지 - row: 10 //아이템갯수 + page: item,//페이지 + row: itemsPerPage //아이템갯수 } } - console.log("searchParams", Number.parseInt(route.query.page as string)) const result = await getPriceList(searchParams) params.priceData = result.content - currentPage.value = null - totalItems.value = null - //페이지 관련 값 설정 - currentPage.value = result.pageable.pageNumber + 1 totalItems.value = result.totalElements - console.log("currentPage.value",currentPage.value) - console.log("totalItems.value",totalItems.value) } function getPriceDetail(){ @@ -96,8 +83,9 @@ function getPriceDetail(){ } } -watch(() => route.query.page, (newPage) => { - searchPrice() +watch(currentPage, (newParams) => { + currentPage.value = newParams + searchPrice(currentPage.value) }) @@ -137,7 +125,7 @@ watch(() => route.query.page, (newPage) => { v-model="searchParamsList.regNm" class="input custom-text-filter" placeholder="담당자" - @keydown.enter="searchPrice" + @keydown.enter="searchPrice(1)" > @@ -205,7 +193,7 @@ watch(() => route.query.page, (newPage) => { color="primary" elevated icon="fas fa-search" - @click.stop="searchPrice" + @click.stop="searchPrice(1)" > 검색 @@ -222,7 +210,27 @@ watch(() => route.query.page, (newPage) => { :compact="true" @rowClick="getPriceDetail" /> - + + + + + + + + + + + + + + + route.query.page, (newPage) => {