Update index.html

index.html

@@ -28,9 +28,11 @@
         border-radius: 8px;
         /*box-shadow: 0 2px 4px rgba(0,0,0,0.1);*/
     }
+
 	.table-task-list tbody tr.selected {
 		background-color: #e9ecef !important; /* 진한 회색조로 변경 */
 	}
+
     .table-task-list, .table-task-detail {
         width: 100%;
         border-collapse: collapse;
@@ -38,12 +40,14 @@
         border: 1px solid #e5e7eb;
         margin-top: 20px; /* 두 테이블 사이에 공백 추가 */
     }
+
     .table-task-list thead, .table-task-detail thead {
         background-color: white;
         color: black;
         font-weight: bold;
 		text-align: left;
     }
+
     .table-task-list td, .table-task-detail td {
         border-top: none;
         border-bottom: none;
@@ -51,27 +55,34 @@
         padding: 8px;
         text-align: left;
     }
+
 	.table-task-detail thead tr th{
 		padding:5px 10px;
 	}
+
     .table-task-list td:last-child, .table-task-detail td:last-child {
         border-right: 1px solid #e5e7eb;
     }
+
     .table-task-list tbody tr:hover, .table-task-detail tbody tr:hover {
         background-color: #f1f1f1;
         cursor: pointer;
     }
+
     .table-task-list tbody tr:nth-child(odd), .table-task-detail tbody tr:nth-child(odd) {
         background-color: #f9fafb;
     }
+
     .table-task-list tbody tr:nth-child(even), .table-task-detail tbody tr:nth-child(even) {
         background-color: white;
     }
+
     .tabs {
         display: flex;
         margin-bottom: 0;
         border-bottom: 1px solid #e5e7eb;
     }
+
     .tab-link {
         font-size: 20px;
         padding: 10px 20px;
@@ -85,27 +96,33 @@
         position: relative;
         transition: color 0.3s, background-color 0.3s;
     }
+
     .tab-link.active {
         color: black;
         z-index: 1;
         margin-bottom: -1px;
     }
+
     .tab-content {
         border: 1px solid #e5e7eb;
         border-top: none;
         padding: 10px;
         position: relative;
     }
+
     .tab-link:hover {
         color: black;
     }
+
 	.notice-task-name{
 		margin: 0px 0px 15px 0px;
 	}
+
 	.notice-task-period{
 		font-weight: 500;
 		font-size:20px;
 	}
+
 	.custom-hr {
 		border: none;
 		height: 1px;
@@ -242,58 +259,91 @@
 		</div>
 	</body>
 	<script>
+        var taskOrdtmStatusCdMap = {
+            TEMP_STOR: "임시 저장",
+            REG_COMP: "등록 완료",
+            PUB_COMP: "공고 완료",
+            OPER_ING: "과제 운영 중",
+            OPER_END: "과제 종료",
+            OPER_WAIT: "운영자 확인 대기",
+            SUB_END: "제출 대기",
+            OKAY_ING: "승인 요청 중",
+            OKAY_END: "승인 완료",
+            OKAY_FAIL: "제출 반려",
+            RE_OKAY_ING: "재승인 요청 중",
+            RE_OKAY_FAIL: "재승인 반려",
+            DELETE: "삭제"
+        };
+
+        var taskOrdtmTyCdMap = {
+            PRER: "사전 공개",
+            CPTHB: "경진 대회",
+            ORDTM: "상시 과제",
+            ACADEMCON: "학술 대회",
+            TRIRUN: "시범 운영"
+        };
+
 		now_task = "progress"
+
 		$(document).ready(function() {
 			getRow(now_task);
+
 			$('.tab-link').click(function () {
 				var selectedTab = $(this).attr('id').split('-')[1];
 				now_task = selectedTab;
 				console.log(now_task)
 				$('.tab-link').removeClass('active');
 				$(this).addClass('active');
+
 				$('.tab').hide();
 				getRow(now_task);
 			});
+
 			 $('.table-task-list tbody').on('click', 'tr', function() {
 				$('.table-task-list tr').removeClass('selected');
 				$(this).addClass('selected');
 			});
 		});
+
 		function getRow(checked_task){
 			postdata = {"checked_progress":checked_task}
+            var clCd = (now_task === "progress") ? "ING_TASK" : "END_TASK";
+
+            // var url = "http://signlab.iptime.org:19021/taskOrdtm/useTaskOrdtmListData.do?clCd=" + clCd + "&siteType=USERLIST&partInYN=N"
+            var url = "https://kli.korean.go.kr/benchmark/taskOrdtm/useTaskOrdtmListData.do?clCd="+clCd+"&siteType=USERLIST&partInYN=N"
             $.ajax({
-                type: 'GET',
-				url: 'https://kli.korean.go.kr/benchmark/taskOrdtm/useTaskOrdtmListData.do?clCd=ING_TASK&siteType=USERLIST&partInYN=N',
-                data: JSON.stringify(postdata),
-                dataType: 'JSON',
-                contentType: "application/json",
+				type: 'GET',
+                url: url,
+                // dataType: 'JSON',
+                // contentType: "application/json",
                 success: function(response) {
 					console.log(response)
-                	// if(response.status === "success") {
-                    //     // console.log("in success")
-			        //     var tableBody = (checked_task === "progress") ? $('#table-progress tbody') : $('#table-past tbody');
-			        //     tableBody.empty(); // 기존 내용을 비웁니다.
-					// 	// console.log(tableBody.parent().attr('id'));
-					// 	// console.log(response.data)
-			        //     response.data.forEach(function(item) {
-			        //         var row = $('<tr>');
-			        //         row.append($('<td>').text(item[0])); // No
-			        //         row.append($('<td>').text(item[1])); // 과제명
-			        //         row.append($('<td>').text(item[2])); // 과제 state
-			        //         row.append($('<td>').text(item[3])); // 과제 기간
-					// 		row.append($('<td>').text(item[4])); // 과제 status
-			        //         tableBody.append(row);
-					//
-			        //         // 클릭 이벤트 추가
-		            //         row.on('click', function() {
-					// 			$('tr').removeClass('selected');
-					// 			$(this).addClass('selected');
-					// 			TaskRowClicked(item);
-					// 		});
-			        //     });
-					// 	// console.log("task-"+now_task)
-					// 	$('#task-' + now_task).show(); // Show the selected tab
-			        // }
+                    var tableBody = (checked_task === "progress") ? $('#table-progress tbody') : $('#table-past tbody');
+                    tableBody.empty(); // 기존 내용을 비웁니다.
+                    var rowNum = 0
+                    var data = JSON.parse(response);
+                    data.forEach(function(item) {
+                        console.log(item['taskOrdtmNm'])
+                        rowNum = rowNum + 1
+                        var row = $('<tr>').attr('data-taskid', item['taskOrdtmId']); // 과제 식별 ID를 data-taskid 속성으로 추가
+                        // var row = $('<tr>');
+                        row.append($('<td>').text(rowNum)); // No
+                        row.append($('<td>').text(item['taskOrdtmNm'])); // 과제명
+                        row.append($('<td>').text(taskOrdtmTyCdMap[item['taskOrdtmTyCd']])); // 과제 분류(사전공개 등)
+                        row.append($('<td>').text(item['taskOrdtmBgngDt'] + " - " + item['taskOrdtmEndDt'])); // 과제 기간
+                        row.append($('<td>').text(taskOrdtmStatusCdMap[item['taskOrdtmStatusCd']])); // 과제 상태 (사전공개중 등)
+                        tableBody.append(row);
+
+                        // 클릭 이벤트 추가
+                        row.on('click', function() {
+                            $('tr').removeClass('selected');
+                            $(this).addClass('selected');
+                            var taskId = $(this).data('taskid'); // data-taskid 속성에서 과제 식별 ID 가져오기
+                            TaskRowClicked(taskId); // 과제 식별 ID를 인자로 넘겨주면서 함수 실행
+                        });
+                    });
+                    // console.log("task-"+now_task)
+                    $('#task-' + now_task).show(); // Show the selected tab
                 },
                 error: function(request, status, error) {
                     alert('ajax 통신 실패');
@@ -301,77 +351,83 @@
                 }
              })
 		}
-		function TaskRowClicked(item) {
-			var postdata = {
-				'checked_progress':now_task,
-				no: item[0],
-				taskName: item[1],
-				taskPeriod: item[2],
-				status: item[3]
-			};
+		function TaskRowClicked(taskId) {
+            console.log("Clicked task ID:", taskId);
 			// 새 AJAX 요청을 보냅니다.
 			$.ajax({
+				// type: 'POST',
 				type: 'GET',
-				url: 'http://112.170.149.129:8090/get_score',
-				data: JSON.stringify(postdata),
-				dataType: 'JSON',
-				contentType: "application/json",
+				url: 'https://kli.korean.go.kr/benchmark/taskOrdtm/taskLeaderBoardData.do?taskOrdtmId='+taskId,
+				// data: JSON.stringify(postdata),
+				// dataType: 'JSON',
+				// contentType: "application/json",
 				success: function(response) {
 					console.log("Response received:", response);
-					if (response.status === "success") {
-						console.log(response.data)
-						var hrArea = now_task === "progress" ? $('#hr-area-progress') : $('#hr-area-past');
-						hrArea.empty();
-						hrArea.html("<br><br><hr class=\"custom-hr\"><br>");
-						//일단 task에 대한 정보를 적어줘야 함.
-						var noticeDetail = now_task === "progress" ? $('#task-progress-notice-div') : $('#task-past-notice-div');
-						var taskNameDiv = noticeDetail.find('.notice-task-name');
-						var taskPeriodDiv = noticeDetail.find('.notice-task-period');
-						var taskInfoDiv = noticeDetail.find('.notice-task-info');
-						taskNameDiv.empty();
-						taskPeriodDiv.empty();
-						taskInfoDiv.empty();
-						var formattedTaskInfo = response.data.task_info.replace(/\n/g, '<br>');
-						console.log(response.data.task_name)
-						taskNameDiv.html(response.data.task_name);
-						taskPeriodDiv.html(response.data.task_period);
-						taskInfoDiv.html("<p style='font-weight:bold;'>[과제 개요]</p>"+formattedTaskInfo);
-						var tableTitle = now_task === "progress" ? $('#table-progress-detail-title') : $('#table-past-detail-title');
-						tableTitle.empty();
-						tableTitle.html("<p style='font-weight:bold;'><br>[순위표]</p>");
-						// 현재 태스크에 따라 적절한 테이블과 헤드 선택
-						var tableDetail = now_task === "progress" ? $('#table-progress-detail') : $('#table-past-detail');
-						var thead = tableDetail.find('thead');
-						var tbody = tableDetail.find('tbody');
-						tableDetail.show(); // 테이블을 보이게 합니다.
-						tableDetail.css("display", "table"); // 테이블을 보이게 합니다.
-						// 헤더를 업데이트합니다.
-						thead.empty(); // 기존의 헤더 내용을 비웁니다.
-						var headerRow = $('<tr>');
-						// 첫 번째 리더보드 아이템의 상세 평가 결과 키 가져오기
-						var detailsKeys = Object.keys(response.data.leaderboard[0].evaluation_result_detail);
-						// 헤더 제목 설정
-						var headers = ["ranking", "team_name", "model_name", "evaluation_result"].concat(detailsKeys, "submit_date");
-						headers.forEach(function(headerTitle) {
-							headerRow.append($('<th>').text(headerTitle));
-						});
-						thead.append(headerRow);
-						// 세부 정보를 표에 추가합니다.
-						tbody.empty(); // 기존 내용을 비웁니다.
-						response.data.leaderboard.forEach(function(entry) {
-							var detailRow = $('<tr>');
-							headers.forEach(function(header) {
-								if (header in entry.evaluation_result_detail) {
-									// 평가 상세 결과 처리
-									detailRow.append($('<td>').text(entry.evaluation_result_detail[header]));
-								} else {
-									// 일반적인 데이터 처리
-									detailRow.append($('<td>').text(entry[header]));
-								}
-							});
-							tbody.append(detailRow);
-						});
-					}
+					// if (response.status === "success") {
+					// 	console.log(response.data)
+					// 	var hrArea = now_task === "progress" ? $('#hr-area-progress') : $('#hr-area-past');
+					// 	hrArea.empty();
+					// 	hrArea.html("<br><br><hr class=\"custom-hr\"><br>");
+                    //
+                    //
+					// 	//일단 task에 대한 정보를 적어줘야 함.
+					// 	var noticeDetail = now_task === "progress" ? $('#task-progress-notice-div') : $('#task-past-notice-div');
+					// 	var taskNameDiv = noticeDetail.find('.notice-task-name');
+					// 	var taskPeriodDiv = noticeDetail.find('.notice-task-period');
+					// 	var taskInfoDiv = noticeDetail.find('.notice-task-info');
+                    //
+					// 	taskNameDiv.empty();
+					// 	taskPeriodDiv.empty();
+					// 	taskInfoDiv.empty();
+                    //
+					// 	var formattedTaskInfo = response.data.task_info.replace(/\n/g, '<br>');
+                    //
+					// 	console.log(response.data.task_name)
+					// 	taskNameDiv.html(response.data.task_name);
+					// 	taskPeriodDiv.html(response.data.task_period);
+					// 	taskInfoDiv.html("<p style='font-weight:bold;'>[과제 개요]</p>"+formattedTaskInfo);
+                    //
+					// 	var tableTitle = now_task === "progress" ? $('#table-progress-detail-title') : $('#table-past-detail-title');
+					// 	tableTitle.empty();
+					// 	tableTitle.html("<p style='font-weight:bold;'><br>[순위표]</p>");
+					// 	// 현재 태스크에 따라 적절한 테이블과 헤드 선택
+					// 	var tableDetail = now_task === "progress" ? $('#table-progress-detail') : $('#table-past-detail');
+					// 	var thead = tableDetail.find('thead');
+					// 	var tbody = tableDetail.find('tbody');
+                    //
+					// 	tableDetail.show(); // 테이블을 보이게 합니다.
+					// 	tableDetail.css("display", "table"); // 테이블을 보이게 합니다.
+                    //
+					// 	// 헤더를 업데이트합니다.
+					// 	thead.empty(); // 기존의 헤더 내용을 비웁니다.
+					// 	var headerRow = $('<tr>');
+					// 	// 첫 번째 리더보드 아이템의 상세 평가 결과 키 가져오기
+					// 	var detailsKeys = Object.keys(response.data.leaderboard[0].evaluation_result_detail);
+                    //
+					// 	// 헤더 제목 설정
+					// 	var headers = ["ranking", "team_name", "model_name", "evaluation_result"].concat(detailsKeys, "submit_date");
+					// 	headers.forEach(function(headerTitle) {
+					// 		headerRow.append($('<th>').text(headerTitle));
+					// 	});
+					// 	thead.append(headerRow);
+                    //
+                    //
+					// 	// 세부 정보를 표에 추가합니다.
+					// 	tbody.empty(); // 기존 내용을 비웁니다.
+					// 	response.data.leaderboard.forEach(function(entry) {
+					// 		var detailRow = $('<tr>');
+					// 		headers.forEach(function(header) {
+					// 			if (header in entry.evaluation_result_detail) {
+					// 				// 평가 상세 결과 처리
+					// 				detailRow.append($('<td>').text(entry.evaluation_result_detail[header]));
+					// 			} else {
+					// 				// 일반적인 데이터 처리
+					// 				detailRow.append($('<td>').text(entry[header]));
+					// 			}
+					// 		});
+					// 		tbody.append(detailRow);
+					// 	});
+					// }
 				},
 				error: function(xhr, status, error) {
 					alert('Error: ' + error.message);
@@ -380,4 +436,3 @@
 		}
 	</script>
 </html>
-