iao_team/resources/views/livewire/records_in.blade.php

<div class="col">
    <div class="row h-100">

    <div class="col-auto filterWrapper" id="filter--section" wire:ignore>
        <aside>

            <header>
                <h2>Filtra Ricerca</h2>
            </header>

            <form action="" id="filter--form" class="dark-form row">
                <div class="filter--item">
                    <span class="filter--item_title">Tipologia</span>

                    <div class="filter--item_formElement">
                        <div class="form-check form-check-inline d-inline-flex align-items-center">
                            <input class="form-check-input" type="radio" value="0" name="filterCommercial" checked>
                            <label class="form-check-label ms-2" for="inlineCheckbox1">Entrambe</label>
                        </div>
                        <div class="form-check form-check-inline d-inline-flex align-items-center">
                            <input class="form-check-input" type="radio" value="1" name="filterCommercial" >
                            <label class="form-check-label ms-2" for="inlineCheckbox1">Commerciale</label>
                        </div>
                        <div class="form-check form-check-inline d-inline-flex align-items-center">
                            <input class="form-check-input" type="radio" value="2" name="filterCommercial">
                            <label class="form-check-label ms-2" for="inlineCheckbox1">Non commerciale</label>
                        </div>
                    </div>
                </div>
                <!-- filter item -->

                <div class="filter--item">
                    <span class="filter--item_title">Persona</span>

                    <div class="filter--item_formElement">
                        <select name="search_member_id" class="form-select filterMember">
                            <option value="">--Seleziona--
                            @foreach($members as $member)
                                <option value="{{$member->id}}">{{$member->last_name}} {{$member->first_name}}
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="filter--item">
                    <span class="filter--item_title">Pagamento</span>

                    <div class="filter--item_formElement">
                        <select name="search_payment_method_id" class="form-select filterPaymentMethod">
                            <option value="">--Seleziona--
                            @foreach($payments as $payment)
                                <option value="{{$payment->id}}">{{$payment->name}}
                            @endforeach
                        </select>
                    </div>
                </div>
                <!-- filter item -->

                <div class="filter--item">
                    <span class="filter--item_title">Causali</span>

                    <div class="filter--item_formElement">
                        <select name="search_causal_id" class="form-select filterCausals">
                            <option value="">--Seleziona--
                            @foreach($causals as $causal)
                                <option value="{{$causal["id"]}}">{!!$causal["name"]!!}
                            @endforeach
                        </select>

                    </div>
                </div>
                <!-- filter item -->

                <div class="filter--item">
                    <span class="filter--item_title">Periodo </span>
                    <div class="filter--item_formElement">
                        <input id="dateFrom" type="date" class="form-control filterFrom" style="background-color:white" >
                    </div>
                    <div class="filter--item_formElement">
                        <input id="dateTo" type="date" class="form-control filterTo" style="background-color:white" >
                    </div>

                </div>

            </form>
            <footer>
                <div class="d-flex align-items-center totalDiv">

                </div>
                <div class="filter--buttons d-flex align-items-center justify-content-between">
                    <button class="btn--ui small dark disable" onclick="reset()">cancella</button>
                    <button class="btn--ui small white" onclick="loadDataTable()">filtra</button>
                </div>
            </footer>

        </aside>
    </div>

        <div class="col card--ui" id="card--dashboard">


                <header id="title--section" class="d-flex align-items-center justify-content-between">
                    <div class="title--section_name d-flex align-items-center justify-content-between">
                        <i class="ico--ui title_section entrate me-2"></i>
                        <h2 class="primary">@if(!$add && !$update)Entrate @else Inserimento/modifica entrata @endif</h2>
                    </div>

                    @if(!$add && !$update)
                        <div class="title--section_addButton" wire:click="add()" style="cursor: pointer;">
                            <div class="card--ui card--ui_btnAddHeaderUser entrata d-flex justify-items-between">
                                <header class="d-flex justify-content-between"><div class="card-title d-flex align-items-start"><h2><small>Registra</small><br>Nuova Entrata</h2></div><a href="#" wire:click="add()"><i class="ico--ui big add primary"></i></a></header>
                            </div>
                        </div>
                    @endif

                </header>


            @if(!$add && !$update)

                <button id="open-filter" onclick="pcsh1()"></button>
                <button id="close-filter" onclick="pcsh2()"></button>

                <section id="subheader" class="d-flex align-items-center justify-content-between">
                </section>

                <section id="resume-table">
                    <div class="compare--chart_wrapper d-none"></div>

                    <table class="table tablesaw tablesaw-stack" id="tablesaw-350">
                        <thead>
                            <tr>
                                <!--<th scope="col"></th>-->
                                <th scope="col">Data pagamento</th>
                                <th scope="col">Importo</th>
                                <th scope="col">Nome</th>
                                <th scope="col">Cognome</th>
                                <th scope="col">Commerciale</th>
                                <th scope="col">Causale</th>
                                <th scope="col">Pagamento</th>
                                <th scope="col">...</th>
                            </tr>
                        </thead>

                        <tbody id="checkall-target">
                        </tbody>
                    </table>

                    <br><b class="totalDiv"></b>

                </section>

            @else

                @if (session()->has('error'))
                    <div class="alert alert-danger" role="alert">
                        {{ session()->get('error') }}
                    </div>
                @endif


                <section id="accountingEntry" class="d-flex">
                    <div class="accountingEntry_data" wire:key='reload-{{$selectId}}'>
                        <form class="form--accounting" >

                                <div class="row gx-2">

                                    <div class="col-md-12">
                                        <span class="title-form d-block w-100">Tipologia</span>
                                        <div class="input-group mb-12">
                                            <div class="check--invoice d-flex align-items-center">
                                                <div class="form-check me-3">
                                                    <input class="form-check-input" type="radio" value="1" wire:model="commercial">
                                                    <label class="form-check-label" for="flexCheckChecked">&nbsp;Commerciale</label>
                                                </div>
                                                <div class="form-check">
                                                    <input class="form-check-input" type="radio" value="0" wire:model="commercial">
                                                    <label class="form-check-label" for="flexCheck">&nbsp;Non Commerciale</label>
                                                </div>
                                                </div>
                                        </div>
                                    </div>

                                    <div class="col-md-6 mt-3">
                                        <span class="title-form d-block w-100">Data pagamento</span>
                                        <div class="input-group mb-3">
                                            <input id="date" type="date" class="form-control"  wire:model="date">
                                        </div>
                                    </div>
                                    <div class="col-md-6">&nbsp;</div>


                                    <div class="col-md-6">
                                        <span class="title-form d-block w-100">Persona</span>
                                        <select name="member_id" class="form-select memberClass @error('member_id') is-invalid @enderror" aria-label="Seleziona una persona" wire:model="member_id">
                                            <option value="">--Seleziona--
                                            @foreach($members as $member)
                                                <option value="{{$member->id}}">{{$member->last_name}} {{$member->first_name}} ({{$member->fiscal_code}})
                                            @endforeach
                                        </select>
                                        @error('member_id')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                        <br><br>
                                        <button type="button" class="btn--ui primary" data-bs-toggle="modal" data-bs-target="#userModal">
                                            Aggiungi
                                        </button>
                                    </div>
                                    <div class="col-md-6">
                                        @if($this->member)
                                            <b>{{$this->member->first_name}} {{$this->member->last_name}}</b> {!! !$this->member->isAdult() ? '<span style="color:red;font-weight:bold">&nbsp;MINORENNE</span>' : '' !!}<br>
                                            <span class="title-form w-100">Codice fiscale</span> : {{$this->member->fiscal_code}}<br>
                                            <span class="title-form w-100">Email</span> : {{$this->member->email}}<br>
                                            <span class="title-form w-100">Borsellino virtuale</span>
                                            <b>{{number_format($virtual, 2, ".", "")}} &euro;</b><br>
                                            @if(sizeof($this->member->certificates) > 0)
                                                @php
                                                $cert = $this->member->certificates[0]
                                                @endphp
                                                @if($cert->expire_date < date("Y-m-d"))
                                                    <span class="title-form w-100">Certificato medico </span><span class="badge tessera-badge suspended">scaduto</span>
                                                @endif
                                            @endif
                                        @endif
                                    </div>
                                </div>

                                <div class="row gx-2 mt-3">
                                    <span class="title-form d-block w-100">Pagamento</span>

                                    <div class="col-md-12" >

                                        <select name="payment_method_id" class="form-select paymentClass @error('payment_method_id') is-invalid @enderror" aria-label="Seleziona un metodo di pagamento" wire:model="payment_method_id" style="width:100%">
                                            <option value="">--Seleziona--
                                            @foreach($payments as $payment)
                                                <option value="{{$payment->id}}">{{$payment->name}}
                                            @endforeach
                                        </select>
                                        @error('payment_method_id')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>

                                @foreach($rows as $idx => $row)

                                    <div class="row gx-2 mt-3" >
                                        <span class="title-form d-block w-100">Causale</span>
                                        <div class="col-md-12">

                                            <livewire:causals :type="$typeIN" :idx="$idx" :causal_id="$rows[$idx]['causal_id']" :wire:key="$idx" />

                                            @error('rows.'. $idx . '.causal_id')
                                                <span style="argin-top: 0.25rem; font-size: 0.875em; color: var(--bs-form-invalid-color);">{{ $message }}</span>
                                            @enderror

                                        </div>
                                    </div>

                                    <div class="row gx-2 mt-3">
                                        <span class="title-form d-block w-100">Dettaglio causale</span>
                                        <div class="col-md-12">
                                            <input class="form-control " id="causal_detail_{{$idx}}" type="text" placeholder="Dettaglio causale" wire:model="rows.{{$idx}}.note">
                                        </div>
                                    </div>

                                    <div class="row gx-2 mt-3 align-items-center">
                                        <div class="col-md-6">
                                            <span class="total primary">Importo</span>
                                        </div>
                                        @if ($commercial)
                                            <div class="col-md-3">
                                                <select id="rows.{{$idx}}.vat_id" class="form-select"  wire:model="rows.{{$idx}}.vat_id">
                                                    <option value="0">
                                                    @foreach($vats as $vat)
                                                        <option value="{{$vat->id}}">{{$vat->name}}
                                                    @endforeach
                                                </select>
                                            </div>
                                        @else
                                            <div class="col-md-3"></div>
                                        @endif
                                        <div class="col-md-3">
                                            @if($add)
                                                <input type="text" class="form-control totalInput text-end @error('amount') is-invalid @enderror" id="rows.{{$idx}}.amount" wire:model="rows.{{$idx}}.amount" wire:keydown.enter="store(false)" onkeyup="onlyNumberAmount(this)" placeholder="€ 0,00">
                                            @endif
                                            @if($update)
                                                <input type="text" class="form-control totalInput text-end @error('amount') is-invalid @enderror" id="rows.{{$idx}}.amount" placeholder="€ 0,00" wire:model="rows.{{$idx}}.amount"  onkeyup="onlyNumberAmount(this)" wire:keydown.enter="update(false)">
                                            @endif
                                            @error('rows.'. $idx . '.amount')
                                                <span style="argin-top: 0.25rem; font-size: 0.875em; color: var(--bs-form-invalid-color);">{{ $message }}</span>
                                            @enderror
                                        </div>

                                    </div>

                                    <div class="row gx-2 mt-3 align-items-center">
                                        <div class="col-md-4">
                                            <span class="total primary">Competenza</span>
                                        </div>
                                        <div class="col-md-8">
                                            <div class="row">

                                                @if($multiP)
                                                    <div class="row" style="background-color:lightGrey">
                                                        <h4>Seleziona inizio e fine multiperiodo</h4>
                                                        <div class="col-md-3">
                                                            <span class="title-form d-block w-100">Dal mese</span>
                                                            <div class="input-group mb-3">
                                                                <select class="form-select form-select-lg me-1"  wire:model="multiMonthFrom">
                                                                    <option value="1">Gennaio</option>
                                                                    <option value="2">Febbraio</option>
                                                                    <option value="3">Marzo</option>
                                                                    <option value="4">Aprile</option>
                                                                    <option value="5">Maggio</option>
                                                                    <option value="6">Giugno</option>
                                                                    <option value="7">Luglio</option>
                                                                    <option value="8">Agosto</option>
                                                                    <option value="9">Settembre</option>
                                                                    <option value="10">Ottobre</option>
                                                                    <option value="11">Novembre</option>
                                                                    <option value="12">Dicembre</option>
                                                                </select>
                                                            </div>
                                                        </div>
                                                        <div class="col-md-3">
                                                            <span class="title-form d-block w-100">Anno</span>
                                                            <div class="input-group mb-3">
                                                                <input type="number" class="form-control"  wire:model="multiYearFrom" >
                                                            </div>
                                                        </div>
                                                        <div class="col-md-3">
                                                            <span class="title-form d-block w-100">Dal mese</span>
                                                            <div class="input-group mb-3">
                                                                <select class="form-select form-select-lg me-1"  wire:model="multiMonthTo">
                                                                    <option value="1">Gennaio</option>
                                                                    <option value="2">Febbraio</option>
                                                                    <option value="3">Marzo</option>
                                                                    <option value="4">Aprile</option>
                                                                    <option value="5">Maggio</option>
                                                                    <option value="6">Giugno</option>
                                                                    <option value="7">Luglio</option>
                                                                    <option value="8">Agosto</option>
                                                                    <option value="9">Settembre</option>
                                                                    <option value="10">Ottobre</option>
                                                                    <option value="11">Novembre</option>
                                                                    <option value="12">Dicembre</option>
                                                                </select>
                                                            </div>
                                                        </div>
                                                        <div class="col-md-3">
                                                            <span class="title-form d-block w-100">Anno</span>
                                                            <div class="input-group mb-3">
                                                                <input type="number" class="form-control"  wire:model="multiYearTo" >
                                                            </div>
                                                        </div>
                                                        <div class="col-md-6">
                                                            <button type="button" class="btn--ui primary" wire:click.prevent="multiPeriodCreate({{$idx}})" style="margin-top:20px">
                                                                Crea multi periodo
                                                            </button>
                                                        </div>
                                                        <div class="col-md-6">
                                                            <button type="button" class="btn--ui primary" wire:click.prevent="multiPeriodCancel()" style="margin-top:20px">
                                                                Annulla multi periodo
                                                            </button>
                                                        </div>
                                                    </div>


                                                @else
                                                    @foreach($row["when"] as $xxx => $w)
                                                        <div class="col-md-4">
                                                            <span class="title-form d-block w-100">Mese</span>
                                                            <div class="input-group mb-3">
                                                                <select class="form-select form-select-lg me-1"  wire:model="rows.{{$idx}}.when.{{$xxx}}.month">
                                                                    <option value="1">Gennaio</option>
                                                                    <option value="2">Febbraio</option>
                                                                    <option value="3">Marzo</option>
                                                                    <option value="4">Aprile</option>
                                                                    <option value="5">Maggio</option>
                                                                    <option value="6">Giugno</option>
                                                                    <option value="7">Luglio</option>
                                                                    <option value="8">Agosto</option>
                                                                    <option value="9">Settembre</option>
                                                                    <option value="10">Ottobre</option>
                                                                    <option value="11">Novembre</option>
                                                                    <option value="12">Dicembre</option>
                                                                </select>
                                                            </div>
                                                        </div>
                                                        <div class="col-md-3">
                                                            <span class="title-form d-block w-100">Anno</span>
                                                            <div class="input-group mb-3">
                                                                <input type="number" class="form-control"  wire:model="rows.{{$idx}}.when.{{$xxx}}.year" >
                                                            </div>
                                                        </div>
                                                        <div class="col-md-3">
                                                        <span class="title-form d-block w-100">Valore</span>
                                                            <span class="netprice_p total--wrapper_netprice"><b>{{$this->currencyToDouble($rows[$idx]["amount"]) > 0 ? formatPrice(($this->currencyToDouble($rows[$idx]["amount"]) + getVatValue($this->currencyToDouble($rows[$idx]["amount"]), $rows[$idx]["vat_id"])) / sizeof($rows[$idx]["when"])) : ""}}</b></span>
                                                        </div>
                                                        <div class="col-md-2"><br>
                                                            <button type="button" class="btn--ui primary" wire:click.prevent="delPeriod({{$idx}}, {{$xxx}})" style="float:right">
                                                                -
                                                            </button>
                                                        </div>
                                                    @endforeach
                                                    <button type="button" class="btn--ui primary" wire:click.prevent="addPeriod({{$idx}})">
                                                        Aggiungi periodo
                                                    </button>

                                                    <button type="button" class="btn--ui primary" wire:click.prevent="multiPeriod()" style="margin-top:20px">
                                                        Imposta multi periodo
                                                    </button>
                                                @endif

                                            </div>
                                        </div>
                                    </div>

                                    <br><br>
                                    @if($idx > 0)
                                        <button type="button" class="btn--ui primary" wire:click.prevent="delRow({{$idx}})" style="float:right">
                                            Rimuovi causale
                                        </button>
                                        <br><br>
                                    @endif
                                    <hr size="1">

                                @endforeach

                                <br>
                                <button type="button" class="btn--ui primary" wire:click.prevent="addRow()">
                                    Aggiungi causale
                                </button>


                                <div class="accountingEntry--btn d-flex align-items-center justify-content-between">
                                    <button class="btn--ui lightGrey"  type="submit" wire:click.prevent="cancel()">annulla</button>
                                    @if($canSave)
                                        @if($add)

                                            @if($commercial)
                                                <button class="btn--ui primary"  type="submit" wire:click.prevent="store(false)">inserisci</button>
                                            @else
                                                <button class="btn--ui primary sendInvoice mt-5 d-flex ms-auto" wire:click.prevent="store(true)"><i class="ico--ui sendingBtn"></i>inserisci e genera ricevuta</button>
                                            @endif

                                        @endif
                                        @if($update)
                                            <button class="btn--ui primary"  type="submit" wire:click.prevent="update(false)">salva</button>
                                        @endif
                                    @else
                                        <span style="color:red">Attenzione : non c'è credito sufficiente sul borsellino virtuale</span>
                                    @endif

                                </div>
                    </form>
                    </div>
                    <div class="accountingEntry_resume card--ui" style="max-height:800px;">
                        <header>
                            <div class="username d-flex align-items-start">
                                <i class="ico--ui accountingResume me-2"></i>
                                <div class="user--resume_name d-flex flex-column"><span class="primary">Ricevuta {{$currentReceip ? $currentReceip->number . "/" . $currentReceip->year : ''}}</span></div></div>
                        </header>

                        <div class="resume--body d-flex justify-content-between flex-column">
                            <header>
                                @if($this->member)
                                    <ul class="resume-item mb-4 p-0">

                                        @if($this->member->isAdult())
                                            <li>
                                                <span class="evidence_name">{{$this->member->last_name}} {{$this->member->first_name}}</span> ({{$this->member->fiscal_code}})
                                            </li>
                                            @if  (false)
                                                <li><span>Nato/a il {{$this->member->birth_date ? date("d/m/Y", strtotime($this->member->birth_date)) : ''}}</span></li>
                                            @endif
                                        @else
                                            <li>
                                                <span class="evidence_name">
                                                    <select class="form-control" wire:model="parent">
                                                        <option value="">Seleziona un genitore
                                                        @if($this->member->father_name != '')
                                                            <option value="{{$this->member->father_name}} {{$this->member->father_fiscal_code}}">{{$this->member->father_name}} {{$this->member->father_fiscal_code}}
                                                        @endif
                                                        @if($this->member->mother_name != '')
                                                            <option value="{{$this->member->mother_name}} {{$this->member->mother_fiscal_code}}">{{$this->member->mother_name}} {{$this->member->mother_fiscal_code}}
                                                        @endif
                                                    </select>
                                                </span>
                                            </li>
                                        @endif
                                    </ul>
                                @endif
                                <ul class="resume-item date p-0">
                                    <li><strong>Data di Pagamento</strong></li>
                                    <li>{{ date("d/m/Y", strtotime($date)) }}</li>
                                </ul>

                                @if(sizeof($rows) > 0)
                                    <table width="100%">
                                        <tr>
                                            <td><b>Causale</b></td>
                                            @if($commercial == 1)
                                                <td><b>Imponibile</b></td>
                                                <td><b>% Iva</b></td>
                                                <td><b>Iva</b></td>
                                            @endif
                                            <td style="float:right"><b>Totale</b></td>
                                        </tr>
                                        @foreach($rows as $row)
                                            <tr>
                                                <td>
                                                    {{$this->getCausal($row["causal_id"])}}<br>
                                                    {{$row["note"]}}
                                                </td>
                                                @php
                                                $vat_value = 0;
                                                @endphp
                                                @if($commercial == 1)
                                                    <td>{{$row["amount"]}}</td>
                                                    @php
                                                    $vat_name = '';
                                                    if ($row["vat_id"] > 0)
                                                    {
                                                        $v = \App\Models\Vat::findOrFail(intval($row["vat_id"]));
                                                        $vat_name = $v->name;
                                                        $vat_value = $this->currencyToDouble($row["amount"]) / 100 * $v->value;
                                                    }
                                                    @endphp
                                                    <td>{{$vat_name}}</td>
                                                    <td>{{$vat_value > 0 ? formatPrice($vat_value) : ''}}</td>
                                                @endif
                                                <td style="float:right">{{formatPrice($this->currencyToDouble($row["amount"]) + $vat_value)}}</td>
                                            </tr>
                                        @endforeach
                                    </table>

                                @endif

                            </header>

                            <footer>
                                <div class="total--wrapper">
                                    <div class="total--wrapper_amount d-flex align-items-center justify-content-between w-100 mb-3">
                                        <span class="amount_p"><strong>Importo</strong></span><span class="amount_data"><strong>{{$this->getPrice()}}</strong></span>
                                    </div>
                                    @if(false)
                                        <div class="total--wrapper_amount d-flex align-items-center justify-content-between w-100 mb-3">
                                            <span class="amount_p"><strong>Iva</strong></span><span class="amount_data"><strong>{{$this->getVat()}}</strong></span>
                                        </div>
                                    @endif
                                    @foreach($this->getVats() as $k => $v)
                                        <div class="total--wrapper_amount d-flex align-items-center justify-content-between w-100 mb-3">
                                            <span class="amount_p"><strong>{{$k}}</strong></span><span class="amount_data"><strong>{{formatPrice($v)}}</strong></span>
                                        </div>
                                    @endforeach
                                    <!--<div class="total--wrapper_tax d-flex align-items-center justify-content-between w-100 mb-2 pb-3">
                                        <span class="taxt_p">Ritenuta d’acconto (20%):</span><span class="tax_data">€ 20,00</span>
                                    </div>-->
                                    <div class="total--wrapper_netprice d-flex align-items-center justify-content-between w-100">
                                        <span class="netprice_p"><strong>Totale</strong></span><span class="netprice_data"><strong>{{$this->getTotal()}}</strong></span>
                                    </div>
                                </div>

                                @if($update)
                                    @if($currentReceip)
                                        @if($currentReceip->status == 99)
                                            <br><b style="float:right">Annullata</b>
                                            <button class="btn--ui primary sendInvoice mt-5 d-flex ms-auto" wire:click.prevent="update(true)"><i class="ico--ui sendingBtn"></i>salva e rigenera ricevuta</button>
                                        @else
                                            <div class="mt-5">
                                                <button class="btn--ui " wire:click="printReceipt()"><i class="ico--ui sendingBtn"></i>stampa ricevuta</button>
                                                <button class="btn--ui " wire:click.prevent="removeReceipt()"><i class="ico--ui "></i>annulla ricevuta</button>
                                            </div>
                                        @endif
                                    @else
                                        <button class="btn--ui primary sendInvoice mt-5 d-flex ms-auto" wire:click.prevent="update(true)"><i class="ico--ui sendingBtn"></i>salva e genera ricevuta</button>
                                    @endif
                                @endif

                            </footer>
                        </div>
                    </div>
                </section>

                <div  wire:ignore.self class="modal fade" id="userModal" tabindex="-1" aria-labelledby="userModalLabel" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="userModalLabel">Inserimento nuovo utente</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-md-6">
                                    <label for="newMemberFirstName" class="form-label">Nome</label>
                                    <input class="form-control @error('newMemberFirstName') is-invalid @enderror" type="text" id="newMemberFirstName" placeholder="Nome" wire:model="newMemberFirstName">
                                </div>
                                <div class="col-md-6">
                                    <label for="newMemberLastName" class="form-label">Cognome</label>
                                    <input class="form-control @error('newMemberLastName') is-invalid @enderror" type="text" id="newMemberLastName" placeholder="Cognome" wire:model="newMemberLastName">
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-12">
                                    <label for="newMemberFiscalCode" class="form-label">Codice fiscale</label>
                                    <input class="form-control @error('newMemberFiscalCode') is-invalid @enderror" type="text" id="newMemberFiscalCode" placeholder="Codice fiscale" maxlength="16" wire:model="newMemberFiscalCode">
                                    @if($newMemberFiscalCodeExist)
                                        <span style="color:red">Il codice fiscale inserito esiste</span>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annulla</button>
                            <button type="button" class="btn btn-primary" wire:click.prevent="createMember()">Salva</button>
                        </div>
                        </div>
                    </div>
                </div>

            @endif
        </div>
    </div>
</div>

@push('scripts')
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    <style>
        .select2-container--default .select2-selection--single{
            background-color: #E9F0F5;
            border: 0.0625rem solid #DFE5EB;
            font-size: 0.75rem;
        }
        .select2-selection
        {
            height: 38px !important;
        }
        .select2-selection__rendered
        {
            padding-top:3px;
        }
        .select2 {
            width:100% !important;
        }
        .page-link.active, .active > .page-link {
            background-color:#006099 !important;
        }
    </style>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
@endpush

@push('scripts')
    <script>

        function formatResult(node) {
            var output = node.text.split(/[,-]+/).pop();
            var $result = $('<span style="padding-left:' + (20 * (node.text.match(/-/g) || []).length) + 'px;">' + output + '</span>');
            return $result;
        };

        function matchStart(params, data) {
            params.term = params.term || '';
            if (data.text.toUpperCase().indexOf(params.term.toUpperCase()) == 0) {
                return data;
            }
            return false;
        }
        @if($refreshAfter == 1)
            setTimeout(() => {
                // $('.causalClass').select2();
                $('.causalClass').select2({
                    matcher: function(params, data) {
                        return matchStart(params, data);
                    }
                });
                $('.memberClass').select2({
                    tags: false
                });
                $('.paymentClass').select2({
                    matcher: function(params, data) {
                        return matchStart(params, data);
                    }
                });
            }, 100);
            setTimeout(() => {
                var element = document.getElementById('causal_detail_0');
                element.dispatchEvent(new Event('input'));
                console.log("ASDASDSA");
            }, 1000);
        @endif
        window.livewire.on('refresh', () => {
            // $('.causalClass').select2();
            $('.memberClass').select2({
                tags: false
            });
            $('.paymentClass').select2({
                matcher: function(params, data) {
                    return matchStart(params, data);
                }
            });
        });
        Livewire.on('load-select', () => {

            $('.causalClass').each(function(i, obj) {
                $(obj).select2({
                    //data: data,
                    /*formatSelection: function(item) {
                    return item.text
                    },*/
                    templateResult: formatResult
                });
                $(obj).on('change', function (e) {
                    var data = $(obj).select2("val");
                    var name = $(obj).select2().attr("name");
                    @this.set(name, data);
                });
            });

            $('.memberClass').select2({
                tags: false
            });
            $('.memberClass').on('change', function (e) {
                var data = $('.memberClass').select2("val");
                @this.set('member_id', data);
            });
            $('.paymentClass').select2({
                matcher: function(params, data) {
                    return matchStart(params, data);
                }
            });
            $('.paymentClass').on('change', function (e) {
                var data = $('.paymentClass').select2("val");
                @this.set('payment_method_id', data);
            });

            $('.filterMember').select2();
            /*$('.filterMember').on('change', function (e) {
                var data = $('.filterMember').select2("val");
                @this.set('filterMember', data);
                @this.search();
            });*/
            $('.filterPaymentMethod').select2();
            /*$('.filterPaymentMethod').on('change', function (e) {
                var data = $('.filterPaymentMethod').select2("val");
                @this.set('filterPaymentMethod', data);
            });*/
            $('.filterCausals').select2();
            /*$('.filterCausals').on('change', function (e) {
                var data = $('.filterCausals').select2("val");
                @this.set('filterCausals', data);
            });*/

        });

        Livewire.on('hide-search', () => {
            pcsh2();
        });

        window.livewire.on('saved', () => {
            $('#userModal').modal('hide');
        });
        window.livewire.on('reloadMembers', () => {
            $('.memberClass').select2("destroy");
            $('.memberClass').select2({
                tags: false
            });
        });

        $('.filterMember').select2();
        /*$('.filterMember').on('change', function (e) {
            var data = $('.filterMember').select2("val");
            @this.set('filterMember', data);
            @this.search();
        });*/
        $('.filterPaymentMethod').select2();
        /*$('.filterPaymentMethod').on('change', function (e) {
            var data = $('.filterPaymentMethod').select2("val");
            @this.set('filterPaymentMethod', data);
        });*/
        $('.filterCausals').select2();
        /*$('.filterCausals').on('change', function (e) {
            var data = $('.filterCausals').select2("val");
            @this.set('filterCausals', data);
        });*/

        function onlyNumberAmount(input) {
            let v = input.value.replace(/\D+/g, '');
            if (v.length > 14) v = v.slice(0, 14);
            input.value = "€ " + v.replace(/(\d)(\d\d)$/, "$1,$2").replace(/(^\d{1,3}|\d{3})(?=(?:\d{3})+(?:,|$))/g, '$1.');
        }

    </script>

    <link href="/css/datatables.css" rel="stylesheet" />
    <script src="/assets/js/datatables.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.2/js/buttons.dataTables.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.js"></script>
    <script>

        $(document).ready(function() {

            // Carico i dati dal local storage
            var filterCommercial = localStorage.getItem("filterCommercial");
            if (filterCommercial)
            {
                $('input[name="filterCommercial"]').val(filterCommercial);
            }
            var filterMember = localStorage.getItem("filterMember");
            if (filterMember)
            {
                $('.filterMember').val(filterMember);
                $('.filterMember').trigger('change');
            }
            var filterPaymentMethod = localStorage.getItem("filterPaymentMethod");
            if (filterPaymentMethod)
            {
                $('.filterPaymentMethod').val(filterPaymentMethod);
                $('.filterPaymentMethod').trigger('change');
            }
            var filterCausals = localStorage.getItem("filterCausals");
            if (filterCausals)
            {
                $('.filterCausals').val(filterCausals);
                $('.filterCausals').trigger('change');
            }
            var filterFrom = localStorage.getItem("filterFrom");
            if (filterFrom)
            {
                $('.filterFrom').val(filterFrom);
            }
            var filterTo = localStorage.getItem("filterTo");
            if (filterTo)
            {
                $('.filterTo').val(filterTo);
            }

            loadDataTable();
        } );

        function editData(id)
        {
            @this.edit(id);
        }

        function duplicateData(id)
        {
            @this.duplicate(id);
        }

        function deleteData(id)
        {
            if (confirm('Sei sicuro?'))
                @this.delete(id);
        }

        Livewire.on('load-data-table', () => {
            setTimeout(function() {loadDataTable()}, 100);

        });

        Livewire.on('destroy-data-table', () => {
            $('#tablesaw-350').DataTable().destroy();
        });

        function destroyDataTable()
        {
            $('#tablesaw-350').DataTable().destroy();
        }

        function reset()
        {
            $('input[name="filterCommercial"]').val(0);
            $('.filterMember').val('');
            $('.filterMember').trigger('change');
            $('.filterPaymentMethod').val('');
            $('.filterPaymentMethod').trigger('change');
            $('.filterCausals').val('');
            $('.filterCausals').trigger('change');
            $('.filterFrom').val('');
            $('.filterTo').val('');
            localStorage.clear();
            loadDataTable();
        }

        function loadDataTable(){

            if ( $.fn.DataTable.isDataTable('#tablesaw-350') ) {
                $('#tablesaw-350').DataTable().destroy();
            }

            var filterCommercial = $('input[name="filterCommercial"]:checked').val();
            var filterMember = $('.filterMember').val();
            var filterPaymentMethod = $('.filterPaymentMethod').val();
            var filterCausals = $('.filterCausals').val();
            var filterFrom = $('.filterFrom').val();
            var filterTo = $('.filterTo').val();

            // Salvo i filtri della ricerca
            localStorage.setItem("filterCommercial", filterCommercial);
            localStorage.setItem("filterMember", filterMember);
            localStorage.setItem("filterPaymentMethod", filterPaymentMethod);
            localStorage.setItem("filterCausals", filterCausals);
            localStorage.setItem("filterFrom", filterFrom);
            localStorage.setItem("filterTo", filterTo);

            $('#tablesaw-350').DataTable({
                ajax: '/get_record_in?filterCommercial=' + filterCommercial + "&filterMember=" + filterMember + "&filterPaymentMethod=" + filterPaymentMethod + "&filterCausals=" + filterCausals + "&filterFrom=" + filterFrom + "&filterTo=" + filterTo,
                columns: [
                    //{ data: 'id' },
                    {
                        data: "date",
                        render: function (data, type){
                            if (data == "")
                                return " TOTALE";
                            if (type == "sort"){
                                return new Date(data).getTime();
                            }
                            // Split class and text
                            const j = data.split(" ");
                            const d = j[0].split("-");
                            var ret = d[2] + "/" + d[1] + "/" + d[0];
                            return ret;
                        }
                    },
                    { data: 'total' },
                    { data: 'first_name' },
                    { data: 'last_name' },
                    { data: 'commercial' },
                    { data: 'causals' },
                    { data: 'payment' },
                    {
                        data: "action",
                        render: function (data){
                            if (data == "")
                                return "";
                            const j = data.split("|");
                            $(".totalDiv").html('Totale&nbsp;:&nbsp;<b>' + j[1] + '</b>');
                            var ret = '<button type="button" class="btn btn-outline-primary btn-sm" onclick="editData(' + j[0] + ')">Modifica</button>&nbsp;';
                            ret += '<button type="button" class="btn btn-outline-danger btn-sm" onclick="deleteData(' + j[0] + ')">Elimina</button>';
                            ret += '<button type="button" class="btn btn-outline-default btn-sm" onclick="duplicateData(' + j[0] + ')">Duplica</button>';
                            return ret;
                        }
                    },
                ],
                fixedHeader: false,
                order: [[0, 'desc']],
                thead: {
                'th': {'background-color': 'blue'}
                },
                layout: {
                    topStart: {
                        buttons: [
                            {
                                extend: 'excelHtml5',
                                title: 'Entrate',
                                exportOptions: {
                                    columns: ":not(':last')"
                                }
                            },
                            {
                                extend: 'pdfHtml5',
                                title: 'Entrate',
                                exportOptions: {
                                    columns: ":not(':last')"
                                }
                            },
                            {
                                extend: 'print',
                                text: 'Stampa',
                                title: 'Entrate',
                                exportOptions: {
                                    columns: ":not(':last')"
                                }
                            }
                        ]
                    }
                },
                pagingType: 'numbers',
                "language": {
                    "url": "/assets/js/Italian.json"
                },
            });
            $('#tablesaw-350 thead tr th').addClass('col');
            $('#tablesaw-350 thead tr th').css("background-color", "#EDF0F2");

        }

        var isEdit = false;

        Livewire.on('showReceipt', (id) =>
        {
            window.open("{{env('APP_URL', '')}}/receipt/" + id, '_blank').focus();
        });

        Livewire.on('setEdit', (x) =>
        {
            isEdit = x;
            console.log(isEdit);
        });

        window.onbeforeunload = function(){
            if (isEdit)
                return 'Cambiando pagina le eventuali modifiche andranno perse';

        };

    </script>

@endpush