@extends('adminlte::page')

@section('title', 'Dashboard')

@section('content_header')

<div class="row justify-content-between">
    <div class=""> <button class="btn btn-primary" onclick="history.back()"><i class="fas fa-arrow-left"></i> Indietro</button></div>
    <div class="text-center"><h1>Analisi Total Body Pediatrico</h1></div>
  <div class="d-flex ">
    <form action="{{route('Analisi.destroy',$data['id'])}}" class="mx-2" method="POST">
      @csrf
      @method('DELETE')
      <button type="submit" class="btn btn-sm btn-danger">cancella</button>

    </form>
    <div class="">
     
      <form action="{{route('Analisi.PdfTotal')}}" method="POST">
        @csrf
    <input type="hidden" name="Sesso" id = "Sesso" value="{{$data['an']->Sesso}}">
    <input type="hidden" name="" id = "BCMG" value="{{$data['an']->BCMG['val']}}">
    <input type="hidden" name="" id = "BCMGP" value="{{$data['anP']->BCMG['val']}}">
    <input type="hidden" name="Resistenza" id = "res" value="{{$data['an']->Resistenza}}">
    <input type="hidden" name="Reattanza" id = "rea" value="{{$data['an']->Reattanza}}">
    <input type="hidden" name="ResistenzaP" id = "resP" value="{{$data['anP']->Resistenza}}">
    <input type="hidden" name="ReattanzaP" id = "reaP" value="{{$data['anP']->Reattanza}}">
    <input type="hidden" name="Altezza" id = "Altezza" value="{{$data['an']->Altezza}}">
    <input type="hidden" name="AltezzaP" id = "AltezzaP" value="{{$data['anP']->Altezza}}">
    <input type="hidden" name="Laf" id = "LAF" value="{{$data['an']->Laf}}">
    <input type="hidden" name="Peso" id = "Peso" value="{{$data['an']->Peso}}">
    <input type="hidden" name="DataNascita" id = "DataNascita" value="{{$data['DataNascita']}}">
    <input type="hidden" name="Formule" id = "Formule" value="{{$data['Formule']}}">
    <input type="hidden" name="Nome" id = "Nome" value="{{$data['Nome']}}">
    <input type="hidden" name="Vsi" id = "Vsi" value="{{$data['Vsi']}}">
    <input type="hidden" name="idp" id="exampleInputEmail1" value="{{$data['idp']}}">
    <input type="hidden" name="id" id="exampleInputEmail1" value="{{$data['id']}}">
    <button type="submit" class="btn btn-sm btn-primary"  >Esporta pdf</button>
    </form></div>

</div>

@stop

@section('content')

<div class="row">
    <div class="col-md-4 mt-1">
        <p><strong>NUTRI-Dex</strong></p>
        <canvas  id="nutri" width="450" height="100" ></canvas>
    </div>
    <div class="col-md-4">
        <p><strong>HYDRA-Dex</strong></p>
        <canvas id="hydra"  width="450" height="100" ></canvas>
    </div>
    <div class="col-md-4">
        <p><strong>FM-Index</strong></p>
        <canvas id="FMI" width="450" height="100" ></canvas>

    </div>
</div>
<div class="row mt-2">
    <div class="col-md-4"> <canvas id="myChart4" style="position: relative; height:40vh; width:40vw"></canvas>
  </div>

    <div class="col-md-2"> <div style="height: 530px"> <canvas id="myChart1"></canvas></div></div>
    <div class="col-md-2"> <div style="height: 530px"> <canvas id="myChart2"></canvas></div></div>
  <div class="col-md-2"> <div style="height: 530px"> <canvas id="myChart3"></canvas></div></div>
</div>


<div>

  </div>
  <div class="row">

    <div class="col-md-4"> </div>
    <div class="col-md-4"> </div>
  </div>
<div class="row">
    <div class="col-md-12">
<div class="card">
    <div class="card-header"><h3 class="text-center">COD Analisi: 0000 - Genere: {{$data['an']->Sesso}}</h3> </div>
    <div class="card-body">
        <div class="row">
            <div class="col-md-6">
                <div class="row"><div class="col-md-5"><p><strong>Resistenza:</strong></p></div> <div class="col-md-2"><strong><p  id="resistenza">{{$data['an']->Resistenza}}</p></strong></div></div>
                <div class="row"><div class="col-md-5"><p><strong>Reattanza:</strong></p></div> <div class="col-md-2"><strong><p  id="resistenza">{{$data['an']->Reattanza}}</p></strong></div></div>
                <div class="row"><div class="col-md-5"  data-toggle="modal" data-target="#modal-PA"><p><strong> Angolo di fase: </strong><span><i class="text-primary fas fa-info-circle"></i></span></p></div> <div class="col-md-2"><p><strong  id="resistenza">{{round($data['an']->PA['val'],2)}}</strong></p></div></div>
            </div>


            <div class="col-md-6">
                <div class="row"><div class="col-md-5"><strong><p>Età:</p></strong></div> <div class="col-md-2"><strong><p  id="eta">{{$data['an']->eta}}</p></strong></div></div>
                <div class="row"><div class="col-md-5"><strong><p>Altezza:</p></strong></div> <div class="col-md-2"><strong><p  id="resistenza">{{$data['an']->Altezza}}</p></strong></div></div>
                <div class="row"><div class="col-md-5"><strong><p>Peso:</p></strong></div> <div class="col-md-2"><strong><p  id="resistenza">{{round($data['an']->Peso,2)}}</p></strong></div></div>
            </div>

        </div>

    </div>
</div>
    </div>
</div>
<div class="row">

</div>
<div class="row">
    <div class="col-md-8">
        <h2 class="text-center">Composizione corporea</h2>
<table class="table">
    <thead class="thead-light">
      <tr>
        <th scope="col" style="width: 40%">Dato</th>
        <th scope="col"   style="width: 10%">Valore attuale</th>
        <th scope="col">Um</th>
        <th scope="col">Percentuali</th>
        <th scope="col">Range</th>
        <th scope="col">Precedente</th>
      </tr>
    </thead>
    <tbody>
        <tr>
            <th scope="row">Altezza</th>
            <td>{{round($data['an']->Altezza,1)}}</td>
            <td>cm</td>
            <td></td>
            <td></td>
            <td>{{round($data['anP']->Altezza,1)}}</td>
          </tr>
          <tr>
            <th scope="row">Peso</th>
            <td>{{round($data['an']->Peso,1)}}</td>
            <td>kg</td>
            <td></td>
            <td></td>
            <td>{{round($data['anP']->Peso,1)}}</td>
          </tr>
          <tr>
            <th scope="row">Resistenza</th>
            <td>{{round($data['an']->Resistenza,1)}}</td>
            <td>ohm</td>
            <td></td>
            <td></td>
            <td>{{round($data['anP']->Resistenza,1)}}</td>
          </tr>
          <tr>
            <th scope="row">Reattanza</th>
            <td>{{round($data['an']->Reattanza,1)}}</td>
            <td>ohm</td>
            <td></td>
            <td></td>
            <td>{{round($data['anP']->Reattanza,1)}}</td>
          </tr>
          <tr>
            <th scope="row">PA angolo di fase</th>
            <td>{{round($data['an']->PA['val'],1)}}</td>
            <td>°</td>
            <td></td>
            <td></td>
            <td>{{round($data['anP']->PA['val'],1)}}</td>
          </tr>
    @cannot('bia-b')  <tr data-toggle="modal" data-target="#modal-Cdex">
        <th  scope="row">C-Dex <span><i class="text-primary fas fa-info-circle"></i></span></th>
        <td id="C-dex">{{round($data['an']->BC['val'])}}</td>
        <td>pF</td>
        <td></td>
        <td>{{$data['an']->BC['range']}}</td>
        <td id="C-dex">{{round($data['anP']->BC['val'])}}</td>
      </tr>
      @endcannot
      <tr data-toggle="modal" data-target="#modal-BCM">
        <th scope="row">BCM - massa cellulare <span><i class="text-primary fas fa-info-circle"></i></span></th>
        <td>{{round($data['an']->BCM['val'],1)}}</td>
        <td>kg</td>
        <td>{{round($data['an']->BCM['val']/$data['an']->Peso*100,1)}}</td>
         <td>{{$data['an']->BCM['range']}}</td>
         <td>{{round($data['anP']->BCM['val'],1)}}</td>
      </tr>
      <tr>
        <th scope="row">BCM/FFM%</th>
        <td>{{round($data['an']->BCMFFM['val']*100,1)}}</td>
        <td></td>
        <td></td>
        <td>{{$data['an']->BCMFFM['range']}}</td>
        <td>{{round($data['anP']->BCMFFM['val']*100,1)}}</td>
      </tr>
      <tr>
        <th scope="row">ECM - massa extra cellulare</th>
        <td>{{round($data['an']->ECM['val'],1)}}</td>
        <td>kg</td>
        <td>{{round($data['an']->ECM['val']/$data['an']->Peso*100,1)}}</td>
        <td>{{$data['an']->ECM['range']}}</td>
        <td>{{round($data['anP']->ECM['val'],1)}}</td>
      </tr>
      <tr data-toggle="modal" data-target="#modal-ECMBCM">
        <th scope="row">ECM/BCM <span><i class="text-primary fas fa-info-circle"></i></span></th>
        <td>{{round($data['an']->ECMBCM['val'],2)}}</td>
        <td></td>
        <td></td>
        <td>{{$data['an']->ECMBCM['range']}}</td>
        <td>{{round($data['anP']->ECMBCM['val'],2)}}</td>
      </tr>
      <tr>
        <th scope="row">ASMM - massa muscolare appendicolare</th>
        <td>{{round($data['an']->ASMM['val'],1)}}</td>
        <td>kg</td>
        <td></td>
        <td></td>
        <td>{{round($data['anP']->ASMM['val'],1)}}</td>
      </tr>
      <tr>
        <th scope="row">FFM - massa magra</th>
        <td>{{round($data['an']->FFM['val'],1)}}</td>
        <td>kg</td>
        <td>{{round($data['an']->FFM['val']/$data['an']->Peso*100,1)}}</td>
        <td>{{$data['an']->FFM['range']}}</td>
        <td>{{round($data['anP']->FFM['val'],1)}}</td>
      </tr>
      <tr>
        <th scope="row">FFMI - indice di massa magra</th>
        <td>{{round($data['an']->FFMht2['val'],1)}}</td>
        <td>kg/m<sup>2</sup></td>
        <td></td>
        <td>{{$data['an']->FFMht2['range']}}</td>
        <td>{{round($data['anP']->FFMht2['val'],1)}}</td>
      </tr>
      <tr>
        <th scope="row">FM - massa grassa</th>
        <td>{{round($data['an']->FM['val'],1)}}</td>
        <td>kg</td>
        <td>{{round($data['an']->FM['val']/$data['an']->Peso*100,1)}}</td>
        <td>{{$data['an']->FM['range']}}</td>
        <td>{{round($data['anP']->FM['val'],1)}}</td>
      </tr>
      <tr>
        <th scope="row">FMI - indice di massa grassa</th>
        <td id="fmid">{{round($data['an']->FMI['val'],1)}}</td>
        <td>kg/m<sup>2</sup></td>
         <td></td>
         <td>{{$data['an']->FMI['range']}}</td>
         <td id="fmidP">{{round($data['anP']->FMI['val'],1)}}</td>
      </tr>

      <tr>
        <th scope="row">BMI</th>
        <td>{{round($data['an']->BMI['val'],1)}}</td>
        <td>kg/m<sup>2</sup></td>
        <td></td>
        <td>{{$data['an']->BMI['range']}}</td>
        <td>{{round($data['anP']->BMI['val'],1)}}</td>
      </tr>
      <tr>
        <th scope="row">BSA - superfice corporea </th>
        <td>{{round($data['an']->BCA['val'],2)}}</td>
        <td>m<sup>2</sup></td>
        <td></td>
        <td>{{$data['an']->BCA['range']}}</td>
        <td>{{round($data['anP']->BCA['val'],2)}}</td>
      </tr>
      <tr>
        <th scope="row">BMR - metabolismo basale</th>
        <td>{{round($data['an']->BMR['val'])}}</td>
        <td>Kcal</td>
        <td></td>
        <td>{{$data['an']->BMR['range']}}</td>
        <td>{{round($data['anP']->BMR['val'])}}</td>
      </tr>

    </tbody>
</table>
<h2 class="text-center">Analisi dei fluidi</h2>
<table class="table">

    <thead class="thead-light">
        <tr>
          <th scope="col" style="width: 40%">Dato</th>
          <th scope="col" style="width:10%">Valore attuale</th>
          <th scope="col" >Um</th>
          <th scope="col">Percentuali</th>
          <th scope="col">Range</th>
          <th scope="col">Precedente</th>
        </tr>
      </thead>

<tbody>
      <tr>
        <th scope="row">TBW</th>
        <td id="TBW"> {{round($data['an']->TBW['val'],1)}}</td>
        <td>lt</td>
        <td>{{round($data['an']->TBW['val']/$data['an']->Peso*100,1)}}</td>
        <td>{{$data['an']->TBW['range']}}</td>
        <td id="TBWP"> {{round($data['anP']->TBW['val'],1)}}</td>
      </tr>
      <tr>
        <th scope="row">Hydration marker</th>
        <td id="TBW"> {{round($data['an']->TBW['val']/$data['an']->FFM['val'],3)}}</td>
        <td></td>
        <td></td>
        <td>0,65 - 0,78</td>
        <td > {{round($data['anP']->TBW['val']/$data['anP']->FFM['val'],3)}}</td>
      </tr>
      <tr>
        <th scope="row">ECW</th>
        <td id="ECW">{{round($data['an']->ECW['val'],1)}}</td>
        <td>lt</td>
        <td id="ECWP">{{round($data['an']->ECW['val']/$data['an']->TBW['val']*100,1)}}</td>
        <td id="ECWrange">35% - 45%</td>
        <td ><span id="ECWPr">{{round($data['anP']->ECW['val'],1)}}</span>  ({{round($data['anP']->ECW['val']/$data['anP']->TBW['val']*100,1)}}%)</td>
      </tr>

      <tr>
        <th scope="row">ICW</th>
        <td>{{round($data['an']->ICW['val'],1)}}</td>
        <td>lt</td>
        <td>{{round($data['an']->ICW['val']/$data['an']->TBW['val']*100,1)}}</td>
        <td>{{$data['an']->ICW['range']}}</td>
        <td>{{round($data['anP']->ICW['val'],1)}}</td>
      </tr>
      <tr data-toggle="modal" data-target="#modal-ECWICW">
        <th scope="row">ECW/ICW  <span><i class="text-primary fas fa-info-circle"></i></span> </th>
        <td>{{round($data['an']->ECWICW['val'],2)}}</td>
        <td></td>
        <td></td>
        <td>{{$data['an']->ECWICW['range']}}</td>
        <td>{{round($data['anP']->ECWICW['val'],2)}}</td>
      </tr>
    </tbody>
  </table>
</div>
@can('show-commento')


<div class="col-md-4">
    <div class="card mSidebar">
        <div class="card-header"><h3 class="text-center">Valutazione</h3> </div>
        <div class="body">
<textarea class="form-control" rows="20" >{{$data['comm']}}</textarea>
        </div>
    </div>
</div>
@endcan

</div>

<div id="modal-PI" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">Peso Ideale</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>Sebbene il peso corporeo ideale sia a volte stimato su base estetica, in realtà questo parametro è stato effettivamente introdotto per valutare meglio gli obiettivi e il possibile livello di benessere generale del soggetto.
          Tuttavia in ambito sportivo non andrebbe preso in considerazione in quanto per alcune specialità ove la finalità è l’aumento della massa muscolare il peso corporeo è spesso superiore al peso ideale, mentre per altre discipline (in particolare quelle di resistenza/endurance) può addirittura essere inferiore.
        </p>
        <p> Ricordiamo che il valore del “peso ideale” non è un dato perfetto in quanto non considera le percentuali di FM grasso corporeo e di BCM Massa cellulare/muscolare nel corpo di una persona. In modo analogo al BMI è possibile che atleti in buona forma fisica vengano considerati in sovrappeso in base al loro peso corporeo. Così essere al di sopra o al di sotto al proprio peso ideale ed essere perfettamente in salute.
            </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-PA" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">Angolo Di fase</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>
            L’angolo di fase è un metodo lineare per analizzare il rapporto tra la resistenza elettrica (Rz) e la reattanza (Xc) (Fluidi e Membrane cellulari). E’ un marker ampiamente utilizzato per valutare lo stato nutrizionale in molte popolazioni denutrite e il valore può aiutare a identificare la malnutrizione precocemente prima dei test di laboratorio.
            L’ Angolo di fase può essere considerato un ottimo indicatore dello stato fisico e dell’integrità cellulare.
            Bassi valori di Angolo di Fase φ sembrano essere coerenti con una bassa Reattanza, deperimento cellulare o rottura della permeabilità della membrana cellulare.

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

  <div id="modal-ecl" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">ECL - Livello di efficienza cellulare</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>Indice bioelettrico di carattere puramente esplorativo che può indicare il livello di efficienza cellulare.<br/> Può essere utilizzato come indice di tentenza - Valori auspicabili nei maschi > 210 e nelle femminie > 170 </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-ECMBCM" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">ECM/BCM</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>Oltre all'angolo di fase PhA e alla massa cellulare in Kg BCM, l'indice ECM/BCM è un parametro importante per valutare lo stato metabolico e nutrizionale. Nelle persone sane e ben nutrite,
            la BCM dovrebbe essere sempre maggiore rispetto alla ECM, quindi con un indice < 1.
            Un aumento dell’indice ECM/BCM può essere correlato con la riduzione dell’angolo di fase PhA ed eventualmente utilizzato per intercettare precocemente eventuale riduzione del livello di benessere nutrizionale in fase iniziale.
            Uno dei primi segnali dell’abbassamento del livello di benessere nutrizionale è dato dall’aumento di questo parametro, causato dal catabolismo della BCM, dall’aumento di acqua extracellulare della ECM per eccesso di insulina nel sangue o per altri motivi.
            Il rapporto ECM/BCM può essere considerato un buon marker in quanto i cambiamenti di tale parametri sono indipendenti dalle variazioni di peso del peso corporeo.

            Ricordiamo inoltre che una riduzione del rapporto ECM/BCM può indicare che l’eventuale dimagrimento sta avvenendo in modo equilibrato mentre il relativo aumento può indicare che la perdita di peso sta avvenendo in modo squilibrato a carico della BCM.
            </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-Cdex" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">C-Dex</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>C-Dex è un parametro bioelettrico di capacità corporea che può rappresentare un indicatore bioelettrico del livello di stoccaggio energetico cellulare.<br/>
            Tale valore può essere legato sia alla quantità che alla qualità delle membrane cellulari contenute all'interno della BCM.</p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-Cm" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">Cm</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>Capacità della membrana è un parametro bioelettrico che può descrivere la quantità di corrente derivata dal flusso di ioni elettrici che attraversa la membrana cellulare.<br/>
           Può riflettere l’integrità della membrana cellulare.
            </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-BiaIndex" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">Bia-Index</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>Bia-Index è un indicatore bioelettrico legato alla permeabiità delle membrane cellulari e alla distribuzione dei fluidi corporei.<br/>Tale valore può essere correlato al livello infiammatorio </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-BCM" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">BCM</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>La massa cellulare corporea BCM è una componente della FFM massa magra corporea.
            Rappresenta tutte le cellule coinvolte nei vari processi metabolici e che determinano il tasso metabolico di base. La BCM è costituita da cellule muscolari scheletriche, muscoli lisci, miocardio, organi interni, apparato digerente, sangue, ghiandole e sistema nervoso.
            Il valore individuale di BCM è determinato da fattori genetici, età e condizione fisica.
            La quota di BCM in relazione alla FFM massa magra dovrebbe essere >/= al 50/53% negli uomini e circa 48/55% nelle donne.
            La BCM può essere anche utilizzata nella valutazione del consumo energetico, determinando il fabbisogno calorico dell'organismo.
            La stima della BCM può essere molto importante per analizzare il livello di benessere nutrizionale. Il mantenimento della BCM ad un determinato livello può avere un effetto positivo sul benessere fisico della persona e rappresenta un importante obiettivo in tutte le tipologie di intervento.
            Parallelamente può essere utile valutare il livello di BCMI ottenuto dai kg di BCM normalizzati con l’altezza del soggetto.
            </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-BD" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">BD</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>La densità corporea rilevata con BIA-Dex rappresenta il rapporto tra la massa ed il volume corporeo. Può essere utile unitamente alla valutazione dei fludi extracellulari ECW% per esplorare l’eventuale rischio/presenza di osteoporosi.
            Valori inferiori a 1,015 o compresi tra 1,015 e 1,03 g/cm³ possono indicare una densità corporea inferiore alla media.
            </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-ECWICW" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">ECW/ICW</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>L’acqua totale TBW è composta prevalentemente dal 57% di acqua Intracellulare ICW e da   circa il 43% extracellulare (ECW). La quantità di l'acqua intracellulare è determinata principalmente dalla massa cellulare/muscolare BCM.
            In presenza di un equilibrio tra le due componenti l'indice ECW/ICW è compreso tra 0,6 e 0,8. Nel caso di alterazioni cataboliche con riduzione della BCM, può verificarsi un aumento dei fluidi compensativo extracellulare, con indice in aumento.
            </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-EFP" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">EFP-Dex</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>Test bioelettrico esplorativo per valutare eventuale tendenza/presenza di panniculopatia edemato fibro-sclerotica, degradazione del tessuto adiposo sottocutaneo ed eventuale alterazione del microcircolo.
            Risultati che si attestano in prossimità della zona rossa possono indicare un verosimile aumento della pressione idrostatica, permeabilità delle pareti vasali e vasodilatazione con conseguente movimento dei fluidi extracellulari nei tessuti infiammati. Potenziale produzione di citochine infiammatorie e rischio di danno strutturale tissutale (proteine fibrose) riconducibile anche alla presenza di radicali liberi. </p>
        </div>
      </div>
    </div>
  </div>

  <div id="modal-VDEX" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">VDEX-Dex</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <p>
            Indice esplorativo per la valutazione della compliance venosa  e  dell’eventuale tendenza/presenza di alterazioni della circolazione venosa/arteriosa.
            L’indice di compliance venosa sfrutta la tecnologia BIA-Dex®  che attraverso l’analisi dei valori di Rz Resistenza, Xc Reattanza e PhA Angolo di Fase consente di elaborare e visualizzare un indice rappresentato da una scala bidirezionale facilmente interpretabile.

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

@stop

@section('css')
    <link rel="stylesheet" href="/css/admin_custom.css">
    <style>
.mSidebar {
  position: relative;
  right: 0px;
  top: 0px;
  -webkit-transition: all 500ms cubic-bezier(0.255, 1, 0.44, 1);
  /* older webkit */
  -webkit-transition: all 500ms cubic-bezier(0.255, 1.225, 0.44, 1.32);
  -moz-transition: all 500ms cubic-bezier(0.255, 1.225, 0.44, 1.32);
  -o-transition: all 500ms cubic-bezier(0.255, 1.225, 0.44, 1.32);
  transition: all 500ms cubic-bezier(0.255, 1.225, 0.44, 1.32);
  /* custom */
  -webkit-transition-timing-function: cubic-bezier(0.255, 1, 0.44, 1);
  /* older webkit */
  -webkit-transition-timing-function: cubic-bezier(0.255, 1.225, 0.44, 1.32);
  -moz-transition-timing-function: cubic-bezier(0.255, 1.225, 0.44, 1.32);
  -o-transition-timing-function: cubic-bezier(0.255, 1.225, 0.44, 1.32);
  transition-timing-function: cubic-bezier(0.255, 1.225, 0.44, 1.32);
  /* custom */
}

    </style>
@stop




@php
  if($data['an']->Sesso == "M")
  {
@endphp
@section('js')
<script>

  $(window).scroll(function(){
    var scrollTop = $(window).scrollTop();
    var top =scrollTop - 1200
    if(top>0  && window.innerWidth>900)
    {
        $('.mSidebar').css( "top", top );
    }else{
        $('.mSidebar').css( "top", 0 );
    }

});
  </script>
<script>
    $.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});
//$request->Resistenza, $request->Reattanza, $request->Altezza, $request->Sesso, $request->Peso,$request->DataNascita,$request->LAF
    $( "#esportaPDf" ).click(function() {

        $.post( "{{route('Analisi.PdfTotal')}}", {  Resistenza: $( "#res" ).val(),
                                                    Reattanza: $( "#rea" ).val(),
                                                    Altezza: $( "#Altezza" ).val(),
                                                    Sesso: $( "#Sesso" ).val(),
                                                    Peso: $( "#Peso" ).val(),
                                                    DataNascita: $( "#DataNascita" ).val(),
                                                    LAF: $( "#Laf" ).val(),
                                                    Formule: $( "#Formule" ).val(),


                                                })
  .done(function( data ) {
    alert( "Data Loaded: " + data );
  });


});
    </script>
<script src="{{ asset('js/Nutri.js')}}"></script>
<script src="{{ asset('js/Hydra.js')}}"></script>
<script src="{{ asset('js/FMI.js')}}"></script>
<script src="{{ asset('js/Cdex.js')}}"></script>
<script src="{{ asset('js/BiaIndex.js')}}"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2.0.0/dist/chartjs-plugin-datalabels.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-annotation/1.4.0/chartjs-plugin-annotation.js" integrity="sha512-es3XL5vwq08UWKA+Fp6tZVTcJ4Kh25GsgsCSkBbPlX6QmDn3YJX0yhUVhPYQUoPX/gUFXf7uH0YtuZHGPj4iHA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
    str= $('#ECWrange').html()
  ecwLIM=str.substring(6, 8);
  console.log("MASCHIO")
   str= $('#ECWrange').html()
  console.log(str.substring(6, 4));
    const ctx1 = document.getElementById('myChart1');
    const myChart1 = new Chart(ctx1, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      backgroundColor: "#F5CF35",
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      data: [{{round($data['an']->FM['val'],2)}}],
    }, {
      label: 'FFM',
      backgroundColor: "#B7FA8E",
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      data: [{{round($data['an']->FFM['val'],2)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,

    plugins: {
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {

        stacked: true,
      },
      y: {
        max:{{round($data['an']->Peso,2)}},
        stacked: true,

      }
    }
  }

});

    const ctx2 = document.getElementById('myChart2');
    const myChart2 = new Chart(ctx2, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      backgroundColor: "#F5CF35",
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      data: [{{round($data['an']->FM['val'],2)}}],
    },  {
      label: 'BCM',
      backgroundColor: "#D64D3E",
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      data: [{{round($data['an']->BCM['val'],2)}}],
    }, {
      label: 'ECM',
      backgroundColor: "#F5B87A",
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      data: [{{round($data['an']->ECM['val'],2)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        max:{{round($data['an']->Peso,2)}},
        stacked: true,

      }
    }
  }

});

ecw=parseFloat($('#ECWP').html())
col="";
if(ecw>parseFloat(ecwLIM) )
{
    col = "#ff0000"
}else{
    col = "#000000"
}

const annotation1 = {
    type: 'box',
  xMin: 0.149,
  xMax: 0.38,
  yMin: parseFloat(ecwLIM),
  yMax: parseFloat(ecwLIM)-0.5,
  backgroundColor: 'rgba(250, 0, 0, 1)',
  drawTime: 'afterDatasetsDraw',
  borderWidth: 0,
  borderRadius: 0,
};
const ctx3 = document.getElementById('myChart3');
    const myChart3 = new Chart(ctx3, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [    {
      label: 'TBW',
      backgroundColor: "#68B0FA",
      datalabels: {
        color: '#000000',
        offset: 50,
        formatter: (item) => {
                return '{{round($data['an']->TBW['val'],1)}} ' + "lt";
              }
      },
      data: [{{round($data['an']->TBW['val']/$data['an']->TBW['val']*100,1)}}],
    },{
      label: 'ICW%',
      backgroundColor: "#5EF3FA",
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "%";
              }
      },
      data: [{{round($data['an']->ICW['val']/$data['an']->TBW['val']*100,1)}}],
    }, {
      label: 'ECW%',
      backgroundColor: "#A8E6FF",
      datalabels: {

        color: col,
        formatter: (item) => {
                return item + ' ' + "%";
              }
      },
      data: [{{round($data['an']->ECW['val']/$data['an']->TBW['val']*100,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        annotation: {
        annotations: {
          annotation1
        }
      },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
      datalabels: {
        offset:0,
        align: 'end',
      }
    },

    scales: {
      x: {

      },
      y: {
        max:100,


      }
    }
  }

});

    const ctx = document.getElementById('myChart');
  const myChart = new Chart(ctx, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {

          datasets: [{
            label: 'PhA/Età ',
              data: [

                     {x: "{{$data['an']->Resistenza}}", y: "{{$data['an']->Reattanza}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 0.2)',
                  'rgba(255, 206, 86, 0.2)',
                  'rgba(75, 192, 192, 0.2)',
                  'rgba(153, 102, 255, 0.2)',
                  'rgba(255, 159, 64, 0.2)'
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 1,
              pointRadius: 4,
          }]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          yMin: 79,
          yMax: 32,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 1,
        },{
          type: 'line',
          xMin: 720,
          xMax: 300,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 1,
        },{
              type: 'ellipse',
              xMin: 230,
          xMax: 820,
          yMin: 40,
          yMax: 68,
          rotation:-66,
          backgroundColor: 'rgba(33, 99, 132, 0.15)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            },{
              type: 'ellipse',
              xMin: 300,
          xMax:  750,
          yMin: 44,
          yMax: 64,
          rotation:-66,
          backgroundColor: 'rgba(22, 11, 132, 0.15)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            },{
              type: 'ellipse',
              xMin: 385,
          xMax:  670,
          yMin: 48,
          yMax: 62,
          rotation:-66,
          backgroundColor: 'rgba(11, 99, 132, 0.15)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            }]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...

                beginAtZero: true,
                max: 100,
                title: {
        display: true,
        text: 'Reattanza'
      },
              min: 0,
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                title: {
        display: true,
        text: 'Resistenza'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)
                max: 1000,
              min: 0,
                           display: true, // mandatory
                           beginAtZero: true,
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });


  const ctx4 = document.getElementById('myChart4');
  var c = document.getElementById("myChart4");
var ctxg = c.getContext("2d");


//PHA eta Inizio
if($("#eta").html()>=16){
  const myChart4 = new Chart(ctx4, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {

          datasets: [{
            label: 'PhA / Età M',
              data: [

                     {x: "{{$data['an']->eta}}", y: "{{$data['an']->PA['val']}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 2,
              pointRadius: 4,
          },{
            label: 'PhA / Età M Prec',
              data: [

                     {x: "{{$data['anP']->eta}}", y: "{{$data['anP']->PA['val']}}"},

                    ],
              backgroundColor: [
                'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderColor: [
                'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 2,
              pointRadius: 4,
          },
          ]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            clip:true,
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          yMin: 8.89,
          yMax: 6.2,
          borderColor: 'rgb(66,245, 61)',
          borderWidth: 2,
        },{
          type: 'line',
          yMin: 8.07,
          yMax: 5.35,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 0.5,
        },{
          type: 'line',
          yMin: 7.25,
          yMax: 4.5,
          borderColor: 'rgb(245, 48, 37)',
          borderWidth: 2,
        }, {
          type: 'label',
          xValue: 77,
          yValue: 4.25,
          content: ['5%'],
          font: {
            size: 15
          }
        }, {
          type: 'label',
          xValue: 77,
          yValue: 5.2,
          content: ['50%'],
          font: {
            size: 15
          }
        }, {
          type: 'label',
          xValue: 77,
          yValue: 6.15,
          content: ['95%'],
          font: {
            size: 15
          }
        }



        ]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...

                beginAtZero: true,
                max: 8,
                title: {
        display: true,
        text: 'PhA'
      },
              min:2,
              max:10,
              ticks: {
                stepSize: 0.5
            },
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                title: {
        display: true,
        text: 'Età'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)
                max: 80,
              min: 15,
              ticks: {
                stepSize: 5
            },

                           display: true, // mandatory
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });
}else{
  const myChart4 = new Chart(ctx4, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {

          datasets: [{
            label: 'PhA / Età ',
              data: [

                     {x: "{{$data['an']->eta}}", y: "{{$data['an']->PA['val']}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 2,
              pointRadius: 4,
          },{
            label: 'PhA / Età ',
              data: [

                     {x: "{{$data['anP']->eta}}", y: "{{$data['anP']->PA['val']}}"},

                    ],
              backgroundColor: [
                'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderColor: [
                'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 2,
              pointRadius: 4,
          }]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            clip:true,
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          yMin: 4,
          yMax: 5,
          borderColor: 'rgb(245, 48, 37)',

          borderWidth: 2,
        },{
          type: 'line',
          yMin: 5.0,
          yMax: 6,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 0.5,
        },{
          type: 'line',
          yMin: 6.0,
          yMax: 7,
          borderColor: 'rgb(66,245, 61)',
          borderWidth: 2,
        }, {
          type: 'label',
          xValue: 77,
          yValue: 3.25,
          content: ['5%'],
          font: {
            size: 15
          }
        }, {
          type: 'label',
          xValue: 77,
          yValue: 4.2,
          content: ['50%'],
          font: {
            size: 15
          }
        }, {
          type: 'label',
          xValue: 77,
          yValue: 5.15,
          content: ['95%'],
          font: {
            size: 15
          }
        }



        ]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...

                beginAtZero: true,
                max: 10,
                min: 2.5,
                ticks: {
                stepSize: 0.5
            },
                title: {
        display: true,
        text: 'PhA'
      },
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                title: {
        display: true,
        text: 'Età'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)
                max: 15,
              min: 3,
              ticks: {
                stepSize: 1
            },

                           display: true, // mandatory
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });

}
//fine

  $("#ricarica").click(function() {
    myChart.update();

});
</script>

@stop
@php
}else{
@endphp
@section('js')
<script>
    $(window).scroll(function(){
    var scrollTop = $(window).scrollTop();
    var top =scrollTop - 1200
    if(top>0  && window.innerWidth>900)
    {
        $('.mSidebar').css( "top", top );
    }else{
        $('.mSidebar').css( "top", 0 );
    }

});
  </script>
<script src="{{ asset('js/Nutri.js')}}"></script>
<script src="{{ asset('js/Hydra.js')}}"></script>
<script src="{{ asset('js/FMI.js')}}"></script>
<script src="{{ asset('js/Cdex.js')}}"></script>
<script src="{{ asset('js/BiaIndex.js')}}"></script>
<script src="{{ asset('js/efpDex.js')}}"></script>

<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2.0.0/dist/chartjs-plugin-datalabels.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-annotation/1.4.0/chartjs-plugin-annotation.js" integrity="sha512-es3XL5vwq08UWKA+Fp6tZVTcJ4Kh25GsgsCSkBbPlX6QmDn3YJX0yhUVhPYQUoPX/gUFXf7uH0YtuZHGPj4iHA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
    str= $('#ECWrange').html()
  ecwLIM=str.substring(6, 8);
    if($("#eta").html()>=16){
    const ctx4 = document.getElementById('myChart4');
  const myChart4 = new Chart(ctx4, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {

          datasets: [{
            label: 'PhA/Età',
              data: [

                     {x: "{{$data['an']->eta}}", y: "{{$data['an']->PA['val']}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 1,
              pointRadius: 4,
          }]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          yMin: 7.90,
          yMax: 5.75,
          borderColor: 'rgb(66,245, 61)',
          borderWidth: 2,
        },{
          type: 'line',
          yMin: 7.19,
          yMax: 5.025,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 0.5,
        },{
          type: 'line',
          yMin: 6.49,
          yMax: 4.3,
          borderColor: 'rgb(245, 48, 37)',
          borderWidth: 2,
        }, {
          type: 'label',
          xValue: 77,
          yValue: 4.2,
          content: ['5%'],
          font: {
            size: 15
          }
        }, {
          type: 'label',
          xValue: 77,
          yValue: 5,
          content: ['50%'],
          font: {
            size: 15
          }
        }, {
          type: 'label',
          xValue: 77,
          yValue: 6,
          content: ['95%'],
          font: {
            size: 15
          }
        }



        ]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...

                beginAtZero: true,
                max: 8,
                title: {
        display: true,
        text: 'PhA'
      },
              min:2.5,
              max:10,
              ticks: {
                stepSize: 0.5
            },
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                title: {
        display: true,
        text: 'Età'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)
                max: 80,
              min: 15,
              ticks: {
                stepSize: 5
            },
                           display: true, // mandatory
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });
}else{
    const ctx4 = document.getElementById('myChart4');
  const myChart4 = new Chart(ctx4, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {

          datasets: [{
            label: 'PhA/Età',
              data: [

                     {x: "{{$data['an']->eta}}", y: "{{$data['an']->PA['val']}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 1,
              pointRadius: 4,
          },
          {
            label: 'PhA/Età Prec',
              data: [

                     {x: "{{$data['anP']->eta}}", y: "{{$data['anP']->PA['val']}}"},

                    ],
              backgroundColor: [
                'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderColor: [
                'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 1,
              pointRadius: 4,
          }]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          yMin: 6,
          yMax: 7,
          borderColor: 'rgb(66,245, 61)',
          borderWidth: 2,
        },{
          type: 'line',
          yMin: 5,
          yMax: 6,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 0.5,
        },{
          type: 'line',
          yMin: 4.0,
          yMax: 5.0,
          borderColor: 'rgb(245, 48, 37)',
          borderWidth: 2,
        }, {
          type: 'label',
          xValue: 77,
          yValue: 2.8,
          content: ['5%'],
          font: {
            size: 15
          }
        }, {
          type: 'label',
          xValue: 77,
          yValue: 4,
          content: ['50%'],
          font: {
            size: 15
          }
        }, {
          type: 'label',
          xValue: 77,
          yValue: 5,
          content: ['95%'],
          font: {
            size: 15
          }
        }



        ]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...

                beginAtZero: true,
                max: 8,
                title: {
        display: true,
        text: 'PhA'
      },
              min:2.5,
              max:10,
              ticks: {
                stepSize: 0.5
            },
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                title: {
        display: true,
        text: 'Età'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)
                max: 15,
              min: 3,
              ticks: {
                stepSize: 1
            },
                           display: true, // mandatory
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });
}


    const ctx1 = document.getElementById('myChart1');
    const myChart1 = new Chart(ctx1, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      backgroundColor: "#F5CF35",
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      data: [{{round($data['an']->FM['val'],2)}}],
    }, {
      label: 'FFM',
      backgroundColor: "#B7FA8E",
      data: [{{round($data['an']->FFM['val'],2)}}],
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        max:{{round($data['an']->Peso,2)}},
        stacked: true,

      }
    }
  }

});

    const ctx2 = document.getElementById('myChart2');
    const myChart2 = new Chart(ctx2, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
        datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      label: 'FAT',
      backgroundColor: "#F5CF35",
      data: [{{round($data['an']->FM['val'],2)}}],
    },  {
        datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      label: 'BCM',
      backgroundColor: "#D64D3E",
      data: [{{round($data['an']->BCM['val'],2)}}],
    }, {
        datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "kg";
              }
      },
      label: 'ECM',
      backgroundColor: "#F5B87A",
      data: [{{round($data['an']->ECM['val'],2)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        max:{{round($data['an']->Peso,2)}},
        stacked: true,

      }
    }
  }

});


ecw=parseFloat($('#ECWP').html())
console.log(ecw)
col="";
if(ecw>=parseFloat(ecwLIM) )
{
    col = "#ff0000"
}else{
    col = "#000000"
}


const annotation1 = {
    type: 'box',
  xMin: 0.149,
  xMax: 0.38,
  yMin: parseFloat(ecwLIM),
  yMax: parseFloat(ecwLIM)-0.5,
  backgroundColor: 'rgba(250, 0, 0, 1)',
  drawTime: 'afterDatasetsDraw',
  borderWidth: 0,
  borderRadius: 0,
};
const ctx3 = document.getElementById('myChart3');
    const myChart3 = new Chart(ctx3, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [ {
      label: 'TBW',
      backgroundColor: "#68B0FA",
      datalabels: {
        formatter: (item) => {
                return '{{round($data['an']->TBW['val'],1)}} ' + "lt";
              },
              color: '#000000',
      },
      data: [{{round($data['an']->TBW['val']/$data['an']->TBW['val']*100,1)}}],
    },{
        datalabels: {
        color: '#000000',
        formatter: (item) => {
                return item + ' ' + "%";
              }
      },
      label: 'ICW%',
      backgroundColor: "#5EF3FA",
      data: [{{round($data['an']->ICW['val']/$data['an']->TBW['val']*100,1)}}],
    }, {
        datalabels: {
        color: col,
        formatter: (item) => {
                return item + ' ' + "%";
              }
      },
      label: 'ECW%',
      backgroundColor: "#A8E6FF",
      data: [{{round($data['an']->ECW['val']/$data['an']->TBW['val']*100,1)}}],
    }],
  },

  plugins: [
  ChartDataLabels],
  options: {

    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        annotation: {
        annotations: {
          annotation1,
        }
      },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
      datalabels: {
        offset:0,
        align: 'end',
      }
    },

    scales: {
      x: {
      },
      y: {
        max:100,


      }
    }
  }

});

    const ctx = document.getElementById('myChart');
  const myChart = new Chart(ctx, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {
          datasets: [{
            label: 'Xc/Rz',
              data: [

                     {x: "{{$data['an']->Resistenza}}", y: "{{$data['an']->Reattanza}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192,1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 1.5
          }]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          xMin: 820,
          xMax: 428,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 1,
        },{
          type: 'line',
          yMin: 86,
          yMax: 42,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 1,
        },{
              type: 'ellipse',
              xMin: 500,
          xMax:  810,
          yMin: 48,
          yMax: 66,
          rotation:-66,
          backgroundColor: 'rgba(22, 11, 132, 0.25)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            },{
              type: 'ellipse',
              xMin: 425,
          xMax:  880,
          yMin: 44,
          yMax: 68,
          rotation:-66,
          backgroundColor: 'rgba(33, 99, 132, 0.25)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            },{
              type: 'ellipse',
              xMin: 322,
          xMax: 980,
          yMin: 38,
          yMax: 75,
          rotation:-66,
          backgroundColor: 'rgba(255, 99, 132, 0.25)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            }]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...

                beginAtZero: true,
                max: 100,
                title: {
        display: true,
        text: 'Reattanza'
      },
              min: 0,
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                title: {
        display: true,
        text: 'Resistenza'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)
                max: 1000,
              min: 0,
                           display: true, // mandatory
                           beginAtZero: true,
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });





//fine

  $("#ricarica").click(function() {
    myChart.update();

});
</script>

@stop

@php
}
@endphp