Attendance/templates/homeroom.html

245 lines
No EOL
14 KiB
HTML
Vendored
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Homeroom 班級 {{homeroomCode[0]}}{{homeroomCode[1]}}) - Attendance 點名</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
<link rel="stylesheet" href="/static/allpages.css">
<link rel="stylesheet" href="/static/homeroom.css">
<link rel="shortcut icon" type="image/x-icon" href="/static/favicon.ico" />
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-H6D61RSBHR"></script>
<script src="/static/gtag.js"></script>
</head>
<body>
<div class="showTime"><span id="showTime"></span></div>
<div class="container">
<h1 class="margin-top">Homeroom View | 班級主頁</h1>
<h2 class="margin-top">{{homeroomCode[0]}}{{homeroomCode[1]}}</h2>
<h2>[{{currDate}}]</h2>
<a href="/logout"><button class="btn btn-primary logout margin-top">Logout 登出</button></a>
<a href="/select"><button class="btn btn-primary margin-top logout">Choose Subuser 選擇其他帳號</button></a>
<select name="date" id="date" class="form-select logout" onchange="chgDate();">
{% for date in range(dateKeys|length) %}
{% if dateKeys[date] == currDate %}
{% if date-2 >= 0 %}<option value="{{dateKeys[date-2]}}">{{dateKeys[date-2]}}</option>{% endif %}
{% if date-1 >= 0 %}<option value="{{dateKeys[date-1]}}">{{dateKeys[date-1]}}</option>{% endif %}
<option value="{{dateKeys[date]}}" selected="selected">{{dateKeys[date]}} ★</option>
{% for i in range(1,5) %}
{% if date+i < dateKeys|length %}<option value="{{dateKeys[date+i]}}">{{dateKeys[date+i]}}</option>{%endif%}
{% endfor %}
{% endif %}
{% endfor %}
</select>
<form action="/manage/homeroom_confirm" id="homeroom_confirm" method="post">
<input type="hidden" name="date" value="{{currDate}}">
<input type="hidden" name="homeroom" value="{{homeroomCode[0]}}^{{homeroomCode[1]}}">
<input type="hidden" id="hrCfrm-sign" name="signatureData" value="">
<input type="hidden" id="hrCfrm-notes" name="notes" value="">
</form>
<div class="col">
<div class="sticky-top" style="background-color:white;">
<div class="row title">
<div class="col">班級</div>
<div class="col">座號</div>
<div class="col">姓名</div>
<div class="col">英文姓名</div>
{% for i in periods %}
<div class="col" {% if currPeriod==i %} style="background-color: #ffdf81;" {% endif %}>{{i}}</div>
{% endfor %}
</div>
<div class="row title">
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
{% for i in periods %}
<div class="col" {% if currPeriod==i %} style="background-color: #ffdf81;" {% endif %}>
{{absData[currDate][i]['name']}}</div>
{% endfor %}
</div>
<div class="row title">
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
{% for i in periods %}
<div class="col" {% if currPeriod==i %} style="background-color: #ffdf81;" {% endif %}>
{{absData[currDate][i]['teacher']}}</div>
{% endfor %}
</div>
</div>
{% for i in homeroomData %}
<div class="row">
<div class="col">{{homeroomCode[0]}}{{homeroomCode[1]}}</div>
<div class="col">{{i}}</div>
<div class="col">{{ homeroomData[i]['name'] }}</div>
<div class="col">{{ homeroomData[i]['eng_name'] }}</div>
{% for j in periods %}
<div class="col view-{{j}}" {% if currPeriod==j %} style="background-color: #ffdf81;" {% endif %}>
{% if 'signature' in absData[currDate][j] %}
{% if i in absData[currDate][j] %}
{% if absData[currDate][j][i] == 1 %}
<p class="highlightAbs n-2 view-n-{{i}}">X</p>
{% else %}
<p class="highlightAbs n-3 view-n-{{i}}">𝜑</p>
{% endif %}
{% else %}
{% if absData[currDate][j]['name'] != 'GP' %}
<p class="highlightAbs n-1 view-n-{{i}}">V</p>
{% else %}
{% if (homeroomData[i]['GP_Class'][absData[currDate][j]['teacher']] in
absData[currDate][j]['signature'] or 'STUD_AFFAIR_OFFICE' in absData[currDate][j]['signature'])%}
<p class="highlightAbs n-1 view-n-{{i}}">V</p>
{% else %}
<p class="highlightAbs n-2 view-n-{{i}}"></p>
{% endif %}
{% endif %}
{% endif %}
{% elif absData[currDate][j]['name'] == 'GP' %}
<p class="highlightAbs"></p>
{% else %}
{% if 'confirm' in absData[currDate] %}
<p class="highlightAbs"></p>
{% else %}
<input type="checkbox" class="tobeform 2^{{j}}^{{i}} late" id="late^{{j}}^{{i}}"
onchange="unCheckAbs('{{j}}^{{i}}')">
<input type="checkbox" class="tobeform 1^{{j}}^{{i}} absent" id="absent^{{j}}^{{i}}"
onchange="unCheckLate('{{j}}^{{i}}')">
{% endif %}
<!-- <input type="checkbox" class="tobeform {{j}}^{{i}}"> -->
{% endif %}
</div>
{% endfor %}
</div>
{% endfor %}
<div class="row">
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
{% for i in periods %}
<div id="btns-{{i}}" class="col" {% if currPeriod==i %} style="background-color: #ffdf81;" {% endif %}>
{% if (absData[currDate][i]['name'] == 'GP' or 'confirm' in absData[currDate] or 'signature' in
absData[currDate][i]) %}
<button class="btn btn-primary afterSelButton" disabled="disabled"></button>
{% else %}
<button class="btn btn-primary afterSelButton"
onclick="afterSelAbs('{{i|string}}', 'newSubmit')">Confirm<br>{{absData[currDate][i]['name']}}</button>
{% endif %}
</div>
{% endfor %}
</div>
<form action="/manage/homeroom_abs" id="postHomeroomAbs" hidden="hidden" method="post">
<input type="text" id="HR-date" name="date" value="{{currDate}}">
<input type="text" id="HR-period" name="period" value="">
<input type="text" id="HR-signatureData" name="signatureData" value="">
<input type="text" id="HR-notes" name="notes" value="">
<input type="text" id="HR-homeroom" name="homeroom" value="{{homeroomCode[0]}}^{{homeroomCode[1]}}">
<input type="text" id="HR-type" name="stype" value="">
</form>
{% if 'confirm' in absData[currDate] %}
<button class="btn btn-primary margin-top afterSelButton" onclick="homeroomCfrm()" disabled="disabled">
Homeroom Teacher Already Confirmed | 班導已確認</button>
{% else %}
<button class="btn btn-primary margin-top afterSelButton" onclick="homeroomCfrm()">Homeroom
Teacher Confirm | 班導確認</button>
{% endif %}
<div id="finalCheck" class="modal fade" id="staticBackdrop" data-bs-backdrop="static"
data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-xl">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="staticBackdropLabel">Please Sign Below 請在下方簽名</h5>
</div>
<div class="modal-body">
<h3>Period: <span id="showSignPeriod"></span></h3>
<h3>Subject: <span id="showSignSubjectName"></h3>
<div class="alert alert-warning margin-top" id="allPresentWarning" role="alert"
hidden="hidden">
<h4 class="alert-heading">請確認是否全班全到Please check if everyone is present!</h4>
</div>
<div class="forSign"><canvas id="signature_pad"></canvas></div>
<h3 class="margin-top">Notes 備註欄</h3>
<input type="textarea" class="form-control" name="notes" id="subjectNotes"
placeholder="Enter Notes 請輸入備註" style="width: 80%; margin-left: 10%;" row="3">
</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" onclick="signaturePad.clear()">Clear
Signature 清除簽名</button>
<button type="button" class="btn btn-danger" onclick="location.reload();">Cancel
取消</button>
<button type="button" class="btn btn-primary submitButton" onclick="submitForm()">Submit
提交</button>
</div>
</div>
</div>
</div>
{% for c in range(periods|length + 1) %}
{% if c % 4 == 0 %}
<div class="row signatures">
{% endif %}
<div class="col half">
{% if c == 0 %}
<div class="row needborder">Homeroom Teacher 導師</div>
{% if 'confirm' in absData[currDate] %}
<div class="row"><img src="{{absData[currDate]['confirm']}}" alt=""></div>
<div class="row">備註: {{absData[currDate]['notes']}}</div>
{% else %}
<div class="row"><span style="color:red;">No Signature 導師尚未簽名</span></div>
{% endif %}
{% else %}
{% if absData[currDate][periods[c-1]]['name'] == 'GP' %}
{% if 'signature' in absData[currDate][periods[c-1]] %}
{% for i in absData[currDate][periods[c-1]]['signature'] %}
<div class="row needborder">{{periods[c-1]}}: {{absData[currDate][periods[c-1]]['teacher']}}: {{i}}:
{{absData[currDate][periods[c-1]]['names'][i]}}</div>
<div class="row"><img src="{{absData[currDate][periods[c-1]]['signature'][i]}}" alt="">
{% if loop.index == loop.length %}
<br>備註: {{absData[currDate][periods[c-1]]['notes']}}
{% endif %}
</div>
{% endfor %}
{% else %}
<div class="row needborder">{{periods[c-1]}}: {{absData[currDate][periods[c-1]]['teacher']}}: No
Signature
</div>
<div class="row"></div>
{% endif %}
{% else %}
<div class="row needborder">{{periods[c-1]}}: {{absData[currDate][periods[c-1]]['name']}}:
{{absData[currDate][periods[c-1]]['teacher']}}
</div>
<div class="row"><img src="{{absData[currDate][periods[c-1]]['signature']}}" alt=""><br>備註:
{{absData[currDate][periods[c-1]]['notes']}}</div>
{% endif %}
{% endif %}
</div>
{% if c % 4 == 3 %}
</div>
{% endif %}
{% endfor %}
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/signature_pad@2.3.2/dist/signature_pad.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
crossorigin="anonymous"></script>
{% include 'footer.html' %}
<script>
var periodData = {}
{% for i in periods %}
periodData['{{i}}'] = '{{ absData[currDate][i]['name'] }}'
{% endfor %}
</script>
<script src="/static/pagejs/homeroom.js"></script>
<script src="/static/time.js"></script>
</body>
</html>