@extends('layouts.app')
@section('title')打卡@endsection
@section('content')
    <div id="nav2" class="dontprint">
        @component('personnel.menu')@endcomponent
        @component('personnel.checking-in.menuChecking-in')@endcomponent
    </div>
    <div class="container-fluid mt-3" id="page">
        <div class="card col-md-10 offset-md-1 p-0">
            <div class="card-body">
                    <div class="list-group list-group-horizontal-lg" >
{{--                        @click="getQRCode(userWorkgroup.id)"--}}
                        <a target="_blank"  class="btn list-group-item" type="button" :href="('{{url('personnel/checking-in/userDutyCheck/QRCode?userWorkgroupId=')}}'+userWorkgroup.id)"  :class="userWorkgroup==checkedUserWorkgroup ? 'btn-primary' : 'btn-outline-primary'"
                                v-for="userWorkgroup in userWorkgroups">@{{ userWorkgroup.name }}</a>
                    </div>
            </div>
        </div>
    </div>
@endsection

@section('lastScript')
    <script>
        new Vue({
            el:"#page",
            data:{
                userWorkgroups:[
                    @foreach($userWorkgroups as $userWorkgroup)
                    {!! $userWorkgroup !!},
                    @endforeach
                ],
                checkedUserWorkgroup:'',
            },
        });
    </script>
@endsection