baoshi-was/resources/views/order/issue/edit.blade.php

@extends('layouts.app')
@section('title')问题件-编辑@endsection

@section('content')
    @component("order.issue.menu")
    @endcomponent
    <div class="container-fluid d-none" id="editOrderIssue">
        <div class="card col-md-8 offset-md-2 ">
            <div class="card-header">问题件修改</div>
            <input type="hidden" name="order_id" v-model="orderIssues.order_id">
            <input type="hidden" name="id" v-model="orderIssues.id">
            <input type="hidden" name="rejected_bill_id" v-model="orderIssues.rejected_bill_id">
            <input type="hidden" name="order_issue_type_id" v-model="orderIssues.order_issue_type_id">
            <input type="hidden" name="second_order_id" v-model="orderIssues.second_order_id">
            <div class="card-body">
                <div class="form-group row">
                    <label for="name" class="col-2 col-form-label text-right">原始客户订单号</label>
                    <div class="col-8">
                        <input type="text" class="form-control" name="client_code" v-model="order.client_code" disabled>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">问题类别</label>
                    <div class="col-8">
                        <select name="order_issue_type_id" class="form-control" id="order_issue_type_id" v-model="orderIssues.order_issue_type_id">
                            <option value></option>
                            <option v-for="type in orderIssueType" :value="type.id">@{{ type.name }}</option>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">客户</label>
                    <div class="col-8">
                        <select name="owner_id" class="form-control" id="owner_id" v-model="order.owner_id">
                            <option value></option>
                            <option v-for="type in owners" :value="type.id">@{{ type.name }}</option>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">承运商</label>
                    <div class="col-8">
                        <select name="logistic_id" class="form-control" id="logistic_id" v-model="order.logistic_id">
                            <option value></option>
                            <option v-for="type in logistics" :value="type.id">@{{ type.name }}</option>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">退回单号</label>
                    <div class="col-8">
                        <input type="text" class="form-control" name="logistic_number" v-model="rejectedBill.logistic_number_return" @blur="getRejectedBill" id="logistic_number_return">
                    </div>
                </div>

                <div class="form-group row" >
                    <label class="col-2 col-form-label text-right">退回单号承运商</label>
                    <div class="col-8 form-group">
                        <select class="form-control" name="id_logistic_return" v-model="rejectedBill.id_logistic_return" id="id_logistic_return">
                            <option value></option>
                            <option v-for="logistic in logistics" :value="logistic.id">@{{ logistic.name }}</option>
                        </select>
                    </div>
                </div>

                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">二次客户订单号</label>
                    <div class="col-8">
                        <input type="text" name="second_order_id" class="form-control" v-model="secondOrder.client_code" @blur="getSecondOrder($event)" id="order_id">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">二次运单商品详情</label>
                    <div class="col-8">
                        <div class="alert alert-success" v-if="secondOrder.packages">二次运单商品详情已填充</div>
                        <div class="alert alert-secondary" v-else>二次运单商品详情</div>
                        <table class="table" v-if="secondOrder.packages">
                            <tr><th>条码</th><th>商品名</th><th>数量</th></tr>
                            <template v-for="package in secondOrder.packages">
                                <tr v-for="commodity in package.commodities">
                                    <td>@{{ commodity.commodity.sku }}</td>
                                    <td>@{{ commodity.commodity.name }}</td>
                                    <td>@{{ commodity.amount }}</td>
                                </tr>
                            </template>
                        </table>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">情况说明</label>
                    <div class="col-8">
                        <textarea name="result_explain" class="form-control" v-model="orderIssues.result_explain"></textarea>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">最终状态</label>
                    <div class="col-8">
                        <select name="final_status" class="form-control" v-model="orderIssues.final_status" id="final_status">
                            <option></option>
                            <option v-for="value in final_status" :value="value">@{{ value }}</option>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">承运商赔偿金额</label>
                    <div class="col-8">
                        <input type="number" name="logistic_indemnity_money" class="form-control" id="logistic_indemnity_money"
                               v-model="orderIssues.logistic_indemnity_money">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">承运商快递减免</label>
                    <div class="col-8">
                        <select name="logistic_express_remission" class="form-control"
                                v-model="orderIssues.logistic_express_remission">
                            <option value></option>
                            <option v-for="remission in logisticExpressRemission" :value="remission">@{{ remission }}
                            </option>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">宝时赔偿金额</label>
                    <div class="col-8">
                        <input type="number" name="baoshi_indemnity_money" class="form-control" id="baoshi_indemnity_money"
                               v-model="orderIssues.baoshi_indemnity_money">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">宝时快递减免</label>
                    <div class="col-8">
                        <select name="baoshi_express_remission" class="form-control" id="baoshi_express_remission"
                                v-model="orderIssues.baoshi_express_remission">
                            <option value></option>
                            <option v-for="remission in baoShiExpressRemission" :value="remission">@{{ remission }}
                            </option>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right">事故责任方</label>
                    <div class="col-8">
                        <select name="user_workgroup_id" class="form-control" id="user_workgroup_id"
                                v-model="orderIssues.user_workgroup_id">
                            <option value></option>
                            <option v-for="workgroup in userWorkgroup" :value="workgroup.id">@{{ workgroup.name }}</option>
                        </select>
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-2 col-form-label text-right"></label>
                    <div class="col-8">
                        <button type="submit" class="btn btn-success form-control" @click="orderIssueUpdate">提交修改
                        </button>
                    </div>
                </div>
            </div>
            <div class="modal fade" id="alertModal" tabindex="-1" role="dialog"  aria-labelledby="alertModalLabel" aria-hidden="true">
                <div class="modal-dialog  modal-dialog-centered">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="exampleModalLabel">提示</h5>
                        </div>
                        <div class="modal-body">
                            <div class="alert alert-success">
                                订单问题件已修改
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-primary" data-dismiss="modal" @click="backOrderIssueIndex">返回查询页面</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('lastScript')
    <script type="text/javascript">
        let editVue = new Vue({
            el: '#editOrderIssue',
            data: {
                orderIssues: {!! $orderIssue!!},
                order: @if($order){!! $order !!}@else {id:null,owner_id:null}@endif,
                secondOrder: @if($secondOrder){!! $secondOrder !!}@else {client_code:''}@endif,
                rejectedBill: @if($rejectedBill){!! $rejectedBill !!}@else {logistic_number_return:''}@endif,
                create_RejectedBill:'',
                owners:{!! $owners  !!},
                logistics:{!! $logistics !!},
                userWorkgroup: {!! $userWorkgroup !!},
                shops:{!! $shops !!},
                orderIssueType:{!! $orderIssueType !!},
                rejectingStatus: ['无', '未退回', '全部退回', '部分退回', '差异退回', '超量退回'],
                final_status: ['已解决', '待退回', '退回中',],
                logisticExpressRemission: ['原单减免', '部分减免', '全部减免'],
                baoShiExpressRemission: ['原单减免', '部分减免', '全部减免'],
                logistic_number:@if($rejectedBill)'{!! $rejectedBill->logistic_number_return !!}'@else ''@endif
            },
            mounted: function () {
                $("#editOrderIssue").removeClass('d-none');
                console.log(this.rejectedBill);
            },
            watch:{
                secondOrder:{
                    handler:function(value){
                        if(value.code === ''){
                            this.secondOrder.packages = '';
                        }
                    },
                    deep:true,
                },
            },
            methods: {
                getRejectedBill(){
                    let logistic_number_return =  this.rejectedBill.logistic_number_return;
                    console.log(123,logistic_number_return);
                    let _this = this;
                    if( logistic_number_return === null || logistic_number_return == '' ){
                        this.rejectedBill = {logistic_number_return:logistic_number_return} ;
                        this.orderIssues.rejected_bill_id = null;
                        return ;
                    }
                    let data = {logisticNumberReturn:logistic_number_return};
                    axios.post("{{url('apiLocal/rejectedBill/getRejectedByLogisticNumberReturn')}}",data).then(function(res){
                        if(res.data.success){
                            if(res.data.rejectedBill){
                                _this.rejectedBill = res.data.rejectedBill;
                                _this.rejectedBill.id_logistic_return = res.data.rejectedBill.id_logistic_return;
                                _this.rejectedBill.id_owner = res.data.rejectedBill.id_owner;
                                _this.orderIssues.rejected_bill_id = res.data.rejectedBill.id;
                            }
                            if(res.data.msg){
                                tempTip.setDuration(2000);
                                tempTip.showSuccess(res.data.msg);
                                _this.orderIssues.rejected_bill_id = null;
                                _this.rejectedBill =  {logistic_number_return:logistic_number_return};
                            }else {
                                tempTip.setDuration(2000);
                                tempTip.showSuccess('找到对应的问题单');
                            }
                        }else{
                            tempTip.setDuration(4000);
                            tempTip.show(res.data.fain_info);
                        }
                    }).catch(function(err){
                        tempTip.setDuration(4000);
                        tempTip.show('网络异常:' + err);
                    });
                },
                orderIssueUpdate() {
                    let arr = {
                        '问题类别':'order_issue_type_id',
                        '处理状态':'handle_status',
                        '处理结果说明':'result_explain',
                        '承运商赔偿金额':'logistic_indemnity_money',
                        '承运商快递减免':'logistic_express_remission',
                        '宝时赔偿金额':'baoshi_indemnity_money',
                        '宝时快递减免':'baoshi_express_remission',
                        '宝时快递减免':'baoshi_express_remission',
                        '宝时快递减免':'baoshi_express_remission',
                        '退回单号':'logistic_number_return',
                        '退回单号货主':'id_owner',
                        '退回单号承运商':'id_logistic_return',
                    }
                    let data = {orderIssues:this.orderIssues,order:this.order,rejectedBill:this.rejectedBill};
                    if(data.rejectedBill.logistic_number_return == null || data.rejectedBill.logistic_number_return===''){
                        data.rejectedBill = null;
                    }
                    axios.post('{{url("apiLocal/order/issue/update")}}', data).then(function (res) {
                        if (res.data.success) {
                            $('#alertModal').modal('show');
                        } else {
                            tempTip.setDuration(3000);
                            tempTip.show(res.data.errors[0][0]);
                            res.data.errors.forEach(function(item){
                                let target = $('#'+arr[item[1]]);
                                target.addClass('is-invalid').change(function(){
                                    target.removeClass('is-invalid');
                                });
                            })
                            $('#alertModal').modal('hide');
                        }
                    }).catch(function (err) {
                        tempTip.setDuration(4000);
                        tempTip.show('网络异常:' + err);
                        $('#alertModal').modal('hide');
                    });
                },
                getSecondOrder(e){
                    let _this = this;
                    let client_code = $(e.target).val();
                    if(!client_code){
                        _this.secondOrder = '';
                        _this.orderIssues.second_order_id = null;
                        return ;
                    }
                    if(client_code){
                        let data = {clientNo:client_code};
                        axios.post("{{url('apiLocal/order/issue/getOrderInfoByClientNo')}}",data).then(function(res){
                            if(res.data.success){
                                _this.secondOrder = res.data.data;
                                _this.orderIssues.second_order_id = res.data.data.id;
                            } else {
                                tempTip.setDuration(4000);
                                tempTip.show('查询订单信息出现异常:' + res.data.fail_info);
                            }
                        }).catch(function(err){
                            tempTip.setDuration(4000);
                            tempTip.show('网络异常:' + err);
                        });
                    }
                },
                backOrderIssueIndex(){
                    window.location.href="javascript:history.go(-1)";
                },
            }
        });
        $('.is-invalid').change(function(){
            $(this).removeClass('is-invalid');
        })


    </script>

@endsection