baoshi-was/resources/views/rejected/search/general.blade.php

@extends('layouts.app')
@section('title')查询-退货管理@endsection

@section('content')
    <div id="nav2">
        @component('rejected.menu')@endcomponent
        @component('rejected.search.menu')@endcomponent
    </div>
    <div class="container-fluid">
        <div>
            <div class="d-none" id="list">
                @if(Session::has('successTip'))
                    <div class="alert alert-success h1">{{Session::get('successTip')}}</div>
                @endif                <div id="form_div"></div>
                <span class="dropdown">
                    <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="exportExcel(false)" href="javascript:">导出勾选内容</a>
                        <a class="dropdown-item" @click="exportExcel(true)" href="javascript:">导出所有页</a>
                    </div>
                </span>
                @can('退货管理-审核')
                    <span class="btn btn-sm btn-outline-dark" @click="checkAll" style="cursor: pointer">审核</span>
                @endcan
                @can('退货管理-编辑')
                    <span class="btn btn-sm btn-outline-dark" @click="finishAll" style="cursor: pointer">完结</span>
                @endcan
                @can('退货管理-查询-一般-修改入库')
                    @cannot('退货管理-客户不可见')
                        <span class="dropdown">
                    <button class="btn btn-outline-dark btn-sm form-control-sm dropdown-toggle tooltipTarget"
                            data-toggle="dropdown" title="将勾选记录的入库状态设定为是或否，仅对未完结状态的记录有效">
                        修改入库
                    </button>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" @click="setIsLoaded_batch(1)" href="javascript:">设定为是</a>
                        <a class="dropdown-item" @click="setIsLoaded_batch(0)" href="javascript:">设定为否</a>
                        <a class="dropdown-item" @click="setIsLoaded_batch('null')" href="javascript:">无需入库</a>
                        <a class="dropdown-item" @click="setIsLoaded_batch(2)" href="javascript:">待推单</a>
                        <a class="dropdown-item" @click="setIsLoaded_batch(4)" href="javascript:">待确认</a>
                    </div>
                </span>
                    @endcannot
                @endcan

                @can('退货管理-编辑')
                    <a class="btn btn-sm btn-outline-dark" href="{{url('rejected/importRejectedNumber')}}" style="cursor: pointer">导入修改</a>
                @endcan
                <button class="btn btn-sm ml-2 btn-primary" @click="copyLogisticNumber()">复制快递单号</button>
                <table class="table table-striped table-sm table-bordered table-hover text-nowrap table-body td-min-width-80"  style="background: #fff;" id="table">
                    <tr v-for="(rejectedBill,i) in rejectedBills" :data-id="rejectedBill.id"  @click="selectTr===i+1?selectTr=0:selectTr=i+1" :class="selectTr===i+1?'focusing' : ''">
                        <td>
                            <label><input type="checkbox" :value="rejectedBill.id"/></label>
                        </td>
                        <td class="text-nowrap">
                            <span class="text-muted" style="opacity:0.7">@{{ i+1 }}</span> <span v-if="rejectedBill.order_issue_rejected_bill" class="badge badge-pill badge-danger">问题件</span>
                        </td>
                        <td class="text-muted">
                            <span>
                                <span v-if="rejectedBill.is_checked==1" class="text-success">
                                    <span class="fa fa-check-square"></span> @{{ rejectedBill.checked_numbers }}
                                </span>
                                <span v-else>未审核</span>
                            </span>
                        </td>
                        <td class="" :class="[rejectedBill.is_finished==1?'text-success':'text-muted']">@{{rejectedBill.is_finished | yesNo}}</td>
                        <td class="" :class="[rejectedBill.is_loaded==1?'text-success':'text-muted']">
                            <span>
                            <span v-if="rejectedBill.is_loaded==4">
                            @can('退货管理-查询-一般-修改入库')
                                    <button class="btn btn-sm btn-info" @click="confirmBeStored($event,rejectedBill.id)">确定入库</button>
                                @endcan
                            </span>
                            <span v-else>@{{rejectedBill.is_loaded | yesNoIsLoaded}}</span>
                            </span>
                        </td>
                        <td class="text-muted"><span>@{{rejectedBill.created_at}}</span></td>
                        <td><span v-if="rejectedBill.owner"><span>@{{rejectedBill.owner.name}}</span></span></td>
                        <td><span>@{{rejectedBill.logistic_number_return}}</span></td>
                        <td class="text-muted"><span v-if="rejectedBill.logistic"><span>@{{rejectedBill.logistic.name}}</span></span></td>
                        <td>@{{rejectedBill.order_number}}</td>
                        <td class="text-muted text-overflow-replace-100" style="pointer-events:auto"><span>@{{rejectedBill.sender}}</span></td>
                        <td class="text-muted text-overflow-replace-200" style="pointer-events:auto"><span>@{{rejectedBill.mobile_sender}}</span></td>
                        <td>@{{rejectedBill.logistic_number}}</td>
                        @cannot('退货管理-到付费用')<td class="text-muted"><span>@{{rejectedBill.fee_collected}}</span></td>@endcannot
                        @can('退货管理-查询-客户定义-爱奇艺')<td class="text-muted"><span>@{{rejectedBill.common_01}}</span></td>@endcan
                        @cannot('退货管理-客户不可见')<td class="text-muted">@{{rejectedBill.common_02}}</td>@endcannot
                        <td class="text-muted"><span>@{{rejectedBill.goods_amount}}</span></td>
                        <td style="min-width: 900px">
                            <div class="w-100" :class="rejectedBill.items.length>1 ? 'up' : ''" :id="'rejected-'+rejectedBill.id">
                                <div class="row" v-for="item in rejectedBill.items">
                                    <div class="col-2 border border-1" style="overflow-x: hidden">
                                        <div class="w-100 text-overflow-warp-200 warp-min-200">@{{item.barcode_goods}}</div>
                                    </div>
                                    <div class="col-2 border border-1" style="overflow-x: hidden">
                                        <div class="w-100 text-overflow-warp-200 warp-min-200">@{{item.name_goods}}</div>
                                    </div>
                                    <div class="col-1 border border-1">@{{item.amount}}</div>
                                    <div class="col-1 border border-1">@{{item.quality_label}}</div>
                                    <div class="col-2 border border-1">@{{item.batch_number}}</div>
                                    <div class="col-1 border border-1">@{{item.made_at}}</div>
                                    <div class="col-1 border border-1">@{{item.validity_at}}</div>
                                    <div class="col-2 border border-1">@{{item.remark}}</div>
                                </div>
                            </div>
                            <div class="text-center cursor-pointer" v-if="rejectedBill.items.length>1" @click="unfold(rejectedBill.id)">
                                <div v-if="upList[rejectedBill.id]">点击收起明细</div>
                                <div v-else>@{{rejectedBill.goods_amount}}件商品，点击展开明细</div>
                            </div>
                        </td>
                        <td style="min-width:150px;">
                            @can('退货管理-编辑备注')
                                <textarea class="form-control form-control-sm"   :rows="rejectedBill.remark?Math.ceil(rejectedBill.remark.length/8):2"  cols=8
                                          @change="updateRejectedBillRemark($event)" :value="rejectedBill.remark" :data_id="rejectedBill.id">@{{ rejectedBill.remark }}</textarea>
                            @else
                                <span>@{{rejectedBill.remark}}</span>
                            @endcan
                        </td>
                        <td class="text-muted">@{{rejectedBill.operator_name}}</td>
                        @can('退货管理-编辑')
                            <td>
                                <span v-if="rejectedBill.is_finished!=1">
                                @can('退货管理-编辑')
                                        <button class="btn btn-outline-info btn-sm tooltipTarget" @click="edit(rejectedBill.id)">改</button>
                                    @endcan
                                    @can('退货管理-删除')
                                        <button
                                            class="btn btn-outline-danger btn-sm tooltipTarget" @click="destroy(rejectedBill)">删</button>
                                    @endcan
                                </span>
                                <span v-else class="text-muted">已完结</span>
                            </td>
                        @endcan
                    </tr>
                </table>
                <div class="text-info h5 btn btn">{{$rejectedBills->count()}}/{{$rejectedBills->total()}}</div>
                {{$rejectedBills->appends($paginateParams)->links()}}
            </div>
            <label><textarea  id="clipboardDiv" style="opacity:0"></textarea></label>
        </div>
    </div>
@endsection

@section('lastScript')
    <script>
        let rejectedBills={!! $rejectedBills->toJson()!!}.data;
        let owners=[
                @foreach($owners as $owner)
            {id:'{{$owner->id}}',name:'{{$owner->name}}'},
            @endforeach
        ];
        let logistics=[
            @foreach($logistics as $logistic)
                {!! $logistic !!},
            @endforeach
        ];
        let qualityLabels=[
                @foreach($qualityLabels as $qualityLabel)
            {id:'{{$qualityLabel->id}}',name:'{{$qualityLabel->name}}'},
            @endforeach
        ];
        @if(isset($paginateParams))
        let paginateParams={!! json_encode($paginateParams) !!};
        @endif
        let total='{{$rejectedBills->total()}}';
        let editUrl = "{{url('rejectedBill')}}/";
        let destroyUrl = "{{url('rejectedBill')}}/";
        let ajaxConfirmBeStoredUrl = '{{url("apiLocal/rejectedBill/apiConfirmBeStored")}}';
        let ajaxCheckUrl = '{{url("apiLocal/rejectedBill/apiSetIsLoadedAll")}}';
        let ajaxCheckAllURL = '{{url("rejected/ajaxCheckAll")}}';
        let ajaxFinishAllUrl='{{url("rejected/ajaxFinishAll")}}';
        let csrfInput='@csrf';
    </script>
    <script src="{{mix('js/queryForm/export.js')}}"></script>
    <script src="{{mix('js/queryForm/queryForm.js')}}"></script>
    <script type="text/javascript" src="{{mix('js/queryForm/header.js')}}"></script>{{--新版2--}}
    <script>
        let vue = new Vue({
            el:"#list",
            data:{
                rejectedBills:rejectedBills,
                owners:[
                        @foreach($owners as $owner)
                    {name:'{{$owner->id}}',value:'{{$owner->name}}'},
                    @endforeach
                ],
                logistics:[
                        @foreach($logistics as $logistic)
                    {name:'{{$logistic->id}}',value:'{{$logistic->name}}'},
                    @endforeach
                ],
                qualityLabels:[
                        @foreach($qualityLabels as $qualityLabel)
                    {name:'{{$qualityLabel->id}}',value:'{{$qualityLabel->name}}'},
                    @endforeach
                ],
                selectTr:'',
                upList:{},
            },
            mounted:function(){
                $(".up").slideUp();
                $(".tooltipTarget").tooltip({'trigger':'hover'});
                $('#list').removeClass('d-none');
                let data=[
                    [
                        {name:'created_at_start',type:'dateTime',tip:'选择显示指定日期的起始时间'},
                        {name:'owner_id',type:'select_multiple_select',tip:['输入关键词快速定位下拉列表，回车确定','选择要显示的客户'],
                            placeholder:['货主','定位或多选货主'],data:this.owners},
                        {name:'order_number',type:'input',tip:'可支持多客户单号，糊模查找需要在右边打上%符号',placeholder:'客户单号'},
                        {name:'logistic_number_return',type:'input',tip:'可支持多退回单号，糊模查找需要在右边打上%符号',placeholder:'退回单号'},
                        {name:'logistic_number',type:'input',tip:'可支持多原单单号，糊模查找需要在右边打上%符号',placeholder:'原单单号'},
                        {name:'is_checked',type:'select',placeholder: '是否审核',data:[{name:1,value:'已审核'},{name:0,value:'未审核'}]},
                        {name:'id_logistic_return',type:'select',placeholder: '快递名称',data:this.logistics},
                        {name:'remark',type:'input',tip:'退单备注：默认查询15天以内记录信息',placeholder: '退单备注'},
                    ],[
                        {name:'created_at_end',type:'dateTime',tip:'选择显示指定日期的结束时间'},
                        {name:'barcode_goods',type:'input',tip:'可支持多商品条码，糊模查找需要在右边打上%符号',placeholder:'商品条码'},
                        {name:'id_quality_label',type:'select',tip:'是否正品：正品仅显示全部是正品的退单，但残次显示的是包含有残次的退单',placeholder: '是否正品',data:this.qualityLabels},
                        {name:'mobile_sender',type:'input',tip:'寄件人手机：输入完成敲回车提交',placeholder:'寄件人手机'},
                        {name:'checked_numbers',type:'input',tip:'可支持多审核批次号，糊模查找需要在右边打上%符号',placeholder:'审核批次号'},
                        {name:'is_loaded',type:'select',placeholder: '是否入库',data:[{name:1,value:'是'},{name:0,value:'否'},
                                {name:'null',value:'无需入库'},{name:2,value:'待推单'},{name:4,value:'待确认'},{name:3,value:'交互异常'}]},
                        {name:'is_issue',type:'select',data:[{name:'true',value:'有'},{name:'false',value:'无'}],tip:'问题件',placeholder:'问题件'}
                    ]
                ];
                this.form=new query({
                    el:"#form_div",
                    condition:data
                });
                this.form.init();
                let column = [
                    {name:'index',value: '序号', neglect: true},
                    {name:'checked_numbers',value: '是否审核', neglect: true},
                    {name: 'is_finished', value: '是否完结',neglect: true},
                    {name: 'is_loaded', value: '是否入库', neglect: true},
                    {name:'created_at',value: '创建时间'},
                    {name: 'owner_name', value: '客户名称', neglect: true},
                    {name: 'logistic_number_return', value: '退回单号'},
                    {name: 'logistic_name', value: '退回公司', neglect: true},
                    {name:'order_number',value: '订单号'},
                    {name: 'sender', value: '姓名'},
                    {name: 'mobile_sender', value: '电话'},
                    {name: 'logistic_number', value: '原单单号'},
                        @cannot('退货管理-到付费用'){name:'fee_collected',value: '到付费用',neglect: true},@endcannot
                        @can('退货管理-查询-客户定义-爱奇艺'){name:'common_01',value: '寄件方省'},@endcan
                        @cannot('退货管理-客户不可见'){name:'common_02',value: '重量'},@endcannot
                    {name:'goods_amount',value: '商品总数'},
                    {name:"goods",type:"multi",title:"商品信息",rows:[
                            {value:"商品条码",col:"2"},
                            {value:"商品名称",col:"2"},
                            {value:"数量",col:"1"},
                            {value:"质量",col:"1"},
                            {value:"批次号",col:"2"},
                            {value:"产期",col:"1"},
                            {value:"效期",col:"1"},
                            {value:"备注",col:"2"},
                        ]},
                    {name:'remark',value: '退单备注'},
                    {name:'operator_name',value: '录入人'},
                        @can('退货管理-编辑','退货管理-删除'){name:'remove',value: '操作', neglect: true},@endcan
                ];
                new Header({
                    el: "table",
                    name: "general",
                    column: column,
                    data: this.rejectedBills,
                    fixedTop:($('#form_div').height())+2,
                }).init();
            },
            methods:{
                unfold(id){
                    this.$set(this.upList,id,this.upList[id] ? !this.upList[id] : true);
                    $("#rejected-"+id).slideToggle();
                },
                selectTableRow(id,e){
                    $('#headerParent tr[class=focusing]').removeClass('focusing');
                    if (id === this.selectTr) {
                        this.selectTr = '';
                        return;
                    }
                    this.selectTr = id;
                    $(e.target).parent('tr').addClass('focusing')
                },
                copyLogisticNumber(){
                    let text="";
                    checkData.forEach((id,i)=>{
                        this.rejectedBills.some(bill=>{
                            if (bill.id == id){
                                text += bill.logistic_number_return;
                                if (i!==checkData.length-1)text += "\r\n";
                                return true;
                            }
                        });
                    });
                    this.copyText(text)
                },
                copyText(text){
                    try {
                        $('#clipboardDiv').text(text).select().focus();
                        document.execCommand("Copy");
                        tempTip.setIndex(1052)
                        tempTip.setDuration(2000)
                        tempTip.showSuccess('复制成功')
                    } catch (e) {
                        tempTip.setIndex(1052)
                        tempTip.setDuration(2000)
                        tempTip.showSuccess('复制失败：'+e)
                    }
                },
                updateRejectedBillRemark:function (e) {
                    let target = $(e.target);
                    let _this = this;
                    let id = target.attr('data_id');
                    let remark = target.val();
                    let ajaxUrl= '{{url("rejected/changeRejectedBillRemark")}}';
                    axios.post(ajaxUrl,{'id':id,'remark':remark}).then(function (response) {
                        if(response.data.success){
                            _this.updateRejectedBills(id,remark);
                            tempTip.setDuration(2000);
                            tempTip.showSuccess('备注修改成功');
                        }else{
                            tempTip.setDuration(3000);
                            tempTip.show('备注修改失败!'+response.data.fail_info);
                        }
                    }).catch(function (err) {
                        tempTip.setDuration(3000);
                        tempTip.show('备注修改失败!网络异常：'+err);
                    });

                },
                // 更新表格数据
                updateRejectedBills(id,remark){
                    this.rejectedBills.some(function(rejectedBill){
                        if(parseInt(rejectedBill.id) === parseInt(id)){
                            rejectedBill.remark = remark;
                            return true;
                        }
                    })
                },
                edit(id){
                    window.location.href=editUrl+id+"/edit";
                },
                destroy:function(rejectedBill){
                    if(!confirm('确定要删除退货信息“' + rejectedBill.owner.name+':'+rejectedBill.logistic_number_return+ '”吗？')){return;}
                    let data=this;
                    let url = destroyUrl+rejectedBill.id;
                    axios.delete(url,{id:rejectedBill.id})
                        .then(function (response) {
                            if(response.data.success){
                                for (let i = 0; i < data.rejectedBills.length; i++) {
                                    if (data.rejectedBills[i].id===rejectedBill.id){
                                        data.rejectedBills.splice(i,1);
                                        break;
                                    }
                                }
                                tempTip.setDuration(1000);
                                tempTip.showSuccess('删除退货信息"'+rejectedBill.owner.name+':'+rejectedBill.logistic_number_return+'"成功!')
                            }else{
                                tempTip.setDuration(1000);
                                tempTip.show('删除退货信息"'+rejectedBill.owner.name+':'+rejectedBill.logistic_number_return+'"失败!')
                            }
                        })
                        .catch(function (err) {
                            tempTip.setDuration(3000);
                            tempTip.show('删除退货信息失败!'+'网络错误：' + err);
                        });
                },
                cancelCheckConfirmAll:function(){
                    $('#checkConfirmingAll').tooltip('hide');
                    setTimeout(function () {
                        $(".tooltipTarget").tooltip({'trigger':'hover'})
                    }, 10);
                    this.rejectedBills.forEach(function(rejectedBill){
                        if(rejectedBill.is_checked===-1)
                            rejectedBill.is_checked='0';
                    })
                },
                setIsLoaded_batch:function(val){
                    let _this=this;
                    if(checkData.length===0){
                        tempTip.show('没有勾选记录');
                        $(e.target).val("");
                        return;
                    }
                    let is_loaded=0;
                    let is_loadedLabel='否';
                    if(parseInt(val)===1){
                        is_loaded=1;
                        is_loadedLabel='是';
                    }else if(parseInt(val)===2){
                        is_loaded=2;
                        is_loadedLabel='待推单';
                    }else if(parseInt(val)===4){
                        is_loaded=4;
                        is_loadedLabel='待确认';
                    }else if(val==="null"){
                        is_loaded='null';
                        is_loadedLabel='无需入库';
                    }
                    if(!confirm("确定要标记所有勾选入库情况为'"+is_loadedLabel+"'吗")){return;}
                    axios.post(ajaxCheckUrl,{ids:checkData,is_loaded:is_loaded}).then(function(response){
                        if(response.data.success){
                            checkData.forEach(function(id){
                                _this.rejectedBills.forEach(function(bill){
                                    if(bill.id===id){
                                        bill.is_loaded=is_loaded;
                                    }
                                });
                            });
                            tempTip.setDuration(1000);
                            tempTip.showSuccess('修改勾选记录的入库状态成功');
                        }else{
                            tempTip.setDuration(2500);
                            tempTip.show('修改勾选记录的入库状态失败，错误：'+response.data.fail_info);
                        }
                    }).catch(function (e) {
                        tempTip.setDuration(2500);
                        tempTip.show('审核勾选内容失败，网络连接错误：'+e);

                    });
                    $(e.target).val("")
                },
                checkAll:function(){
                    let _this=this;
                    if(checkData.length===0){
                        tempTip.show('没有勾选记录');
                        return
                    }
                    if(!confirm("确定要标记所有勾选内容为'已审核'吗")){return;}
                    axios.post(ajaxCheckAllURL,{ids:checkData}).then(function(response){
                        if(response.data.success){
                            response.data.rejecteds.forEach(function (rejected) {
                                _this.rejectedBills.forEach(function(rejectedBill){
                                    if(parseInt(rejectedBill.id)===parseInt(rejected.id)){
                                        rejectedBill.is_checked=1;
                                        rejectedBill.checked_numbers=rejected.checked_numbers;
                                    }
                                });
                            });
                            tempTip.setDuration(1000);
                            tempTip.showSuccess('审核勾选内容成功');
                        }else{
                            tempTip.setDuration(2500);
                            tempTip.show('审核勾选内容失败，错误：'+response.data.fail_info);
                        }
                    }).catch(function (e) {
                        tempTip.setDuration(2500);
                        tempTip.show('审核勾选内容失败，网络连接错误：'+e);
                    })
                },
                confirmBeStored:function($e,id){
                    let _this=this;
                    axios.post(ajaxConfirmBeStoredUrl,{id:id}).then(function(response){
                        if(response.data.success){
                            _this.rejectedBills.forEach(function(rejectedBill){
                                if(rejectedBill.id===id){
                                    rejectedBill.is_loaded=1;
                                }
                            });
                            tempTip.setDuration(1000);
                            tempTip.showSuccess('确认入库成功');
                        }else{
                            tempTip.setDuration(2500);
                            tempTip.okWindow('数据异常无法确认！请在WMS确定入库状态后，勾选该条目手动修改相应入库状态！','知道了')
                        }
                    }).catch(function (e) {
                        alert('确认失败，网络连接错误：'+e);
                        tempTip.setDuration(2500);
                        tempTip.show('确认失败，网络连接错误：'+e);

                    })
                },
                finishAll:function(){
                    let _this=this;
                    if(checkData.length===0){
                        tempTip.show('没有勾选记录');
                        return
                    }
                    if(!confirm("确定要标记所有勾选内容为'已完结'吗")){return;}
                    axios.post(ajaxFinishAllUrl,{ids:checkData}).then(function(response){
                        if(response.data.success){
                            _this.rejectedBills.forEach(function(rejectedBill){
                                checkData.forEach(function (checkedId) {
                                    if(rejectedBill.id===checkedId){
                                        rejectedBill.is_finished=1;
                                    }
                                });
                            });
                            tempTip.setDuration(1000);
                            tempTip.showSuccess('标记勾选内容为完结成功');
                        }else{
                            tempTip.setDuration(2500);
                            tempTip.show('标记勾选内容为完结失败，错误：'+response.data.fail_info);
                        }
                    }).catch(function (e) {
                        alert('网络连接错误：'+e);
                        tempTip.setDuration(2500);
                        tempTip.show('标记勾选内容完结失败，网络连接错误：'+e);
                    })
                },
                exportExcel:function(checkAllSign){
                    let url = '{{url('rejected/export')}}';
                    let token='{{ csrf_token() }}';
                    excelExport(checkAllSign,checkData,url,total,token);
                },

            },
            filters:{
                yesNo:function (val) {
                    if(!val||val===0||val==='0'){return '否'}
                    return '是'
                },
                yesNoIsLoaded:function (val) {
                    switch(val){
                        case 0:case '0':return '否';
                        case 1:case '1':return '是';
                        case 2:case '2':return '待推单';
                        case 3:case '3':return '交互异常';
                        case 4:case '4':return '待确认';
                        case null:case 'null':return '无需入库';
                    }
                    return '';
                }
            }
        });
    </script>
@endsection