@extends('layouts.app')
@php $isNew = ! $template->exists; @endphp
@section('title', __('vrc::lang.inspection_template'))
@section('content')
<section class="content-header"><h1>@lang('vrc::lang.inspection_template')</h1></section>
<section class="content">
    @component('components.widget', ['class' => 'box-primary'])
        {!! Form::open(['route' => $isNew ? 'vrc.inspection-templates.store' : ['vrc.inspection-templates.update', $template->id], 'method' => $isNew ? 'POST' : 'PUT']) !!}
        <div class="row">
            <div class="col-md-4"><div class="form-group">{!! Form::label('name', __('vrc::lang.name') . ' (EN):*') !!}{!! Form::text('name', $template->name, ['class' => 'form-control', 'required']) !!}</div></div>
            <div class="col-md-4"><div class="form-group">{!! Form::label('name_ar', __('vrc::lang.name') . ' (AR):') !!}{!! Form::text('name_ar', $template->name_ar, ['class' => 'form-control', 'dir' => 'rtl']) !!}</div></div>
            <div class="col-md-4"><div class="form-group">{!! Form::label('vehicle_type', __('vrc::lang.vehicle_type') . ':') !!}{!! Form::text('vehicle_type', $template->vehicle_type, ['class' => 'form-control']) !!}</div></div>
        </div>

        <label>@lang('vrc::lang.checklist_items'):</label>
        <table class="table table-condensed" id="vrc_tpl_items">
            <thead><tr><th>@lang('vrc::lang.section')</th><th>@lang('vrc::lang.label') (EN)</th><th>@lang('vrc::lang.label') (AR)</th><th style="width:140px;">@lang('vrc::lang.input_type')</th><th style="width:40px;"></th></tr></thead>
            <tbody>
                @foreach ($template->items as $it)
                    <tr>
                        <td><input type="text" name="item_section[]" class="form-control input-sm" value="{{ $it->section }}"></td>
                        <td><input type="text" name="item_label[]" class="form-control input-sm" value="{{ $it->label }}"></td>
                        <td><input type="text" name="item_label_ar[]" class="form-control input-sm" dir="rtl" value="{{ $it->label_ar }}"></td>
                        <td><select name="item_input_type[]" class="form-control input-sm">@foreach (['status','number','text','photo'] as $t)<option value="{{ $t }}" {{ $it->input_type==$t?'selected':'' }}>{{ $t }}</option>@endforeach</select></td>
                        <td><button type="button" class="btn btn-xs btn-danger vrc-tpl-rm"><i class="fa fa-times"></i></button></td>
                    </tr>
                @endforeach
            </tbody>
        </table>
        <button type="button" class="btn btn-xs btn-default" id="vrc_tpl_add"><i class="fa fa-plus"></i> @lang('vrc::lang.add_item')</button>
        <template id="vrc_tpl_row">
            <tr>
                <td><input type="text" name="item_section[]" class="form-control input-sm"></td>
                <td><input type="text" name="item_label[]" class="form-control input-sm"></td>
                <td><input type="text" name="item_label_ar[]" class="form-control input-sm" dir="rtl"></td>
                <td><select name="item_input_type[]" class="form-control input-sm"><option value="status">status</option><option value="number">number</option><option value="text">text</option><option value="photo">photo</option></select></td>
                <td><button type="button" class="btn btn-xs btn-danger vrc-tpl-rm"><i class="fa fa-times"></i></button></td>
            </tr>
        </template>

        <div class="checkbox"><label>{!! Form::checkbox('is_active', 1, (bool) $template->is_active) !!} @lang('vrc::lang.active')</label></div>
        <hr>
        <button type="submit" class="btn btn-primary">@lang('messages.save')</button>
        <a href="{{ route('vrc.inspection-templates.index') }}" class="btn btn-default">@lang('messages.cancel')</a>
        {!! Form::close() !!}
    @endcomponent
</section>
@endsection
@section('javascript')
<script>
$(function () {
    $('#vrc_tpl_add').on('click', function () { $('#vrc_tpl_items tbody').append(document.getElementById('vrc_tpl_row').innerHTML); });
    $(document).on('click', '.vrc-tpl-rm', function () { $(this).closest('tr').remove(); });
});
</script>
@endsection
