@extends('layouts.app')
@section('title')回收站-临时工报表-人事管理@endsection
@section('content')
<span id="nav2">
    @component('personnel.laborReport.menu')@endcomponent
</span>
<div id="page" class="d-none container-fluid">
    <div class="card">
        <div class="card-header form-inline">
            <select v-model="paginate" class="form-control form-control-sm" style="max-width: 100px">
                <option value="50">显示50条</option>
                <option value="100">显示100条</option>
                <option value="200">显示200条</option>
                <option value="500">显示500条</option>
                <option value="1000">显示1000条</option>
            </select>
            <button class="btn btn-sm btn-outline-danger ml-2" @click="recover()">恢复</button>
        </div>
        <div class="card-body">
            <table class="table table-hover table-striped text-nowrap table-bordered">
                <tr>
                    <th>
                        <label for="all">
                            <input id="all" type="checkbox" @click="checkAll($event)">全选
                        </label>
                    </th>
                    <th>序号</th>
                    <th>进场编号</th>
                    <th>小组</th>
                    <th>临时工</th>
                    <th>电话</th>
                    <th>身份证号</th>
                    <th>劳务所</th>
                    <th>进场时间</th>
                    <th>进组时间</th>
                    <th>退组时间</th>
                    <th>退场时间</th>
                    <th>审核时间</th>
                    <th>审核人</th>
                    <th>晚饭打卡</th>
                    <th>在线时长</th>
                    <th>本次工作时长</th>
                    <th>备注</th>
                </tr>
                <tr v-for="(laborReport,i) in laborReports">
                    <td v-if="laborReport.id">
                        <input class="checkItem" type="checkbox" :value="laborReport.id" v-model="checkData">
                    </td>
                    <td>@{{ i+1 }}</td>
                    <td class="text-muted">@{{laborReport.enter_number}}</td>
                    <td>@{{laborReport.userWorkGroupName}}</td>
                    <td >@{{laborReport.name}}</td>
                    <td class="text-muted">@{{laborReport.mobile_phone}}</td>
                    <td class="text-muted">@{{laborReport.identity_number}}</td>
                    <td class="text-muted">@{{laborReport.labor_company}}</td>
                    <td class="text-muted">@{{laborReport.enter_at}}</td>
                    <td>@{{laborReport.checkInAt}}</td>
                    <td class="text-muted">@{{laborReport.checkOutAt}}</td>
                    <td >@{{ laborReport.exit_at }}</td>
                    <td class="text-muted">@{{laborReport.verifyAt}}</td>
                    <td class="text-muted"><span v-if="laborReport.verifyPerson">@{{laborReport.verifyPerson}}</span></td>
                    <td class="text-muted"><span v-if="laborReport.relax_time">@{{laborReport.relax_time}}</span></td>
                    <td class="text-muted"><span v-if="laborReport.thisRecordOnlineTime">@{{laborReport.thisRecordOnlineTime}}</span></td>
                    <td><span v-if="laborReport.thisRecordWorkingTime">@{{laborReport.thisRecordWorkingTime}}</span></td>
                    <td><span v-if="laborReport.remark">@{{laborReport.remark}}</span></td>
                </tr>
            </table>
            <div class="text-info h5 btn btn">{{$laborReports->count()}}/@{{ sum }}</div>
            <div>{{$laborReports->appends($paginateParams)->links()}}</div>
        </div>
    </div>

</div>
@stop

@section('lastScript')
    <script>
        new Vue({
            el:"#page",
            data:{
                laborReports:[
                        @foreach($laborReports as $laborReport)
                    {id:'{{$laborReport->id}}',enter_number:'{{$laborReport->enter_number}}'
                        ,@if($laborReport->userWorkgroup)user_workgroup_id:'{{$laborReport->userWorkgroup->id}}',
                        userWorkgroupNeedRemark:'{{$laborReport->userWorkgroup->isNeedRemark}}',
                        userWorkGroupName:'{{$laborReport->userWorkgroup->name}}',@endif
                        userId:'{{$laborReport->user_id}}',name:'{{$laborReport->name}}'
                        ,mobile_phone:'{{$laborReport->mobile_phone}}',identity_number:'{{$laborReport->identity_number}}',
                        @if($laborReport->laborCompany)
                        labor_company:'{{$laborReport->laborCompany->name}}',labor_company_id:'{{$laborReport->laborCompany->id}}',@endif
                        checkInAt:'{{$laborReport->check_in_at}}', relax_time:'{{$laborReport->relax_time}}',
                        is_exportGroup:'{{$laborReport->is_exportGroup}}',is_export:'{{$laborReport->is_export}}',
                        verifyAt:'{{$laborReport->verify_at}}',groupUserId:'{{$laborReport->group_user_id}}',verifyPerson:'{{$laborReport->user['name']}}',
                        checkOutAt:'{{$laborReport->check_out_at}}',onlineDuration:'{{$laborReport->online_duration}}',
                        workingDuration:'{{$laborReport->working_duration}}', created_at:'{{$laborReport->created_at}}',
                        enter_at:'{{$laborReport->enter_at}}',exit_at:'{{$laborReport->exit_at}}',
                        thisRecordOnlineTime:'{{$laborReport->thisRecordOnlineTime}}',
                        thisRecordWorkingTime:'{{$laborReport->thisRecordWorkingTime}}',isAdult:'{{$laborReport->isAdult}}',
                        sequence:'{{$laborReport->sequence}}',amountOfJoined:'{{$laborReport->amountOfJoined}}',remark:'{{$laborReport->remark}}',
                        @if($laborReport->userDutyCheck)user_duty_check_id:'{{$laborReport->userDutyCheck->id}}', userDutyCheckVerifyUserId:'{{$laborReport->userDutyCheck->verify_user_id}}'
                        ,userDutyCheckType:'{{$laborReport->userDutyCheck->type}}',userDutyCheckAt:'{{$laborReport->userDutyCheck->checked_at}}',@endif},
                    @endforeach
                ],
                paginate:50,
                checkData:[],
                sum:{!! $laborReports->total() !!},
            },
            mounted(){
                $("#page").removeClass('d-none');
            },
            methods:{
                //全选事件
                checkAll(e){
                    if (e.target.checked){
                        this.laborReports.forEach((el,i)=>{
                            if (this.checkData.indexOf(el.id) == '-1'){
                                this.checkData.push(el.id);
                            }
                        });
                    }else {
                        this.checkData = [];
                    }
                },
                recover(){
                    tempTip.setDuration(3000);
                    if (this.checkData.length<1){
                        tempTip.showSuccess('尚未未选择需要恢复单!');
                        return;
                    }
                    let checkData=this.checkData;
                    let _this=this;
                    let delArr=[];
                    if (!confirm('确定要恢复所选内容吗？'))return;
                    axios.post('{{url('laborReport/recover')}}',{checkData:checkData})
                        .then(function (response) {
                            if (response.data.success){
                                checkData.forEach(function (data) {
                                    _this.laborReports.every(function (laborReport,i) {
                                        if (data===laborReport.id){
                                            delArr.unshift(i);return false;
                                        }
                                        return true;
                                    });
                                });
                                delArr.forEach(function (item) {
                                    _this.$delete(_this.laborReports,item);
                                });
                                tempTip.showSuccess('恢复成功!');
                                return;
                            }
                            tempTip.show('恢复失败，未知错误！');
                        }).catch(function (err) {
                            tempTip.show('恢复失败,网络错误：'+err);
                        });
                }
            },
        });
    </script>
@stop
