baoshi-was/resources/views/personnel/laborApply/dispatch/index.blade.php

@extends('layouts.app')
@section('title')查看-劳务派遣明细@endsection

@section('content')
    <div id="list" class="d-none">
        <div class="container-fluid">
            <div id="form_div"></div>
            @include('shared._messages')
            <table class="table table-striped table-bordered table-hover card-body td-min-width-80" id="table">
                <tr v-for="(labor_company_dispatch,i) in labor_company_dispatches"
                    @click="selectTr===i+1?selectTr=0:selectTr=i+1"
                    :class="selectTr===i+1?'focusing' : ''"
                    :style="(labor_company_dispatch.man_num==0 && labor_company_dispatch.woman_num==0)?'background-color: #DCDCDC !important':''">
                    <td>
                        <input class="checkItem" type="checkbox" :value="labor_company_dispatch.id">
                    </td>
                    <td>
                        <div>
                            @{{ i+1 }}
                            <span v-if="labor_company_dispatch.exceed_max_labor_num_status==2"><i
                                    class="fa fa-thermometer-full" style="color: red" aria-hidden="true"></i></span>
                        </div>
                    </td>
                    <td>
                        @can('人事管理-临时工申请协调-劳务派遣明细')
                            <div class="float-left ml-3" v-if="labor_company_dispatch.status==='人事确认'">
                                <form :action="getBaseUrl(labor_company_dispatch) + '/laborCompanyReceivingOrder'"
                                      method="post"
                                      accept-charset="UTF-8" onsubmit="return confirm('是否确认接单！')">
                                    @csrf
                                    @method('PATCH')
                                    <input type="number" name="status" hidden value="3">
                                    <button type="submit" class="btn btn-outline-primary btn-sm" role="button">劳务接单
                                    </button>
                                </form>
                            </div>
                            <div class="float-left ml-3" v-if="labor_company_dispatch.status==='劳务接单'">
                                <a :href="getCreateOrEditDetailUrl(labor_company_dispatch)"
                                   class="btn btn-outline-secondary btn-sm" role="button">
                                    @{{
                                    labor_company_dispatch.labor_company_dispatch_details.length>0?'修改明细':'录入明细'
                                    }}
                                </a>
                            </div>
                        @endcan()
                        @can('临时工申请协调-劳务派遣明细-人事确认')
                            <div class="float-left ml-3" v-if="labor_company_dispatch.status==='创建'">
                                <form :action="getBaseUrl(labor_company_dispatch) + '/personnelCheck'" method="post"
                                      accept-charset="UTF-8" onsubmit="return confirm('是否确认！')">
                                    @csrf
                                    @method('PATCH')
                                    <input type="text" name="status" hidden value="人事确认">
                                    <button type="submit" class="btn btn-outline-primary btn-sm" role="button">人事确认
                                    </button>
                                </form>
                            </div>

                            <div class="float-left ml-3" v-if="labor_company_dispatch.status==='创建'">
                                <a :href="getEditlLaborCompanyDispatchUrl(labor_company_dispatch)"
                                   class="btn btn-outline-secondary btn-sm" role="button">
                                    修改派遣人数
                                </a>
                            </div>
                        @endcan()
                    </td>
                    <td>@{{ labor_company_dispatch.check_user?labor_company_dispatch.check_user.name:'' }}</td>
                    <td>@{{ labor_company_dispatch.labor_company.name }}</td>
                    <td>@{{ labor_company_dispatch.warehouse ?labor_company_dispatch.warehouse.name:''}}</td>
                    <td><span :class="getStatusClass(labor_company_dispatch.status)">@{{ labor_company_dispatch.status }}</span>
                    </td>
                    <td>@{{ labor_company_dispatch.man_num }}</td>
                    <td>@{{ labor_company_dispatch.woman_num }}</td>
                    <td>
                        <div v-if="labor_company_dispatch.labor_company_dispatch_details.length >0">
                            <table v-if="labor_company_dispatch.showMore" style="margin: 0;padding: 0">
                                <tr v-for="(v,k) of labor_company_dispatch.labor_company_dispatch_details" :key="k">
                                    <td>@{{ v.name }}</td>
                                    <td>@{{ v.gender }}</td>
                                    <td>@{{ v.age }}</td>
                                    <td>@{{ v.card_id }}</td>
                                </tr>
                            </table>
                            <table v-else style="margin: 0;padding: 0">
                                <tr>
                                    <td>@{{ labor_company_dispatch.labor_company_dispatch_details[0].name }}</td>
                                    <td>@{{ labor_company_dispatch.labor_company_dispatch_details[0].gender }}</td>
                                    <td>@{{ labor_company_dispatch.labor_company_dispatch_details[0].age }}</td>
                                    <td>@{{ labor_company_dispatch.labor_company_dispatch_details[0].card_id }}</td>
                                </tr>
                            </table>
                            <a href="javascript:void(0)"
                               v-if="labor_company_dispatch.labor_company_dispatch_details.length >1"
                               @click="labor_company_dispatch.showMore = !labor_company_dispatch.showMore">
                                @{{ labor_company_dispatch.showMore?'收起':'显示更多' }}
                            </a>
                        </div>
                    </td>
                    <td>@{{ labor_company_dispatch.dispatch_date.slice(0, 10) }}</td>

                </tr>
            </table>
            {{ $labor_company_dispatches->links() }}
        </div>
    </div>
@endsection

@section('lastScript')
    <script type="text/javascript" src="{{mix('js/queryForm/export.js')}}"></script>
    <script type="text/javascript" src="{{mix('js/queryForm/queryForm.js')}}"></script>
    <script type="text/javascript" src="{{mix('js/queryForm/header.js')}}"></script>{{--新版2--}}
    <script>
        new Vue({
            el: "#list",
            data: {
                labor_company_dispatches: [
                    @foreach( $labor_company_dispatches as $labor_company_dispatch )
                        {!! $labor_company_dispatch !!},
                    @endforeach
                ],
                selectTr: 0,
                warehouses: [
                        @foreach( $warehouses as $item )
                    {
                        name: '{{ $item->id }}', value: '{{ $item->name }}'
                    },
                    @endforeach
                ],
                labor_companies: [
                        @foreach( $labor_companies as $item )
                    {
                        name: '{{ $item->id }}', value: '{{ $item->name }}'
                    },
                    @endforeach
                ],
                statuses: [
                    {name: 1, value: '创建'},
                    {name: 2, value: '人事确认'},
                    {name: 3, value: '劳务接单'},
                    {name: 4, value: '任务完结'},
                ]
            },
            mounted() {
                $('#list').removeClass('d-none');
                let _this = this;
                $(".up").slideUp();
                let data = [
                    [
                        //起始时间
                        {name: 'dispatch_date_start', type: 'dateTime', tip: '选择显示分配时间的起始时间'},
                        //仓库
                        {
                            name: 'warehouse',
                            type: 'select_multiple_select',
                            tip: ['输入关键词快速定位下拉列表，回车确定', '仓库'],
                            placeholder: ['仓库', '定位或多选仓库'],
                            data: _this.warehouses
                        },
                        //状态
                        {
                            name: 'status',
                            type: 'select_multiple_select',
                            tip: ['输入关键词快速定位下拉列表，回车确定', '状态'],
                            placeholder: ['状态', '定位或多选状态'],
                            data: _this.statuses
                        },
                    ],
                    [
                        //截止时间
                        {name: 'dispatch_date_end', type: 'dateTime', tip: '选择显示分配时间的截止时间'},
                        //劳务公司
                        {
                            name: 'labor_company',
                            type: 'select_multiple_select',
                            tip: ['输入关键词快速定位下拉列表，回车确定', '劳务公司'],
                            placeholder: ['劳务公司', '定位或多选劳务公司'],
                            data: _this.labor_companies
                        },
                    ]
                ]
                _this.form = new query({
                    el: '#form_div',
                    condition: data,
                    appendDom: "btn",
                });
                _this.form.init();
                let column = [
                    {name: 'index', value: '序号', neglect: true},
                    {name: 'do', value: '操作'},
                    {name: 'check_user', value: '确认人'},
                    {name: 'name', value: '劳务公司'},
                    {name: 'warehouse', value: '仓库'},
                    {name: 'status', value: '状态 '},
                    {name: 'man_num', value: '男工人数'},
                    {name: 'woman_num', value: '女工人数'},
                    {name: 'details', value: '派遣详情'},
                    {name: 'dispatch_date', value: '分配日期'},
                ];
                new Header({
                    el: "table",
                    name: "labor_company_dispatches",
                    column: column,
                    data: this.labor_company_dispatches,
                    restorationColumn: 'addtime',
                    fixedTop: ($('#form_div').height()) + ($('#btn').height()) + 1,
                }).init();
            },

            methods: {
                /*临时工信息详情*/
                getCreateOrEditDetailUrl(labor_company_dispatch) {
                    let url = "";
                    if (labor_company_dispatch.labor_company_dispatch_details.length > 0) {
                        url = "{{ url('personnel/laborApply/laborCompanyDispatch') }}/" + labor_company_dispatch.id + '/detail/edit';
                    } else {
                        url = "{{ url('personnel/laborApply/laborCompanyDispatch') }}/" + labor_company_dispatch.id + '/detail/create';
                    }
                    return url;
                },
                /*分配详情编辑*/
                getEditlLaborCompanyDispatchUrl(labor_company_dispatch) {
                    let url = "";
                    url = "{{ url('personnel/laborApply/laborCompanyDispatch') }}/" + labor_company_dispatch.id + '/edit';
                    return url;
                },
                /*劳务接单*/
                getBaseUrl(labor_company_dispatch) {
                    let url = "";
                    url = "{{ url('personnel/laborApply/laborCompanyDispatch') }}/" + labor_company_dispatch.id;
                    return url;
                },
                //获取状态的徽章（badge）组件的外观
                getStatusClass(status) {
                    let result = '';
                    switch (status) {
                        case '创建':
                            result = 'badge badge-light'
                            break;
                        case '指派成功':
                            result = 'badge badge-info'
                            break;
                        case '劳务接单':
                            result = 'badge badge-primary'
                            break;
                        case '任务完结':
                            result = 'badge badge-success'
                            break;
                        default:
                            result = 'badge badge-info'
                    }
                    return result;
                }
            },
        });
    </script>
@endsection