전송 이력 화면 진행중

- 페이지네이션 개발
main
semin.baek 4 months ago
parent ea06e74766
commit 220bf99e95

@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title> <title>DFXConsole</title>
</head> </head>
<body> <body>
<div id="app" class="container d-flex min-vh-100 flex-column"></div> <div id="app" class="container d-flex min-vh-100 flex-column"></div>

@ -0,0 +1,47 @@
<script setup>
import { defineProps } from 'vue'
const props = defineProps({
searchParameterDto: Object,
listFunction: Function,
})
async function retrieveDataList(pageIndex) {
props.listFunction(pageIndex)
}
async function retrievePreviousDataList() {
if (searchParameterDto.value.page < 2) {
return
} else {
this.retrieveDataList(props.searchParameterDto.value.page--)
}
}
async function retrieveNextDataList() {
const maxPage = Math.ceil(props.searchParameterDto.value.totalItemCount / props.searchParameterDto.value.itemCountPerPage)
if (maxPage == 0 || props.searchParameterDto.value.page == maxPage) {
return
} else {
this.retrieveDataList(props.searchParameterDto.value.page++)
}
}
</script>
<template>
<nav aria-label="Page navigation">
<ul class="pagination">
<li class="page-item">
<a class="page-link" @click.prevent="retrievePreviousDataList">Previous</a>
</li>
<li class="page-item" v-for="pageNo in props.searchParameterDto.pageList" :class="pageNo == props.searchParameterDto.page ? 'active' : ''" :aria-current="pageNo == props.searchParameterDto.page ? 'page' : ''">
<a class="page-link" @click.prevent="retrieveDataList(pageNo)">{{ pageNo }}</a>
</li>
<li class="page-item">
<a class="page-link" @click.prevent="retrieveNextDataList">Next</a>
</li>
</ul>
</nav>
</template>
<style></style>

@ -3,6 +3,7 @@ import '@/assets/main.css'
import { useApiClient } from '@/main' import { useApiClient } from '@/main'
import { onMounted, ref } from 'vue' import { onMounted, ref } from 'vue'
import SearchParameterDto from '@/components/SearchParameterDto' import SearchParameterDto from '@/components/SearchParameterDto'
import Pagination from '@/components/Pagination.vue'
const apiClient = useApiClient() const apiClient = useApiClient()
@ -84,19 +85,7 @@ onMounted(async () => {
</table> </table>
</div> </div>
</div> </div>
<nav aria-label="Page navigation"> <pagination :list-function="retrieveDataList" :search-parameter-dto="searchParameterDto" />
<ul class="pagination">
<li class="page-item">
<a class="page-link">Previous</a>
</li>
<li class="page-item" v-for="pageNo in searchParameterDto.pageList" :class="pageNo == searchParameterDto.page ? 'active' : ''" :aria-current="pageNo == searchParameterDto.page ? 'page' : ''">
<a class="page-link" href="#">{{ pageNo }}</a>
</li>
<li class="page-item">
<a class="page-link" href="#">Next</a>
</li>
</ul>
</nav>
</article> </article>
</div> </div>
</main> </main>

@ -3,6 +3,7 @@ package com.bsmlab.dfx.dfxconsole.app.agent;
import com.bsmlab.dfx.agent.config.AgentConfigDto; import com.bsmlab.dfx.agent.config.AgentConfigDto;
import com.bsmlab.dfx.agent.listener.dto.ReceiveMessageDto; import com.bsmlab.dfx.agent.listener.dto.ReceiveMessageDto;
import com.bsmlab.dfx.dfxconsole.app.agent.service.*; import com.bsmlab.dfx.dfxconsole.app.agent.service.*;
import com.bsmlab.dfx.dfxconsole.framework.dto.SearchParameterDto;
import com.bsmlab.dfx.dfxconsole.framework.support.ResponseUtils; import com.bsmlab.dfx.dfxconsole.framework.support.ResponseUtils;
import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterxml.jackson.core.JsonProcessingException;
import lombok.RequiredArgsConstructor; import lombok.RequiredArgsConstructor;
@ -54,8 +55,8 @@ public class DfxAgentInfoController {
} }
@PostMapping("/app-api/agent/getAgentMessageDtoList") @PostMapping("/app-api/agent/getAgentMessageDtoList")
public ResponseEntity<List<DfxAgentMessageDto>> getAgentMessageDtoList() { public ResponseEntity<List<DfxAgentMessageDto>> getAgentMessageDtoList(@RequestBody SearchParameterDto searchParameterDto) {
List<DfxAgentMessageDto> dfxAgentMessageDtoList = dfxAgentMessageHistoryService.selectDfxAgentMessageDtoList(); List<DfxAgentMessageDto> dfxAgentMessageDtoList = dfxAgentMessageHistoryService.selectDfxAgentMessageDtoList(searchParameterDto);
return ResponseEntity.ok().body(dfxAgentMessageDtoList); return ResponseEntity.ok().body(dfxAgentMessageDtoList);
} }

@ -1,12 +1,13 @@
package com.bsmlab.dfx.dfxconsole.app.agent.service; package com.bsmlab.dfx.dfxconsole.app.agent.service;
import com.bsmlab.dfx.dfxconsole.framework.dto.SearchParameterDto;
import org.apache.ibatis.annotations.Mapper; import org.apache.ibatis.annotations.Mapper;
import java.util.List; import java.util.List;
@Mapper @Mapper
public interface DfxAgentMessageHistoryMapper { public interface DfxAgentMessageHistoryMapper {
List<DfxAgentMessageDto> selectDfxAgentMessageList(); List<DfxAgentMessageDto> selectDfxAgentMessageList(SearchParameterDto searchParameterDto);
int selectDfxAgentMessageListTotalCount(); int selectDfxAgentMessageListTotalCount();
DfxAgentMessageDto selectDfxAgentMessageBySenderAgentIdAndMessageUuid(DfxAgentMessageDto dfxAgentMessageDto); DfxAgentMessageDto selectDfxAgentMessageBySenderAgentIdAndMessageUuid(DfxAgentMessageDto dfxAgentMessageDto);
void insertDfxAgentMessage(DfxAgentMessageDto dfxAgentMessageDto); void insertDfxAgentMessage(DfxAgentMessageDto dfxAgentMessageDto);

@ -1,5 +1,6 @@
package com.bsmlab.dfx.dfxconsole.app.agent.service; package com.bsmlab.dfx.dfxconsole.app.agent.service;
import com.bsmlab.dfx.dfxconsole.framework.dto.SearchParameterDto;
import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.core.type.TypeReference; import com.fasterxml.jackson.core.type.TypeReference;
import com.fasterxml.jackson.databind.ObjectMapper; import com.fasterxml.jackson.databind.ObjectMapper;
@ -18,8 +19,8 @@ import java.util.Map;
public class DfxAgentMessageHistoryService { public class DfxAgentMessageHistoryService {
private final DfxAgentMessageHistoryMapper dfxAgentMessageHistoryMapper; private final DfxAgentMessageHistoryMapper dfxAgentMessageHistoryMapper;
public List<DfxAgentMessageDto> selectDfxAgentMessageDtoList() { public List<DfxAgentMessageDto> selectDfxAgentMessageDtoList(SearchParameterDto searchParameterDto) {
List<DfxAgentMessageDto> dfxAgentMessageDtoList = dfxAgentMessageHistoryMapper.selectDfxAgentMessageList(); List<DfxAgentMessageDto> dfxAgentMessageDtoList = dfxAgentMessageHistoryMapper.selectDfxAgentMessageList(searchParameterDto);
return dfxAgentMessageDtoList; return dfxAgentMessageDtoList;
} }

@ -18,8 +18,8 @@
FROM TB_DFX_AGENT_MESSAGE FROM TB_DFX_AGENT_MESSAGE
WHERE 1 = 1 WHERE 1 = 1
ORDER BY CONSOLE_RECEIVE_TS ORDER BY CONSOLE_RECEIVE_TS
LIMIT 20 LIMIT #{itemCountPerPage}
OFFSET (1 - 1) * 20 OFFSET (#{page} - 1) * #{itemCountPerPage}
) A ) A
JOIN TB_DFX_AGENT_INFO B ON (A.SENDER_AGENT_ID = B.AGENT_ID) JOIN TB_DFX_AGENT_INFO B ON (A.SENDER_AGENT_ID = B.AGENT_ID)
JOIN TB_DFX_AGENT_INFO C ON (A.RECIPIENT_AGENT_ID = C.AGENT_ID) JOIN TB_DFX_AGENT_INFO C ON (A.RECIPIENT_AGENT_ID = C.AGENT_ID)

Loading…
Cancel
Save