<div class="row">
    <div class="col-md-10 col-lg-8 offset-md-1 offset-lg-2">
        <div class="row bg-secondary p-3">
            <div class="form-group col-12 col-sm-6 col-md-4">
                <div class="input-group">
                    <input 
                        type="text" 
                        class="form-control" 
                        uib-datepicker-popup="dd/MM/yyyy" 
                        ng-model="notaPedido.fechaCarga" 
                        is-open="popup1.opened" 
                        datepicker-options="dateOptions" 
                        close-text="Cerrar"
                        current-text="Hoy"
                        clear-text="Borrar"
                        alt-input-formats="altInputFormats" 
                    />
                    <span class="input-group-append">
                        <button type="button" class="btn btn-default" ng-click="popup1.opened = true">
                            <i class="fa fa-calendar"></i>
                        </button>
                    </span>
                </div>
            </div>
            <div class="form-group col-12 col-sm-6 col-md-4">
                <input 
                    class="form-control selectable"
                    type="text"
                    readonly="true"
                    ng-bind="cliente.nombre"
                    ng-click="seleccionarVendedor()"
                    placeholder="Seleccione Vendedor"
                >
            </div>
            <div class="form-group col-12 col-sm-6 col-md-4">
                <input 
                    class="form-control selectable"
                    type="text"
                    readonly="true"
                    ng-bind="vendedor.nombre"
                    ng-click="seleccionarCliente()"
                    placeholder="Seleccione Cliente"
                >
            </div>
            <div class="form-group col-12 col-sm-6 col-md-4">
                <input 
                    class="form-control selectable"
                    type="text"
                    readonly="true"
                    ng-bind="vendedor.nombre"
                    ng-click="abrirModalDomicilio()"
                    placeholder="Seleccione Domicilio"
                >
            </div>
            <div class="form-group col-12 col-sm-6 col-md-4">
                <input 
                    class="form-control selectable"
                    type="text"
                    readonly="true"
                    ng-bind="vendedor.nombre"
                    ng-click="abrirModalListaPrecio()"
                    placeholder="Seleccione Lista de precio"
                >
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-10 col-lg-8 offset-md-1 offset-lg-2">
        <div class="row">
            
        </div>
        <div class="row">
            <table class="table table-striped table-sm">
                <thead>
                    <tr>
                        <th>Sector</th>
                        <th>Código</th>
                        <th>Descripción</th>
                        <th>Cantidad</th>
                        <th>Precio Unitario</th>
                        <th>SubTotal</th>
                        <th></th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td colspan="2"><input class="form-control" readonly></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr style="cursor: pointer;" ng-click="show = !show">
                        <td>1</td>
                        <td>1</td>
                        <td>Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...</td>
                        <td>{{10000 | number: 2}}</td>
                        <td>{{1000000000 | currency:'$'}}</td>
                        <td>{{1000000000 | currency:'$'}}</td>
                        <td></td>
                        <td>
                            <button class="btn btn-outline-secondary" style="float: right;">
                                <i class="fa fa-chevron-down" ng-hide="show" aria-hidden="true"></i>
                                <i class="fa fa-chevron-up" ng-show="show" aria-hidden="true"></i>
                            </button>
                        </td>
                    </tr>
                    <tr ng-show="show">
                        <td>1</td>
                        <td>2</td>
                        <td>Lorem Ipsum</td>
                        <td>1</td>
                        <td>{{1000000000 | currency:'U$D'}}</td>
                        <td>{{10 | currency:'$'}}</td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr ng-show="show">
                        <td>1</td>
                        <td>2</td>
                        <td>Lorem Ipsum</td>
                        <td>1</td>
                        <td>{{10 | currency:'$'}}</td>
                        <td>{{10 | currency:'$'}}</td>
                        <td></td>
                        <td></td>
                    </tr>
                </tbody>
                <tfoot>
                    <tr class="table-secondary">
                        <td colspan="5"><b>Cantidad Items:</b> 3</td>
                        <td colspan="3">{{30 | currency:'$'}}</td>
                    </tr>
                </tfoot>
            </table>
        </div>
    </div>
</div>

<!--
<form name="formCrearNota">
    <uib-tabset active="active">
        <uib-tab index="0" heading="General">
            <input type="hidden" name="id" ng-model="notaPedido.id" />
            <div>
                <div class="col-auto my-2">
                    <button type="submit" title="Siguiente" class="btn btn-primary float-right">Siguiente</button>
                </div>
            </div>
            <br>
            <br>
            <div class="row">
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Fecha de carga</label>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-auto">
                        <input type="date" class="form-control" ng-model="notaPedido.fechaCarga" ng-required="true">
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Kilómetros</label>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-auto">
                        <input type="number" min="0" step="0.01" class="form-control" placeholder="Kilómetros recorridos para la entrega en el cliente"
                            ng-model="notaPedido.kilometros" ng-required="true">
                    </div>
                </div>
            </div>
            <div class="row my-3">
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Jurisdicción de IIBB</label>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-auto">
                        <input type="text" class="form-control" placeholder="Jurisdicción de IIBB donde se realiza la entrega"
                            ng-model="notaPedido.jurisdiccionIIBB" ng-required="true">
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Costo de financiación</label>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-auto">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text">$</div>
                            </div>
                            <input type="number" min="0" step="0.01" class="form-control" placeholder="Costo de financiación"
                                ng-model="notaPedido.costoFinanciacion">
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Bomba</label>
                    </div>
                </div>
                <div class="col-md-1">
                    <div class="col-auto">
                        <div class="form-check custom-radio custom-control-inline">
                            <input class="form-check-input" type="radio" name="radioBomba" value="1" ng-model="notaPedido.bomba">
                            <label class="form-check-label">
                                Si
                            </label>
                        </div>
                        <div class="form-check custom-radio custom-control-inline">
                            <input class="form-check-input" type="radio" name="radioBomba" value="0" ng-model="notaPedido.bomba">
                            <label class="form-check-label">
                                No
                            </label>
                        </div>
                    </div>
                </div>
                <div class="col-md-1">
                    <div class="col-auto">
                        <label>Flete</label>
                    </div>
                </div>
                <div class="col-md-1">
                    <div class="col-auto">
                        <div class="form-check custom-radio custom-control-inline">
                            <input class="form-check-input" type="radio" name="radioFlete" value="1" ng-model="notaPedido.flete">
                            <label class="form-check-label">
                                Si
                            </label>
                        </div>
                        <div class="form-check custom-radio custom-control-inline">
                            <input class="form-check-input" type="radio" name="radioFlete" value="0" ng-model="notaPedido.flete">
                            <label class="form-check-label">
                                FOB
                            </label>
                        </div>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Costo unitario kilometro flete</label>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-auto">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text">$</div>
                            </div>
                            <input type="number" min="0" step="0.01" class="form-control" placeholder="Costo unitario del kilometro del flete"
                                ng-model="notaPedido.costoUnitarioKmFlete" ng-required="true">
                        </div>
                    </div>
                </div>
            </div>
            <div class="row my-3">
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Vendedor</label>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-auto">
                        <input type="text" class="form-control" placeholder="Seleccione vendedor" ng-model="notaPedido.vendedor"
                            ng-click="seleccionarVendedor()" readonly>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Petrolera</label>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-auto">
                        <input type="text" class="form-control" placeholder="Seleccione petrolera" ng-model="notaPedido.petrolera"
                            ng-click="seleccionarPetrolera()" readonly>
                    </div>
                </div>
            </div>
            </div>
            <div class="row">
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Cliente</label>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-auto">
                        <input type="text" class="form-control" placeholder="Seleccione cliente" ng-model="notaPedido.cliente"
                            ng-click="seleccionarCliente()" ng-change="obtenerDomicilios()" readonly>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Domicilio</label>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="col-md-12 row" ng-repeat="domicilio in notaPedido.domicilio">
                        <div class="col-auto">
                            <input type="text" ng-model="domicilio.dom" placeholder="Domicilio" uib-typeahead="
                                    domi.dom
                                    for domi
                                    in domiciliosCliente
                                "
                                typeahead-no-results="sinResultados" typeahead-min-length="0" typeahead-on-select="seleccionar($item)"
                                class="form-control mb-2" ng-disabled="domicilio.id > 0" ng-required="true">
                            <i ng-show="cargandoClientes" class="fas fa-sync"></i>
                            <div ng-show="sinResultados">
                                No se encontraron resultados.
                            </div>
                        </div>
                        <a class="btn" ng-click="removeNewChoice(domicilio)" ng-if="domicilio.id==0">-</a>
                        <a class="btn" ng-click="addNewDom()">+</a>
                    </div>
                </div>
            </div>
        </uib-tab>
        <uib-tab index="1" heading="Producto" disable="formCrearNota.$invalid">
            <div>
                <div class="col-auto my-2">
                    <button ng-click="crearNotaPedido()" type="button" title="Crear nota pedido" class="btn btn-primary float-right">Crear</button>
                </div>
            </div>
            <br>
            <br>
            <div class="row">
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Precios y condiciones</label>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="col-auto">
                        <select class="form-control" ng-change="cargarArticulos()" ng-model="notaPedido.precioCondicion" ng-options="preCond.id as preCond.nombre for preCond in precioCondiciones">
                        </select>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="col-auto">
                        <label>Producto</label>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="col-auto">
                        <input type="text" class="form-control" placeholder="Seleccione producto" ng-model="notaPedido.producto"
                            ng-click="seleccionarArticulo()" readonly>
                    </div>
                </div>
            </div>
            <div class="col-md-12">
                <table class="table my-3 table-hover table-nonfluid">
                    <thead>
                        <tr>
                            <th>Código</th>
                            <th>Nombre</th>
                            <th>Precio unitario</th>
                            <th>Costo unitario bruto</th>
                            <th>Cantidad</th>
                            <th>Subtotal</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="articulo in articulosTabla">
                            <td ng-bind="articulo.codigo"></td>
                            <td ng-bind="articulo.nombre"></td>
                            <td ng-bind="articulo.precio"></td>
                            <td ng-bind="articulo.costoUnitario"></td>
                            <td><input ng-model="articulo.cantidad" class="form-control" type="number" min="0" value="1"></td>
                            <td ng-bind="getSubTotal(articulo.item)"></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </uib-tab>
    </uib-tabset>
</form>-->