emp.html 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. <!DOCTYPE html>
  2. {% load static %}
  3. <html lang="en">
  4. <head>
  5. <meta charset="UTF-8">
  6. <title>员工</title>
  7. <link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
  8. </head>
  9. <body>
  10. <div class="container">
  11. <div class="row clearfix">
  12. <div class="col-md-12 column">
  13. <h3>{{ dept_name }}员工信息</h3>
  14. <hr>
  15. </div>
  16. </div>
  17. <div class="row clearfix">
  18. <div class="col-md-8 column">
  19. {% if emp_list %}
  20. <table id="dept" class="table table-striped table-hover">
  21. <thead>
  22. <tr>
  23. <th>编号</th>
  24. <th>姓名</th>
  25. <th>职位</th>
  26. <th>月薪</th>
  27. <th>部门名称</th>
  28. </tr>
  29. </thead>
  30. <tbody>
  31. {% for emp in emp_list %}
  32. <tr>
  33. <td>{{ emp.no }}</td>
  34. <td>{{ emp.name }}</td>
  35. <td>{{ emp.job }}</td>
  36. <td>{{ emp.sal }}</td>
  37. <td>{{ dept_name }}</td>
  38. </tr>
  39. {% endfor %}
  40. </tbody>
  41. </table>
  42. {% else %}
  43. <h2>此部门暂时没有员工!</h2>
  44. {% endif %}
  45. </div>
  46. <div class="col-md-4 column">
  47. </div>
  48. </div>
  49. <a href="{% url 'depts' %}">返回部门列表</a>
  50. </div>
  51. <script src="{% static 'js/jquery.min.js' %}"></script>
  52. <script src="{% static 'js/bootstrap.min.js' %}"></script>
  53. <script>
  54. $(function() {
  55. $('#dept tbody tr:even').addClass('info');
  56. $('#dept tbody tr:odd').addClass('warning');
  57. });
  58. </script>
  59. </body>
  60. </html>