@extends('layouts.app', [ "withHeader" => false, "bodyClass" => "overflow-hidden", "mainClass" => "gis spa-application"
,"sidebarOpened" => true ])
@section('content')

    <div id="map" class="dark-stroke" data-lat="{{ $farm->lat }}" data-lng="{{ $farm->lng }}"></div>
    <div class="spa-points-analysed-legend hide">
        <div class='item'>
            Com informações: <div class='circle analysed'></div>
        </div>
        <div class='item'>
            Sem informações: <div class='circle non-analysed'></div>
        </div>
    </div>

    <div data-json="points">{!! json_encode($points) !!}</div>

    <div class="map-controls">

        <form data-url="{{ url('spa_application/file') }}">
            <button type="button" class="btn btn-primary btn-open-file" title="{{ __('messages.open_report_with_sample_data') }}"><i
                    class="fa fa-folder-open"></i></button>
            <input type="file" name="file" class="hide" accept=".csv, .xls, .xlsx" max-size="2000" />
            <input name="crop_id" type="hidden" value="{{ $crop->id }}" />
        </form>
    </div>
@endsection

@section('sidebar-content')
    <div class="sidebar-header">

        <h3>{{ $labels->title }}</h3>
        <small>{{ __('messages.manage_info_from') }} {{ $labels->title }}</small>
    </div>

    <form id="application-form" method="post" action="{{ url('spa_application') }}" class="data-form"
        data-parsley-validate>

        <div class="sidebar-body">

            @include('partials._alert')

            <input type="hidden" name="farm_id" value="{{ $farm->id }}" />
            <input type="hidden" name="crop_id" value="{{ $crop->id }}" />
            <input type="hidden" name="scene_id" value="{{ $scene->id }}" />

            <div data-json="gradients">{!! json_encode($gradients) !!}</div>
            <div data-json="classification_types">{!! json_encode($classifications) !!}</div>

            <div class="row element-selector">
                <div class="form-group col-sm-12 col-xs-12">
                    <label>{{ __('messages.element') }}</label>
                    <select name="elements" class="form-control" disabled></select>
                </div>
            </div>

            <div class="inconsistent-element hide">{{ __('errors.inconsistent_element_data') }}</div>

            <div class="element-form">
                <div class="row">
                    <div class="form-group col-sm-8 col-xs-12">
                        <label>{{ __('messages.name') }} <span class="required">*</span></label>
                        <input type="text" class="form-control change-elm" name="name" required="required" disabled />
                    </div>

                    <div class="form-group col-sm-4 col-xs-12">
                        <label>{{ __('messages.unit') }}</label>
                        <input type="text" class="form-control change-elm" name="metric" disabled />
                    </div>

                    <div class="form-group col-sm-8 col-xs-12">
                        <label>{{ __('messages.collect_profile') }}</label> 
                        <input type="hidden" name="collection_profile_id" class="form-control change-elm"
                            required="required" />
                        <input type="text" name="collection_profile_name" class="form-control change-elm"
                            required="required" disabled="disabled" />
                    </div>

                    <div class="form-group col-sm-4 col-xs-12">
                        <label>{{ __('messages.precision') }}</label>
                        <input type="number" class="form-control change-elm" name="decimal_places"
                            data-parsley-type="number" min="0" max="4" disabled required />
                    </div>

                    <div class="form-group col-sm-12 col-xs-12 hide">
                        <label>Arredondar Valores</label>
                        <select name="rounding_application" class="form-control change-elm">
                            <option value="">{{ __('messages.select') }}</option>
                            <option value="5">5</option>
                            <option value="10">10</option>
                            <option value="20">20</option>
                            <option value="50">50</option>
                            <option value="100">100</option>
                            <option value="250">250</option>
                            <option value="500">500</option>
                            <option value="1000">1000</option>
                            <option value="2500">2500</option>
                            <option value="5000">5000</option>
                        </select>
                    </div>

                    <div class="form-group col-sm-12 col-xs-12">
                        <label>{{ __('messages.info') }}</label>
                        <input type="text" class="form-control change-elm" name="info" maxlength="50" disabled />
                    </div>
                </div>

                <div class="row mb10">
					<div class="col-sm-12 col-xs-12 pr5">
                        <button type="button" class="btn btn-light btn-save-info btn-block">Salvar Informações </button>
					</div>
					{{-- <div class="col-sm-6 col-xs-12 pl5">
						<button type="button" class="btn btn-block btn-danger btn-rmv-elm" disabled>{{ __('messages.remove') }} </button>
					</div> --}}
				</div>
            </div>
        </div>

        @if(isset($process) && isset($process->observation))
        <div class='spa-process-information'>
            <h4>Informações do processamento:</h4>
            <p>
                {{ $process->observation }}
            </p>

            <div class='marker {{ $process->status_id == \App\Enums\SpaProcessStatusEnum::COMPLETE ? 'success' : ''}} {{ $process->status_id == \App\Enums\SpaProcessStatusEnum::ERROR ? 'danger' : '' }}'>
                <i class="fa fa-exclamation" aria-hidden="true"></i>
            </div>
        </div>
        @endif

        <div class="sidebar-footer">

            <div>
                <button type="button" class="btn btn-light btn-open-classification btn-block" disabled>{{ __('messages.classification') }} </button>
            </div>
            <div class="mt5">
                {{-- <button type="button" class="btn btn-light btn-block btn-show-table disabled mb5" disabled="disabled">{{ __('messages.values_table') }}</button> --}}
                {{-- <button type="button" class="btn btn-secondary btn-block btn-classify-all disabled mb5" disabled="disabled">{{ __('messages.classify').' '.__('messages.all') }}</button> --}}
                <button type="button" class="btn btn-block btn-danger btn-rmv-all-elm" disabled="disabled">{{ __('messages.remove').' '.__('messages.all') }}</button>
            </div>

            <div class="row mt5">
                <div class="col-sm-6 col-xs-12 pr5">
                    <a href="{{ $backUrl }}" class="btn btn-light btn-block btn-prev">{{ __('messages.previous') }}</a>
                </div>
                <div class="col-sm-6 col-xs-12 pl5">
                    <button type="submit" class="btn btn-primary btn-block btn-submit disabled"
                        disabled="disabled">{{ __('messages.save') }}</button>
                </div>
            </div>
        </div>
    </form>

    <div class="modals hide">

        @include('partials._spa-process-progress')

    </div>
    </div>
@endsection