@extends('layouts.app')
@section('title')
    绩效-人事管理
@endsection
@section('content')
    @component('personnel.menu')@endcomponent
    <div class="container-fluid card d-none" id="container">
        <div class="container-fluid nav3">
            <div class="card menu-third" >
                <ul class="nav nav-pills">
                    <li class="nav-item">
                        <a class="nav-link" style="cursor: pointer;" :class="type==0 ? 'active' : ''" @click="switchType(0)">项目部</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" style="cursor: pointer;" :class="type==1 ? 'active' : ''" @click="switchType(1)">销售部</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" style="cursor: pointer;" :class="type==2 ? 'active' : ''" @click="switchType(2)">仓库部</a>
                    </li>
                </ul>
            </div>
        </div>
        @include("customer._selectedOwner")

        <div id="form_div"></div>
        <div>
            <button type="button" class="btn btn-outline-dark btn-sm form-control-sm dropdown-toggle tooltipTarget"
                    data-toggle="dropdown" title="导出所有页将会以搜索条件得到的筛选结果，将其全部记录（每一页）导出">
                        导出Excel
            </button>
            <div class="dropdown-menu">
                <a class="dropdown-item" @click="reportExport(false)" href="javascript:">导出勾选内容</a>
                <a class="dropdown-item" @click="reportExport(true)" href="javascript:">导出所有页</a>
            </div>
            <button class="ml-1 btn btn-sm btn-outline-primary" data-toggle="modal" data-target="#selectedOwner">刷 新</button>
        </div>
        <div>
            <table class="table table-sm table-striped table-hover td-min-width-80" id="table">
                <tr v-for="(report,i) in reports">
                    <td>
                        <label><input type="checkbox" :value="report.id"></label>
                    </td>
                    <td><span>@{{ i+1 }}</span></td>
                    <td><span>@{{ report.countingMonth }}</span></td>
                    <td><span>@{{ report.ownerStorageDuration }}</span></td>
                    <td v-if="type == 0"><span>@{{ report.ownerGroupName }}</span></td>
                    <td v-if="type == 0">
                        <small v-for="user in report.ownerGroupUserList">@{{ user }}</small><br>
                    </td>
                    <td v-if="type == 0"><span>@{{ report.ownerName }}</span></td>
                    <td v-if="type == 0"><span>@{{ report.warehouseName }}</span></td>
                    <td v-if="type == 0"><span>@{{ report.userWorkGroupName }}</span></td>
                    <td v-if="type == 0 || type == 1"><span>@{{ report.sell }}</span></td>
                    <td v-if="type == 1"><span>@{{ report.ownerName }}</span></td>
                    <td v-if="type == 1"><span>@{{ report.warehouseName }}</span></td>
                    <td v-if="type == 1 || type == 2"><span>@{{ report.userWorkGroupName }}</span></td>
                    <td v-if="type == 1"><span>@{{ report.ownerGroupName }}</span></td>
                    <td v-if="type == 2">
                        <small v-for="user in report.userWorkGroupUserList">@{{ user }}</small><br>
                    </td>
                    <td v-if="type == 2"><span>@{{ report.ownerName }}</span></td>
                    <td v-if="type == 2"><span>@{{ report.warehouseName }}</span></td>
                    <td v-if="type == 2"><span>@{{ report.principal }}</span></td>
                    <td v-if="type == 2"><span>@{{ report.sell }}</span></td>
                    <td><span>@{{ report.ownerStatus }}</span></td>
                    <td><span>@{{ report.ownerCreatedAt }}</span></td>
                    <td><span>@{{ report.dailyAverageOrderAmount }}</span></td>
                    <td><span>@{{ report.lastMonthCountingArea }}</span></td>
                    <td><span>@{{ report.currentMonthCountingArea }}</span></td>
                    <td v-if="type == 0"><span>@{{ report.ownerBillReportInitialFee }}</span></td>
                    <td v-if="type == 0 || type == 1"><span>@{{ report.ownerBillReportConfirmFee }}</span></td>
                    <td v-if="type == 2"><span>@{{ report.ownerBillReportWorkFee }}</span></td>
                    <td v-if="type == 2"><span>@{{ report.ownerAreaReportAccountingArea }}</span></td>
                    <td><span>@{{ report.ownerBillReportConfirmUpdatedAt }}</span></td>
                    <td v-if="type == 0"><span>@{{ report.timeOut }}</span></td>
                </tr>
            </table>
            {{$reports->appends($params)->links()}}
        </div>
    </div>
@stop

@section('lastScript')
    <script type="text/javascript" src="{{mix('js/queryForm/queryForm.js')}}"></script>
    <script type="text/javascript" src="{{mix('js/queryForm/header.js')}}"></script>{{--新版2--}}
    <script type="text/javascript" src="{{mix('js/queryForm/export.js')}}"></script>
    <script>
        let vue = new Vue({
            el:"#container",
            data:{
                reports : [
                    @foreach($reports as $report)
                    {
                        id : "{{$report->id}}",
                        ownerGroupName : "{{$report->owner ? ($report->owner->userOwnerGroup ? $report->owner->userOwnerGroup->name : '') : ''}}",
                        customerName : "{{$report->owner ? ($report->owner->customer ? $report->owner->customer->name : '') : ''}}",
                        ownerName : "{{$report->owner ? $report->owner->name : ''}}",
                        warehouseName : "{{$report->owner->warehouse->name ?? ''}}",
                        userWorkGroupName : "{{$report->userWorkGroup->name ?? ''}}",
                        ownerGroupUserList:[],
                        userWorkGroupUserList:[],
                        ownerStatus : "{{$report->owner ? ($report->owner->deleted_at ? "冻结" : "激活") : ''}}",
                        ownerStorageDuration : "{{$report->owner ? ($report->owner->created_at ? ((new DateTime())->diff(new DateTime($report->owner->created_at))->days)  : '') : ''}}",
                        ownerCreatedAt : "{{$report->owner ? $report->owner->created_at : ''}}",
                        countingMonth : "{{$report->counting_month}}",
                        dailyAverageOrderAmount : "{{$report->daily_average_order_amount}}",
                        lastMonthCountingArea : "{{$report->last_month_counting_area}}",
                        currentMonthCountingArea : "{{$report->current_month_counting_area}}",
                        ownerBillReportInitialFee : "{{$report->ownerBillReport ? $report->ownerBillReport->initial_fee : ''}}",
                        ownerBillReportConfirmFee : "{{$report->ownerBillReport ? $report->ownerBillReport->confirm_fee : ''}}",
                        ownerBillReportWorkFee : "{{$report->ownerBillReport->work_fee ?? ''}}",
                        ownerAreaReportAccountingArea : "{{$report->owner->ownerAreaReport->accounting_area ?? ''}}",
                        ownerBillReportConfirmUpdatedAt : "{{$report->ownerBillReport ? $report->ownerBillReport->updated_at : ''}}",
                    },
                    @endforeach
                ],

                owners : [
                    @foreach($owners as $owner)
                    {name:"{{$owner->id}}",value:"{{$owner->name}}"},
                    @endforeach
                ],
                workgroup : [
                    @foreach($ownerGroups as $ownerGroup)
                    {name:"{{$ownerGroup->id}}",value:"{{$ownerGroup->name}}"},
                    @endforeach
                ],
                customers : [
                    @foreach($customers as $customer)
                    {name:"{{$customer->id}}",value:"{{$customer->name}}"},
                    @endforeach
                ],
                status : [
                    {name:"激活",value:"激活"},
                    {name:"冻结",value:"冻结"},
                ],
                sum : Number("{{ $reports->total() }}"),
                errors:[],
                type:0,
                header:"",
            },
            mounted(){
                $('#container').removeClass('d-none');
                let data=[
                    [
                        {name:'owner_group_id',type:'select',tip:'项目小组',placeholder: '项目小组',data:this.workgroup},
                        {name:'counting_month_start',type:'dateMonth',tip:'起始结算月',placeholder: '----年--月'},
                        {name:'owner_id',type:'select_multiple_select',tip:['输入关键词快速定位下拉列表，回车确定','选择要显示的项目'],
                            placeholder:['项目','定位或多选项目'],data:this.owners},
                    ],[
                        {name:'customer_id',type:'select_multiple_select',tip:['客户','定位或多选客户'],placeholder: ['客户','定位或多选客户'],data:this.customers},
                        {name:'counting_month_end',type:'dateMonth',tip:'结束结算月',placeholder: '----年--月'},
                        {name:'status',type:'select',placeholder:'状态',data:this.status},
                    ],
                ];
                this.form = new query({
                    el:"#form_div",
                    condition:data,
                });
                this.form.init();
                new Header({
                    el: "table",
                    name: "report",
                    column: this._getRenderingHeader(),
                    data: this.reports,
                    fixedTop:($('#form_div').height())+2,
                    before : [
                        {colspan:2,value: '', class:"table-header-layer-1"},
                        {colspan:2,value: '日期信息', class:"bg-light-purple"},
                        {colspan:(this.type==1?7:8),value: '项目信息', class:"bg-light-khaki"},
                        {colspan:3,value: '盘点信息', class:"bg-light-info"},
                        {colspan:(this.type==0 ? '4' : (this.type==1 ? '2' : '3')),value: '账单信息', class:"bg-light-cyanogen"},
                    ],
                }).init();
            },
            methods : {
                _getRenderingHeader()
                {
                    let column = [
                        {name:'index',value: '序号', neglect: true},
                        {name:'countingMonth',value: '结算月' ,class:"bg-purple"},
                        {name:'ownerStorageDuration',value: '入仓时长' ,class:"bg-purple"},
                    ];
                    switch (this.type) {
                        case 0:
                            column.push({name:'ownerGroupName',value: '项目小组',class:"bg-khaki"});
                            column.push({name:'ownerGroupUserList', neglect: true,value: '成员',class:"bg-khaki"});
                            column.push({name:'ownerName',value: '项目',class:"bg-khaki"});
                            column.push({name:'warehouseName',value: '所在仓库',class:"bg-khaki"});
                            column.push({name:'userWorkGroupName',value: '仓库小组',class:"bg-khaki"});
                            column.push({name:'sell',value: '销售', neglect: true,class:"bg-khaki"});
                            break;
                        case 1:
                            column.push({name:'sell',value: '销售', neglect: true,class:"bg-khaki"});
                            column.push({name:'ownerName',value: '项目',class:"bg-khaki"});
                            column.push({name:'warehouseName',value: '所在仓库',class:"bg-khaki"});
                            column.push({name:'userWorkGroupName',value: '仓库小组',class:"bg-khaki"});
                            column.push({name:'ownerGroupName',value: '项目小组',class:"bg-khaki"});
                            break;
                        case 2:
                            column.push({name:'userWorkGroupName',value: '仓库小组',class:"bg-khaki"});
                            column.push({name:'userWorkGroupUserList', neglect: true,value: '成员',class:"bg-khaki"});
                            column.push({name:'ownerName',value: '项目',class:"bg-khaki"});
                            column.push({name:'warehouseName',value: '所在仓库',class:"bg-khaki"});
                            column.push({name:'principal', neglect: true,value: '项目负责人',class:"bg-khaki"});
                            column.push({name:'sell',value: '销售', neglect: true,class:"bg-khaki"});
                            break;
                    }
                    column.push({name:'ownerStatus',value: '状态',class:"bg-khaki"});
                    column.push({name:'ownerCreatedAt',value: '创建日期',class:"bg-khaki"});
                    column.push({name:'dailyAverageOrderAmount',value: '日均单量', neglect: true, class:"bg-info"});
                    column.push({name:'lastMonthCountingArea',value: '上月盘点面积', neglect: true, class:"bg-info"});
                    column.push({name:'currentMonthCountingArea',value: '本月盘点面积', neglect: true, class:"bg-info"});
                    switch (this.type) {
                        case 0:
                            column.push({name:'ownerBillReportInitialFee',value: '初始账单金额', neglect: true, class:"bg-cyanogen"});
                            column.push({name:'ownerBillReportConfirmFee',value: '确认账单金额', neglect: true, class:"bg-cyanogen"});
                            column.push({name:'ownerBillReportConfirmUpdatedAt',value: '确认日期', class:"bg-cyanogen"});
                            column.push({name:'timeOut',value: '超时', neglect: true,class:"bg-cyanogen"});
                            break;
                        case 1:
                            column.push({name:'ownerBillReportConfirmFee',value: '确认账单金额', neglect: true, class:"bg-cyanogen"});
                            column.push({name:'ownerBillReportConfirmUpdatedAt',value: '确认日期', class:"bg-cyanogen"});
                            break;
                        case 2:
                            column.push({name:'ownerBillReportWorkFee',value: '操作费账单金额', neglect: true, class:"bg-cyanogen"});
                            column.push({name:'ownerAreaReportAccountingArea',value: '结算面积', neglect: true, class:"bg-cyanogen"});
                            column.push({name:'ownerBillReportConfirmUpdatedAt',value: '确认日期', class:"bg-cyanogen"});
                            break;
                    }
                    return column;
                },
                reportExport(isAll){
                    let url = '{{url('personnel/report/export')}}';
                    let token='{{ csrf_token() }}';
                    excelExport(isAll,checkData,url,this.sum,token);
                },
                createReport(isAll = false){
                    let dom = $("#owners");
                    let val = dom.selectpicker('val');
                    if (isAll){
                        val = [];
                        this.owners.forEach(owner=>{
                            val.push(owner.name);
                        });
                    }
                    window.tempTip.setDuration(3000);
                    window.tempTip.setIndex(1099);
                    if (val.length<1){
                        window.tempTip.show("未选择");
                        return;
                    }
                    let url="{{url('customer/project/createReport')}}";
                    let params = {val:val};
                    window.tempTip.postBasicRequest(url,params,res=>{
                        if (!isAll) this.errors = res.errors;
                        this.reports = res.data.concat(this.reports);
                        dom.selectpicker('val',[]);
                        return "已生成报表";
                    },true)
                },
                switchType(type){
                    this.type = type;
                    let obj = {columns:this._getRenderingHeader()};
                    if (type === 1)obj.offset = 7;
                    this.header.reset(obj);
                }
            }
        });
    </script>
@stop
