rank.blade.php 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306
  1. @extends('admin/layout')
  2. @section('header')
  3. @endsection
  4. <style type="text/css">
  5. ul {
  6. padding-left: 0;
  7. margin: 0;
  8. }
  9. li {
  10. list-style-type: none;
  11. }
  12. table {
  13. border-spacing: 0;
  14. border-collapse: collapse;
  15. }
  16. td {
  17. display: table-cell;
  18. vertical-align: inherit;
  19. }
  20. .de-boxs {
  21. margin-left: 10px;
  22. }
  23. .containers {
  24. max-width: 1200px;
  25. }
  26. .table-boxs {
  27. display: flex;
  28. margin-left: 15px;
  29. }
  30. .box-right {
  31. width: 78%;
  32. float: left;
  33. }
  34. .box-left {
  35. width: 22%;
  36. float: left;
  37. }
  38. .box-ul {
  39. display: flex;
  40. justify-content: center;
  41. align-items: center;
  42. padding-left: 0;
  43. margin: 0 -10px;
  44. padding-bottom: 10px;
  45. }
  46. .box-ul li {
  47. margin: 0 10px;
  48. width: 25%;
  49. }
  50. .box-ul li .part {
  51. border: 1px solid #d6d6d6;
  52. padding: 10px 20px;
  53. text-align: center;
  54. background: #f6f6f6 !important;
  55. display: flex;
  56. align-items: center;
  57. justify-content: center;
  58. border-radius: 4px;
  59. }
  60. .box-ul li .part .titles {
  61. font-size: 14px;
  62. display: block;
  63. margin-bottom: 0;
  64. }
  65. .box-ul li .part .datas {
  66. display: block;
  67. font-size: 14px;
  68. color: #2f4050;
  69. padding: 0 30px;
  70. }
  71. .table-wrap {
  72. }
  73. .table-wrap table {
  74. width: 100%;
  75. }
  76. .table-wrap table tr td {
  77. padding: 15px 20px;
  78. text-align: center;
  79. color: #505050;
  80. }
  81. .table-wrap table tr:nth-child(odd) {
  82. background: #f6f6f6;
  83. }
  84. .table-wrap table thead tr td {
  85. background: #2f4050 !important;
  86. color: #fff;
  87. font-size: 14px;
  88. }
  89. .table-wrap table thead {
  90. border: 1px solid #2f4050;
  91. }
  92. .table-wrap table tbody {
  93. border: 1px solid #d6d6d6;
  94. }
  95. .box-left {
  96. margin-left: 30px;
  97. border: 1px solid #d6d6d6;
  98. }
  99. .box-left .border-box {
  100. }
  101. .box-left .light-title {
  102. line-height: 56px;
  103. font-size: 14px;
  104. text-align: center;
  105. margin-top: 0;
  106. background: #2f4050 !important;
  107. color: #fff;
  108. text-transform: uppercase;
  109. margin-bottom: 0;
  110. border: 1px solid #2f4050;
  111. }
  112. .box-left .name-ul {
  113. padding-left: 0;
  114. }
  115. .box-left .name-ul li {
  116. line-height: 52px;
  117. font-size: 14px;
  118. text-align: center;
  119. cursor: pointer;
  120. margin-bottom: -2px;
  121. color: #505050;
  122. }
  123. .box-left .name-ul li:nth-child(odd) {
  124. background: #f6f6f6;
  125. }
  126. .box-left .name-ul li:hover {
  127. background: #2f4050 !important;
  128. color: #fff;
  129. }
  130. .btn-danger, .btn-primary, .btn-info {
  131. background: #009688 !important;
  132. border-color: #009688 !important;
  133. }
  134. </style>
  135. <body class="gray-bg">
  136. <div style="margin-left: 10px">
  137. <form action="{{url('/admin/plan/rank/'.$type)}}" method="get">
  138. <div style="display: flex;padding: 10px 0;">
  139. <select data-placeholder="请选择人员..." style="width:150px;" name="user" class="form-control">
  140. <option value="">请选择人员</option>
  141. @foreach($userList as $key=>$value)
  142. <option value="{{$key}}" @if(($user)==$key) selected @endif>{{$value}}</option>
  143. @endforeach
  144. </select>
  145. <input type="text" placeholder="请输入搜索日期" class="input-md form-control"
  146. name="date" id="date" style="width: 150px;float: right" value="{{$date}}">
  147. <input style="margin-left: 10px;border-radius:3px;" type="submit" class="btn btn-primary" value="搜索">
  148. </div>
  149. </form>
  150. </div>
  151. <div class="de-boxs">
  152. <div class="containers">
  153. <div class="row clearfix">
  154. <div class="table-boxs">
  155. <div class='box-right'>
  156. {{-- <ul class="clearfix box-ul">
  157. <li class="li-box">
  158. <div class="part">
  159. <p class="titles">上周</p>
  160. <span class="datas">{{$lastWeekSum??0}}</span>
  161. </div>
  162. </li>
  163. <li class="li-box">
  164. <div class="part">
  165. <p class="titles">上月</p>
  166. <span class="datas">{{$lastMonth??0}}</span>
  167. </div>
  168. </li>
  169. <li class="li-box">
  170. <div class="part">
  171. <p class="titles">近三月</p>
  172. <span class="datas">{{$threeMonths??0}}</span>
  173. </div>
  174. </li>
  175. <li class="li-box">
  176. <div class="part">
  177. <p class="titles">近半年</p>
  178. <span class="datas">{{$halfOfaYear??0}}</span>
  179. </div>
  180. </li>
  181. </ul>--}}
  182. <div class="table-wrap">
  183. <table>
  184. <thead>
  185. <tr>
  186. <td>任务类型</td>
  187. <td>完成数量</td>
  188. <td>未完成数量</td>
  189. <td>工时(时)</td>
  190. <td>kpi</td>
  191. <td>人员</td>
  192. <td>截止日期</td>
  193. </tr>
  194. </thead>
  195. <tbody>
  196. @php
  197. $quantityCompleted=0;
  198. $unfinishedQuantity=0;
  199. $kpiSum=0;
  200. @endphp
  201. @foreach($list as $key=>$value)
  202. @php
  203. $endDate=$value['end_date'];
  204. $user=$value['user'];
  205. $quantityCompleted+=$value['count'];
  206. $unfinishedQuantity+=($value['count']-$value['complete_total']);
  207. /* if($value['id']==16){
  208. $kpiSum+=($value['score']*$value['complete_slices_total']);
  209. }else{
  210. $kpiSum+=($value['score']*$value['complete_total']);
  211. }*/
  212. $kpiSum+=($value['score']*$value['complete_total']);
  213. @endphp
  214. <tr>
  215. <td>{{$value['name']}}</td>
  216. <td>{{$value['complete_total']}}</td>
  217. <td>{{$value['count']-$value['complete_total']}}</td>
  218. <td>{{$value['score']}}</td>
  219. {{-- @if($value['id']==16)
  220. <td>{{$value['score']*$value['complete_slices_total']}}</td>
  221. @else
  222. <td>{{$value['score']*$value['complete_total']}}</td>
  223. @endif--}}
  224. <td>{{$value['score']*$value['complete_total']}}</td>
  225. <td>{{$value['user']}}</td>
  226. <td>{{$value['end_date']}}</td>
  227. </tr>
  228. @endforeach
  229. <tr>
  230. <td>总计</td>
  231. <td>{{$quantityCompleted}}</td>
  232. <td>{{$unfinishedQuantity}}</td>
  233. <td></td>
  234. <td>{{$kpiSum}}</td>
  235. <td>{{$user}}</td>
  236. <td></td>
  237. </tr>
  238. </tbody>
  239. </table>
  240. </div>
  241. </div>
  242. <div class="box-left">
  243. <div class="border-box">
  244. <p class="light-title">
  245. 截止{{$endDate}}排名
  246. </p>
  247. <ul class='name-ul'>
  248. @foreach($rank as $key=>$value)
  249. <li>
  250. <span>{{$value['user']}}({{$value['rank']}})</span>
  251. </li>
  252. @endforeach
  253. </ul>
  254. </div>
  255. </div>
  256. </div>
  257. </div>
  258. </div>
  259. </div>
  260. </body>
  261. @section('footer')
  262. <script src="{{asset('js/plugins/layDate-v5.0.9/laydate/laydate.js')}}"></script>
  263. <script type="text/javascript">
  264. $(function () {
  265. laydate.render({
  266. elem: '#date',
  267. type: 'month'
  268. });
  269. });
  270. </script>
  271. @endsection