@extends('layouts.user.app')

@section('title', 'Editar medidor')

@section('head')
  <link rel="stylesheet" href="{{ asset('css/materialdesignicons.min.css') }}">
  <link rel="stylesheet" href="{{asset('css/jquery-ui.min.css')}}">
@endsection

@section('content')
  <div class="row">
    <div class="col-12 grid-margin">
      <div class="card">
        <div class="card-body">          
            @include('errors.lista')
            <form method="post" action="{{route('editar.medidor')}}">
              @csrf
              @method('PATCH')
              <div class="col-8 panel panel-default">
                <!-- Default panel contents -->
                <h3 class="card-title">Editar medidor</h3>                
                <div class="panel-body">
                  <div class="form-group">
                     {{-- NOME --}}
                    <label for="nome" class="pt-2 control-label">Nome:</label>
                    <input class="form-control input-sm" autofocus="autofocus" 
                                                              name="nome" 
                                                              type="text" 
                                                              id="nome" 
                                                              data-js="nome" 
                                                              value="{{old('nome') ?? $medidor->nome}}"
                                                              required>
                    {{-- CPF --}}
                    <label for="cpf" class="pt-2 control-label">CPF/CNPJ:</label>
                    <input class="form-control input-sm" name="cpf" 
                                                              type="text" 
                                                              id="cpf" 
                                                              data-js="cpf" 
                                                              value="{{old('cpf') ?? $medidor->cpf}}"
                                                              required>
                    {{-- TELEFONE --}}
                    <label for="telefone" class="pt-2 control-label">Telefone:</label>
                    <input class="form-control input-sm mask" name="telefone" 
                                                              type="text" 
                                                              id="telefone" 
                                                              data-js="telefone" 
                                                              value="{{old('telefone') ?? $medidor->telefone}}"
                                                              required>

                    <label for="cep" class="pt-2 control-label">CEP:</label>
                    <input class="form-control input-sm mask" name="cep" 
                                                              type="text" 
                                                              id="cep" 
                                                              data-js="cep" 
                                                              value="{{old('cep') ?? $medidor->address->cep}}"
                                                              required>

                    <label for="endereco" class="pt-2 control-label">Endereço:</label>
                    <input class="form-control input-sm" name="endereco" 
                                                         type="text" 
                                                         id="endereco" 
                                                         value="{{old('endereco') ?? $medidor->address->endereco}}" 
                                                         readonly>
                    
                    <label for="numero" class="pt-2 control-label">Número:</label>
                    <input class="form-control input-sm mask" name="numero" 
                                                              data-js="numero" 
                                                              type="text" 
                                                              id="numero" 
                                                              value="{{old('numero') ?? $medidor->address->numero}}"
                                                              required>

                    <label for="complemento" class="pt-2 control-label">Complemento:</label>
                    <input class="form-control input-sm" name="complemento" 
                                                         type="text" 
                                                         id="complemento" 
                                                         value="{{old('complemento') ?? $medidor->address->complemento}}">

                    <label for="cidade" class="pt-2 control-label">Cidade:</label>
                    <input class="form-control input-sm" name="cidade" 
                                                         type="text" 
                                                         id="cidade" 
                                                         value="{{old('cidade') ?? $medidor->address->city->nome}}" 
                                                         readonly>
                    
                    <label for="estado" class="pt-2 control-label">Estado:</label>
                    <input class="form-control input-sm" name="estado" 
                                                         type="text" 
                                                         id="estado" 
                                                         value="{{old('estado') ?? $medidor->address->state->UF}}" 
                                                         readonly>
                    
                    <label for="concessionaria_id" class="pt-2">Selecione a concessionária:</label>
                    <select name="concessionaria_id" id="concessionaria_id" class="form-control" required>
                      <option value="0" disable> Selecione </option>
                      @foreach($concessionarias as $concessionaria)
                        <option value="{{ $concessionaria->id }}" @if($selected_concessionaria_id == $concessionaria->id)selected @endif>{{ $concessionaria->nome }}</option>
                      @endforeach
                    </select>

                    <label for="codigo_instalacao" class="pt-2 control-label">Código Instalação:</label>
                    <input class="form-control input-sm mask" name="codigo_instalacao" 
                                                              data-js="codigo_instalacao" 
                                                              type="text" 
                                                              id="codigo_instalacao" 
                                                              value="{{old('codigo_instalacao') ?? $medidor->codigo_instalacao}}"
                                                              required>

                    <label for="dia_leitura" class="pt-2 control-label">Dia de previsão de leitura:</label>
                     <select name="dia_leitura" id="dia_leitura" class="form-control" required>
                      <option value="" disable> Selecione o dia </option>
                      @for ($i = 1; $i < 32; $i++)
                        <option value="{{$i}}" @if((old('dia_leitura') == $i)||($medidor->dia_leitura == $i))selected @endif>
                          {{$i}}
                        </option>
                      @endfor                      
                    </select>
                    
                    <label for="constante" class="pt-2 control-label">Constante:</label>
                    <input class="form-control input-sm mask" name="constante" 
                                                              data-js="constante" 
                                                              type="text" 
                                                              id="constante" 
                                                              value="{{old('constante')  ?? $medidor->constante}}"
                                                              required>

                    <input type="hidden" name="producao_fv" id="producao_fv" value="{{$medidor->producao_fv}}">
                    @if($medidor->producao_fv === 1)
                      <p style="margin-bottom:0;" class="pt-2">
                        Possui produção fotovoltaica(Energia solar) - <span class="badge badge-success">SIM</span>
                      </p>
                      <label for="data_troca_medidor" class="pt-2 control-label">Data Troca Medidor:</label>
                      <input class="form-control input-sm mask date_calendar_medidor" name="data_troca_medidor" 
                                                                                      data-js="data_troca_medidor" 
                                                                                      type="text" 
                                                                                      id="data_troca_medidor" 
                                                                                      value="{{old('data_troca_medidor') ?? Carbon\Carbon::parse($medidor->data_troca_medidor)->format('d/m/Y')}}"
                                                                                      autocomplete="off">

                      <div id="medidorAntigo" @if($medidor->producao_fv=='0') style="display:none" @endif>                    
                        <label for="leitura_medidor_anterior" class="pt-2 control-label">
                          Informe a medição do medidor no ato da troca:  
                          <i class="fas fa-info-circle" title="Essa informção é importante para calcular o resíduo de energia que ficou no relógio unidirecional que será cobrado nas primeiras contas com injeção de energia solar em formas de parcelas.Se não houver a medição do medidor anterior preencha com 0."></i>                        
                        </label>
                        <input class="form-control input-sm mask" name="leitura_medidor_anterior" 
                                                                  data-js="leitura_medidor_anterior" 
                                                                  type="text" id="leitura_medidor_anterior" 
                                                                  value="{{old('leitura_medidor_anterior') ?? $medidor->leitura_medidor_anterior}}">

                        <label for="leitura_ultima_conta" class="pt-2 control-label">
                          Informe a última leitura emitida pela concessionária na sua conta antes da troca do medidor:  
                          <i class="fas fa-info-circle" title="Informe a leitura da última conta, pois essa informação é necessária para o cálculo do resíduo. Se não houver conta anterior preencha com 0."></i>
                        </label>
                        <input class="form-control input-sm mask" name="leitura_ultima_conta" 
                                                                  data-js="leitura_ultima_conta" 
                                                                  id="leitura_ultima_conta" 
                                                                  value="{{old('leitura_ultima_conta') ?? $medidor->leitura_ultima_conta}}"
                                                                  type="text">
                        
                        <label for="constante_ultima_conta" class="pt-2 control-label">
                          Constante Última Conta: 
                          <i class="fas fa-info-circle" title="Informe a constante da última conta, pois essa informação é necessária para o cálculo do resíduo. Se não houver conta anterior preencha com 0."></i>
                        </label>
                        <input class="form-control input-sm mask" name="constante_ultima_conta" 
                                                                  data-js="constante_ultima_conta" 
                                                                  id="constante_ultima_conta" 
                                                                  value="{{old('constante_ultima_conta') ?? $medidor->constante_ultima_conta}}"
                                                                  type="text">
                      </div>
                    @else
                      <div id="creditosExcedentes">
                        <p style="margin-bottom:0;" class="pt-2 pb-2">Recebe créditos excedentes - <span class="badge badge-success">SIM</span></p>                        
                        <div id="creditosExcedentesPorcentagem">                        
                          <label for="medidor_fornecedor_id">Informe o medidor da instalação:</label>
                          <select name="medidor_fornecedor_id" id="medidor_fornecedor_id" class="form-control">
                            <option value="" disable> Selecione </option>
                            @foreach($medidores as $medidor_select)
                              <option value="{{ $medidor_select->id }}" data-js={{Carbon\Carbon::parse($medidor_select->data_troca_medidor)->format('d/m/Y')}}
                                       @if((old('medidor_fornecedor_id') == $medidor_select->id)||($credito->medidor_fornecedor_id == $medidor_select->id))selected @endif>
                                Cód. {{ $medidor_select->codigo_instalacao }} - {{ $medidor_select->address->endereco }}
                              </option>
                            @endforeach
                          </select>
                          
                          <label for="creditosRecebidos" class="pt-2 control-label">Qual a porcentagem dos créditos recebidos:</label>
                          <input class="form-control input-sm mask" name="creditosRecebidos" 
                                                                    data-js="creditosRecebidos" 
                                                                    type="text" 
                                                                    id="creditosRecebidos" 
                                                                    value="{{old('creditosRecebidos') ?? $credito->porcentagem_recebido}}">
                        </div>
                      </div> 
                      <input type="hidden" name="credito_id" id="credito_id" value="{{$credito->id}}">                   
                      <input type="hidden" name="creditosExcedentes" id="creditosExcedentes" value="1">                   
                    @endif

                    {{-- Historico --}}
                    <div class="row pt-3">
                      <div class="col-12">
                        <h4>Histórico</h4>
                      </div>                      
                      {{-- Column 1 --}}
                      <div id="column1" class="col-md-6"> 
                        @for ($i = 0; $i < 6; $i++)
                          <div class="form-group row">
                            <label for="consumo_{{$historicosArray[$i]['mes']}}_{{$historicosArray[$i]['ano']}}" class="col-md-5 col-form-label">
                              {{ucfirst($historicosArray[$i]['mes'])}}/{{$historicosArray[$i]['ano']}}:
                            </label>
                            <div class="col-md-5">
                              <input type="text" class="form-control" name="consumo[]" id="consumo_{{$historicosArray[$i]['mes']}}_{{$historicosArray[$i]['ano']}}" placeholder="Consumo" required value="{{$historicosArray[$i]['consumo']}}">
                              <input type="hidden" name="data[]" id="data_{{$historicosArray[$i]['mes']}}_{{$historicosArray[$i]['ano']}}" value="{{$historicosArray[$i]['mesNum']}}_{{$historicosArray[$i]['ano']}}">
                              <input type="hidden" name="id[]" id="id_{{$historicosArray[$i]['mes']}}_{{$historicosArray[$i]['ano']}}" value="{{$historicosArray[$i]['id']}}">
                            </div>
                          </div>
                        @endfor 
                      </div>
                      {{-- Column2 --}}
                      <div id="column2" class="col-md-6">  
                        @for ($i = 6; $i < 12; $i++)
                          <div class="form-group row">
                            <label for="consumo_{{$historicosArray[$i]['mes']}}_{{$historicosArray[$i]['ano']}}" class="col-md-5 col-form-label">
                              {{ucfirst($historicosArray[$i]['mes'])}}/{{$historicosArray[$i]['ano']}}:
                            </label>
                            <div class="col-md-5">
                              <input type="text" class="form-control" name="consumo[]" id="consumo_{{$historicosArray[$i]['mes']}}_{{$historicosArray[$i]['ano']}}" placeholder="Consumo" required value="{{$historicosArray[$i]['consumo']}}">
                              <input type="hidden" name="data[]" id="data_{{$historicosArray[$i]['mes']}}_{{$historicosArray[$i]['ano']}}" value="{{$historicosArray[$i]['mesNum']}}_{{$historicosArray[$i]['ano']}}">
                              <input type="hidden" name="id[]" id="id_{{$historicosArray[$i]['mes']}}_{{$historicosArray[$i]['ano']}}" value="{{$historicosArray[$i]['id']}}">
                            </div>
                          </div>
                        @endfor 
                      </div>
                    </div>
                  </div>
                  <div class="form-group">
                    <input type="hidden" name="medidor_id" id="medidor_id" value="{{$medidor->id}}">                                       
                    <input class="btn btn-outline-success" type="submit" value="Atualizar">
                  </div>
                </div>
              </div>            
            </form>
        </div>
      </div>
    </div>
  </div>
@endsection

@section('scripts')
  <script src="{{ asset('js/jquery-ui.min.js') }}"></script>
  <script src="{{ asset('js/calendario.js') }}"></script>
  <script src="{{ asset('js/medidorAntigo.js') }}"></script> 
  <script src="{{ asset('js/tooltip.js') }}"></script> 
  <script src="{{ asset('js/validateDate.js') }}"></script> 
  <script src="{{ asset('js/inputHistoricoMedidor.js') }}"></script>
  <script src="{{ asset('js/carregaCEP.js') }}"></script>

  <script>
    const masks = {       
        cep(value){
            return value
                .replace(/\D/g,'')
                .replace(/(\d{5})(\d)/,'$1-$2')                    
                .replace(/(-\d{3})\d+?$/,'$1');
        },
        cpf(value){
            return value
                .replace(/\D/g, '')
                .replace(/(\d{3})(\d)/, '$1.$2')
                .replace(/(\d{3})(\d)/, '$1.$2')
                .replace(/(\d{3})(\d{1,2})/, '$1-$2')
                .replace(/(-\d{2})\d+?$/, '$1')
        },       
        telefone(value){
            return value
                .replace(/\D/g, '')
                .replace(/(\d{2})(\d)/, '($1) $2')
                .replace(/(\d{4})(\d)/, '$1-$2')
                .replace(/(\d{4})-(\d)(\d{4})/, '$1$2-$3')
                .replace(/(-\d{4})\d+?$/, '$1')
        },           
        codigo_instalacao(value){
                          return value
                              .replace(/\D/g,'');
        },       
        dia_leitura(value){
                    return value
                        .replace(/\D/g,'')
                        .replace(/(\d{2})\d+?$/,'$1');
        },
        constante(value){
                  return value
                      .replace(/\D/g,'')
                      .replace(/(\d{2})\d+?$/,'$1');
        },
        numero(value){
              return value
                  .replace(/\D/g,'');
        }, 
        leitura_medidor_anterior(value){
                          return value
                              .replace(/\D/g,'');
        },
        leitura_ultima_conta(value){
                          return value
                              .replace(/\D/g,'');
        },
        constante_ultima_conta(value){
                          return value
                              .replace(/\D/g,'');
        },
        creditosRecebidos(value){
                          return value
                              .replace(/\D/g,'');
        },
        data_troca_medidor(value){
            return value
                  .replace(/\D/g,'')
                  .replace(/(\d{2})(\d)/,'$1/$2')
                  .replace(/(\d{2})(\d)/,'$1/$2')
                  .replace(/(\d{4})\d+?$/,'$1');
                  //.replace(/[0-9]{2}[\/]{1}[0-9]{2}[\/]{1}[0-9]{4}$/g, '$1');
        },        
    }

    document.querySelectorAll('.mask').forEach(($input) => {
        const field = $input.dataset.js;
        
        $input.addEventListener('input', (e) => {
            e.target.value = masks[field](e.target.value);
        
            if((e.target.value.length == 9)&&(e.target.name=="cep")){
              let cep = e.target.value.replace("-","");
              let url = "{{env('APP_URL')}}";
              //console.log("URL:",url);
              carregaCEP(cep,url);
            }
        }, false);
    });
    
  </script>

@endsection