@extends('layouts.app')

@section('style')

		<!-- Internal  Data table css -->
		<link href="{{URL::asset('assets/plugins/datatable/css/dataTables.bootstrap4.min.css')}}" rel="stylesheet" />
		<link href="{{URL::asset('assets/plugins/datatable/css/buttons.bootstrap4.min.css')}}" rel="stylesheet">
		<link href="{{URL::asset('assets/plugins/datatable/css/responsive.bootstrap4.min.css')}}" rel="stylesheet" />
		<link href="{{URL::asset('assets/plugins/datatable/css/jquery.dataTables.min.css')}}" rel="stylesheet">
		<link href="{{URL::asset('assets/plugins/datatable/css/responsive.dataTables.min.css')}}" rel="stylesheet">
        <!-- Internal Nice-select css  -->
		<link href="{{URL::asset('assets/plugins/jquery-nice-select/css/nice-select.css')}}" rel="stylesheet"/>

@endsection

@section('content')
    <form wire:submit.prevent="save">
        <div class="row mt-3 mb-4 justify-space-between">
    		<div class="col-md-6 text-left">
    			<h5 class="content-title mb-2 font-700">Agregar cliente</h5>
    		</div>
    		<div class="col-md-6 text-right">
    			<a href="{{url('facturacion-clientes')}}"><h5><i class="far fa-arrow-alt-circle-left"></i> Volver</h5></a>
    		</div>
        </div>
    	<div class="row mt-3 mb-4">
    		<div class="col-12">
                <div class="card">
                    <!--
    				<div class="card-header pb-0">
    					<div class="d-flex justify-content-between">
    						<h4 class="card-title mg-b-0">SIMPLE TABLE</h4>
    						<i class="mdi mdi-dots-horizontal text-gray"></i>
    					</div>
    					<p class="tx-12 tx-gray-500 mb-2">Example of Mintro Simple Table. <a href="">Learn more</a></p>
    				</div>
                    -->
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="main-content-label mg-b-5">
                                    Datos de dirección fiscal
                                </div>
                                <div class="mb-2">
                                    <p class="mb-1">Calle</p>
                                    <input wire:model="calle" aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Calle" type="text">
                                    
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="mb-2">
                                            <p class="mb-1">Num. Exterior</p>
                                            <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Num. Exterior" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="mb-2">
                                            <p class="mb-1">Num. Interior</p>
                                            <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Num. Interior" type="text">
                                        </div>
                                    </div>
                                </div>
                                <div class="mb-2">
                                    <p class="mb-1">Colonia</p>
                                    <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Colonia" type="text">
                                </div>
                                <div class="mb-2">
                                    <p class="mb-1">Localidad</p>
                                    <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Localidad" type="text">
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="mb-2">
                                            <p class="mb-1">Num. Exterior</p>
                                            <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Num. Exterior" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="mb-2">
                                            <p class="mb-1">Num. Interior</p>
                                            <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Num. Interior" type="text">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="mb-2">
                                            <p class="mb-1">País</p>
                                            <select>
                                                <option value="Cliente1">México</option>
                                                <option value="Cliente2">Canadá</option>
                                                <option value="Cliente3">Estados Unidos</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="mb-2">
                                            <p class="mb-1">Estado</p>
                                            <select>
                                                <option value="Cliente1">CDMX</option>
                                                <option value="Cliente2">Puebla</option>
                                                <option value="Cliente3">Morelos</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="main-content-label mg-b-5">
                                    Datos de facturación
                                </div>
                                <div class="mb-2">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="mb-2">
                                                <p class="mb-1">Tipo de Tercero</p>
                                                <select>
                                                    <option value="Cliente1">Nacional</option>
                                                    <option value="Cliente2">Internacional</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="mb-2">
                                                <p class="mb-1">RFC</p>
                                                <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="RFC" type="text">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="mb-4">
                                    <p class="mb-1">Nombre / Razón social</p>
                                    <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Nombre / Razón social" type="text">
                                </div>
                                <div class="main-content-label mg-b-5">
                                    Datos de contacto
                                </div>
                                <div class="mb-2">
                                    <p class="mb-1">Correo electrónico</p>
                                    <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Correo electrónico" type="text">
                                </div>
                                <div class="mb-2">
                                    <p class="mb-1">Celular</p>
                                    <input aria-describedby="basic-addon1" aria-label="Username" class="form-control" placeholder="Celular" type="text">
                                </div>
                            </div>
                            <div class="col-12">
                                <div class="text-right">
                                    <a href="{{url('facturacion-clientes')}}"><button class="btn btn-outline-primary mt-2 mt-xl-0 font-700">Cancelar</button></a>
                                    <button type="submit" class="btn btn-primary mt-2 mt-xl-0 font-700">Guardar</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--
            <div class="col-6">
                <a href="#"><h6><i class="fas fa-file-export"></i> Exportar</h6></a>
            </div>
            <div class="col-6 text-right">
                <a href="{{url('gastos-pagados')}}"><h6>Siguiente ></h6></a>
            </div>
            -->
        </div>
    </form>
@endsection

@section('script')

		<!-- Internal Data tables -->
		<script src="{{URL::asset('assets/plugins/datatable/js/jquery.dataTables.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/dataTables.dataTables.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/dataTables.responsive.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/responsive.dataTables.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/jquery.dataTables.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/dataTables.bootstrap4.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/dataTables.buttons.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/buttons.bootstrap4.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/jszip.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/pdfmake.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/vfs_fonts.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/buttons.html5.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/buttons.print.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/buttons.colVis.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/dataTables.responsive.min.js')}}"></script>
		<script src="{{URL::asset('assets/plugins/datatable/js/responsive.bootstrap4.min.js')}}"></script>

		<!-- Internal Datatable js -->
		<script src="{{URL::asset('assets/js/table-data.js')}}"></script>
		

@endsection