seat_sticker.blade.php 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport"
  6. content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  7. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  8. <title>考生考场座位贴</title>
  9. <style>
  10. .room{
  11. width: 100%;
  12. border:1px solid #cecece;
  13. }
  14. .room.selected{
  15. border:1px solid #f20e01;
  16. }
  17. .print h2{
  18. text-align: center;
  19. }
  20. .print .list .item{
  21. width: 280px;
  22. text-align: center;
  23. line-height: 40px;
  24. font-weight: bold;
  25. font-size: 19px;
  26. float: left;
  27. margin: 0 10px 30px;
  28. padding: 10px 0;
  29. border: 1px solid #ccc;
  30. }
  31. .print .list .item .avatar{
  32. width: 180px;
  33. height: 253px;
  34. margin: 0 auto;
  35. }
  36. </style>
  37. </head>
  38. <body>
  39. @foreach($data as $k=>$v)
  40. <h1>
  41. 考场名称:{{ $k }}
  42. </h1>
  43. @foreach($v as $kk => $vv)
  44. <h2>
  45. {{ $kk }} 座位贴
  46. </h2>
  47. <div class="room clearfix">
  48. <div class="print">
  49. <div class="list" style="padding-top:30px">
  50. @foreach($vv as $key => $val)
  51. <div class="item">
  52. <div class="avatar">
  53. <img src="{{$val['avatar']}}" width="170" height="247"/>
  54. </div>
  55. <div class="seat">
  56. 座位号:{{$val['seat']}}
  57. </div>
  58. <div class="realname">
  59. 姓名:{{$val['realname']}}
  60. </div>
  61. <div class="number">
  62. 准考证:{{$val['number']}}
  63. </div>
  64. </div>
  65. @endforeach
  66. </div>
  67. </div>
  68. </div>
  69. <div class="print" style="margin: 10px 0;text-align: center">
  70. <button class="print_page btn btn-sm btn-info" style="width: 200px;height: 60px;font-size: 30px;line-height: 40px">打印此页</button>
  71. </div>
  72. @endforeach
  73. @endforeach
  74. <div id="print_body" ></div>
  75. <script type="text/javascript" src="{{ theme_asset('app/js/hiprint/polyfill.min.js') }}"></script>
  76. <script type="text/javascript" src="{{ theme_asset('app/js/hiprint/hiprint.bundle.js') }}"></script>
  77. <script type="text/javascript" src="{{ theme_asset('app/js/hiprint/plugins/JsBarcode.all.min.js') }}"></script>
  78. <script type="text/javascript" src="{{ theme_asset('app/js/hiprint/plugins/qrcode.js') }}"></script>
  79. <script type="text/javascript" src="{{ theme_asset('app/js/jQuery.print.js') }}"></script>
  80. <script>
  81. $(".print_page").on('mouseover',function(){
  82. var dom = $(this).parent().prev();
  83. $(dom).addClass('selected')
  84. });
  85. $(".print_page").on('mouseout',function(){
  86. var dom = $(this).parent().prev();
  87. $(dom).removeClass('selected')
  88. });
  89. $(".print_page").on('click',function(){
  90. var dom = $(this).parent().prev();
  91. console.log(dom)
  92. $(dom).print()
  93. });
  94. </script>
  95. </body>
  96. </html>