@extends('layouts.app')

@section('title', 'Cadastrar Clínicas')

@section('content')

@section('page-function', 'Cadastrar Clínicas')

<section class="content">
    <div class="container-fluid">
        @include('template.alert')
        <div class="row">
            <div class="col-12">
                <div class="card card-info">
                    <div class="card-header">

                    </div>
                    <form method="POST" action="{{ route('clinica.cadastrar') }}" onsubmit="return checkForm(this);">
                        @csrf
                        <div class="card-body">
                            <div class="row">
                                <div class="col-sm-14 col-md-7">
                                    <div class="form-group">
                                        <label for="nome">Nome</label>
                                        <input type="text" class="form-control" name="nome" id="nome"
                                            placeholder="Digite o nome da clínica" required>
                                    </div>
                                </div>
                                <div class="col-sm-10 col-md-5">
                                    <div class="form-group">
                                        <label for="cnpj">CNPJ</label>
                                        <input type="text" class="form-control" name="cnpj" id="cnpj"
                                            placeholder="99.999.999/9999-99" required>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-10 col-md-5">
                                    <div class="form-group">
                                        <label for="cep">CEP</label>
                                        <input type="text" class="form-control" name="cep" id="cep"
                                            placeholder="99999-999">
                                    </div>
                                </div>
                                <div class="col-sm-10 col-md-5">
                                    <div class="form-group">
                                        <label for="cidade">Cidade</label>
                                        <input type="text" class="form-control" name="cidade" id="cidade"
                                            placeholder="Digite a cidade" required>
                                    </div>
                                </div>
                                <div class="col-sm-4 col-md-2">
                                    <div class="form-group">
                                        <label for="uf">UF</label>
                                        <input type="text" class="form-control" name="uf" id="estado"
                                            placeholder="Digite o UF" required>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-10 col-md-5">
                                    <div class="form-group">
                                        <label for="logradouro">Logradouro</label>
                                        <input type="text" class="form-control" name="logradouro" id="logradouro"
                                            placeholder="Digite o logradouro" required>
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="form-group">
                                        <label for="numero">Número</label>
                                        <input type="text" class="form-control" name="numero" id="numero"
                                            placeholder="Digite o número" required>
                                    </div>
                                </div>
                                <div class="col-sm-8 col-md-4">
                                    <div class="form-group">
                                        <label for="bairro">Bairro</label>
                                        <input type="text" class="form-control" name="bairro" id="bairro"
                                            placeholder="Digite o bairro" required>
                                    </div>
                                </div>
                                
                            </div>
                            <div class="row">
                                <div class="col-sm-12 col-md-6">
                                    <div class="form-group">
                                        <label for="email">E-mail</label>
                                        <input type="text" class="form-control" name="email" id="email"
                                            placeholder="example@domain.com">
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="form-group">
                                        <label for="telefone1">Telefone</label>
                                        <input type="text" class="form-control" name="telefone1" id="telefone1"
                                            placeholder="(99) 9999-9999">
                                    </div>
                                </div>
                                <div class="col-sm-6 col-md-3">
                                    <div class="form-group">
                                        <label for="telefone2">Celular</label>
                                        <input type="text" class="form-control" name="telefone2" id="telefone2"
                                            placeholder="(99) 99999-9999">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-footer">
                            <button type="submit" name="enviar" class="btn btn-primary">Cadastrar</button>
                        </div>
                    </form>
                </div>
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div><!-- /.container-fluid -->
</section><!-- /.content -->

@push('scripts')
<script src="{{asset('js/cep.js')}}"></script>
<script>
    $(document).ready(function () {
        $('#cnpj').inputmask('99.999.999/9999-99');
        $('#cep').inputmask('99999-999');
        $('#telefone1').inputmask('(99) 9999-9999');
        $('#telefone2').inputmask('(99) 99999-9999');

        $('[name=enviar]').attr('disabled', false);

        $('#cep').val('13600-000');
      $('#cep').blur();
    });
</script>
<script>
    function checkForm(form) {
        form.enviar.disabled = true;
        form.enviar.text = 'Enviando...Aguarde!';
        return true;
    }
</script>
@endpush
@endsection