@extends('layouts.bubofamily')

@section('content_header')
<h1>Lista dei Conti</h1>
@endsection

@section('content')
<!-- <div class="row">
    <div class="col-lg-12">
        <h1 class="page-header"></h1>
    </div>
</div>-->
<div class="row">
	<div class="col-lg-12">
    	<div class="panel panel-default">
            <div class="panel-heading">
                Lista conti
            </div>
			@if ($errors->any())
				<div class="alert alert-danger">
					<ul>
						@foreach ($errors->all() as $error)
							<li>{{ $error }}</li>
						@endforeach
					</ul>
				</div>
			@endif
            <div class="panel-body">
            	<div class="row">
            		<button class="btn btn-warning btn-detail open_modal_conto">Nuovo Conto</button>&nbsp;

            	</div>
            	<div class="row">
            <div class="table-responsive">
                   <table class="table table-striped table-bordered table-hover" id="listaconti" data-page-length='25'>
            		<thead>
            			<tr>
            				<th>Nome</th>
            				<th>Banca</th>
            				<th>IBAN</th>
            				<th>Saldo iniziale</th>
            				<th>Azioni</th>
            			</tr>
            		</thead>
            		<tbody>
            		@foreach( $conti as $conto )
            		<tr>

            			<td>{{ $conto->nomeConto}}</td>
                        <td>{{ $conto->Banca }}</td>
            			<td>{{ $conto->IBAN }}</td>
            			<td>&euro; {{ $conto->saldo_iniziale }}</td>
            			<td>
            				<button class="btn btn-warning btn-detail open_modal_modifica" value="{{ $conto->id }}"><i class="fa-solid fa-pencil"></i></button>&nbsp;
            				<a class="btn btn-danger" href="/admin/conti/{{ $conto->id }}/?_method=DELETE"><i class="fa-solid fa-trash-can"></i></a>&nbsp;
            			</td>
            		</tr>
            		@endforeach
            		</tbody>
            		</table>
            	</div>
            	</div>
			</div>
		</div>
	</div>
</div>


		</div>
	</div>
</div>
<!-- MODAL NEW -->
<div class="modal fade " id="myModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog draggable" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">Nuovo conto</h4>

			</div>
			<div class="modal-body">
				<div class="row">
					<div class="col-md-12">
						<form action="" method="POST" id="form">
							@csrf
							<div class="row">
                                <!-- Nome del Conto (Label) -->
								<div class="col-xs-6">
									<label for="nomeConto" class="form-label">nomeConto</label> <input
										type="text" class="form-control" id="nomeConto" name="nomeConto">
								</div>
                                <!-- Banca (Nome istituto di credito) -->
								<div class="col-xs-6">
									<label for="Banca" class="form-label">Banca</label> <input type=text
										name="Banca" class="form-control "
										id="Banca">

								</div>
							</div>
							<div class="row">
                                <!-- IBAN del Conto  -->
								<div class="col-xs-12">
									<label for="IBAN" class="form-label">Descrizione</label>
									<input type="text" class="form-control" id="IBAN"
										size="50" name="IBAN">
								</div>
							</div>
							<div class="row">
                                <!-- Saldo iniziale -->
								<div class="col-xs-5">
									<label for="saldo_iniziale" class="form-label">Saldo iniziale

                                    </label>
									<div class="input-group">
										<span class="input-group-addon"> <i class="fa fa-eur"></i></span>
                                        <input type="number" step="0.01" min="-999999"
											max="999999" class="form-control" id="saldo_iniziale" size="50"
											name="saldo_iniziale" aria-describedby="saldo_iniziale">
									</div>
								</div>
                                <!-- Note -->
                                <div class="col-xs-7">
									<label for="note" class="form-label">Note</label>
                                    <input type="text" class="form-control" id="note"
                                        size="50" name="note">
								</div>
							</div>
							<div class="row">
								<div class="col-xs-12">&nbsp;</div>
							</div>
							<div class="row">
								<div class="col-xs-12"></div>
							</div>

					</div>
				</div>
			</div>
			<div class="modal-footer">

				<button type="submit" class="btn btn-primary">Submit</button>
				</form>
			</div>
		</div>
	</div>
</div>

@endsection

@section('js')
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.min.js"></script>
<script src="/js/app/conti.js"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
@endsection