baoshi-was/resources/views/waybill/waybillFinancialSnapshot/index.blade.php

@extends('layouts.app')
@section('title')财务报表@endsection

@section('content')
<div class="d-none" id="editingPanel">

    <div  class="card" id="nav2">
        @component('waybill.menu')@endcomponent

            <div class="container-fluid nav3">
                <div class="card menu-third" >
                    <ul class="nav nav-pills">
                        @can('财务报表-查询')
                            <li class="nav-item">
                                <a class="nav-link @if($type=='') active @endif" href="@if(!isset($excepted)) {{url('waybill/waybillFinancialSnapshot')}} @else {{url('waybill/waybillFinancialExcepted')}} @endif">全部</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link @if($type=='ZX') active @endif" href="@if(!isset($excepted)) {{url('waybill/waybillFinancialSnapshot?type=ZX')}} @else {{url('waybill/waybillFinancialExcepted?type=ZX')}} @endif">专线</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link @if($type=='ZF') active @endif" href="@if(!isset($excepted)) {{url('waybill/waybillFinancialSnapshot?type=ZF')}} @else {{url('waybill/waybillFinancialExcepted?type=ZF')}} @endif">直发车</a>
                            </li> @endcan

                    </ul>
                </div>
            </div>
    </div>
    <div class="card " style="width: 3500px">
    <form  method="get" action="@if(!isset($excepted))
    @if($type=='ZF'){{url('waybill/waybillFinancialSnapshot?type=ZF')}}@elseif($type=='ZX'){{url('waybill/waybillFinancialSnapshot?type=ZX')}}@else{{url('waybill/waybillFinancialSnapshot')}}@endif
    @else
    @if($type=='ZF'){{url('waybill/waybillFinancialExcepted?type=ZF')}}@elseif($type=='ZX'){{url('waybill/waybillFinancialExcepted?type=ZX')}}@else{{url('waybill/waybillFinancialExcepted')}}@endif
    @endif ">
    <div class="card-header form-inline">
        <label style="margin-left: 1%"> 开始日期：</label><input style="max-width: 200px" type="date" name="created_at_start" class="form-control form-control-sm"  v-model="filterData.created_at_start">
        <label style="margin-left: 1%"> 截至日期：</label><input style="max-width: 200px" type="date" class="form-control form-control-sm" name="created_at_end" v-model="filterData.created_at_end">
        <input type="text" hidden name="type" v-model="filterData.type" >
        <input type="submit" class="btn btn-sm btn-outline-dark ml-3" value="按条件搜索" >
    </div>
    </form>
<!-- 自定义内容区域 -->
<div>
    @if(!isset($excepted))
    <div class="card-header">
    <label>操作选定记录：</label>
        <span class="dropdown">
            <button class="btn btn-sm form-control-sm dropdown-toggle tooltipTarget" :class="[checkData.length>0?'btn-dark':'btn-outline-dark']"
                    data-toggle="dropdown" title="导出所有页将会以搜索条件得到的筛选结果，将其全部记录（每一页）导出">
                导出Excel
            </button>
            <div class="dropdown-menu">
                <a class="dropdown-item" @click="waybillExport(false)" href="javascript:">导出勾选内容</a>
                <a class="dropdown-item" @click="waybillExport(true)" href="javascript:">导出所有页</a>
            </div>
        </span>
    </div>
    @endif
    @if(!isset($excepted))
        <label for="all" class="d-none" id="cloneCheckAll">
            <input id="all" type="checkbox" @click="checkAll($event)">全选
        </label>
    @endif
    <table class="d-none table table-bordered text-nowrap" id="headerRoll"></table>
    <table class="table  table-hover table-bordered text-nowrap " style="width: 1500px;height: auto" id="headerParent">
        <thead>
        <tr style="background: #E8E8E8;@if(isset($excepted)) color: red; @endif" id="header"></tr>
        </thead>
        <tbody>

        <tr v-for="(json_content,i) in json_contents" :style="{background:json_content.type=='直发车'?'#F8F8F8':''}">
            @if(!isset($excepted))
            <td>
                <input class="checkItem" type="checkbox" :value="json_content.waybill_id" v-model="checkData">
            </td>
            @endif
            <td>@{{ i+1 }}</td>
            <td>@{{json_content.type}}</td>
            <td>@{{json_content.waybill_number}}</td>
            <td>@{{json_content.owner_name}}</td>
            <td>@{{json_content.wms_bill_number}}</td>
            <td>@{{json_content.origination}}</td>
            <td>@{{json_content.destination}}</td>
            <td>@{{json_content.recipient}}</td>
            <td>@{{json_content.recipient_mobile}}</td>
            <td>@{{json_content.charge}}</td>
            <td>@{{json_content.ordering_remark}}</td>
            <td>@{{json_content.carrier_name}}</td>
            <td>@{{json_content.carrier_bill}}</td>
            <td>@{{json_content.origination_city_name}}</td>
            <td>@{{json_content.destination_city_name}}</td>
            <td>@{{json_content.warehouse_weight}}</td>
            <td>@{{json_content.warehouse_weight_other}}</td>
            <td>@{{json_content.carrier_weight_other}}</td>
            <td>@{{json_content.carrier_weight_other}}</td>
            <td>@{{json_content.car_type_name}}</td>
            <td>@{{json_content.car_owner_info}}</td>
            <td>@{{json_content.fee}}</td>
            <td>@{{json_content.pick_up_fee}}</td>
            <td>@{{json_content.other_fee}}</td>
            <td>@{{json_content.collect_fee}}</td>
            <td>@{{json_content.dispatch_remark}}</td>
            <td>@{{json_content.created_at}}</td>
            <td>@{{json_content.auditLog_user_name }}</td>
            <td>@{{json_content.total_receivable}}</td>
            <td>@{{json_content.total_expense}}</td>
            <td>@{{json_content.gross_margin}}</td>
            <td>@{{Math.round(json_content.gross_profit_rate*100)}}%</td>

        </tr>

        </tbody>
    </table>
        <div class="text-info h5 btn btn">{{$waybillFinancialSnapshots->count()}}/{{$waybillFinancialSnapshots->total()}}</div>
    </div>
</div>

<!-- 分页  -->
<div>
    <div class="pull-right">
        {{$waybillFinancialSnapshots->render()}}
    </div>
</div>
</div>
@stop

@section('lastScript')
<script type="text/javascript" src="{{asset('js/queryForm/header200826b.js')}}"></script>
<script type="text/javascript" src="{{asset('js/queryForm/export200818a.js')}}"></script>
<script>
    let vue = new Vue({
        el:'#editingPanel',
        data:{
            json_contents:[
                @if(isset($waybillFinancialSnapshots))
                @foreach($waybillFinancialSnapshots as $waybillFinancialSnapshot)
                    {!!$waybillFinancialSnapshot->json_content!!},
                @endforeach
                @endif
            ],
            checkData:[],
            filterData:{
                created_at_start:'',created_at_end:'',type:'{{$type}}',
            },
            sum:{!! $waybillFinancialSnapshots->total() !!},
        },
        watch:{
            checkData:{
                handler(){
                    if (this.checkData.length === this.json_contents.length){
                        document.querySelector('#all').checked = true;
                        document.querySelector('#all_temp').checked = true;
                    }else {
                        document.querySelector('#all').checked = false;
                        document.querySelector('#all_temp').checked = false;
                    }
                },
                deep:true
            },
        },
        mounted:function(){
            this.initInputs();
            $(".tooltipTarget").tooltip({'trigger':'hover'});
            $('#editingPanel').removeClass('d-none');
            let column = [
                @if(!isset($excepted)){name:'cloneCheckAll',customization:true,type:'checkAll',column:'waybill_id',
                    dom:$('#cloneCheckAll').removeClass('d-none'), neglect: true},@endif
                {name:'index',value: '序号', neglect: true},
                {name:'type',value: '运单类型', neglect: true},
                {name:'waybill_number',value: '运单号', neglect: true},
                {name:'owner',value: '货主', neglect: true},
                {name:'wms_bill_number',value: 'WMS单号', neglect: true},
                {name:'origination',value: '始发地', neglect: true},
                {name:'destination',value: '目的地', neglect: true},
                {name:'recipient',value: '收件人', neglect: true},
                {name:'recipient_mobile',value: '收件人电话', neglect: true},
                {name:'charge',value: '收费(元)', neglect: true},
                {name:'ordering_remark',value: '下单备注', neglect: true},
                {name:'carrier',value: '承运商', neglect: true},
                {name:'carrier_bill',value: '承运商单号', neglect: true},
                {name:'origination_city',value: '始发市', neglect: true},
                {name:'destination_city',value: '目的市', neglect: true},
                {name:'warehouse_weight',value: '仓库计数(抛)', neglect: true},
                {name:'warehouse_weight_other',value: '仓库计数二', neglect: true},
                {name:'carrier_weight',value: '承运商计数(抛)', neglect: true},
                {name:'carrier_weight_other',value: '承运商计数二', neglect: true},
                {name:'car_type',value: '车型', neglect: true},
                {name:'car_owner_info',value: '车辆信息', neglect: true},
                {name:'fee',value: '运费(元)', neglect: true},
                {name:'pick_up_fee',value: '提货费(元)', neglect: true},
                {name:'other_fee',value: '其他费用(元)', neglect: true},
                {name:'collect_fee',value: '到付金额(元)', neglect: true},
                {name:'dispatch_remark',value: '调度备注', neglect: true},
                {name:'created_at',value: '创建时间', neglect: true},
                {name:'user_name',value: '终审人员', neglect: true},
                {name:'total_receivable',value: '应收款', neglect: true},
                {name:'total_expense',value: '应付款', neglect: true},
                {name:'gross_margin',value: '毛利', neglect: true},
                {name:'gross_profit_rate',value: '毛利率', neglect: true},
            ];
            let _this = this;
            setTimeout(function () {
                let header = new Header({
                    el: "#header",
                    column: column,
                    data: _this.json_contents,
                    restorationColumn: 'id',
                    offset:0.5,
                    vue : vue,
                });
                header.init();
            },0);
        },
        methods:{
            initInputs:function(){
                let data=this;
                let uriParts =decodeURI(location.href).split("?");
                if(uriParts.length>1){
                    let params = uriParts[1].split('&');
                    params.forEach(function(paramPair){
                        let pair=paramPair.split('=');
                        let key = pair[0], val = pair[1];
                        $('input[name="'+key+'"]').val(val);
                        decodeURI(data.filterData[key]=val);
                    });
                }
            },
            checkAll(e){
                if (e.target.checked){
                    this.json_contents.forEach((el,i)=>{
                        if (this.checkData.indexOf(el.waybill_id) == '-1'){
                            this.checkData.push(el.waybill_id);
                        }
                    });
                }else {
                    this.checkData = [];
                }
            },
            waybillExport(checkAllSign){
                let url='{{url('waybillFinancialSnapshot/export')}}';
                let token='{{ csrf_token() }}';
                excelExport(checkAllSign,this.checkData,url,this.sum,token);
            },
        }
    })

</script>
@stop