@extends('layouts.app')
@section('title')录入-直发车-计费模型@endsection

@section('content')
    <div id="nav2">
        @component('maintenance.menu')@endcomponent
        @component('maintenance.priceModel.directLogistic.menu')
            @if(isset($model))
                <li class="nav-item">
                    <a class="nav-link" href="{{URL::current()}}" :class="{active:isActive('edit',5)}">编辑</a>
                </li>
            @endif
        @endcomponent
    </div>
    <div class="container-fluid mt-2 card" id="container">
        <form method="POST" action="{{url('maintenance/priceModel/directLogistic')}}@if(isset($model))/{{$model->id}}/edit @endif" class="card-body offset-3">
            @csrf
            <div class="row">
                <label for="name" class="col-2"><b class="text-danger">* </b>价格名称</label>
                <input id="name" v-model="model.name" type="text" name="name" required class="col-6 form-control"
                       :class="errors.name ? 'is-invalid' : ''">
                <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.name">
                    <strong>@{{ errors.name[0] }}</strong>
                </span>
            </div>
            <div class="row mt-3">
                <label for="base_km" class="col-2"><b class="text-danger">* </b>起步公里数</label>
                <input id="base_km" v-model="model.base_km" type="number" min="0" step="0.01" name="base_km" class="col-3 form-control" required
                       :class="errors.base_km ? 'is-invalid' : ''">
                <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.base_km">
                    <strong>@{{ errors.base_km[0] }}</strong>
                </span>
            </div>
            <div class="row mt-3">
                <label class="col-2" for="owner_id">项目</label>
                <select id="owner_id" class="selectpicker" multiple data-live-search="true" title="项目(多选)"
                        v-model="model.owner_id" :class="errors.owner_id ? 'is-invalid' : ''">
                    <option v-for="owner in owners" :value="owner.id">@{{ owner.name }}</option>
                </select>
                <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.owner_id">
                    <strong>@{{ errors.owner_id[0] }}</strong>
                </span>
                <label hidden><input name="owner_id" type="text" :value="model.owner_id"></label>
            </div>
            <div class="row mt-3 offset-1">
                <button type="submit" class="btn btn-success col-7">提交</button>
            </div>
        </form>
    </div>
@stop

@section("lastScript")
    <script>
        new Vue({
            el:"#container",
            data:{
                model:{
                    id: "{{isset($model) ? $model->id : ''}}",
                    owner_id:{!! old('owner_id') ? json_encode(old('owner_id')) : (isset($model) ? json_encode($model->owner_id) : '[]') !!},
                    name:"{{old('name') ?? (isset($model) ? $model->name : '')}}",
                    base_km:"{{old('base_km') ?? (isset($model) ? $model->base_km : '')}}",
                },
                owners:[
                    @foreach($owners as $owner)
                    {id:"{{$owner->id}}",name:"{{$owner->name}}"},
                    @endforeach
                ],
                errors:{!! $errors !!},
            },
        });
    </script>
@stop