Files
chocomae/src/web/module/maestro_section_record.html
T

474 lines
14 KiB
HTML

<script type="text/javascript">
$(document).ready(function() {
$("#player_name_list").keydown(function(key) {
if(key.keyCode == 13) {
requestPlayerRecordListAll();
}
});
initDatePicker();
loadAppList();
});
function initDatePicker() {
$('#start_datepicker')
.datepicker({
format: 'yyyy-mm-dd',
autoclose: true,
language: 'kr'
});
$('#end_datepicker')
.datepicker({
format: 'yyyy-mm-dd',
autoclose: true,
language: 'kr'
});
setDatePickersForMonths(3);
}
function setDatePickersForWeeks(weeks) {
var today = new Date();
updateDatePickerIn("#end_datepicker", today);;
var startDay = new Date();
startDay.setDate(startDay.getDate() - 7 * weeks);
updateDatePickerIn("#start_datepicker", startDay);;
}
function setDatePickersForMonths(months) {
var today = new Date();
updateDatePickerIn("#end_datepicker", today);;
var startDay = new Date();
startDay.setMonth(startDay.getMonth() - months);
updateDatePickerIn("#start_datepicker", startDay);;
}
function setDatePickersForYears(years) {
var today = new Date();
updateDatePickerIn("#end_datepicker", today);;
var startDay = new Date();
startDay.setFullYear(startDay.getFullYear() - years);
updateDatePickerIn("#start_datepicker", startDay);;
}
function updateDatePickerIn(inputID, date) {
var yyyy = date.getFullYear();
var mm = String(date.getMonth() + 1).padStart(2, '0'); //January is 0!
var dd = String(date.getDate()).padStart(2, '0');
$(inputID).datepicker('update', yyyy + "-" + mm + "-" + dd);
}
function copyToClipboard() {
el = document.getElementById('dataTable');
var body = document.body, range, sel;
if (document.createRange && window.getSelection) {
range = document.createRange();
sel = window.getSelection();
sel.removeAllRanges();
try {
range.selectNodeContents(el);
sel.addRange(range);
} catch (e) {
range.selectNode(el);
sel.addRange(range);
}
} else if (body.createTextRange) {
range = body.createTextRange();
range.moveToElementText(el);
range.select();
}
document.execCommand("Copy");
}
function loadAppList() {
var self = this;
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
"./../server/app/typing_app_list.php",
"maestro_id=" + maestroID,
(function(jsonData) {
// console.log(jsonData);
makeTypingPracticeSubjectList(jsonData["appList"]);
makeTypingTestSubjectList(jsonData["appList"]);
makeTypingAppSubjectList(jsonData["appList"]);
}),
(function(errorMessage, errorCode) {
showErrorMessage(errorMessage, "error");
})
);
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
"./../server/app/mouse_app_list.php",
"maestro_id=" + maestroID,
(function(jsonData) {
// console.log(jsonData);
makeMouseAppSubjectList(jsonData["appList"]);
}),
(function(errorMessage, errorCode) {
showErrorMessage(errorMessage, "error");
})
);
}
function makeTypingPracticeSubjectList(appList) {
$("#typing_practice_subject_list").empty();
addSubjectBundleItem("#typing_practice_subject_list", 1000, "한글 손가락 연습 묶음");
addSubjectBundleItem("#typing_practice_subject_list", 1001, "영문 손가락 연습 묶음");
for(var i = 0; i < appList.length; i++) {
var appData = appList[i];
if(appData.appID > 20)
continue;
else if(appData.koreanName == "")
continue;
addSubjectListItem("#typing_practice_subject_list", appData.appID, appData.koreanName);
}
}
function makeTypingTestSubjectList(appList) {
$("#typing_test_subject_list").empty();
addSubjectBundleItem("#typing_test_subject_list", 1002, "한글 단어/문장 연습 묶음");
addSubjectBundleItem("#typing_test_subject_list", 1003, "영문 단어/문장 연습 묶음");
for(var i = 0; i < appList.length; i++) {
var appData = appList[i];
if(appData.appID < 21 || appData.appID > 49)
continue;
else if(appData.koreanName == "")
continue;
addSubjectListItem("#typing_test_subject_list", appData.appID, appData.koreanName);
}
}
function makeTypingAppSubjectList(appList) {
$("#typing_app_subject_list").empty();
for(var i = 0; i < appList.length; i++) {
var appData = appList[i];
if(appData.appID < 50)
continue;
else if(appData.koreanName == "")
continue;
addSubjectListItem("#typing_app_subject_list", appData.appID, appData.koreanName);
}
}
function makeMouseAppSubjectList(appList) {
$("#mouse_app_subject_list").empty();
for(var i = 0; i < appList.length; i++) {
var appData = appList[i];
if(appData.koreanName == "")
continue;
addSubjectListItem("#mouse_app_subject_list", appData.appID, appData.koreanName);
}
}
function addSubjectListItem(subjectListID, appID, appName) {
$(subjectListID).append('\
<div class="form-check form-check-inline">\
<input class="form-check-input" type="radio" name="subject_group" id="record_'
+ appID + '" + " value="' + appID + '">\
<label class="form-check-label" for="record_' + appID + '">' + appName + '</label>\
</div>\
');
}
function addSubjectBundleItem(subjectListID, appID, appName) {
$(subjectListID).append('\
<div class="form-check form-check-inline">\
<input class="form-check-input" type="radio" name="subject_group" id="record_'
+ appID + '" + " value="' + appID + '">\
<label class="form-check-label text-success" for="record_' + appID + '">' + appName + '</label>\
</div>\
');
}
function requestPlayerRecordList() {
if(getPlayerRecordList(50))
$("#search_all").prop("disabled", false);
}
function requestPlayerRecordListAll() {
getPlayerRecordList(0);
}
function getPlayerRecordList(limitCount) {
showNoResultContent();
var startDate = $("#start_date").val();
var endDate = $("#end_date").val();
// console.log(startDate);
// console.log(endDate);
var playerNameList = $("#player_name_list").val();
// console.log("player name list");
// console.log($("player_name_list"));
// console.log(playerNameList);
var appID = $(":radio[name='subject_group']:checked").val();
if(typeof(appID) == "undefined") {
showErrorMessage("검색할 과목을 선택하세요.");
return false;
}
var requestURL = "";
if(appID == 3000)
requestURL = "./../server/record/request_license_timer_player_record_list.php";
else
requestURL = "./../server/record/request_app_player_record_list.php";
sendRequestServer( //url, sendParams, onSuccess, onFail, isDebugMode);
requestURL,
"MaestroID=" + maestroID + "&StartDate="
+ startDate + "&EndDate=" + endDate
+ "&PlayerNameList=" + playerNameList
+ "&AppID=" + appID + "&LimitCount=" + limitCount,
(function(jsonData) {
// console.log(jsonData);
showRecordCount(jsonData);
makeRecordTableContent(jsonData["RecordList"]);
}),
(function(errorMessage, errorCode) {
showErrorMessage(errorMessage, "error");
})
);
return true;
}
function showRecordCount(jsonData) {
$("#record_count").empty();
var count = jsonData["RecordList"].length;
$("#record_count").append('총 ' + count + '개 검색');
}
function makeRecordTableContent(recordList) {
$("#record_table_content").empty();
if(recordList == null || recordList.length == 0) {
showNoResultContent();
return;
}
// console.log(recordList);
for(var i = 0; i < recordList.length; i++) {
var record = recordList[i];
addRecordListItem(record.Date, record.Time, record.PlayerName, record.Subject, record.Record);
}
}
function showNoResultContent() {
$("#record_table_content").append('\
<tr>\
<th scope="row" class="table-warning text-center" colspan="5">데이터가 없습니다.</th>\
</tr>\
');
}
function addRecordListItem($date, $time, $name, $subject, $record) {
$("#record_table_content").append('\
<tr>\
<th scope="row" class="text-center">' + $date + '</th>\
<td class="text-center">' + $time + '</td>\
<td class="text-center">' + $name + '</td>\
<td class="text-center">' + $subject + '</td>\
<td class="text-right">' + $record + '</td>\
</tr>\
');
}
</script>
<div class="modal fade" id="recordPopupModal" tabindex="-1" role="dialog" aria-labelledby="contractModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div id="recordPopupContent" class="modal-content">
</div> <!-- modal content -->
</div> <!-- modal dialog -->
</div> <!-- modal -->
<div class="card border-dark mb-3">
<h5 class="card-header">검색 조건</h5>
<div class="card-body text-dark">
<form>
<!-- 날짜 -->
<div class="form-group row">
<label class="col-sm-2 my-2 text-right">날짜</label>
<div class="col-sm-10">
<div class="form-row align-items-center">
<div class="col-auto">
<div class="input-group input-append date" id="start_datepicker">
<label class="col-auto col-form-label" for="start_date">시작일</label>
<input type="text" id="start_date" class="form-control" aria-describedby="button-date-picker-1" size="12" readonly>
<div class="input-group-append">
<button class="add-on btn btn-primary" id="button-date-picker-1">
<span class="oi oi-calendar" title="icon calendar" aria-hidden="true"></span>
</button>
</div>
</div>
</div>
<div class="col-auto">
<div class="input-group input-append date" id="end_datepicker">
<label class="col-auto col-form-label" for="end_date">종료일</label>
<input type="text" id="end_date" class="form-control" aria-describedby="button-date-picker-2" size="12" readonly>
<div class="input-group-append">
<button class="add-on btn btn-primary" id="button-date-picker-2">
<span class="oi oi-calendar" title="icon calendar" aria-hidden="true"></span>
</button>
</div>
</div>
</div>
<div class="col-auto">
<button type="button" class="btn btn-primary" onClick="setDatePickersForWeeks(1);">1W</button>
<button type="button" class="btn btn-primary" onClick="setDatePickersForMonths(1);">1M</button>
<button type="button" class="btn btn-primary" onClick="setDatePickersForYears(1);">1Y</button>
</div>
</div>
</div>
</div>
<!-- 학생 이름 -->
<div class="form-group row">
<!-- <h5 class="col-sm-2 my-2 text-right">학생 이름</h5> -->
<label class="col-sm-2 my-2 text-right">
학생 이름&nbsp;
<span class="badge badge-pill badge-info" onClick='showModal("recordPopupModal", "recordPopupContent", "search_record_player_name");' style="cursor: pointer;">?</span>
</label>
<div class="col-sm-10">
<input type="text" id="player_name_list" class="form-control" placeholder="학생 이름을 입력하세요.">
</div>
</div>
<!-- 과목 -->
<div class="form-group row mb-0">
<!-- <h5 class="col-sm-2 my-2 text-right">과목</h5> -->
<label class="col-sm-2 my-2 text-right">
과목&nbsp;
<span class="badge badge-pill badge-info" onClick='showModal("recordPopupModal", "recordPopupContent", "search_record_subject");' style="cursor: pointer;">?</span>
</label>
<div class="col-sm-10">
<div class="row">
<label for="time" class="col-sm-2 col-form-label py-0">손가락 연습</label>
<div id="typing_practice_subject_list" class="col-sm-10 mb-2">
</div>
</div>
<div class="row">
<label for="time" class="col-sm-2 col-form-label py-0">단어/문장 연습</label>
<div id="typing_test_subject_list" class="col-sm-10 mb-2">
</div>
</div>
<div class="row">
<label for="time" class="col-sm-2 col-form-label py-0">타자 앱</label>
<div id="typing_app_subject_list" class="col-sm-10 mb-2">
</div>
</div>
<div class="row">
<label for="time" class="col-sm-2 col-form-label py-0">마우스 앱</label>
<div id="mouse_app_subject_list" class="col-sm-10 mb-2">
</div>
</div>
<div class="row">
<label for="time" class="col-sm-2 col-form-label py-0">기타</label>
<div id="mouse_app_subject_list" class="col-sm-10 mb-2">
<!-- 자격증 타이머 -->
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="subject_group" id="record_3000" + " value="3000">
<label class="form-check-label" for="record_3000">자격증 타이머</label>
</div>
</div>
</div>
<br/>
<!-- <button type="button" class="btn btn-primary" onClick="requestPlayerRecordList();">검색 (50개까지 보기)</button> -->
<button type="button" id="search_all" class="btn btn-primary col-sm-3" onClick="requestPlayerRecordListAll();">검색 실행</button>
</div>
</div>
</form>
</div>
</div>
<br/>
<div class="row justify-content-between mb-2">
<div class="col-auto">
<button type="button" class="btn btn-primary" onClick="copyToClipboard();">
<span class="oi oi-clipboard" title="icon clipboard" aria-hidden="true"></span>&nbsp;
표 내용을 클립보드에 복사
</button>
<span class="badge badge-pill badge-info" onClick='showModal("recordPopupModal", "recordPopupContent", "search_record_copy_result_to_clipboard");' style="cursor: pointer;">?</span>
</div>
<div class="col-auto">
<span id="record_count" class="text-info"></span>
<!-- <button type="button" class="btn btn-primary" disabled>표 내용을 엑셀 파일로 다운로드</button> -->
</div>
</div>
<table class="table table-striped" id="dataTable">
<thead class="thead-dark">
<tr>
<th scope="col" class="text-center">날짜</th>
<th scope="col" class="text-center">시간</th>
<th scope="col" class="text-center">이름</th>
<th scope="col" class="text-center">과목</th>
<th scope="col" class="text-center">점수</th>
</tr>
</thead>
<tbody id="record_table_content">
<tr>
<th scope="row" class="table-warning text-center" colspan="5">데이터가 없습니다.</th>
</tr>
</tbody>
</table>