<div>
    @component('common.breadcrumb', ['addBtn' => false, 'permission_create' => 'Company_register_users_index', 'breadcrumb_show' => $breadcrumb_show])
        @slot('breadcrumb_title')
            <h3>{{ $componentName }} | {{ $pageTitle }}</h3>
        @endslot
        <li class="breadcrumb-item">{{ $componentName }}</li>
        <li class="breadcrumb-item active">{{ $pageTitle }}</li>

    @endcomponent

    @include('common.searchbox')
    <div class="container-fluid">
        <div class="card">
            <div class="card-body">
                <div class="card-header">
                    <h4>{{ $company_name }} | Plan: <b>{{ $company_plan_name }}</b></h4>
                </div>
                <div class="row layout-top-spacing">
                    <div class="col-sm-12 col-md-6">
                        <div class="form-group">
                            <label for="">Nombre Empresa</label>
                            <input type="text" wire:model.lazy="name" class="form-control" placeholder="ej: Alira" maxlength="99">
                            @error('name')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <div class="form-group">
                            <label>NIT</label>
                            <input type="text" wire:model.lazy="nit" class="form-control" placeholder="ej: 123-456-789-1" maxlength="15">
                            @error('nit')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <div class="form-group">
                            <label>Email</label>
                            <input type="email" wire:model.lazy="email" class="form-control" placeholder="ej: info@empresa.com" maxlength="99">
                            @error('email')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <div class="form-group">
                            <label>Dirección</label>
                            <input type="text" wire:model.lazy="address" class="form-control" placeholder="ej: Carrera 2 #15 - 80" maxlength="99">
                            @error('address')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-sm-6 col-md-6">
                        <div class="mb-3">

                            <div class="mb-3">
                                <label class="form-label">Departamento</label>
                                <select class="form-control btn-square form-select" wire:model.lazy="selectedState" name="selectedState">
                                    <option value="Seleccionar" selected>Seleccionar</option>
                                    @foreach ($states as $state)
                                        <option value="{{ $state->code }}">{{ $state->name }}</option>
                                    @endforeach
                                </select>
                                @error('selectedState')
                                    <span class="text-danger er">{{ $message }}</span>
                                @enderror

                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6 col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Ciudad</label>
                                <select class="form-control btn-square form-select" wire:model.lazy="city" name="city" >
                                    <option value="Seleccionar">Seleccionar</option>
                                    @if (!is_null($selectedState))
                                        @foreach ($cities as $city)
                                            <option value="{{ $city->code }}">{{ $city->name }}</option>
                                        @endforeach
                                    @endif
                                </select>
                                @error('city_residence')
                                    <span class="text-danger er">{{ $message }}</span>
                                @enderror
                            </div>
                    </div>
                    <div class="col-sm-12 col-md-4">
                        <div class="form-group">
                            <label>Teléfono</label>
                            <input type="text" wire:model.lazy="phone" class="form-control" placeholder="ej: 3202568745"
                                maxlength="15">
                            @error('phone')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-4">
                        <div class="form-group">
                            <label>Logo</label>
                            <small class="text-muted">(Formatos: .jpg | .png )</small>
                            <input type="file" wire:model="image" class="form-control" accept=".png, .jpg">
                            @error('image')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-4 d-flex align-items-center justify-content-center">
                            <img src="{{ asset('storage/companies/'.$image_view) }}?{{rand()}}" alt="logo" class="img-fluid" style="max-width: 100px;">
                    </div>
                    <div class="col-sm-12 col-md-12">
                        <hr class="mb-2">
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <div class="form-group">
                            <label>Nombre del Representante Legal</label>
                            <input type="text" wire:model.lazy="legal_representative" class="form-control" placeholder="ej: Pedro Perez" maxlength="100">
                            @error('legal_representative')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <div class="form-group">
                            <label class="form-label">Tipo documento</label>
                                <select class="form-control form-select" wire:model.lazy="document_type_representative" name="document_type_representative">
                                    <option value="Seleccionar">Seleccionar</option>
                                    @foreach (DataTypeDocument() as $key => $value)
                                        <option value="{{ $key }}">{{ $value }}</option>
                                    @endforeach
                                </select>
                                @error('document_type_representative')
                                    <span class="text-danger er">{{ $message }}</span>
                                @enderror
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <div class="form-group">
                            <label>Documento</label>
                            <input type="text" wire:model.lazy="document_representative" id="document_representative" class="form-control" placeholder="ej: 123456789" maxlength="15">
                            @error('document_representative')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-6">
                        <div class="form-group">
                            <label>Lugar de Expedición </label>
                            <input type="text" wire:model.lazy="document_expedition_representative" class="form-control" placeholder="ej: Bogotá" maxlength="100">
                            @error('document_expedition_representative')
                                <span class="text-danger er">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>

                    <div class="col-sm-12 col-md-12">
                        <div class="form-group f-right mt-5">
                            <button type="button" class="btn btn-primary close-modal" wire:click.prevent="Update()">ACTUALIZAR DATOS</button>
                        </div>
                    </div>

                </div><!--row -->

            </div><!-- card-body -->
        </div><!-- card -->
    </div><!-- container-fluid -->
    @include('livewire.company.config.form-upload-signature')
</div>
@include('common.scriptsCompStandar')
<script>
    document.addEventListener('DOMContentLoaded', function() {
        window.livewire.on('show-modal-upload-signature', msg => {
            $('#modal-upload-signature').modal('show')
        });
        window.livewire.on('hide-modal-upload-signature', msg => {
            $('#modal-upload-signature').modal('hide')
        });
        window.livewire.on('item-updated-upload-signature', msg => {
            noty(msg);
            $('#modal-upload-signature').modal('hide')
        });

    });
</script>
