@section('alpine')
<script src="{{asset('js/alpine.js')}}"></script>
@endsection
@section('styles')
    <style>
        .row {
            margin-top: -.6em;
        }
    </style>
@endsection
<div class="row" id="step1">
    <div class="col-md-4">
        <div class="form-group">
            {{ Form::label('perspective_id',__('Perspective')) }}
            {{ Form::select('perspective_id',$perspha,old('perspective_id') ? old('perspective_id') : null,[
                'class'       => 'form-control',
                'id'          => 'perspective_id',
                'placeholder' => __('Choose Perspective'),
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-8">
        <div class="form-group">
            {{ Form::label('objective_id',__('Objective')) }}
            {{ Form::select('objective_id',$objpers,old('objective_id') ? old('objective_id') : null,[
                'class'       => 'form-control',
                'id'          => 'objective_id',
                'placeholder' => __('Choose Objective'),
                'required'
            ]) }}
        </div>
    </div>
</div>
<div class="row" id="step2">
    <div class="col-md-4">
        <div class="form-group">
            {{ Form::label('kpi',__('Kpi')) }}
            {{ Form::text('kpi',old('kpi') ? old('kpi') : null,[
                'id'          => 'kpi',
                'class'       => 'form-control',
                'placeholder' => __('KPI Name'),
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-8">
        <div class="form-group">
            {{ Form::label('description',__('Description')) }}
            {{ Form::text('description',old('description') ? old('description') : null,[
                'class'       => 'form-control',
                'placeholder' => __('KPI Description'),
                'required'
            ]) }}
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-2">
        <div class="form-group" id="step5">
            {{ Form::label('frequency_id',__('Frequency')) }}
            {{ Form::select('frequency_id',$frequen,old('frequency_id') ? old('frequency_id') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Choose Freq.'),
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group" id="step6">
            {{ Form::label('measure_id',__('Dimension')) }}
            {{ Form::select('measure_id',$measure,old('measure_id') ? old('measure_id') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Choose Dimension'),
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-1 centrado">
        <div class="form-group" id="step7">
            {{ Form::label('reference',__('Ref')) }}
            {{ Form::text('reference',old('reference') ? old('reference') : null,[
                'class'    => 'form-control',
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-1 centrado">
        <div class="form-group" id="step8">
            {{ Form::label('deficient',__('Def'),['class' => 'my_red']) }}
            {{ Form::text('deficient',old('deficient') ? old('deficient') : null,[
                'class'    => 'form-control',
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-1 centrado">
        <div class="form-group" id="step9">
            {{ Form::label('acceptable',__('Acep'),['class' => 'my_yellow']) }}
            {{ Form::text('acceptable',old('acceptable') ? old('acceptable') : null,[
                'class'    => 'form-control',
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-1 centrado">
        <div class="form-group">
            <div class="form-group" id="step10">
                {{ Form::label('optimum',__('Opt'),['class' => 'my_green']) }}
                {{ Form::text('optimum',old('optimun') ? old('optimun') : null,[
                    'class'    => 'form-control',
                    'required'
                ]) }}
            </div>
        </div>
    </div>
    <div class="col-md-1 centrado">
        <div class="form-group" id="step11">
            {{ Form::label('result',__('Resul')) }}
            @if ($op == 'edit')
                {{ Form::text('result',!is_null($record->last_measurement) ? $record->last_measurement->result :null,[
                    'class'    => 'form-control',
                    'disabled' => 'disabled',
                    'style'    => 'background-color: '.$record->color_code
                ]) }}
            @else
                {{ Form::text('result',null,[
                    'class'    => 'form-control',
                    'disabled' => 'disabled'
                ]) }}
            @endif
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group" id="step12">
            {{ Form::label('result_date',__('Result Date')) }}
            @if ($op == 'edit')
                {{ Form::text('result_date',!is_null($record->last_measurement) ? $record->last_measurement->result_date : '',[
                    'id'       => 'result_date',
                    'class'    => 'form-control',
                    'disabled' => 'disabled'
                ]) }}
            @else
                {{ Form::text('result_date',null,[
                    'id'       => 'result_date',
                    'class'    => 'form-control',
                    'disabled' => 'disabled'
                ]) }}
            @endif
        </div>
    </div>
    <div class="col-md-1 centrado">
        <div class="form-group" id="step13">
            {{ Form::label('deviation',__('Dev')) }}
            @if ($op == 'edit')
                {{ Form::text('deviation',!is_null($record->last_measurement) ? $record->last_measurement->deviation : null,[
                    'class'    => 'form-control',
                    'disabled' => 'disabled'
                ]) }}
            @else
                {{ Form::text('deviation',null,[
                    'class'    => 'form-control',
                    'disabled' => 'disabled'
                ]) }}
            @endif
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-3">
        <div class="form-group" id="step14">
            {{ Form::label('responsable_id',__('Responsable')) }}
            {{ Form::select('responsable_id',$respons,old('responsable_id') ? old('responsable_id') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Choose Responsable'),
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-1" style="text-align:center">
        <div class="form-group" id="step15">
            {{ Form::label('is_sensible',__('Sensible')) }}<br>
            {{ Form::checkbox('is_sensible', 1, old('is_sensible'), [
                'disabled' => ($op == 'show' ? 'disabled' : null),
            ])}} 
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group" id="step16">
            {{ Form::label('init_date',__('First Measurement')) }}
            {{ Form::text('init_date',old('init_date') ? old('init_date') : null,
            [
                'id'             => 'init_date',
                'class'          => 'form-control',
                'required',
            ]) }}
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group" id="step17">
            {{ Form::label('due_date',__('Last Measurement')) }}
            {{ Form::text('due_date',old('due_date') ? old('due_date') : null,
            [
                'id'             => 'due_date',
                'class'          => 'form-control',
            ]) }}
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group" id="step18">
            {{ Form::label('indicator_type',__('Indicator Type')) }}
            {{ Form::select('indicator_type',\App\Models\Cmi::indicator_types(),old('indicator_type') ? old('indicator_type') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Choose One'),
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group" id="doc_hwgd">
            {{ Form::label('type',__('How we get the data').' ?') }}
            {{ Form::select('type',\App\Models\Cmi::types(),old('type') ? old('type') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Choose One'),
                'id'          => 'type',
                $allow_hwgd,
                'required',
            ]) }}
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-1">
        <div class="form-group" id="doc_ob">
            {{ Form::label('on_board',__('On Board').' ?') }}
            {{ Form::select('on_board',\App\Models\Cmi::on_boards(),old('on_board') ? old('on_board') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Choose'),
                'id'          => 'on_board',
                'required'
            ]) }}
        </div>
    </div>
    <div class="col-md-1">
        <div class="form-group" id="doc_pos">
            {{ Form::label('board_position',__('Board Pos').' ?') }}
            {{ Form::text('board_position',old('board_position') ? old('board_position') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Pos'),
                'id'          => 'board_position',
            ]) }}
        </div>
    </div>
    <div class="col-md-2">
        <div class="form-group" id="doc_obwd">
            {{ Form::label('on_board_wd',__('On Board When Dev').' ?') }}
            {{ Form::text('on_board_wd',old('on_board_wd') ? old('on_board_wd') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Deviation'),
            ]) }}
        </div>
    </div>
    <div class="col">
        <div class="form-group" id="doc_api">
            {{ Form::label('api_url',__('Api Url')) }}
            {{ Form::text('api_url',old('api_url') ? old('api_url') : null,[
                'class'       => 'form-control',
                'placeholder' => __('Api Url to consume to get data'),
                'id'          => 'api_url',
                'disabled',
                'required',
            ]) }}
        </div>
    </div>
</div>


@push('scripts')
<script>
    $(function () {
        $('#type').change(function(e) {
            var tipo = e.target.value;
            if (tipo == 'A') {
                $('#api_url').removeAttr('disabled');
            } else {
                $('#api_url').attr('disabled','disabled');
            }
        });
    });
</script>
@endpush