search.html 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. <!DOCTYPE html>
  2. {% load staticfiles %}
  3. <html lang="en">
  4. <head>
  5. <meta charset="UTF-8">
  6. <title>车辆违章查询</title>
  7. <style>
  8. * {
  9. font: 18px/30px Arial;
  10. }
  11. #container {
  12. width: 960px;
  13. margin: 0 auto;
  14. }
  15. #container form {
  16. width: 620px;
  17. margin: 10px auto;
  18. padding-top: 100px;
  19. }
  20. #container form input[type=search] {
  21. display: inline-block;
  22. width: 480px;
  23. height: 30px;
  24. }
  25. #container form input[type=submit] {
  26. display: inline-block;
  27. width: 80px;
  28. height: 40px;
  29. border: None;
  30. background-color: red;
  31. color: white;
  32. margin-left: 20px;
  33. }
  34. #container table {
  35. width: 920px;
  36. margin: 20px auto;
  37. border-collapse: collapse;
  38. }
  39. #container table th {
  40. font-weight: bolder;
  41. border-bottom: 1px solid darkgray;
  42. }
  43. #container table td {
  44. text-align: center;
  45. height: 50px;
  46. width: 180px;
  47. }
  48. </style>
  49. </head>
  50. <body>
  51. <div id="container">
  52. <form action="/search" method="post">
  53. <!-- 跨站身份伪造: 利用浏览器存储的cookie中的用户身份标识冒充用户执行操作 -->
  54. <!-- 防范跨站身份伪造最佳的做法就是在表单中放置随机令牌 -->
  55. <!-- 除此之外通过设置令牌还可以防范表单重复提交以及重放攻击 -->
  56. <!-- 隐藏域 / 隐式表单域: 页面上是无法看到该内容-->
  57. {% csrf_token %}
  58. <input type="search" name="carno" placeholder="请输入你的车牌号" required>
  59. <input type="submit" value="搜索">
  60. </form>
  61. <hr>
  62. {% if show_result %}
  63. <table>
  64. <tr>
  65. <th>车牌号</th>
  66. <th>违章原因</th>
  67. <th>违章时间</th>
  68. <th>处罚方式</th>
  69. <th>是否受理</th>
  70. </tr>
  71. {% for record in record_list %}
  72. <tr>
  73. <td>{{ record.carno }}</td>
  74. <td>{{ record.reason }}</td>
  75. <td>{{ record.happen_date }}</td>
  76. <td>{{ record.punish }}</td>
  77. <td>
  78. {% if record.isdone %}
  79. <img src="{% static '/images/icon-yes.svg' %}">
  80. {% else %}
  81. <img src="{% static '/images/icon-no.svg' %}">
  82. {% endif %}
  83. </td>
  84. </tr>
  85. {% endfor %}
  86. </table>
  87. {% endif %}
  88. </div>
  89. </body>
  90. </html>