Python-100-Days/Day41-55/oa/templates/dept.html

84 lines
2.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
{% load static %}
<html lang="en">
<head>
<meta charset="UTF-8">
<title>部门</title>
<link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
<style>
#dept td, #dept th {
text-align: center;
}
</style>
</head>
<body>
<div class="container">
<div class="row clearfix">
<div class="col-md-12 column">
<h3>部门信息</h3>
<hr>
</div>
</div>
<div class="row clearfix">
<div class="col-md-8 column">
<table id="dept" class="table table-striped table-hover">
<thead>
<tr>
<th>部门编号</th>
<th>部门名称</th>
<th>部门所在地</th>
<th>是否优秀</th>
<th>操作</th>
</tr>
</thead>
<tbody>
{% for dept in dept_list %}
<tr>
<td>{{ dept.no }}</td>
<td>
<!-- 写代码时要尽量避免使用硬编码(hard code) -->
<a href="{% url 'empsindept' dept.no %}">{{ dept.name }}</a>
</td>
<td>{{ dept.location }}</td>
<td>
{% if dept.excellent %}
<span style="color: green;"></span>
{% else %}
<span style="color: red;">×</span>
{% endif %}
</td>
<td>
<a id="{{ dept.no }}" href="javascript:void(0);" class="btn btn-xs btn-warning">删除</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<div class="col-md-4 column">
</div>
</div>
</div>
<script src="{% static 'js/jquery.min.js' %}"></script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
<script>
$(function() {
$('#dept tbody tr:even').addClass('info');
$('#dept tbody tr:odd').addClass('warning');
$('#dept a[id]').on('click', function(evt) {
var a = $(evt.target);
if (confirm('确定要删除吗?')) {
$.getJSON('/hrs/deldept/' + a.attr('id'), function(json) {
if (json.code == 200) {
a.parent().parent().remove();
$('#dept tbody tr:even').addClass('info');
$('#dept tbody tr:odd').addClass('warning');
}
});
}
});
});
</script>
</body>
</html>