Files
bns_system/test_contract_list.html
2025-09-16 14:04:11 +09:00

220 lines
7.0 KiB
HTML

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>계약 리스트 조회 테스트</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
background-color: #f5f5f5;
}
.container {
max-width: 1200px;
margin: 0 auto;
background-color: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
h1 {
color: #333;
text-align: center;
margin-bottom: 30px;
}
.test-section {
margin-bottom: 30px;
padding: 20px;
border: 1px solid #ddd;
border-radius: 5px;
background-color: #fafafa;
}
.test-section h2 {
color: #0066cc;
margin-bottom: 15px;
}
button {
background-color: #0066cc;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
margin-right: 10px;
margin-bottom: 10px;
}
button:hover {
background-color: #0052a3;
}
.result {
margin-top: 15px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
background-color: white;
max-height: 300px;
overflow-y: auto;
}
.success {
border-color: #4caf50;
background-color: #f9fff9;
}
.error {
border-color: #f44336;
background-color: #fff9f9;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 10px;
}
th,
td {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
}
th {
background-color: #f2f2f2;
font-weight: bold;
}
.loading {
text-align: center;
color: #666;
font-style: italic;
}
</style>
</head>
<body>
<div class="container">
<h1>📋 계약 리스트 조회 테스트</h1>
<!-- 테스트 1: 전체 리스트 조회 -->
<div class="test-section">
<h2>🔍 테스트 1: 전체 리스트 조회</h2>
<p>저장된 모든 계약 데이터를 조회합니다.</p>
<button onclick="testAllList()">전체 리스트 조회</button>
<div id="result1" class="result"></div>
</div>
<!-- 테스트 2: 2025년 데이터 조회 -->
<div class="test-section">
<h2>📅 테스트 2: 2025년 데이터 조회</h2>
<p>2025년도 계약 데이터만 조회합니다.</p>
<button onclick="testYearFilter()">2025년 데이터 조회</button>
<div id="result2" class="result"></div>
</div>
<!-- 테스트 3: 영업번호별 조회 -->
<div class="test-section">
<h2>🔢 테스트 3: 영업번호별 조회</h2>
<p>특정 영업번호(25C-로 시작하는)로 조회합니다.</p>
<button onclick="testContractNoFilter()">영업번호 조회</button>
<div id="result3" class="result"></div>
</div>
<!-- 테스트 4: 페이징 조회 -->
<div class="test-section">
<h2>📄 테스트 4: 페이징 조회</h2>
<p>페이징 처리된 리스트를 조회합니다.</p>
<button onclick="testPagingList()">페이징 리스트 조회</button>
<div id="result4" class="result"></div>
</div>
</div>
<script>
// 공통 AJAX 함수
function makeRequest(url, data, resultElementId) {
const resultElement = document.getElementById(resultElementId);
resultElement.innerHTML =
'<div class="loading">⏳ 데이터를 조회하는 중...</div>';
fetch(url, {
method: "GET",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
credentials: "include",
})
.then((response) => {
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
return response.text();
})
.then((html) => {
resultElement.className = "result success";
resultElement.innerHTML = `
<h3>✅ 조회 성공</h3>
<p><strong>응답 크기:</strong> ${html.length} bytes</p>
<p><strong>응답 내용 (처음 500자):</strong></p>
<pre style="max-height: 200px; overflow-y: auto; background-color: #f8f8f8; padding: 10px; border-radius: 4px;">${html.substring(
0,
500
)}...</pre>
`;
// 테이블 데이터 파싱 시도
const parser = new DOMParser();
const doc = parser.parseFromString(html, "text/html");
const rows = doc.querySelectorAll("table tbody tr");
if (rows.length > 0) {
resultElement.innerHTML += `
<p><strong>조회된 데이터 건수:</strong> ${rows.length}건</p>
<p><strong>첫 번째 데이터:</strong></p>
<div style="background-color: #f0f8ff; padding: 10px; border-radius: 4px;">
${rows[0].innerHTML}
</div>
`;
}
})
.catch((error) => {
resultElement.className = "result error";
resultElement.innerHTML = `
<h3>❌ 조회 실패</h3>
<p><strong>오류 메시지:</strong> ${error.message}</p>
<p><strong>해결 방법:</strong></p>
<ul>
<li>서버가 실행 중인지 확인 (http://localhost:8090)</li>
<li>로그인이 필요한지 확인</li>
<li>매퍼 파일 수정사항이 반영되었는지 확인</li>
</ul>
`;
});
}
// 테스트 1: 전체 리스트 조회
function testAllList() {
makeRequest("/contractMgmt/contractList.do", {}, "result1");
}
// 테스트 2: 2025년 데이터 조회
function testYearFilter() {
makeRequest("/contractMgmt/contractList.do?Year=2025", {}, "result2");
}
// 테스트 3: 영업번호별 조회
function testContractNoFilter() {
makeRequest(
"/contractMgmt/contractList.do?contract_no=25C",
{},
"result3"
);
}
// 테스트 4: 페이징 조회
function testPagingList() {
makeRequest("/contractMgmt/getPagingContractList.do", {}, "result4");
}
// 페이지 로드 시 자동으로 전체 리스트 조회
window.onload = function () {
console.log("🚀 계약 리스트 조회 테스트 페이지가 로드되었습니다.");
console.log("💡 각 테스트 버튼을 클릭하여 데이터 조회를 확인하세요.");
};
</script>
</body>
</html>