new view for attendance

resources/views/attendance.blade.php

+@extends('layouts.template')
+@section('header')
+    <script type="text/javascript" src="{{asset('bower_components/moment/moment.js')}}"></script>
+    <script type="text/javascript" src="{{asset('bower_components/moment/locale/zh-tw.js')}}"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/6.0.0-RC.5/video.js"></script>
+    <!-- PC 端浏览器不支持播放 hls 文件(m3u8), 需要 videojs-contrib-hls 来给我们解码 -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.3.3/videojs-contrib-hls.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-hotkeys/0.2.25/videojs.hotkeys.min.js"></script>
+    <link rel="stylesheet" href="{{asset('css/video_replay.css')}}">
+@stop
+
+@section('content')
+
+
+
+        <form id="send" action="/attend" method="GET">
+            {{ csrf_field() }}
+            <div class="row" >
+                
+                <div class="col-xs-6 col-md-2">
+                    <span id="arg">開始時間:</span>
+                </div>
+                <div class="form-group" style="margin-left: 2%" >
+                    <div class="input-group date" id="datetimepicker1" data-target-input="nearest">
+                        <input id='start_time' style="text-align: center" name="start_time" type="text" class="form-control datetimepicker-input" data-target="#datetimepicker1" required/>
+                        <div class="input-group-append" data-target="#datetimepicker1" data-toggle="datetimepicker">
+                            <div class="input-group-text"><i class="fa fa-calendar"></i></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="row"><div class="col-md-6" style="margin-left: 2%">到</div></div>
+            <div class="row">
+               
+                <div class="col-xs-6 col-md-2">
+                    <span id="arg">結束時間:</span>
+                </div>
+                <div class="form-group" style="margin-left: 2%">
+                    <div class="input-group date" id="datetimepicker2" data-target-input="nearest">
+                        <input id='end_time' style="text-align: center" name="end_time" type="text" class="form-control datetimepicker-input" data-target="#datetimepicker2" required/>
+                        <div class="input-group-append" data-target="#datetimepicker2" data-toggle="datetimepicker">
+                            <div class="input-group-text"><i class="fa fa-calendar"></i></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="row">
+                <div class="col-md-6"></div><input id='sub_btn' style="margin: 2% ; margin-left : 80%"  class="btn-lg btn-success btn" type="submit" value="送出"/>
+            </div>
+            <table class="table table-dark table-striped" style="text-align:center">
+
+            <tr>
+            <td>姓名</td>
+            <td>上班時間</td>
+            <td>下班時間 </td>
+            <td>外出時間</td>
+            <td>返回時間</td>
+            </tr>
+            
+            
+            @foreach($content as $contents)<tr>
+            <td>{{$contents['name']}}</td>
+            <td>{{$contents['on_work']}}</td>
+            <td>{{$contents['off_work']}}</td>
+            <td>{{$contents['go_out']}}</td>
+            <td>{{$contents['come_back']}}</td>
+
+</tr>
+            @endforeach
+
+            
+            </table>
+
+
+
+
+        </form>
+
+
+    </div>
+</div>
+<span id='buttom'></span>
+
+
+
+
+<!-- 時間選擇器 -->
+<!-- datetimepicker1 物件  -->
+<script type="text/javascript">
+    $(function () {
+        $('#datetimepicker1').datetimepicker({
+            locale:'zh-tw',
+            format: 'YYYY/MM/DD HH:mm:ss ',
+            weekStart: 1,
+            autoclose: 0,
+            todayHighlight: 1,
+            // sideBySide:true,
+            stepping:0,
+            minView:0,
+            maxView:0,
+            startView: 0,  // 0 ＝月曆   1＝月份  2 =年份
+        });
+    });
+</script>
+
+<!-- datetimepicker2 物件  -->
+<script type="text/javascript">
+    $(function () {
+        $('#datetimepicker2').datetimepicker({
+            locale:'zh-tw',
+            format: 'YYYY/MM/DD HH:mm:ss ',
+            weekStart: 1,
+            autoclose: 0,
+            todayHighlight: 1,
+            // sideBySide:true,
+            stepping:0,
+            minView:0,
+            maxView:0,
+
+            startView: 0,  // 0 ＝月曆   1＝月份  2 =年份
+        });
+    });
+</script>
+
+
+@endsection