<div class="modal-header">
    <button type="button" class="close" ng-click="cancel()">
        <span aria-hidden="true">×</span>
    </button>
    <div id="cabeceraPagina">
        <h1>Detalle Inscripción</h1>
    </div>
</div>
<div class="modal-body">
    <form class="form-horizontal" ng-submit="buscar()" autocomplete="off" name="formulario">
        <div class="row">
            <div class="col-lg-12">
                <fieldset>
                    <legend>Datos generales</legend>
                    <div class="form-group">
                        <label class="control-label col-lg-1 required">Categoría</label>
                        <div class="col-lg-3">
                            <ui-select
                                    ng-if="!isLoadingCategorias"
                                    class="ui-select-match"
                                    ng-model="inscripcion.categoria"
                                    theme="bootstrap"
                                    required
                                    reset-search-input="true">
                                  <ui-select-match placeholder="Categoría..." allow-clear="true">{{$select.selected.descripcion}}</ui-select-match>
                                  <ui-select-choices class="ui-select-choices" repeat="categoria in categorias  | filter: $select.search  track by categoria.id">
                                   <div ng-bind-html="categoria.descripcion | highlight: $select.search"></div>
                                  </ui-select-choices>
                                </ui-select>

                            <div ng-if="isLoadingCategorias">Cargando categorias...</div>
                        </div>
                        <label class="control-label col-lg-1 required">Tipo</label>
                        <div ng-class="'col-lg-3'">
                            <select name="tipoInscripcion" class="form-control"
                                    required
                                    ng-options="tipo.descripcion for tipo in tiposInscripcion track by tipo.id"
                                    ng-model="inscripcion.tipo" ng-if="!isLoadingTipos"></select>
                            <div ng-if="isLoadingTipos">Cargando tipos...</div>
                        </div>
                        <label class="control-label col-lg-1 required">Programa</label>
                        <div ng-class="'col-lg-3'">
                            <input type="text" class="form-control"ng-model="inscripcion.programa" required maxlength="50">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-lg-1 required">Profesional / Inscripción</label>
                        <div class="col-lg-3">
                            <input type="text" class="form-control" ng-model="inscripcion.inscripcion" required maxlength="50">
                        </div>
                        <label class="control-label col-lg-1 required">Canal</label>
                        <div ng-class="'col-lg-3'">
                            <select name="tipoPremio" class="form-control" ng-model="inscripcion.canal" required>
                                <option value="">Seleccione...</option>
                                <option value="{{canal.id}}" ng-repeat="canal in canales">{{canal.descripcion}}</option>
                            </select>
                        </div>
                        <label class="control-label col-lg-1 required">Estado de la inscripcion</label>
                        <div ng-class="'col-lg-3'">
                            <select name="estado" class="form-control" ng-model="inscripcion.estado" required>
                                <option value="">Seleccione...</option>
                                <option value="{{estado.id}}" ng-repeat="estado in estados">{{estado.descripcion}}</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-lg-1">Quién recoge</label>
                        <div ng-class="'col-lg-3'">
                            <!--input type="text" class="form-control" ng-model="inscripcion.recoge" maxlength="100"-->
                            <textarea rows="4" class="form-control" maxlength="500" ng-model="inscripcion.recoge"></textarea>
                        </div>
                        <label class="control-label col-lg-1">Quién asiste</label>
                        <div ng-class="'col-lg-3'">
                            <!-- input type="text" class="form-control" ng-model="inscripcion.asiste" maxlength="100" -->
                            <textarea rows="4" class="form-control" maxlength="500" ng-model="inscripcion.asiste"></textarea>
                        </div>
                        <label class="control-label col-lg-1">Custodia premio</label>
                        <div ng-class="'col-lg-3'">
                            <!-- input type="text" class="form-control" ng-model="inscripcion.custodia" maxlength="100"-->
                            <textarea rows="4" class="form-control" maxlength="500" ng-model="inscripcion.custodia"></textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-lg-1">Importe</label>
                        <div ng-class="'col-lg-3'">
                            <input type="text" class="form-control" ng-model="inscripcion.importe">
                        </div>
                        <label class="control-label col-lg-1">Moneda</label>
                        <div ng-class="'col-lg-3'">
                            <ui-select
                                    ng-if="!isLoadingMonedas"
                                    class="ui-select-match"
                                    ng-model="inscripcion.moneda"
                                    theme="bootstrap"
                                    reset-search-input="true">
                                  <ui-select-match placeholder="Moneda..." allow-clear="true">{{$select.selected.descripcion}}</ui-select-match>
                                  <ui-select-choices class="ui-select-choices" repeat="moneda in monedas  | filter: $select.search  track by moneda.id">
                                   <div ng-bind-html="moneda.descripcion | highlight: $select.search"></div>
                                  </ui-select-choices>
                                </ui-select>
                            <div ng-if="isLoadingMonedas">Cargando monedas...</div>
                        </div>
                        <label class="control-label col-lg-1">Tipo Premio</label>
                        <div ng-class="'col-lg-3'">
                            <select name="tipoPremio" class="form-control" ng-model="inscripcion.tipoPremio" required>
                                <option value="">Seleccione...</option>
                                <option value="{{tipoPremio.id}}" ng-repeat="tipoPremio in tiposPremio">{{tipoPremio.descripcion}}</option>
                            </select>
                        </div>
                    </div>
                </fieldset>
            </div>
        </div>
        <div class="row" >
            <div class="col-lg-12">
                <fieldset>
                    <legend>Dotaciones  <span class="glyphicon glyphicon-plus accion" title="añadir dotación"></span></legend>
                        <table class="table table-striped table-bordered table-hover tabla-forms" cellspacing="0" fixed-header style="max-height: 400px;" st-table="capitulos">
                            <thead>
                                <tr>
                                    <th>Destinatario</th>
                                    <th>Importe</th>
                                    <th></th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr ng-repeat="dotacion in inscripcion.dotaciones track by $index" ng-class="dotacion.deleted?'borrado':''">
                                    <td>{{dotacion.destinatario.descripcion}}</td>
                                    <td>{{dotacion.importe}}</td>
                                    <td><span class="glyphicon glyphicon-edit accion" ng-click="showDetalleDotacion(dotacion)"></span></td>
                                    <td><span class="glyphicon glyphicon-trash accion"  ng-click="deleteDotacion(dotacion)"></span></td>
                                </tr>
                            </tbody>
                        </table>
                </fieldset>
            </div>
        </div>
        <div class="loadingGrande" ng-if="isLoading">
            <div class="col-lg-12">Cargando datos...</div>
        </div>
    </form>
</div>
<div class="modal-footer modal-footer-fondo-gris">
    <button type="button" class="btn btn-default" ng-click="cancel()">Cerrar</button>
    <button type="button" class="btn btn-primary" ng-click="guardar(inscripcion)"  ng-disabled="formulario.$invalid" >Aceptar</button>
</div>