150 lines
7.8 KiB
PHP
150 lines
7.8 KiB
PHP
@extends('layouts.admin')
|
|
@section('styles')
|
|
<link rel="stylesheet" type="text/css" href="{{ asset('assets/admin/css/vendors/datatables.css') }}">
|
|
<style>
|
|
#webcam-container {
|
|
margin-top: 20px;
|
|
text-align: center;
|
|
}
|
|
|
|
#webcam {
|
|
transform: scaleX(-1);
|
|
=-webkit-transform: scaleX(-1);
|
|
}
|
|
</style>
|
|
@endsection
|
|
@section('app')
|
|
<div class="container-fluid">
|
|
<div class="row d-flex justify-content-center">
|
|
<div class="col-sm-12 col-xl-6 d-none mb-3" id="webcam-container">
|
|
<video id="webcam" autoplay playsinline style="width: 100%;"></video>
|
|
<button id="btn-capture" class="btn btn-primary mt-3">Ambil</button>
|
|
|
|
<canvas id="canvas-preview" class="d-none" style="width: 100%; border: 1px solid #ccc;"></canvas>
|
|
|
|
<div id="action-buttons" class="d-none mt-3">
|
|
<button id="btn-retry" class="btn btn-warning">Ulangi</button>
|
|
<button id="btn-save" class="btn btn-success">Simpan</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-sm-12 col-xl-6">
|
|
<div class="card card-absolute">
|
|
@if (!$checkInAttendance)
|
|
<div class="card-header bg-primary">
|
|
<a href="javascript:void(0)" id="attendance-btn">
|
|
<h5 class="txt-light">Hadir</h5>
|
|
</a>
|
|
</div>
|
|
@endif
|
|
<div class="card-body">
|
|
<div class="d-flex list-behavior-1 align-items-center">
|
|
@if ($checkInAttendance)
|
|
<div class="flex-shrink-0">
|
|
<a
|
|
href="{{ Storage::url("attendances/{$checkInAttendance->attachments->where('type', 'check_in')->first()->formatted_attachment}") }}">
|
|
<img class="tab-img img-fluid"
|
|
src="{{ Storage::url("attendances/{$checkInAttendance->attachments->where('type', 'check_in')->first()->formatted_attachment}") }}"
|
|
alt="image">
|
|
</a>
|
|
</div>
|
|
@endif
|
|
@if (!$checkInAttendance)
|
|
<div class="flex-grow-1">
|
|
<p class="mb-xl-0 mb-sm-4">
|
|
Selamat pagi, semoga hari Anda penuh semangat! Jangan lupa untuk melakukan absensi
|
|
kehadiran masuk sebelum memulai aktivitas Anda hari ini.
|
|
</p>
|
|
</div>
|
|
@else
|
|
<div class="flex-grow-1">
|
|
<p class="mb-xl-0 mb-sm-4">
|
|
Terima kasih, Anda telah melakukan absensi kehadiran masuk pada pukul
|
|
{{ $checkInAttendance->check_in }}.Semoga hari Anda produktif.
|
|
</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@if ($checkInAttendance)
|
|
<div class="col-sm-12 col-xl-6">
|
|
<div class="card card-absolute">
|
|
@if (!$checkOutAttendance)
|
|
<div class="card-header bg-primary">
|
|
<a href="javascript:void(0)" id="attendance-btn">
|
|
<h5 class="txt-light">Hadir</h5>
|
|
</a>
|
|
</div>
|
|
@endif
|
|
<div class="card-body">
|
|
<div class="d-flex list-behavior-1 align-items-center">
|
|
@if ($checkOutAttendance)
|
|
<div class="flex-shrink-0">
|
|
<a
|
|
href="{{ Storage::url("attendances/{$checkOutAttendance->attachments()->where('type', 'check_out')->first()->formatted_attachment}") }}">
|
|
<img class="tab-img img-fluid"
|
|
src="{{ Storage::url("attendances/{$checkOutAttendance->attachments()->where('type', 'check_out')->first()->formatted_attachment}") }}"
|
|
alt="image">
|
|
</a>
|
|
</div>
|
|
@endif
|
|
@if (!$checkOutAttendance)
|
|
<div class="flex-grow-1">
|
|
<p class="mb-xl-0 mb-sm-4">
|
|
Jangan lupa untuk melakukan absensi kehadiran pulang sebelum meninggalkan
|
|
tempat kerja.
|
|
</p>
|
|
</div>
|
|
@else
|
|
<div class="flex-grow-1">
|
|
<p class="mb-xl-0 mb-sm-4">
|
|
Terima kasih, Anda telah melakukan absensi kehadiran pulang pada pukul
|
|
{{ $checkOutAttendance->check_out }}.Semoga istirahat Anda menyegarkan untuk
|
|
hari berikutnya.
|
|
</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="display" id="datatable" data-ajax="{{ url(url()->current()) }}">
|
|
<thead>
|
|
<tr>
|
|
<th>No</th>
|
|
<th>Tanggal</th>
|
|
<th>Masuk</th>
|
|
<th>Foto</th>
|
|
<th>Pulang</th>
|
|
<th>Foto</th>
|
|
<th>Total Kerja</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
@section('afterScripts')
|
|
<script src="{{ asset('assets/admin/js/datatable/jquery.dataTables.min.js?ver=1.0.0') }}"></script>
|
|
<script src="{{ asset('assets/admin/js/datatable/custom-table/attendance.js?ver=1.0.0') }}"></script>
|
|
<script src="{{ asset('assets/admin/js/datatable/server-side.js?ver=1.0.0') }}"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/locale/id.min.js"></script>
|
|
<script src="{{ asset('assets/admin/js/custom/attendance.js?ver=1.0.0') }}"></script>
|
|
@endsection
|