Add: search_record popup htmls

This commit is contained in:
2019-03-28 09:21:28 +09:00
parent d7753ec246
commit 4ce72e24b4
6 changed files with 265 additions and 191 deletions
+16 -8
View File
@@ -83,7 +83,7 @@ function selectElementContents(el) {
<!-- 날짜 -->
<div class="form-group row">
<h5 class="col-sm-2 my-2 text-right">날짜</h5>
<label class="col-sm-2 my-2 text-right">날짜</label>
<div class="col-sm-10">
<div class="form-row align-items-center">
@@ -117,7 +117,11 @@ function selectElementContents(el) {
<!-- 학생 이름 -->
<div class="form-group row">
<h5 class="col-sm-2 my-2 text-right">학생 이름</h5>
<!-- <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" class="form-control" id="formGroupExampleInput" placeholder="Example input">
</div>
@@ -125,18 +129,22 @@ function selectElementContents(el) {
<!-- 과목 -->
<div class="form-group row mb-0">
<h5 class="col-sm-2 my-2 text-right">과목</h5>
<!-- <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 class="col-sm-10">
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1">
<label class="form-check-label" for="inlineRadio1">한글 타자 연습</label>
<label class="form-check-label" for="inlineRadio1">한글 타자 연습 묶음</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2">
<label class="form-check-label" for="inlineRadio2">영문 타자 연습</label>
<label class="form-check-label" for="inlineRadio2">영문 타자 연습 묶음</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio3" value="option3" disabled>
@@ -150,11 +158,11 @@ function selectElementContents(el) {
<div class="col-sm-10">
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1">
<label class="form-check-label" for="inlineRadio1">한글 타자 연습</label>
<label class="form-check-label" for="inlineRadio1">한글 타자 시험 묶음</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2">
<label class="form-check-label" for="inlineRadio2">영문 타자 연습</label>
<label class="form-check-label" for="inlineRadio2">영문 타자 시험 묶음</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio3" value="option3" disabled>
@@ -178,7 +186,7 @@ function selectElementContents(el) {
<div class="row justify-content-between mb-2">
<div class="col-auto">
<button type="button" class="btn btn-primary" onClick="selectElementContents( document.getElementById('dataTable') );">표 내용을 클립보드에 복사</button>
<span class="badge badge-pill badge-info" onClick='showModal("recordPopupModal", "recordPopupContent", "copy_result_to_clipboard");' style="cursor: pointer;">?</span>
<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">
<button type="button" class="btn btn-primary" disabled>표 내용을 엑셀 파일로 다운로드</button>
-183
View File
@@ -1,183 +0,0 @@
<script type="text/javascript">
$(document).ready(function() {
$('.shortcut_icon_maestro_id').append(maestroInfo.maestroName);
});
</script>
<div class="modal-header">
<h5 class="modal-title" id="contractModalLabel">바로 가기 아이콘 생성</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="card">
<h5 class="card-header bg-dark text-white">바로 가기 주소</h5>
<div class="card-body">
<table class="table table-sm table-borderless">
<tbody>
<tr>
<td scope="row">학생 로그인 화면</td>
<td>http://www.chocomae.com/<span class="text-danger">login</span>/<span class="shortcut_icon_maestro_id"></span></td>
</tr>
<tr>
<td scope="row">타이머 로그인 화면</td>
<td>http://www.chocomae.com/<span class="text-primary">timer</span>/<span class="shortcut_icon_maestro_id"></span></td>
</tr>
</tbody>
</table>
</div>
</div>
<br/>
<div class="card">
<h5 class="card-header bg-success text-white">직접 만들기 (권장)</h5>
<div class="card-body">
<h5 class="card-title">바탕화면에 아이콘 생성</h5>
<p class="card-text">
<ol>
<li>
바탕화면 빈 곳에서 마우스 오른쪽 버튼 클릭
<ul>
<li>팝업창에서 [새로 만들기(W)] > [바로 가기(S)] 클릭</li>
</ul>
<picture>
<source srcset="./../../../resources/image/help/make_shortcut_file.png" type="image/svg+xml">
<img src="./../../../resources/image/help/make_shortcut_file.png" class="img-fluid img-thumbnail" alt="새로 만들기">
</picture>
</li>
<br/>
<li>
[바로 가기 만들기] 팝업창 실행
<ol>
<li>"항목 위치 입력(T)"에 바로 가기 url 입력</li>
<li>[다음(N)] 버튼 클릭</li>
<li>"바로 가기에 사용할 이름 입력(T)"에 아이콘 이름 입력</li>
<li>[마침(F)] 버튼 클릭</li>
</ol>
</li>
<br/>
<li>바탕 화면에 바로 가기 아이콘이 생성된 것을 확인</li>
</ol>
</p>
</div>
</div>
<br/>
<div class="card">
<h5 class="card-header bg-info text-white">바로 가기 파일 다운받고 수정하기</h5>
<div class="card-body">
<h5 class="card-title">바로 가기 파일 다운받기</h5>
<p class="card-text">
<ul>
<li>아래의 바로 가기 파일 다운로드 받기</li>
</ul>
<a href="./../../../resources/file/chocomae.url" download>
<img src="./../../../resources/image/icon/icon_chocomae.png" class="rounded mx-auto d-block" alt="바로 가기 아이콘 파일">
<div class="text-center">초코마에 바로 가기 아이콘 다운로드</div>
</a>
</p>
<br/>
<h5 class="card-title">내용 수정하기</h5>
<p class="card-text">
<ul>
<li>바로 가기 파일을 마우스 오른쪽 버튼 클릭</li>
<li>팝업창에서 [속성(R)] 클릭</li>
<li>
[웹 문서] 탭에서 "URL(U)"에 수정할 주소 입력
<picture>
<source srcset="./../../../resources/image/help/shortcut_icon_url.png" type="image/svg+xml">
<img src="./../../../resources/image/help/shortcut_icon_url.png" class="img-fluid img-thumbnail" alt="바로 가기 주소 수정">
</picture>
</li>
<li>[확인] 버튼 클릭</li>
</ul>
</p>
</div>
</div>
<br/>
<div class="card">
<h5 class="card-header bg-danger text-white">브라우저에서 드래그해서 만들기 (권장하지 않음)</h5>
<div class="card-body">
<h5 class="card-title">Chrome</h5>
<p class="card-text">
<ul>
<li>
<span class="text-primary">생성 가능</span>
<ol>
<li>주소입력창 왼쪽의 사이트 아이콘을 클릭-드래그 시작</li>
<li>바탕화면으로 끌고 와서 드롭</li>
</ol>
<picture>
<source srcset="./../../../resources/image/help/chrome_shortcut_icon_drag.png" type="image/svg+xml">
<img src="./../../../resources/image/help/chrome_shortcut_icon_drag.png" class="img-fluid img-thumbnail" alt="새로 만들기">
</picture>
</li>
<li>
<span class="text-primary">주소 변경 가능</span>
<ol>
<li>바로 가기 아이콘을 마우스 오른쪽 클릭하고 [속성(R)] 클릭</li>
<li>팝업창에서 바로 가기 url을 새로 입력</li>
</ol>
</li>
</ul>
</p>
<h5 class="card-title">IE11</h5>
<p class="card-text">
<ul>
<li>
<span class="text-primary">생성 가능</span>
<ol>
<li>주소입력창 왼쪽의 사이트 아이콘을 클릭-드래그 시작</li>
<li>바탕화면으로 끌고 와서 드롭</li>
</ol>
<picture>
<source srcset="./../../../resources/image/help/ie11_shortcut_icon_drag.png" type="image/svg+xml">
<img src="./../../../resources/image/help/ie11_shortcut_icon_drag.png" class="img-fluid img-thumbnail" alt="새로 만들기">
</picture>
</li>
<li>
<span class="text-danger">주소 변경 불가능</span>
<ul>
<li>생성된 아이콘 파일이 .url 이 아니라 .website 여서 내용 변경이 안됨
</li>
</ul>
</li>
</ul>
</p>
<h5 class="card-title">MS Edge</h5>
<p class="card-text">
<ul>
<li>
<span class="text-danger">생성 불가능</span>
<ol>
<li>주소입력창 왼쪽의 사이트 아이콘을 클릭-드래그 시작</li>
<li>바탕화면에 <span class="text-danger">드롭 불가 표시</span>가 나타남</li>
</ol>
<picture>
<source srcset="./../../../resources/image/help/edge_shortcut_icon_drag.png" type="image/svg+xml">
<img src="./../../../resources/image/help/edge_shortcut_icon_drag.png" class="img-fluid img-thumbnail" alt="새로 만들기">
</picture>
</li>
<li>
<span class="text-danger">주소 변경 불가능</span>
</li>
</ul>
</p>
</div>
</div>
<br/>
</div> <!-- modal-body -->
@@ -0,0 +1,78 @@
<div class="modal-header">
<h5 class="modal-title" id="contractModalLabel">엑셀에 클립보드 데이터 붙여넣기</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="card">
<h5 class="card-header bg-info text-white">엑셀에 데이터 붙여넣기</h5>
<div class="card-body">
<h5 class="card-title">바로 가기 파일 다운받기</h5>
<p class="card-text">
<ul>
<li>아래의 바로 가기 파일 다운로드 받기</li>
</ul>
<a href="./../../../resources/file/chocomae.url" download>
<img src="./../../../resources/image/icon/icon_chocomae.png" class="rounded mx-auto d-block" alt="바로 가기 아이콘 파일">
<div class="text-center">초코마에 바로 가기 아이콘 다운로드</div>
</a>
</p>
<br/>
<h5 class="card-title">내용 수정하기</h5>
<p class="card-text">
<ul>
<li>바로 가기 파일을 마우스 오른쪽 버튼 클릭</li>
<li>팝업창에서 [속성(R)] 클릭</li>
<li>
[웹 문서] 탭에서 "URL(U)"에 수정할 주소 입력
<picture>
<source srcset="./../../../resources/image/help/shortcut_icon_url.png" type="image/svg+xml">
<img src="./../../../resources/image/help/shortcut_icon_url.png" class="img-fluid img-thumbnail" alt="바로 가기 주소 수정">
</picture>
</li>
<li>[확인] 버튼 클릭</li>
</ul>
</p>
</div>
</div>
<br/>
<div class="card">
<h5 class="card-header bg-info text-white">필터 사용</h5>
<div class="card-body">
<h5 class="card-title">필터 적용하기</h5>
<p class="card-text">
<ul>
<li>아래의 바로 가기 파일 다운로드 받기</li>
</ul>
<a href="./../../../resources/file/chocomae.url" download>
<img src="./../../../resources/image/icon/icon_chocomae.png" class="rounded mx-auto d-block" alt="바로 가기 아이콘 파일">
<div class="text-center">초코마에 바로 가기 아이콘 다운로드</div>
</a>
</p>
<br/>
<h5 class="card-title">필터링하기</h5>
<p class="card-text">
<ul>
<li>바로 가기 파일을 마우스 오른쪽 버튼 클릭</li>
<li>팝업창에서 [속성(R)] 클릭</li>
<li>
[웹 문서] 탭에서 "URL(U)"에 수정할 주소 입력
<picture>
<source srcset="./../../../resources/image/help/shortcut_icon_url.png" type="image/svg+xml">
<img src="./../../../resources/image/help/shortcut_icon_url.png" class="img-fluid img-thumbnail" alt="바로 가기 주소 수정">
</picture>
</li>
<li>[확인] 버튼 클릭</li>
</ul>
</p>
</div>
</div>
<br/>
</div> <!-- modal-body -->
@@ -0,0 +1,78 @@
<div class="modal-header">
<h5 class="modal-title" id="contractModalLabel">엑셀에 클립보드 데이터 붙여넣기</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="card">
<h5 class="card-header bg-info text-white">엑셀에 데이터 붙여넣기</h5>
<div class="card-body">
<h5 class="card-title">바로 가기 파일 다운받기</h5>
<p class="card-text">
<ul>
<li>아래의 바로 가기 파일 다운로드 받기</li>
</ul>
<a href="./../../../resources/file/chocomae.url" download>
<img src="./../../../resources/image/icon/icon_chocomae.png" class="rounded mx-auto d-block" alt="바로 가기 아이콘 파일">
<div class="text-center">초코마에 바로 가기 아이콘 다운로드</div>
</a>
</p>
<br/>
<h5 class="card-title">내용 수정하기</h5>
<p class="card-text">
<ul>
<li>바로 가기 파일을 마우스 오른쪽 버튼 클릭</li>
<li>팝업창에서 [속성(R)] 클릭</li>
<li>
[웹 문서] 탭에서 "URL(U)"에 수정할 주소 입력
<picture>
<source srcset="./../../../resources/image/help/shortcut_icon_url.png" type="image/svg+xml">
<img src="./../../../resources/image/help/shortcut_icon_url.png" class="img-fluid img-thumbnail" alt="바로 가기 주소 수정">
</picture>
</li>
<li>[확인] 버튼 클릭</li>
</ul>
</p>
</div>
</div>
<br/>
<div class="card">
<h5 class="card-header bg-info text-white">필터 사용</h5>
<div class="card-body">
<h5 class="card-title">필터 적용하기</h5>
<p class="card-text">
<ul>
<li>아래의 바로 가기 파일 다운로드 받기</li>
</ul>
<a href="./../../../resources/file/chocomae.url" download>
<img src="./../../../resources/image/icon/icon_chocomae.png" class="rounded mx-auto d-block" alt="바로 가기 아이콘 파일">
<div class="text-center">초코마에 바로 가기 아이콘 다운로드</div>
</a>
</p>
<br/>
<h5 class="card-title">필터링하기</h5>
<p class="card-text">
<ul>
<li>바로 가기 파일을 마우스 오른쪽 버튼 클릭</li>
<li>팝업창에서 [속성(R)] 클릭</li>
<li>
[웹 문서] 탭에서 "URL(U)"에 수정할 주소 입력
<picture>
<source srcset="./../../../resources/image/help/shortcut_icon_url.png" type="image/svg+xml">
<img src="./../../../resources/image/help/shortcut_icon_url.png" class="img-fluid img-thumbnail" alt="바로 가기 주소 수정">
</picture>
</li>
<li>[확인] 버튼 클릭</li>
</ul>
</p>
</div>
</div>
<br/>
</div> <!-- modal-body -->
@@ -0,0 +1,52 @@
<div class="modal-header">
<h5 class="modal-title" id="contractModalLabel">학생 이름으로 검색하기</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="card">
<h5 class="card-header bg-info text-white">학생 이름 검색 팁</h5>
<div class="card-body">
<h5 class="card-title">전체 학생 검색</h5>
<p class="card-text">
<ul>
<li>
전체 학생을 검색하려면, 학생 이름을 <span class="text-danger">빈 칸</span>으로 남겨주세요.
<input type="text" class="form-control" placeholder="" disabled>
</li>
</ul>
</p>
<br/>
<!--
<h5 class="card-title">여러 명을 한꺼번에 검색</h5>
<p class="card-text">
<ul>
<li>
검색할 학생들의 이름 사이에 <b>공백</b>을 입력합니다.
<input type="text" class="form-control" placeholder="홍길동 최영희 김철수" disabled>
</li>
</ul>
</p>
<br/>
-->
<h5 class="card-title">검색어를 포함하는 모든 이름이 출력됩니다.</h5>
<p class="card-text">
<ul>
<li class="mb-1">
검색어 : <span class="text-primary">영희</span><br/>→ 결과 : 김<span class="text-success">영희</span>, 박<span class="text-success">영희</span>, 최<span class="text-success">영희</span>
</li>
<li>
검색어 : <span class="text-primary"></span><br/>→ 결과 : <span class="text-success"></span>수혁, 존<span class="text-success"></span>, 최<span class="text-success"></span>
</li>
</ul>
</p>
</div>
</div>
<br/>
</div> <!-- modal-body -->
+41
View File
@@ -0,0 +1,41 @@
<div class="modal-header">
<h5 class="modal-title" id="contractModalLabel">과목별로 검색하기</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="card">
<h5 class="card-header bg-info text-white">과목 검색 안내</h5>
<div class="card-body">
<h5 class="card-title">한 과목씩만 검색</h5>
<p class="card-text">
<ul>
<li>서버 부담을 줄이기 위해, 한 과목씩만 검색하도록 제한하였습니다.</li>
<li></li>
</ul>
</p>
<br/>
<h5 class="card-title">묶음 검색</h5>
<p class="card-text">
<ul>
<li>타자 연습, 타자 시험의 경우 묶음 검색을 제공합니다.</li>
<li>한글, 영문으로 구분되어 제공됩니다.</li>
<li class="mb-1">
<b>한글 타자 <span class="text-primary">연습</span> 묶음</b>에는 아래와 같은 과목이 포함됩니다.<br/>
<span class="text-secondary">: 기본 자리, 왼손 윗글쇠, 검지 글쇠, 오른손 윗글쇠, 왼손 밑글쇠, 오른손 밑글쇠, 왼손 쌍자음, 오른손 쌍모음</span>
</li>
<li>
<b>한글 타자 <span class="text-primary">시험</span> 묶음</b>에는 아래와 같은 과목이 포함됩니다.<br/>
<span class="text-secondary">: 기본 자리, 왼손 윗글쇠, 검지 글쇠, 오른손 윗글쇠, 왼손 밑글쇠, 오른손 밑글쇠, 왼손 쌍자음, 오른손 쌍모음, <span class="text-info">시험 - 단어, 시험 - 문장</span></span>
</li>
</ul>
</p>
</div>
</div>
<br/>
</div> <!-- modal-body -->