@extends('crudbooster::admin_template')
@section('content')

<style>

.sweet-alert .dropdown button {
    color: black !important;
	border: 1px solid #d0d0d0 !important;
	margin-top: 5px !important;
}

.datepicker {
    z-index: 99999999999 !important;
}

.sweet-alert textarea{
border-radius: 2px;
resize: none;
height: 100px;
margin: 5px 0px;
display: block;
   width: 100%;
   padding: 6px 12px;
   font-size: 14px;
   line-height: 1.42857143;
   color: #555;
   background-color: #fff;
   background-image: none;
   border: 1px solid #ccc;
   border-radius: 4px;
   -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
   box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
   -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
   -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
   transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.yellow {
  background-color:  #E3FF00 !important;
}

.metodoPago {
    min-height: 50px;
    color: black;
    font-weight: bold;
	cursor: pointer;
}

.sweet-alert h2 {
    color: #575757;
    font-size: 24px !important;
    text-align: center;
    font-weight: 600;
    text-transform: none;
    position: relative;
    margin: 0px 0 !important;
    padding: 0;
    line-height: 40px;
    display: block;
}

.metodoPagoSuscripcion {
    min-height: 50px;
    color: black;
    font-weight: bold;
	cursor: pointer;
}

ul.typeahead {
	top: 41px;
    left: 15px;
    display: block;
    margin-top: 12px !important;
}

.nav-tabs .nav-link {

    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
	color: #8c8a8a;

	border: 1px solid #f0f0f0 !important;
    padding-bottom: 5px;
    margin-top: 9px;
    font-size: 12px;
}

.nav-tabs {
    border-bottom: 1px solid #dee2e6;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: #fff;
	border-color: #dee2e6 #dee2e6 #fff;
    padding-bottom: 10px;
    margin-top: 0px;
	font-size: 15px;
	border-bottom: 1px solid #fff !important;
}

@media (min-width: 768px)
{
	.modal-dialog {
		width: 800px;
		margin: 30px auto;
	}
}


.nav-tabs .nav-link {
    border: 1px solid transparent;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
}

.nav-tabs .nav-item {
    margin-bottom: -1px;
}

.nav-link {
    display: block;
    padding: .5rem 1rem;
}

.metodoPago.seleccionado {
    background-color: #f0f0f0
}

.metodoPagoSuscripcion.seleccionado {
    background-color: #f0f0f0
}

.no_editable input {
	border: none;
    pointer-events: none;
}

.no_editable .input-group-addon{
	display: none;
}

.no_editable input[name=referido_chk],.no_editable input[name=referido]
{
	border: 1px solid #ccc !important;
    pointer-events: initial !important;
}

.no_editable .input-group {
	width: 100%;
}

.no_editable input#cellphone, .no_editable input#phone, .no_editable input#new-tag, .no_editable input#new-pref, .no_editable input#new-image, .no_editable input#new-document {
	border: 1px solid #d2d6de;
    pointer-events: initial !important;
}

.no_editable .btn-success {
	pointer-events: initial !important;
	width: auto !important;
}

.lds-roller {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px;
  position: fixed;
    height: 100vh;
    background: #ffffff;
    width: 100vw;
    z-index: 9999;
    top: 0;
    left: 0;
    padding-left: calc(50% - 32px);
    padding-top: 10%;
	display: none;
}
.lds-roller div {
  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 32px 32px;
}
.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #000;
  margin: -3px 0 0 -3px;
}
.lds-roller div:nth-child(1) {
  animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
  top: 50px;
  left: 50px;
}
.lds-roller div:nth-child(2) {
  animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
  top: 54px;
  left: 45px;
}
.lds-roller div:nth-child(3) {
  animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
  top: 57px;
  left: 39px;
}
.lds-roller div:nth-child(4) {
  animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
  top: 58px;
  left: 32px;
}
.lds-roller div:nth-child(5) {
  animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
  top: 57px;
  left: 25px;
}
.lds-roller div:nth-child(6) {
  animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
  top: 54px;
  left: 19px;
}
.lds-roller div:nth-child(7) {
  animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
  top: 50px;
  left: 14px;
}
.lds-roller div:nth-child(8) {
  animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
  top: 45px;
  left: 10px;
}
@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.sweet-alert {
    width: 800px !important;
    margin-left: -400px !important;
}

</style>
<div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>

@php
	$aMeses = array('Ene.', 'Feb.', 'Mar.', 'Abr.', 'May.', 'Jun.', 'Jul.', 'Ago.', 'Sep.', 'Oct.', 'Nov.', 'Dic.');
@endphp

<style>

select {
	border-color: #dfdfdf;
}

#modal-add-event select{
-webkit-appearance: none;
height: 27px;
padding: 0 5px;
border-radius: 0;
background: white;
}

.btn-primary {
    background-color: #555;
    border-color: #313131;
}

.nav-tabs-custom>.nav-tabs>li.active {
border-bottom: 2px solid black;
}
.nav-tabs-custom>.nav-tabs>li {
border-top: 0 !important;
border-bottom: 2px solid transparent;
}

.profile-status{
margin-bottom: 20px;
display: table;
width: 100%;
}

.profile-status > div{
padding: 5px 10px;
float: left;
height: 55px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
text-transform: uppercase;
border-left: 0px !important;
position: relative;
margin: 0 4px;
font-size: 14px;
}

.profile-status > div::after {
z-index: 2;
content: '';
position: absolute;
top: 0px;
right: -10px;
height: 55px;
border-bottom: 25px solid transparent;
border-top: 25px solid transparent;
border-left-width: 10px;
border-left-color: white;
border-left-style: solid;
}

.profile-status > div::before {
z-index: 1;
content: '';
position: absolute;
top: 0px;
left: 0px;
height: 55px;
border-bottom: 25px solid transparent;
border-top: 25px solid transparent;
border-left-width: 10px;
border-left-color: #ffffff;
border-left-style: solid;
}

.profile-status > div.active{
height: 65px;
margin-top: -5px;
font-weight: bold;
}

.profile-status > div.active::before, .profile-status > div.active::after {
  height: 65px;
  border-bottom: 33px solid transparent;
  border-top: 33px solid transparent;
}

.action-links{
  text-align: left;
}

.action-links a,
.action-links button, .action-links2 button{
  width: 31px;
  height: 31px;
  font-size: 15px;
  line-height: 30px;
  border-radius: 50%;
  text-align: center;
  padding: 0;
  margin: 0 7px;
  color: #FFFFFF !important;
}

.action-links a.phone{
  background-color: #ab6abb !important;
}

.action-links a.email,
.action-links button.email{
  background-color: #f39c12 !important;
}

.action-links2 a.email,
.action-links2 button.email{
  background-color: #f39c12 !important;
}

.action-links a.whatsapp,
.action-links button.whatsapp{
  font-size: 17px;
  background-color: #25d366 !important;
}

.action-links a.facebook{
  background-color: #4267b2 !important;
}

.action-links a.calendar{
  background-color: #00adff !important;
}

.action-links a.pago{
  background-color: #ff0000 !important;
}

.action-links.init-contact a,
.action-links.init-contact button{
  height: 46px;
  width: 46px;
  padding: 6px 2px;
  font-size: 26px !important;
  transition: all 0.2s ease;
  box-shadow: 1px 1px 6px #33333360;
}

.action-links.init-contact a.whatsapp,
.action-links.init-contact button.whatsapp{
  font-size: 32px !important;
}

.action-links.init-contact a:hover,
.action-links.init-contact button:hover{
  box-shadow: 1px 1px 6px #00000087;
}

.modal hr{
  width: 60%;
}

@media(max-width: 800px){
.profile-status > div{
  width: 100%;
  float: none;
  height: 40px !important;
}

.profile-status > div::after, .profile-status > div::before{
  border: 0;
}

.profile-status > div:not(.active){
  display: none;
}
}

.contacto-whatsapp .mensaje {
	display: none;
}

.contacto-whatsapp h3 {
	transition: all 0.2s ease;
  transition-property: all;
  transition-duration: 0.2s;
  transition-timing-function: ease;
  transition-delay: 0s;
}

.contacto-whatsapp.iniciado .mensaje {
	display: block;
}

.contacto-whatsapp.iniciado .whatsapp {
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	-o-transform: scale(0.6);
	transform: scale(0.6);
	margin-top: -20px;
	margin-bottom: -16px;
}

.contacto-whatsapp.iniciado h3 {
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	-o-transform: scale(0.6);
	transform: scale(0.6);
	margin-top: -10px;
}

.contacto-whatsapp.iniciado .tiene_conversacion {
	display: none;
}

.contacto-whatsapp .tituloEntrante {
	display: none;
}

.contacto-whatsapp #link_whatsapp {
	display: inline-block;
}

.contacto-whatsapp #link_whatsapp2 {
	display: none;
}

.contacto-whatsapp .tituloSaliente {
	display: block;
}

.contacto-whatsapp.saliente .tituloEntrante {
	display: block;
}

.contacto-whatsapp.saliente .tituloSaliente {
	display: none;
}

.contacto-whatsapp.iniciado .estados {
	display: none;
}

.contacto-whatsapp.saliente .estados {
	display: block;
}

.contacto-whatsapp.saliente #link_whatsapp {
	display: none;
}

.contacto-whatsapp.saliente #link_whatsapp2 {
	display: inline-block;
}

.contacto-phone .mensaje {
	display: none;
}

.contacto-phone h3 {
	transition: all 0.2s ease;
  transition-property: all;
  transition-duration: 0.2s;
  transition-timing-function: ease;
  transition-delay: 0s;
}

.contacto-phone.iniciado .mensaje {
	display: block;
}

.contacto-phone.iniciado .whatsapp {
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	-o-transform: scale(0.6);
	transform: scale(0.6);
	margin-top: -20px;
	margin-bottom: -16px;
}

.contacto-phone.iniciado h3 {
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	-o-transform: scale(0.6);
	transform: scale(0.6);
	margin-top: -10px;
}

.contacto-phone.iniciado .tiene_conversacion {
	display: none;
}

.contacto-phone .tituloEntrante {
	display: none;
}

.contacto-phone #link_phone {
	display: inline-block;
}

.contacto-phone #link_phone2 {
	display: none;
}

.contacto-phone .tituloSaliente {
	display: block;
}

.contacto-phone.saliente .tituloEntrante {
	display: block;
}

.contacto-phone.saliente .tituloSaliente {
	display: none;
}

.contacto-phone.iniciado .estados {
	display: none;
}

.contacto-phone.saliente .estados {
	display: block;
}

.contacto-phone.saliente #link_phone {
	display: none;
}

.contacto-phone.saliente #link_phone2 {
	display: inline-block;
}

.contacto-facebook .mensaje {
	display: none;
}

.contacto-facebook h3 {
	transition: all 0.2s ease;
  transition-property: all;
  transition-duration: 0.2s;
  transition-timing-function: ease;
  transition-delay: 0s;
}

.contacto-facebook.iniciado .mensaje {
	display: block;
}

.contacto-facebook.iniciado .facebook {
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	-o-transform: scale(0.6);
	transform: scale(0.6);
	margin-top: -20px;
	margin-bottom: -16px;
}

.contacto-facebook.iniciado h3 {
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	-o-transform: scale(0.6);
	transform: scale(0.6);
	margin-top: -10px;
}

.contacto-facebook.iniciado .tiene_conversacion {
	display: none;
}

.contacto-facebook .tituloEntrante {
	display: none;
}

.contacto-facebook #link_facebook {
	display: inline-block;
}

.contacto-facebook #link_facebook2 {
	display: none;
}

.contacto-facebook .tituloSaliente {
	display: block;
}

.contacto-facebook.saliente .tituloEntrante {
	display: block;
}

.contacto-facebook.saliente .tituloSaliente {
	display: none;
}

.contacto-facebook.iniciado .estados {
	display: none;
}

.contacto-facebook.saliente .estados {
	display: block;
}

.contacto-facebook.saliente #link_facebook {
	display: none;
}

.contacto-facebook.saliente #link_facebook2 {
	display: inline-block;
}

.subestados > div {
	display: inline-block;
	padding: 5px;
	font-size: 12px;
	margin: 5px;
	cursor: pointer;
}

.estados > div {
	display: inline-block;
	padding: 5px;
	font-size: 12px;
	margin: 5px;
	cursor: pointer;
}

.subestados > div.activo {
	border: 2px solid black;
}

.estados > div.activo {
	border: 2px solid black;
}

a.btn-secondary {
	background: #93959a;
	color: white !important;
	margin-top: 20px;
}

a.btn-danger {
	margin-top: 20px;
}

.contacto-mail .mensaje {
	display: none;
}

.contacto-mail.iniciado .mensaje {
	display: block;
}

.contacto-mail.iniciado .saliente {
	display: none;
}

.contacto-mail.iniciado .email {
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	-o-transform: scale(0.6);
	transform: scale(0.6);
	margin-top: -20px;
	margin-bottom: -16px;
}

.contacto-mail.iniciado h3 {
	-ms-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	-o-transform: scale(0.6);
	transform: scale(0.6);
	margin-top: -10px;
}

.contacto-mail.iniciado .action-links {
	display: none;
}

.contacto-mail .action-links2 {
	display: none;
}

.contacto-mail.iniciado .action-links2 {
	display: block;
}

.div_medio:first-child {
	border-radius: 35px 35px 0px 0px;
}

.div_medio:last-child {
	border-radius: 0px 0px 50px 50px;
}

.div_medio:only-child {
	border-radius: 50px 50px 50px 50px;
}

.medio-canal-anuncio {
	display: inline-block; text-align: center; padding: 5px;
}

.medio-canal-anuncio span {
	font-weight: bold;
    font-size: 14px;
}

.medio-canal-anuncio small {
	font-size: 11px;
}

.subestados {
	display: none;
}

  .profile-status{
    margin-bottom: 20px;
    display: table;
    width: 100%;
  }

  .profile-status > div{
    padding: 5px 10px;
    float: left;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    border-left: 0px !important;
    position: relative;
    margin: 0 4px;
    font-size: 14px;
  }

  .profile-status > div::after {
    z-index: 2;
    content: '';
    position: absolute;
    top: 0px;
    right: -10px;
    height: 55px;
    border-bottom: 25px solid transparent;
    border-top: 25px solid transparent;
    border-left-width: 10px;
    border-left-color: white;
    border-left-style: solid;
  }

  .profile-status > div::before {
    z-index: 1;
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    height: 55px;
    border-bottom: 25px solid transparent;
    border-top: 25px solid transparent;
    border-left-width: 10px;
    border-left-color: #ffffff;
    border-left-style: solid;
  }

  .profile-status > div.active{
    height: 65px;
    margin-top: -5px;
  }

  .profile-status > div.active::before, .profile-status > div.active::after {
    height: 65px;
    border-bottom: 33px solid transparent;
    border-top: 33px solid transparent;
  }

  .action-links{
  text-align: center;
}

#table_detail tr {
  background-color:  #f9f9f9;
}

.action-links a,
.action-links button, .action-links2 button{
  width: 31px;
  height: 31px;
  font-size: 15px;
  line-height: 30px;
  border-radius: 50%;
  text-align: center;
  padding: 0;
  margin: 0 7px;
  color: #FFFFFF !important;
}

.action-links a.phone{
  background-color: #ab6abb !important;
}

.action-links a.email,
.action-links button.email{
  background-color: #f39c12 !important;
}

.action-links2 a.email,
.action-links2 button.email{
  background-color: #f39c12 !important;
}

.action-links a.whatsapp,
.action-links button.whatsapp{
  font-size: 17px;
  background-color: #25d366 !important;
}

.action-links a.facebook{
  background-color: #4267b2 !important;
}

.action-links a.calendar{
  background-color: #00adff !important;
}

.action-links a.pago{
  background-color: #ff0000 !important;
}

.action-links.init-contact a,
.action-links.init-contact button{
  height: 46px;
  width: 46px;
  padding: 6px 2px;
  font-size: 26px !important;
  transition: all 0.2s ease;
  box-shadow: 1px 1px 6px #33333360;
}

.action-links.init-contact a.whatsapp,
.action-links.init-contact button.whatsapp{
  font-size: 32px !important;
}

.action-links.init-contact a:hover,
.action-links.init-contact button:hover{
  box-shadow: 1px 1px 6px #00000087;
}


  @media(max-width: 800px){
    .profile-status > div{
      width: 100%;
      float: none;
      height: 40px;
    }

    .profile-status > div::after, .profile-status > div::before{
      border: 0;
    }
  }

  .panel {
        margin-bottom: 20px;
        background-color: transparent;
        border: none;
        border-radius: 0;
        padding: 10px;
        box-shadow: none;
    }

    #taula {
        height: 200px !important;
        overflow: auto;
    }
</style>
@php
	$aMeses = array('Ene.', 'Feb.', 'Mar.', 'Abr.', 'May.', 'Jun.', 'Jul.', 'Ago.', 'Sep.', 'Oct.', 'Nov.', 'Dic.');
@endphp

<div class="row" style="margin-top: 30px;margin-bottom: 20px;">
    <div class="col-md-3">
        <div class="info-box bg-aqua">
            <span class="info-box-icon" style="font-size: 20px; line-height: 27px;padding-top: 18px;">
                 {{ $aMeses[date('m') -1] }}<br>
                <small style="font-size: 22px"> {{ date('Y') }}</small>
            </span>

            <div class="info-box-content">
                <span class="info-box-text">Cuota Actual</span>
                <span class="info-box-number"><span id="cabecera-cuota-mes">&nbsp;</span></span>

                <div class="progress">
                    <div class="progress-bar" id="cabecera-cuota-progress" style=""></div>
                </div>
                <span class="progress-description">

                </span>
            </div>
            <!-- /.info-box-content -->
        </div>
    </div>

    <div class="col-md-3">
        <div class="info-box bg-green">
            <span class="info-box-icon" data-toggle="tooltip" style="font-size: 20px; line-height: 27px;padding-top: 18px;" title="Moneda">
              Moneda <br/>{{ $moneda->nombre }}
            </span>

            <div class="info-box-content">
                <span class="info-box-text">País</span>
                <span class="info-box-number"><span id="cabecera-total-pagos">{{$pais->nombre}}</span></span>

                <div class="progress">
                    <div class="progress-bar" id="cabecera-cuota-progress" style=""></div>
                </div>
                <span class="progress-description">
                  {{$metodo->nombre}}
                </span>
            </div>
            <!-- /.info-box-content -->
        </div>
    </div>

    <div class="col-md-3">
        <div class="info-box bg-yellow">
            <span class="info-box-icon" style="font-size: 30px; line-height: 27px;padding-top: 18px;"><br>
                <small style="font-size: 16px">Dólar BASE</small>
            </span>

            <div class="info-box-content">
                <span class="info-box-text" style="font-size:12px">D&oacute;lar <br><i class="fa fa-arrow-up pull-right" style="border-radius: 50%;padding: 2px 2px 2px 3px;background: white;color: #00a65a"></i>

                <span class="info-box-number">145</span>

                <div class="progress">
                    <div class="progress-bar" id="cabecera-cuota-progress" style=""></div>
                </div>

                <span class="progress-description">
                    <span >D&oacute;lar HOY: </span>
                </span>
            </div>
            <!-- /.info-box-content -->
        </div>
    </div>

    <div class="col-md-3">
        <div class="info-box bg-yellow" style="background-color: #9C27B0 !important">

            <div class="info-box-content" style="margin: 0">
                <span class="info-box-text">DOCUMENTOS <small style="cursor: pointer; float: right"><b><i class="fa fa-files-o"></i> Ver Todos</b></small></span>
                <span id="cabecera-inicio-plan"><i class="fa fa-refresh fa-spin"></i></span>

                <div class="progress">
                    <div class="progress-bar"  style=""></div>
                </div>

                <span class="progress-description">
                    <span id="cabecera-total-"></span>
                </span>
            </div>
            <!-- /.info-box-content -->
        </div>
    </div>
</div>

<div class="panel panel-default">
    <div class="panel-heading">
        Datos de Proyecto
    </div>
    <div class="panel-body">
        <form method="post" action="{{ route('editarProyecto') }}" id="formProyecto">
            <input type="hidden" name="_token" value="{{csrf_token()}}" />
            <input type="hidden" name="proyecto_id" value="{{$row->id}}" />
            <input type="hidden" name="referer" value="{{ url()->full() }}">
            <div class="row">
                <div class="col-md-6">
                    <div class="form-group row">
                      <label class="col-sm-3 col-form-label">Proyecto</label>
                      <div class="col-sm-9">
                        <input type="text" disabled name="nombre" id="nombre" class="form-control" value="{{$row->nombre}}" required />
                      </div>
                    </div>
                  </div>
                <div class="col-md-6">
                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">Cliente</label>
                    <div class="col-sm-9">
                       <select style="width:100%" disabled class="form-control" id="cliente_id" required="" name="cliente_id" tabindex="-1" aria-hidden="true">
                        <option value="">** Selecciona un Cliente</option>
                        @foreach($clientes as $c)
                            @if ($cliente->id == $c->id)
                                <option value="{{$c->id}}" SELECTED>{{$c->nombre}}</option>
                            @else
                                <option value="{{$c->id}}">{{$c->nombre}}</option>
                            @endif
                        @endforeach
                       </select>
                    </div>
                   </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <div class="form-group row">
                      <label class="col-sm-3 col-form-label">Unidad de Negocio</label>
                      <div class="col-sm-9">
                         <select style="width:100%" disabled class="form-control" id="unidad" required="" name="unidad" tabindex="-1" aria-hidden="true">
                            <option value="">** Selecciona una Unidad</option>
                          @foreach($unidades as $u)                             
                            @if($unidad->id == $u->id)
                              <option value="{{$u->id}}" SELECTED>{{$u->nombre}}</option>
                            @else
                              <option value="{{$u->id}}">{{$u->nombre}}</option>
                            @endif
                          @endforeach
                          </select>
                      </div>
                    </div>
                  </div>
                <div class="col-md-6">
                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">Moneda</label>
                    <div class="col-sm-9">
                        <select style="width:100%" disabled class="form-control" id="moneda" required="" name="moneda" tabindex="-1" aria-hidden="true">
                          <option value="">** Selecciona una Moneda</option>
                          @foreach($monedas as $m)
                            @if($moneda->id == $m->id)
                              <option value="{{$m->id}}" SELECTED>{{$m->nombre}}</option>
                            @else
                              <option value="{{$m->id}}">{{$m->nombre}}</option>
                            @endif
                          @endforeach
                        </select>
                    </div>
                  </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">Método Pago</label>
                    <div class="col-sm-9">
                        <select style="width:100%" disabled class="form-control" id="metodo_pago" required="" name="metodo_pago" tabindex="-1" aria-hidden="true">
                          <option value="">** Selecciona un Metodo</option>
                          @foreach($metodos as $m)
                            @if($metodo->id == $m->id)
                              <option value="{{$m->id}}" SELECTED>{{$m->nombre}}</option>
                            @else
                              <option value="{{$m->id}}">{{$m->nombre}}</option>
                            @endif
                          @endforeach
                        </select>
                    </div>
                  </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                </div>
                <div class="col-md-6">
                </div>
            </div>
        </form>
    </div>
</div>

<div class="panel panel-default">
    <div class="panel-heading">
        Plan de cuotas
    </div>
    <div class="panel-body">
        <div class="row">
            <div class="col-md-12">
                <table class="table" id="plan">
                    <thead>
                    <tr>
                        <th scope="col">Fecha</th>
                        <th scope="col">Concepto</th>
                        <th scope="col">Servicio</th>
                        <th scope="col">Plazo</th>
                        <th scope="col">Importe</th>
					    <th scope="col">Subtotal</th>
                    </tr>
                    </thead>
                    @php
                        $subtotal = 0;
                    @endphp
                    @foreach($historial as $cuota)
                        @php
                            $subtotal += $cuota->importe;
                        @endphp
                    @endforeach
                    <tfoot>
                    <tr>
                        <th>Total importe:</th>
                        <th></th>
                        <th></th>
                        <th></th>
                        <th></th>
                        <th>{{ '$' . number_format($subtotal, 2, ',', '.')}}</th>
                    </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>
</div>

<div class="panel panel-default">
    <div class="panel-heading">
        Acciones
    </div>
    <div class="panel-body">
        <div class="row">
            <div class="col-md-12">
                <form class='form-horizontal' method='post' id="form" enctype="multipart/form-data" action="{{ route('aprobarPlan') }}" >
                    <input type="hidden" name="_token" value="{{ csrf_token() }}">
                    <input type='hidden' name='return_url' value='{{ @$return_url }}'/>
                    <input type='hidden' name='ref_mainpath' value='{{ CRUDBooster::mainpath() }}'/>
                    <input type='hidden' name='ref_parameter' value='{{urldecode(http_build_query(@$_GET))}}'/>
                    <input type='hidden' name='project_id' value='{{$row->id}}'/>
                    <input type="hidden" name="referer" value="{{ url()->full() }}">
                    <div class="row">
                        <div class="col-md-6">
                          <div class="form-group row">
                            <label class="col-sm-3 col-form-label">Empresa</label>
                            <div class="col-sm-9">
                               <select style="width:100%" class="form-control" id="empresa" required="" name="empresa" tabindex="-1" aria-hidden="true">
                                <option value="">** Selecciona una Empresa</option>
                                @foreach($empresas as $empresa)
                                    <option value="{{$empresa->id}}">{{$empresa->nombre}}</option>
                                @endforeach
                               </select>
                            </div>
                           </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <input type="submit" name="submit" value="Aprobar" class="btn btn-success">&nbsp;
                            <button type="button" name="desaprobar" id="rejected" class="btn btn-danger">Desaprobar</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>


<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script type="text/javascript" language="javascript" scr="https://editor.datatables.net/extensions/Editor/js/dataTables.editor.min.js"></script>
<script>
 var url = "{{url('api/v1/cuotas') }}";
 var id = {{$row->id}};
 var editor;

 $(document).ready(function(){

   var table = $('#plan').DataTable({
		 processing: true,
		 serverSide: false,
		 "bDestroy": true,
         searching: false,
		 paging: true,
		 lengthChange: true,
		 'language': {"paginate": {
             "previous": "Anterior",
             "next": "Siguiente",
             },
		     "search": "Buscar",
		     "zeroRecords": "No hay registros",
	         "info": "Mostrando pagina _PAGE_ de _PAGES_",
	         "infoEmpty": "No hay registros diponibles",
         },
		 ajax: {
				url: url + "/list/" + id
		 },
		 scrollY:        "500px",
	     scrollX:        true,
	     scrollCollapse: true,
		 "columnDefs": [
			    { "width": "200", "targets": 0 }
	     ],
	     fixedColumns: true,
         "createdRow": function( row, data, dataIndex ) {
             if ( data.aprobado == 0) {
               $(row).addClass('yellow');
         }},
		 columns: [
			{ "data": "fecha"},
		    { "data": "concepto"},
            { "data": "servicio", orderable: false},
            { "data": "plazo"},
            { "data": "importe", render: $.fn.dataTable.render.number( ',', '.', 0, '$' ) },
            { "data": "subtotal", render: $.fn.dataTable.render.number( ',', '.', 0, '$' ) },
		  ]

   });

   $('#rejected').click(function() {
    swal({
            title: 'Desaprobar Proyecto',
            text: "Desea enviar el proyecto a Comercial?",
            html: true,
            showCancelButton: true,
            confirmButtonColor: '#89be4f',
            confirmButtonText: 'Confirmar',
            closeOnConfirm: true
        },
        function(){
                $.ajax({
                type: "POST",
                url: "{{ route('desAprobar') }}",
                data: {project_id: id},
                dataType: "json",
                cache: false,
                timeout: 600000,
                success: function (data) {
                    swal({
                        title: 'Operación Exitosa',
                        text: 'Se desaprobó el proyecto correctamente',
                        html: true,
                        type: 'success',
                        showCancelButton: false,
                        confirmButtonColor: '#666666',
                        confirmButtonText: 'Cerrar',
                        closeOnConfirm: true
                    },
                    function(){
                        window.location.href='/admin/aprobaciones';
                    });
                }})
        });
   });

});


</script>


@endsection