@extends('Admin.Views.edit')

@include('shoppingcard::sidebar')

@section('editform')
    @php if(! isset($data)) { $old = old(); if(! empty($old)) { $data = $old; } else { $data = []; } } @endphp

    @if (isset($data['id']))
        <x-fieldhidden name='id' :data='$data' />
    @endif

    <x-fieldselectajax
        label='Vecino'
        name='person_id'
        :data='$data'
        template='templateSelectPersons'
        :items='$model_info->persons'
        itemsurl='{{ route("people.persons.find") }}'
        itemtext='name'
        itemindex='id'
    />
    <x-fieldnumber
        label='Legajo'
        name='file'
        min="1"
        step="1"
        :data='$data'
        placeholder='Legajo'
    />
    <x-fieldselect
        label='Tipo de beneficiario'
        name='beneficiary_type_id'
        :data='$data'
        :items='$model_info->beneficiaryTypes'
        itemtext='name'
        itemindex='id'
    />
    <x-fieldnumber
        label='Monto'
        name='amount'
        min="1"
        step="0.01"
        max="99999999"
        :data='$data'
        placeholder='Monto'
    />

    <x-takepicture
        name="imagen"
        button="Tomar fotografía"
        fileInputId="1"
        title="Tomar fotografía"
    />

    <div class="d-none" id="cropOptions_1">
        {
            "dragMode": "move",
            "aspectRatio": "16/9",
            "autoCropArea": 0.65,
            "restore": false,
            "guides": false,
            "center": false,
            "highlight": false,
            "cropBoxMovable": false,
            "cropBoxResizable": false,
            "toggleDragModeOnDblclick": false
        }
    </div>
    <div class="row">
        <div class="col-12 col-md-4">
            <div class="form-group row">
                <div class="col-12">
                    <div class="card">
                        <input type="file" id="1" class="fieldimage">
                        <textarea style="display:none;" id="real_1" name="photo">{{ $data['photo'] ?? '' }}</textarea>
                        <div id="card_1" class="card-img-upload mx-1 mt-1 fieldimage_button">
                            @if (! isset($data['photo']))
                                <p id="msg_1">Click para subir imagen</p>
                                <img id="show_1" class="card-img" style="display: none;" src="{{ $data['photo'] ?? '' }}" alt="">
                            @else
                                <p id="msg_1" style="display: none;">Click para subir imagen</p>
                                <img id="show_1" class="card-img" src="{{ $data['photo'] ?? '' }}" alt="">
                            @endif
                        </div>
                        <div class="card-body">
                            <div class="d-flex align-items-start flex-nowrap">
                                <div>
                                    <h6 class="font-weight-semibold mr-2">
                                        Foto
                                        @if (isset($data['photo']))
                                            <span class="text-right"><i data-id="1" class="mi-delete fieldimage_delete"></i></span>
                                        @endif
                                    </h6>
                                    <span id="info_1">{{ $data['photo'] ?? '' }}</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal fade cropImagePop" id="modal_1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="myModalLabel">
                        </div>
                        <div class="modal-body">
                            <div id="upload-demo" class="center-block">
                                <img class="cropImageModal" id="cropImageModal_1" src="">
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" data-id="1" class="btn btn-default cropCloseBtn" data-dismiss="modal">Cerrar</button>
                            <button type="button" id="cropImage" class="btn btn-primary cropImageBtn">Recortar</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection