@extends('layouts.master')
@section('content')
    @include('partials.containers-header')
    <div class="row">
        <div class="col-md-12">
            @include('partials.errors_display')
            <div class="card">
                <div class="card-header {{config('adminlte.bg-card-header', 'bg-info-gradient')}}" style="min-height: 3.5em">
                    <h4 class="card-title">@lang('Edit '.$name)</h4>
                </div>
                <div class="card-body">
                    @include('config.phase.tabs')
                    <div class="tab-content" id="myTabContent">
                        <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
                            <form role="form" action="{{route($model.'.update',$record->id)}}" method="post">
                                @csrf
                                @method('PUT')
                                <div class="form-group row" style="margin-top: .5em">
                                    <div class="col-md-4"></div>
                                    <div class="col-md-8">
                                        @include('partials.edit-buttons',[
                                            'model' => $model,
                                            'btns'  => 'mics'
                                        ])
                                        @if ($record->deleteable)
                                        <a href="{{url('phase/delete-data/'.$record->id)}}" class="btn btn-sm btn-danger">
                                            <i class="fa fa-trash"></i> @lang('Data Reset')
                                        </a>
                                        @endif                                
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <div class="col-md-7">
                                        @include('config.phase.fields',[
                                            'option'  => 'update',
                                            'record'  => $record,
                                        ])
                                    </div>
                                    <div class="col-md-5">
                                        <div class="form-group">
                                            <div class="col-sm-3" style="text-align: right">
                                                {{ Form::label('actual_data','Actual Data') }}
                                            </div>
                                            <div class="col-sm-9">
                                                <input type="text" 
                                                    class="form-control" 
                                                    name="actual_data" 
                                                    id="actual_data" 
                                                    value="{{$strTextResu}}" disabled>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="col-sm-3" style="text-align: right">
                                                {{ Form::label('another_id','Copy From') }}
                                            </div>
                                            <div class="col-sm-7">
                                                <select name="another_id" id="another_id" class="form-control">
                                                    <option value="null">Phase to copy data from</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="col-sm-3" style="text-align: right">
                                                {{ Form::label('data_copy','What Copy ?') }}
                                            </div>
                                            <div class="col-sm-7">
                                                <select name="data_copy" id="data_copy" class="form-control" disabled>
                                                    <option value="null">What do you want to Copy?</option>
                                                    <option value="o">Only Objectives (Map)</option>
                                                    <option value="k">Objectives and KPIs (BSC)</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
                            <form role="form" action="{{url('behavior/'.$record->id)}}" method="post">
                                @csrf
                                @method('PUT')
                                <div class="form-group row" style="margin-top: .5em">
                                    <div class="col-md-4"></div>
                                    <div class="col-md-6">
                                        @include('partials.edit-buttons',[
                                            'model' => $model,
                                            'btns'  => 'mics'
                                        ])
                                    </div>
                                </div>
                                <div class="row justify-content-center">
                                    <div class="col-md-7">
                                        @include('config.phase.behavior',[
                                            'option'  => 'update',
                                            'record'  => $record,
                                        ])
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @include('partials.changes')
    @include('partials.containers-footer')
@endsection

@section('javascript')
<script type="text/javascript">
    function startIntro(){
        var intro = introJs();
        intro.setOptions({
            nextLabel: "{{__('Next')}}",
            prevLabel: "{{__('Prev')}}",
            skipLabel: "{{__('Skip')}}",
            doneLabel: "{{__('Done')}}",
            steps: [
                { intro: "{{__('This form allows to Update a Phase')}}!!" },
                { element: '#name', intro: "{{__('Name of the Phase')}}", },
                { element: '#country_id', intro: "{{__('Country in which one you will work during the Phase')}}", },
                { element: '#start_date', intro: "{{__('Start date of the Phase')}}", },
                { element: '#end_date', intro: "{{__('End date of the Phase')}}", },
                { element: '#active', intro: "{{__('It indicates weather the Phase is active or not')}}", },
                { element: '#actual_data', intro: "{{__('Data associated to the Phase.  When the Phase is empty, you can copy data from another one')}}", },
                { element: '#another_id', intro: "{{__('Here you can choose the Phase which data copy from.  This is available only if the actual Phase is empty')}}", },
                { element: '#data_copy', intro: "{{__('Here you must specify which data will be copy from the other Phase')}}", },
                { element: '#optipesi', intro: "{{__('By default the Phase is pessimitic.  Here you can change that behavior')}}", },
                { element: '#behaobje', intro: "{{__('Here you can tweak the behavior of the Objectives')}}", },
                { element: '#behapers', intro: "{{__('Here you can tweak the behavior of the Perspectives')}}", },
            ]
        });

        intro.start();
    };

    $(function () {
        $.getJSON('/api/v1/anp/'+{{$record->id}},function (data) {
            var i = 0;
            $.each(data, function () {
                i++;
            });
            $('#another_id').empty();
            var option = $("<option></option>")
                .attr("value", "0")
                .text("Phase to copy data from ("+i+")");
            $('#another_id').append(option);
            $.each(data, function(key, value) {
                var option = $("<option></option>")
                    .attr("value", value.id)
                    .text(value.name);
                $('#another_id').append(option);
            });
        });
        $("#another_id").on('change',function(e) {
            var id = e.target.value;
            if (id > 0) {
                $('#data_copy').attr('disabled',false);
                $('#data_copy').attr('required',true);
            } else {
                $('#data_copy').attr('disabled',true);
                $('#data_copy').attr('required',false);
            }
        });
        $('#optimistic').click(function(e) {
            $('#objective_o').attr('disabled',null);
            $('#objective_a').attr('disabled',null);
            $('#objective_d').attr('disabled',null);
            $('#perspective_o').attr('disabled',null);
            $('#perspective_a').attr('disabled',null);
            $('#perspective_d').attr('disabled',null);
        });
        $('#pessimistic').click(function(e) {
            $('#objective_o').attr('disabled','disabled');
            $('#objective_a').attr('disabled','disabled');
            $('#objective_d').attr('disabled','disabled');
            $('#perspective_o').attr('disabled','disabled');
            $('#perspective_a').attr('disabled','disabled');
            $('#perspective_d').attr('disabled','disabled');
        });
    });
</script>
@endsection