@extends('../layout/' . $layout)

@section('subhead')
    <title>Atarud MIS - Bio Attendance Sync</title>
@endsection

@section('subcontent')
    <div class="grid grid-cols-12 gap-6">
        <div class="col-span-12 2xl:col-span-9">
            <div class="grid grid-cols-12 gap-6">
                <!-- BEGIN: General Report -->
                <div class="col-span-12 mt-8">
                    <div class="intro-y flex items-center h-10">
                        <h2 class="text-lg font-medium truncate mr-5">Bio Devices Sync</h2>

                    </div>
                    @foreach ($devices as $row)
                    <div class="grid grid-cols-12 gap-6 mt-5">
                        <div class="col-span-12 sm:col-span-6 xl:col-span-3 intro-y">
                            <div class="report-box zoom-in">
                                <div class="box p-5">
                                    <div class="flex">
                                        <i data-lucide="trello" class="report-box__icon text-primary"></i>
                                        <div class="ml-auto">

                                        </div>
                                    </div>
                                    <div class="text-3xl font-medium leading-8 mt-6">{{ $row->name }}</div>
                                    <div class="text-base text-slate-500 mt-1">{{ $row->ip }}</div>
                                    <div class="ml-auto">
                                        <form method="post" action="{{ route('bio.attendance.sync') }}">
                                            @method('post')
                                            @csrf
                                            <input type="hidden" name="ip" value="{{ $row->ip }}">
                                            <input type="hidden" name="name" value="{{ $row->name }}">
                                            <button type="submit" class="report-box__indicator bg-success cursor-pointer" >
                                                Sync
                                            </button>
                                         </form>
                                         <div class="dropdown float-left" style="margin-left:45px; margin-top: -22px;">
                                            <button class="report-box__indicator bg-success cursor-pointer" aria-expanded="false" data-tw-toggle="dropdown">Setting</button>
                                            <div class="dropdown-menu w-40">
                                                <ul class="dropdown-content">
                                                    <li><a href='{{url("bio/setting/shutdown/$row->ip")}}' class="dropdown-item">Shut Down</a></li>
                                                    <li><a href='{{url("bio/setting/restart/$row->ip")}}' class="dropdown-item">Restart</a></li>
                                                    <li><a href='{{url("bio/setting/sleep/$row->ip")}}' class="dropdown-item">Sleep</a></li>
                                                    <li><a href='{{url("bio/setting/resume/$row->ip")}}' class="dropdown-item">Resume</a></li>
                                                    <li><a href='{{url("bio/setting/testvoice/$row->ip")}}' class="dropdown-item">Test Voice</a></li>
                                                    <li><a href='{{url("bio/setting/clearAttendance/$row->ip")}}' class="dropdown-item">Clear Attendance</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    
                                   
                                
                            
                                </div>
                            </div>
                        </div>
                    </div>
                    @endforeach

                </div>
                <!-- END: General Report -->

            </div>
        </div>
    </div>
@endsection