uprojects.blade.php 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741
  1. @extends('layouts.master')
  2. @section('style')
  3. <link href="{{URL::asset('assets/css/jquery.datetimepicker.css')}}" rel="stylesheet" type="text/css"/>
  4. <style type="text/css">
  5. .cls-show-time{
  6. color: #000;
  7. font-style: italic;
  8. font-size: 12px;
  9. }
  10. </style>
  11. @endsection
  12. @section('content')
  13. <section class="content">
  14. <div class="row">
  15. <div class="col-md-6">
  16. @if(!empty($pm_created_task))
  17. <section class="panel tasks-widget">
  18. <header class="panel-heading" style="color:#34BCA0;">
  19. <b>PM # all created task</b>
  20. </header>
  21. <div class="cls-overflow table-responsive project-list">
  22. <table class="table table-striped">
  23. <thead>
  24. <tr>
  25. <th>
  26. Task
  27. </th>
  28. <th>
  29. Project
  30. </th>
  31. <th>
  32. Name
  33. </th>
  34. <th>
  35. Assigned time
  36. </th>
  37. </tr>
  38. </thead>
  39. <tbody>
  40. @foreach($pm_created_task as $pt)
  41. <tr>
  42. <td>
  43. <a style="color: #333;" href="{{url("user/uproject_details/$pt->proj_id")}}">
  44. {{$pt->name}}
  45. </a>
  46. </td>
  47. <td>{{$pt->proj_name->name}}</td>
  48. <td>
  49. @if(!empty($pt->user->name))
  50. {{$pt->user->name}}
  51. @else
  52. <span style="color:#FF6000;">
  53. {{"Not assigned"}}
  54. </span>
  55. @endif
  56. </td>
  57. <td>{{date("d-m-Y H:i", strtotime($pt->assign_time))}}</td>
  58. </tr>
  59. @endforeach
  60. </tbody>
  61. </table>
  62. <hr>
  63. </hr>
  64. </div>
  65. </section>
  66. @endif
  67. </div>
  68. <div class="col-md-6">
  69. @if(!empty($pm_inprocess_task))
  70. <section class="panel tasks-widget">
  71. <header class="panel-heading" style="color:#34BCA0;">
  72. <b>PM # all in-process task</b>
  73. </header>
  74. <div class="cls-overflow table-responsive project-list">
  75. <table class="table table-striped">
  76. <thead>
  77. <tr>
  78. <th>
  79. Task
  80. </th>
  81. <th>
  82. Project
  83. </th>
  84. <th>
  85. Name
  86. </th>
  87. <th>
  88. Start time
  89. </th>
  90. </tr>
  91. </thead>
  92. <tbody>
  93. @foreach($pm_inprocess_task as $pt)
  94. <tr>
  95. <td>
  96. <a style="color: #333;" href="{{url("user/uproject_details/$pt->proj_id")}}">
  97. {{$pt->name}}
  98. </a>
  99. </td>
  100. <td>{{$pt->proj_name->name}}</td>
  101. <td>
  102. @if(!empty($pt->user->name))
  103. {{$pt->user->name}}
  104. @else
  105. <span style="color:#FF6000;">
  106. {{"Not assigned"}}
  107. </span>
  108. @endif
  109. </td>
  110. <td>{{date("d-m-Y H:i", strtotime($pt->start_time))}} # {{$pt->estimated_time}}</td>
  111. </tr>
  112. @endforeach
  113. </tbody>
  114. </table>
  115. <hr>
  116. </hr>
  117. </div>
  118. </section>
  119. @endif
  120. </div>
  121. </div>
  122. <div class="row">
  123. <div class="col-md-6">
  124. <section class="panel tasks-widget">
  125. <header class="panel-heading">
  126. <b>Pending Tasks</b>
  127. </header>
  128. <div class="table-responsive project-list">
  129. @if(count($tasks) > 0)
  130. <table class="table table-striped">
  131. @foreach($tasks as $tsk)
  132. <tr>
  133. <td></td>
  134. <td>
  135. <span class="cls-assign" data-task_id="{{$tsk->id}}" data-toggle="modal" data-target=".bs-example-modal-lg" aria-hidden="true" style="cursor:pointer;">
  136. <b>{{ substr($tsk->name, 0, 30)}}</b><br>
  137. <b style="color:red">
  138. @if($tsk->proj_id != 0)
  139. {{ $tsk->proj_name->name }}
  140. @else
  141. {{ $tsk->company_name->name }}
  142. @endif
  143. </b>&nbsp;&nbsp;&nbsp; <i class="fa fa-user" aria-hidden="true"></i> {{ $tsk->user->name }}&nbsp;&nbsp;&nbsp; <i class="fa fa-clock-o" aria-hidden="true"></i> {{ date("F jS", strtotime($tsk->dead_line)) }}
  144. </span>
  145. </td>
  146. <td>
  147. @if($tsk->status == 1)
  148. <a href="{{url("user/change_task_status/$tsk->id")}}">
  149. <i style="color:red;font-size: 18px;" class="fa fa-square-o" aria-hidden="true"></i>
  150. </a><br>
  151. <span style="color:red;font-size: 12px;">PENDING</span>
  152. @elseif($tsk->status == 6)
  153. <a href="{{url("user/change_task_status/$tsk->id")}}">
  154. <i style="color:#398439;font-size: 18px;" class="fa fa-check-square-o" aria-hidden="true"></i>
  155. </a><br>
  156. <span style="color:#398439;font-size: 12px;">DONE</span>
  157. @elseif($tsk->status == 2)
  158. <a href="{{url("user/change_task_status/$tsk->id")}}">
  159. <i style="color:#d58512;font-size: 18px;" class="fa fa-square-o" aria-hidden="true"></i>
  160. </a><br>
  161. <span style="color:#d58512;font-size: 12px;">IN PROGRESS</span>
  162. @endif
  163. </td>
  164. </tr>
  165. @endforeach
  166. </table>
  167. @endif
  168. </div>
  169. </section>
  170. </div>
  171. <div class="col-md-6">
  172. <section class="panel tasks-widget">
  173. <header class="panel-heading">
  174. Projects you assigned
  175. </header>
  176. <div class="table-responsive project-list">
  177. <table class="table table-striped">
  178. <thead>
  179. <tr>
  180. <th colspan="2">
  181. Project Name
  182. </th>
  183. <th>
  184. Assigned By
  185. </th>
  186. <th>
  187. Description
  188. </th>
  189. {{--
  190. <th>
  191. Action
  192. </th>
  193. --}}
  194. </tr>
  195. </thead>
  196. <tbody>
  197. @if (session('data'))
  198. <div class="alert alert-success">
  199. {{ session('data') }}
  200. </div>
  201. @endif
  202. @if(!empty($projj))
  203. @foreach($projj as $proj)
  204. <tr>
  205. <td>
  206. <div class="task-checkbox">
  207. <input class="flat-grey" type="checkbox"/>
  208. </div>
  209. </td>
  210. <td>
  211. <a href="{{url("user/uproj_inprocess_pending_task/$proj->proj_id")}}">
  212. {{$proj->proj_name->name}}
  213. </a>
  214. <span class="cls-show-time">
  215. @if(count($proj->proj_name->tasks) > 0)
  216. <?php
  217. $pend = 0;
  218. $donee = 0;
  219. $not_assign = 0;
  220. ?>
  221. @foreach($proj->proj_name->tasks as $pt)
  222. @if($pt->user_id == 0)
  223. <?php $not_assign++; ?>
  224. @elseif($pt->status < 6 && $pt->user_id == $login_user_id)
  225. <?php $pend++; ?>
  226. @elseif($pt->status == 6 && $pt->user_id == $login_user_id)
  227. <?php $donee++; ?>
  228. @endif
  229. @endforeach
  230. <br>
  231. Not Assigned: {{$not_assign}},
  232. Pending: {{$pend}},
  233. Done: {{$donee++}}
  234. @else
  235. {{"No tasks added"}}
  236. @endif
  237. </span>
  238. <br>
  239. <small>
  240. <i class="fa fa-clock-o">
  241. </i>
  242. Assigned in {{$proj->assign_time}}
  243. </small>
  244. </br>
  245. </td>
  246. <td>
  247. {{$proj->assigned->name}}
  248. </td>
  249. <td>
  250. {{str_limit($proj->proj_name->description, $limit = 30, $end = '...')}}
  251. </td>
  252. {{-- <td>
  253. <a href="" style="color: #7dcc93;">
  254. <i class="fa fa-pencil-square-o" aria-hidden="true"></i>
  255. </a>
  256. &nbsp; &nbsp;
  257. <a onclick="return confirm ('want to delete?')" href="{{url("admin/remove_proj/$proj->id")}}" style="color:#FD4B39;">
  258. <i class="fa fa-times" aria-hidden="true"></i>
  259. </a>
  260. </td> --}}
  261. </tr>
  262. @endforeach
  263. @endif
  264. </tbody>
  265. </table>
  266. <hr>
  267. </hr>
  268. </div>
  269. </section>
  270. </div>
  271. </div>
  272. <div class="row">
  273. <div class="col-md-6">
  274. <section class="panel tasks-widget">
  275. <header class="panel-heading">
  276. Important Notes
  277. <button class="btn btn-success btn-xs pull-right" data-toggle="modal" data-target="#myModal2"><i class="fa fa-plus-circle" data-toggle="modal" data-target="#myModal2" aria-hidden="true"></i> Add Note</button>
  278. </header>
  279. <div class="table-responsive project-list">
  280. <table class="table table-striped">
  281. <thead>
  282. <tr>
  283. <th>
  284. Note
  285. </th>
  286. <th>
  287. Date Time
  288. </th>
  289. <th>
  290. Status
  291. </th>
  292. </tr>
  293. </thead>
  294. <tbody>
  295. @if(!empty($notes))
  296. @foreach($notes as $nott)
  297. <tr>
  298. <td>{{$nott->note}}</td>
  299. <td>{{$nott->time}}</td>
  300. <td style="cursor:pointer;">
  301. @if($nott->status > 0)
  302. <a href="{{url("user/change_note_status/$nott->id")}}">
  303. <i style="color:green;" class="fa fa-check-square-o" aria-hidden="true"></i>
  304. </a>
  305. @else
  306. <a href="{{url("user/change_note_status/$nott->id")}}">
  307. <i class="fa fa-square-o" aria-hidden="true"></i>
  308. </a>
  309. @endif
  310. &nbsp; &nbsp;
  311. <a onclick="return confirm ('want to delete?')" href="{{url("user/remove_note/$nott->id")}}">
  312. <i style="color:red" class="fa fa-times" aria-hidden="true"></i>
  313. </a>
  314. </td>
  315. </tr>
  316. @endforeach
  317. @endif
  318. </tbody>
  319. </table>
  320. <hr>
  321. </hr>
  322. </div>
  323. </section>
  324. </div>
  325. </div>
  326. </section>
  327. <!-- row end -->
  328. <!-- /.content -->
  329. <!-- Add note modal -->
  330. <div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  331. <div class="modal-dialog" role="document">
  332. <div class="modal-content">
  333. <div class="modal-header">
  334. <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  335. <h4 class="modal-title" id="gridSystemModalLabel">Add User</h4>
  336. </div>
  337. <div class="modal-body">
  338. <form role="form" action="{{url('user/add_note')}}" method="POST">
  339. {!! csrf_field() !!}
  340. <div class="form-group">
  341. <label for="Add new Project">
  342. Note
  343. </label>
  344. <textarea name="note" rows="5" class="form-control" id="new-project" placeholder="Write down your important notes..." ></textarea>
  345. </div>
  346. <div class="form-group">
  347. <label for="Add new Project">
  348. Select Date Time
  349. </label>
  350. <input name="date_time" class="form-control" id="datetimepicker" type="text">
  351. </div>
  352. <div class="form-group">
  353. <button class="btn btn-info" type="submit">
  354. Submit
  355. </button>
  356. </div>
  357. </form>
  358. </div>
  359. <div class="modal-footer">
  360. <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  361. </div>
  362. </div><!-- /.modal-content -->
  363. </div><!-- /.modal-dialog -->
  364. </div>
  365. <!-- Modal assign task -->
  366. <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
  367. <div class="modal-dialog modal-lg">
  368. <div class="modal-content">
  369. <div class="modal-header">
  370. <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  371. <h4 class="modal-title" id="gridSystemModalLabel">Assign Task</h4>
  372. </div>
  373. <div class="modal-body">
  374. <div class="row">
  375. <div class="col-md-7">
  376. <b>Assinged users:</b>
  377. <div class="assinged-users">
  378. </div>
  379. </div>
  380. <div class="col-md-5">
  381. <input type="hidden" name="id_task_id" id="id_task_id" value="">
  382. <div class="form-group">
  383. <label for="Add new Project">
  384. User
  385. </label>
  386. <select name="user_id" id="id_user_id" class="form-control cls-proj-user">
  387. </select>
  388. </div>
  389. <div class="form-group">
  390. <label for="Add new Project">
  391. Estimated Time
  392. </label>
  393. <br>
  394. <input type="text" id="id_estimated_time" name="estimated_time" class="form-control">
  395. </div>
  396. <div class="form-group">
  397. <button class="btn btn-primary assign-task-user">Assign</button>
  398. </div>
  399. </div>
  400. </div>
  401. <div class="row">
  402. <div class="col-md-12">
  403. <div style="margin-bottom:10px;">
  404. <b>Details:</b> <span class="cls-task-details"></span>
  405. </div>
  406. <!-- Add Comments ... -->
  407. <textarea class="form-control" name="comment_txt" id="comment_txt" cols="" rows="2" placeholder="Post comment here"></textarea>
  408. <button class="btn btn-success add-task-comment" style="margin-top:5px;">Post Comment</button>
  409. <button class="btn btn-success add-task-comment-doc" style="margin-top:5px;" data-toggle="modal" data-target="#add_doc_task_modal">Attach Documnet</button>
  410. <br><br>
  411. <b>Comments:</b><br>
  412. <div class="comments-cls" style="height:400px;overflow:scroll;">
  413. </div>
  414. </div>
  415. </div>
  416. <div class="row">
  417. <div class="col-md-12">
  418. <br/>
  419. <b>Activity Logs:</b><br>
  420. <div class="show-logs" style="height:150px;overflow:scroll;">
  421. </div>
  422. </div>
  423. </div>
  424. </div>
  425. <div class="modal-footer">
  426. <div class="row">
  427. <div class="col-md-10">
  428. Change status to:
  429. <button data-id='2' class="btn btn-primary cls-change-created btn-xs">In-process</button>
  430. <span class="show-change-btn">
  431. <button data-id='3' class="btn btn-primary cls-change-created btn-xs">Completed</button>
  432. <button data-id='4' class="btn btn-primary cls-change-created btn-xs">Checking</button>
  433. <button data-id='5' class="btn btn-primary cls-change-created btn-xs">Bug-fixing</button>
  434. <button data-id='6' class="btn btn-primary cls-change-created btn-xs">Done</button>
  435. </span>
  436. </div>
  437. <div class="col-md-2">
  438. <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  439. </div>
  440. </div>
  441. </div>
  442. </div>
  443. </div>
  444. </div>
  445. <!-- Assign task finished -->
  446. <!-- Assign modal -->
  447. @endsection
  448. @section('script')
  449. <script type="text/javascript">
  450. //jQuery('#datetimepicker').datetimepicker();
  451. </script>
  452. <script src="{{URL::asset('assets/dropzone.js')}}" type="text/javascript"></script>
  453. <script src="{{URL::asset('assets/ckeditor/ckeditor.js')}}"></script>
  454. <link rel="stylesheet" href="{{ URL::asset('assets/css/jquery.datetimepicker.css') }}">
  455. <script type="text/javascript" src="{{ URL::asset('assets/js/jquery.datetimepicker.full.min.js') }}"></script>
  456. <script type="text/javascript">
  457. function datePicker1(){
  458. $( "#id_estimated_time" ).datetimepicker({
  459. });
  460. }$('.bs-example-modal-lg').on('shown.bs.modal', function () {
  461. datePicker1();
  462. });
  463. $(document).ready(function(){
  464. $( "#test5" ).datetimepicker({});
  465. $('.cls-group').hide();
  466. $('.cls-user').hide();
  467. $('.show-change-btn').hide();
  468. jQuery('#datetimepicker').datetimepicker({
  469. format:'Y-m-d H:i:s',
  470. lang:'ru'
  471. });
  472. });
  473. $('.cls-proj').change(function(event){
  474. var proj_id = $(this).val();
  475. $.ajax({
  476. url: "{{url("user/change_tast_by_proj")}}",
  477. type: 'POST',
  478. data: { proj_id:proj_id},
  479. })
  480. .done(function(data){
  481. $('.cls-tasks').html(data);
  482. });
  483. });
  484. $('#id-group-user').change(function(event)
  485. {
  486. var chk_id = $(this).val();
  487. if(chk_id == 1){
  488. $('.cls-group').show();
  489. $('.cls-user').hide();
  490. }
  491. else if(chk_id == 2){
  492. $('.cls-group').hide();
  493. $('.cls-user').show();
  494. }
  495. else{
  496. $('.cls-group').hide();
  497. $('.cls-user').hide();
  498. }
  499. });
  500. $('.cls-assign').click(function(event)
  501. {
  502. var proj_id = $('.cls-project-id').val();
  503. var task_id = $(this).data('task_id');
  504. $('#id_task_id').val(task_id);
  505. $.ajax({
  506. url: "{{url('user/user_list_for_task_assign')}}",
  507. type: 'POST',
  508. data: {proj_id: proj_id, task_id: task_id},
  509. })
  510. .done(function(data) {
  511. var status = data[4];
  512. if(status > 1)
  513. {
  514. $('.show-change-btn').show();
  515. }
  516. else{
  517. $('.show-change-btn').hide();
  518. }
  519. $('.cls-proj-user').html(data[0]);
  520. $('.assinged-users').html(data[1]);
  521. $('.show-logs').html(data[2]);
  522. $('.comments-cls').html(data[3]);
  523. $('.cls-task-details').html(data[5]);
  524. });
  525. });
  526. $('.assign-task-user').click(function(event)
  527. {
  528. var id_estimated_time = $('#id_estimated_time').val();
  529. var id_user_id = $('#id_user_id').val();
  530. var id_task_id = $('#id_task_id').val();
  531. if(id_estimated_time !=''){
  532. $.ajax({
  533. url: "{{url('user/task_assign_to_user')}}",
  534. type: 'POST',
  535. data: {id_estimated_time: id_estimated_time,id_user_id: id_user_id,id_task_id: id_task_id},
  536. })
  537. .done(function(data) {
  538. $('.assinged-users').html(data);
  539. });
  540. }
  541. else{
  542. alert('Please define time estimate!');
  543. }
  544. });
  545. $('.assinged-users').on('click','.remove-task-assign-user',function(){
  546. var id = $(this).prev('input').val();
  547. var task_id = $('#id_task_id').val();
  548. $.ajax({
  549. url: "{{url('user/remove_assign_task_user')}}",
  550. type: 'POST',
  551. data: {id: id,task_id: task_id},
  552. })
  553. .done(function(data) {
  554. $('.assinged-users').html(data);
  555. });
  556. });
  557. $('.add-task-comment').click(function(event) {
  558. var comment = $('#comment_txt').val();
  559. var task_id = $('#id_task_id').val();
  560. if(comment.length > 0){
  561. $.ajax({
  562. url: "{{url('user/add_task_comment')}}",
  563. type: 'POST',
  564. data: {comment: comment,task_id: task_id},
  565. })
  566. .done(function(data) {
  567. $('.comments-cls').html(data);
  568. });
  569. }
  570. else{
  571. alert('Please fill-up comment field.');
  572. }
  573. });
  574. $('.comments-cls').on('click','.edit_comment',function(){
  575. var id = $(this).data('id');
  576. $.ajax({
  577. url: '{{url('user/edit_comment_form')}}',
  578. type: 'POST',
  579. data: {id: id},
  580. })
  581. .done(function(data) {
  582. $('.modal-edit').modal('show');
  583. $('.update-comment').val(data['comment']);
  584. $('.update-comment-id').val(data['id']);
  585. });
  586. });
  587. $('.comments-cls').on('click','.remove_comment',function(){
  588. var id = $(this).data('id');
  589. var task_id = $('#id_task_id').val();
  590. $.ajax({
  591. url: "{{url('user/remove_comment')}}",
  592. type: 'POST',
  593. data: {id: id,task_id: task_id},
  594. })
  595. .done(function(data) {
  596. $('.comments-cls').html(data);
  597. });
  598. });
  599. $('.save-updated-comment').click(function(event) {
  600. var id = $('.update-comment-id').val();
  601. var comment = $('.update-comment').val();
  602. var task_id = $('#id_task_id').val();
  603. $.ajax({
  604. url: '{{url('user/save_update_comment')}}',
  605. type: 'POST',
  606. data: {id: id,comment: comment,task_id: task_id},
  607. })
  608. .done(function(data) {
  609. $('.modal-edit').modal('hide');
  610. $('.comments-cls').html(data);
  611. $('.update-comment').val('');
  612. alert('Data updated successfully!');
  613. });
  614. });
  615. $('.cls-change-created').click(function(event)
  616. {
  617. if(confirm("Are you sure you want to change status ?"))
  618. {
  619. var task_id = $('#id_task_id').val();
  620. var status = $(this).data('id');
  621. $.ajax({
  622. url: "{{url('user/change_to_process')}}",
  623. type: 'POST',
  624. data: {task_id: task_id, status: status},
  625. })
  626. .done(function(data) {
  627. if(data == 'Yes'){
  628. alert('Status Changed !!');
  629. location.reload();
  630. }
  631. else{
  632. alert('Status Not Changed !!');
  633. }
  634. });
  635. }
  636. });
  637. $('.upload-cls').click(function(event){
  638. var id = $('.cls-project-id').val();
  639. $('.cls-proj-id').val(id);
  640. });
  641. $('.add-task-comment-doc').click(function(event){
  642. var task_id = $('#id_task_id').val();
  643. $('.cls-task-doc-id').val(task_id);
  644. });
  645. $('.attatch-close-btn').click(function(event) {
  646. location.reload();
  647. });
  648. $('.attatchment-doc-comment').click(function(event) {
  649. //this event only for fetch the comments after close
  650. //attatchemnt dropzone.
  651. var comment = '';
  652. var task_id = $('#id_task_id').val();
  653. $.ajax({
  654. url: "{{url('user/add_task_comment')}}",
  655. type: 'POST',
  656. data: {comment: comment,task_id: task_id},
  657. })
  658. .done(function(data){
  659. $('.comments-cls').html(data);
  660. });
  661. });
  662. </script>
  663. @endsection