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

@extends('layouts.app')
@section('title')打卡审核@endsection
@section('content')
    <div id="nav2">
        @component('personnel.menu')@endcomponent
        @component('personnel.checking-in.menuChecking-in')@endcomponent
    </div>
    <div class="container-fluid" id="list">
        <div class="card col-md-10 offset-md-1">
            <div class="card-body p-0">
                <table class="table table-striped table-bordered text-nowrap">
                    <thead class="thead-light">
                    <tr>
                        <td>序号</td>
                        <td>姓名</td>
                        <td>手机号</td>
                        <td>劳务所</td>
                        <td>打卡时间</td>
                        <td>打卡类型</td>
                        @can('人事管理-打卡审核')<td>操作</td>@endcan
                        <td>工作组</td>
                        <td v-if="workgroupSign">组长审核</td>
                        <td>异常</td>
                        <td>合计工时</td>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(userDutyCheck,i) in userDutyChecks">
                        <td>@{{ i+1 }}</td>
                        <td ><span v-if="userDutyCheck.user_detail">@{{ userDutyCheck.user_detail.full_name }}</span></td>
                        <td  class="text-muted"><span v-if="userDutyCheck.user_detail">@{{ userDutyCheck.user_detail.mobile_phone }}</span></td>
                        <td ><span v-if="userDutyCheck.user_detail">@{{ userDutyCheck.user_detail.user_labor_company }}</span></td>
                        <td>@{{ userDutyCheck.checked_at }}</td>
                        <td>
                            <div v-if="userDutyCheck.verify_user_id" class="text-center">@{{ userDutyCheck.type }}</div>
                            <select v-else v-model="userDutyCheck.type" @change="isException(userDutyCheck.id,userDutyCheck.user_id,userDutyCheck.checked_at,userDutyCheck.type)" class="form-control" style="width: 100px">
                                <option value="登入">登入</option>
                                <option value="登出">登出</option>
                            </select>
                        </td>
                        @can('人事管理-打卡审核')<td>
                            <b v-if="userDutyCheck.verify_user_id" class="text-success">已审核</b>
                            <button v-else @click="storeClockAudit(userDutyCheck.id,userDutyCheck.type)" class="btn btn-primary w-80">审核</button>
                        </td>@endcan
                        <td class="font-weight-bold"><span v-if="userDutyCheck.user_detail.user.user_workgroups&&userDutyCheck.user_detail.user.user_workgroups.length>0">
                                @{{ userDutyCheck.user_detail.user.user_workgroups[0].name }}</span></td>
                        <td v-if="workgroupSign">
                            <b v-if="userDutyCheck.group_user_id" class="text-success">已审核</b>
                            <button v-else @click="storeGroupAudit(userDutyCheck.id,userDutyCheck.type)" class="btn btn-primary w-80">组长审核</button>
                        </td>
                        <td>@{{ userDutyCheck.exception }}</td>
                        <td>@{{ userDutyCheck.duration_man_hour }}</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection

@section('lastScript')
    <script>
        new Vue({
            el:"#list",
            data:{
                userDutyChecks:[
                    @foreach($userDutyChecks as $userDutyCheck)
                    {id:'{{$userDutyCheck->id}}',user_id:'{{$userDutyCheck->user_id}}',checked_at:'{{$userDutyCheck->checked_at}}',
                    type:'{{$userDutyCheck->type}}',verify_user_id:'{{$userDutyCheck->verify_user_id}}',group_user_id:'{{$userDutyCheck->group_user_id}}',
                    exception:'',duration_man_hour:'',@if($userDutyCheck->userDetail)user_detail:{!! $userDutyCheck->userDetail !!} @endif },
                    @endforeach
                ],
                workgroupSign:'{{$workgroupSign}}',
            },
            methods:{
                store(id,type,url){

                },
                storeClockAudit(id,type){
                    let url='{{url("personnel/checking-in/storeClockAudit")}}';
                    let _this=this;
                    axios.post(url,{id:id,type:type})
                        .then(function (response) {
                            if (!response.data.success){
                                tempTip.setDuration(3000);
                                tempTip.show(response.data.data);
                                return;
                            }
                            _this.userDutyChecks.every(function (userDutyCheck) {
                                if (userDutyCheck.id==id){
                                    userDutyCheck.verify_user_id=response.data.data;
                                    tempTip.setDuration(3000);
                                    tempTip.showSuccess('审核通过！');
                                    return false
                                }
                                return true;
                            });
                        }).catch(function (err) {
                        tempTip.setDuration(4000);
                        tempTip.show('审核失败！网络错误：'+err);
                    });
                },
                storeGroupAudit(id,type){
                    let url='{{url("personnel/checking-in/storeGroupAudit")}}';
                    let _this=this;
                    axios.post(url,{id:id,type:type})
                        .then(function (response) {
                            if (!response.data.success){
                                tempTip.setDuration(3000);
                                tempTip.show(response.data.data);
                                return;
                            }
                            _this.userDutyChecks.every(function (userDutyCheck) {
                                if (userDutyCheck.id==id){
                                    userDutyCheck.group_user_id=response.data.data;
                                    tempTip.setDuration(3000);
                                    tempTip.showSuccess('审核通过！');
                                    return false
                                }
                                return true;
                            });
                        }).catch(function (err) {
                        tempTip.setDuration(4000);
                        tempTip.show('审核失败！网络错误：'+err);
                    });
                },
                isException(id,user_id,checked_at,type){
                    let _this=this;
                    axios.post('{{url("personnel/checking-in/isException")}}',{id:id,user_id:user_id,checked_at:checked_at,type:type})
                        .then(function (response) {
                            _this.userDutyChecks.every(function (userDutyCheck) {
                                if (userDutyCheck.id==id){
                                    userDutyCheck.exception=response.data.exception;
                                    userDutyCheck.duration_man_hour=response.data.duration_man_hour;
                                    return false
                                }
                                return true;
                            });
                        }).catch(function (err) {
                        tempTip.setDuration(4000);
                        tempTip.show('校验失败！网络错误：'+err);
                        });
                }
            },
        });
    </script>
@endsection