baoshi-was/resources/views/personnel/checking-in/getUserWorkGroups.blade.php

@extends('layouts.app')
@section('title')打卡-人事管理@endsection
@section('content')
    <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 align-content-center" v-if="userWorkgroups">
                    <a target="_blank"  class="btn list-group-item col-md-2" type="button" :href="('{{url('personnel/checking-in/QRCode?userWorkgroupId=')}}'+userWorkgroup.id)"  :class="userWorkgroup==checkedUserWorkgroup ? 'btn-primary' : 'btn-outline-primary'"
                       v-for="userWorkgroup in userWorkgroups">@{{ userWorkgroup.name }}</a>
                </div>
                <h3 v-else>还未录入工作组，请先录入工作组！</h3>
            </div>
        </div>
    </div>
@endsection

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