baoshi-was/resources/views/waybill/create.blade.php

@extends('layouts.app')
@section('title')录入-运输管理@endsection

@section('content')
    <div 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="{{url('waybill/create?type=ZX')}}" >专线</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link @if($type=='直发车') active @endif" href="{{url('waybill/create?type=ZF')}}">直发车</a>
                        </li> @endcan
                </ul>
            </div>
        </div>
    </div>
    <div class="container-fluid" id="list">
        <div class="card col-md-8 offset-md-2">
            <div class="card-body">
                <form method="POST" action="{{ url('waybill') }}">
                    @csrf
                    <label hidden><input name="type" value="{{$type}}"></label>
                    <div class="h5 text-center mb-3">
                        <ul class="nav nav-tabs">
                            <li class="nav-item offset-5"><a class="nav-link @if($type=='专线') active @endif" href="{{url('waybill/create?type=ZX')}}">专线</a></li>
                            <li class="nav-item"><a class="nav-link @if($type!='专线') active @endif" href="{{url('waybill/create?type=ZF')}}">直发车</a></li>
                        </ul>
                    </div>
                    <div class="form-group row">
                        <label for="wms_bill_number" class="col-2 col-form-label text-right text-muted">WMS单号</label>
                        <div class="col-8">
                            <input id="wms_bill_number" @change="bindOrder($event)" type="text" class="form-control @error('wms_bill_number') is-invalid @enderror"
                                   name="wms_bill_number" autocomplete="off" value="{{ old('wms_bill_number') }}"  >
                            @error('wms_bill_number')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="owner_id" class="col-2 col-form-label text-right text-primary">货主 *</label>
                        <div class="col-8 form-inline">
                            <select id="owner_id" :disabled="!!model.order_id" :name="model.order_id ? '' : 'owner_id'" class="form-control @error('owner_id') is-invalid @enderror" v-model="model.owner_id"  style="width: 30%" required>
                                <option v-for="owner in owners" :value="owner.id">@{{owner.name}}</option>
                            </select>
                            <label v-if="!model.order_id"><input class="form-control form-control-sm ml-2 rounded-pill" placeholder="输入关键字定位" @input="seekOwner($event)"></label>
                        </div>
                        <div class="col-sm-5">
                            <p class="form-control-static text-danger small font-weight-bold" style="margin-left: 50%">{{ $errors->first('owner_id') }}</p>
                        </div>
                    </div>
                    <label hidden><input :value="model.order_id" name="order_id"></label>
                    <div class="col-8" style="margin-left: 15%">
                        <button type="button" class="btn btn-outline-primary btn-sm" @click="origination='松江区泗砖仓'" style="transform: scale(0.9)">松江泗砖仓</button>
                        <button type="button" class="btn btn-outline-primary btn-sm" @click="origination='松江区九干仓'" style="transform: scale(0.9)">松江九干仓</button>
                        <button type="button" class="btn btn-outline-primary btn-sm" @click="origination='嘉定区武乡仓'" style="transform: scale(0.9)">嘉定武乡仓</button>
                    </div>
                    <div class="form-group row">
                        <label for="origination" class="col-2 col-form-label text-right text-primary">始发地址 *</label>
                        <div class="col-8">
                            <input id="origination" type="text" class="form-control @error('origination') is-invalid @enderror"
                                   name="origination" autocomplete="off" value="{{ old('origination') }}"  v-model="origination" required>
                            @error('origination')
                            <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="destination" class="col-2 col-form-label text-right text-primary">目的地址 *</label>
                        <div class="col-8">
                            <input id="destination" type="text" class="form-control @error('destination') is-invalid @enderror" autocomplete="off"
                                   :readonly="!!model.order_id" required
                                   :name="model.order_id ? '' : 'destination'" :value="model.order_id ? order.address : '{{ old('destination') }}'" >
                            @error('destination')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="recipient" class="col-2 col-form-label text-right text-primary">收件人 *</label>
                        <div class="col-8">
                            <input id="recipient" type="text" class="form-control @error('recipient') is-invalid @enderror"
                                   :readonly="!!model.order_id" autocomplete="off"  required
                                   :name="model.order_id ? '' : 'recipient'" :value="model.order_id ? order.consignee_name : '{{ old('recipient') }}'">
                            @error('recipient')
                            <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="recipient_mobile" class="col-2 col-form-label text-right text-primary">收件人电话 *</label>
                        <div class="col-8">
                            <input id="recipient_mobile" type="text" class="form-control @error('recipient_mobile') is-invalid @enderror"
                                   :readonly="!!model.order_id" autocomplete="off"  required
                                   :name="model.order_id ? '' : 'recipient_mobile'" :value="model.order_id ? order.consignee_phone : '{{ old('recipient_mobile') }}'">
                            @error('recipient_mobile')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    {{--zengjun start--}}
{{--                    @can('运输管理-运费')--}}
                        <div class="form-group row">
                            <label for="charge" class="col-2 col-form-label text-right ">运输收费(元)</label>
                            <div class="col-8">
                                <input id="charge" type="number" step="0.001" class="form-control @error('charge') is-invalid @enderror"
                                       name="charge" autocomplete="off" value="{{ old('charge') }}">
                                @error('charge')
                                <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>


                    <div class="form-group row">
                        <label for="other_charge" class="col-2 col-form-label text-right text-muted">其他收费(元)</label>
                        <div class="col-8">
                            <input id="other_charge" type="number" step="0.001" class="form-control @error('other_charge') is-invalid @enderror"
                                   name="other_charge" autocomplete="off" value="@if(old('other_charge')){{ old('other_charge') }}@endif"  >
                            @error('other_charge')
                            <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="other_charge_remark" class="col-2 col-form-label text-right text-muted">其他收费备注</label>
                        <div class="col-8">
                            <input id="other_charge_remark" type="text" class="form-control @error('other_charge') is-invalid @enderror"
                                   name="other_charge_remark" autocomplete="off" value="@if(old('other_charge_remark')){{ old('other_charge_remark') }}@endif"  >
                            @error('other_charge_remark')
                            <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>·
                            @enderror
                        </div>
                    </div>
{{--                    @endcan--}}
                    {{--zengjun end--}}
                    <div class="form-group row">
                        <label for="collect_fee" class="col-2 col-form-label text-right text-muted">到付金额(元)</label>
                        <div class="col-8">
                            <input id="collect_fee" type="number" step="0.001" class="form-control @error('collect_fee') is-invalid @enderror"
                                   name="collect_fee" autocomplete="off" value="{{ old('collect_fee') }}"  >
                            @error('collect_fee')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="ordering_remark" class="col-2 col-form-label text-right text-muted">下单备注</label>
                        <div class="col-8">
                            <textarea id="ordering_remark" class="form-control @error('ordering_remark') is-invalid @enderror"
                                      name="ordering_remark" autocomplete="off"  >{{ old('ordering_remark') }}</textarea>
                            @error('ordering_remark')
                            <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-8 offset-2">
                            <input type="submit" class="btn btn-success form-control">
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection

@section('lastScript')
    <script>
        let vueList=new Vue({
            el:'#list',
            data:{
                owners:[
                    @foreach($owners as $owner)
                    {id:'{{$owner->id}}',name:'{{$owner->name}}'},
                    @endforeach
                ],
                origination:'{{old('origination')}}',
                model:{
                    order_id : "{{old("order_id")}}",
                    owner_id:'{{old('owner_id')}}',
                },
                order:{},
            },
            mounted(){
                if (this.model.order_id)this._codeGetOrder("{{ old('wms_bill_number') }}");
            },
            methods:{
                seekOwner(e) {
                    if (this.model.order_id)return;
                    let val=e.target.value;
                    if(!val)this.model.owner_id='';
                    else{
                        this.owners.every(owner=> {
                            if (owner.name.includes(val)){
                                this.model.owner_id=owner.id;
                                return false;
                            }
                            return true;
                        });
                    }
                },
                bindOrder(e){
                    this.model.order_id = "";
                    this.model.owner_id = "";
                    let val = e.target.value;
                    this._codeGetOrder(val);
                },
                _codeGetOrder(val){
                    let url = "{{url('waybill/seekOrder')}}";
                    window.tempTip.postBasicRequest(url,{code:val},res=>{
                        this.order = res;
                        this.model.order_id = res.id;
                        this.model.owner_id = res.owner_id;
                    });
                },
            },
        });
    </script>
@endsection