Files
oficial/app/resources/views/inmobiliarias/proveedores/add_modal.blade.php
Juan Pablo Vial 187b6f6f05 Edit Proveedores
2024-12-03 17:35:29 -03:00

139 lines
7.1 KiB
PHP

<div class="ui modal" id="add_modal">
<div class="header">Agregar Proveedor</div>
<div class="content">
<form class="ui form" id="add_form">
<div class="three wide field">
<label for="rut">RUT</label>
<div class="ui right labeled input">
<input class="right aligned" type="text" id="rut" name="rut" placeholder="RUT" maxlength="10"
required/>
<div class="ui basic label">-<span id="dv"></span></div>
</div>
</div>
<div class="five wide field">
<label for="nombre">Nombre</label>
<input type="text" id="nombre" name="nombre" placeholder="Nombre" required/>
</div>
<div class="field">
<label for="razon">Razón Social</label>
<input type="text" id="razon" name="razon" placeholder="Razón Social" required/>
</div>
<div class="ui divider">Contacto</div>
<div class="three wide field">
<label for="rut_contacto">RUT</label>
<div class="ui right labeled input">
<input type="text" id="rut_contacto" name="rut_contacto" placeholder="RUT" maxlength="10"
required/>
<div class="ui basic label">-<span id="dv_contacto"></span></div>
</div>
</div>
<div class="fields">
<div class="five wide field">
<label for="nombre_contacto">Nombre</label>
<input type="text" id="nombre_contacto" name="nombre_contacto" placeholder="Nombre" required/>
</div>
<div class="field">
<label for="apellido_paterno_contacto">Apellido Paterno</label>
<input type="text" id="apellido_paterno_contacto" name="apellido_paterno_contacto"
placeholder="Apellido Paterno" required/>
</div>
<div class="field">
<label for="apellido_materno_contacto">Apellido Materno</label>
<input type="text" id="apellido_materno_contacto" name="apellido_materno_contacto"
placeholder="Apellido Materno"/>
</div>
</div>
<div class="field">
<label for="email_contacto">Email</label>
<input type="email" id="email_contacto" name="email_contacto" placeholder="Email"/>
</div>
<div class="field">
<label for="telefono_contacto">Teléfono</label>
<div class="ui left labeled input">
<div class="ui basic label">+56</div>
<input type="text" id="telefono_contacto" name="telefono_contacto" placeholder="Teléfono"/>
</div>
</div>
</form>
</div>
<div class="actions">
<button class="ui green approve button">Guardar</button>
</div>
</div>
@push('page_scripts')
<script>
class AddModal {
props
constructor(props, formatters) {
this.props = props
this.setup(formatters)
}
show() {
$(this.props.modal).modal('show')
}
add() {
const form = document.getElementById(this.props.form)
const data = {
rut: form.querySelector(this.props.rut).value.replace(/\D/g, ''),
digito: form.querySelector(this.props.digito).textContent,
nombre: form.querySelector(this.props.nombre).value,
razon: form.querySelector(this.props.razon).value,
contacto: {
rut: form.querySelector(this.props.contacto.rut).value.replace(/\D/g, ''),
digito: form.querySelector(this.props.contacto.digito).textContent,
nombres: form.querySelector(this.props.contacto.nombres).value,
apellido_paterno: form.querySelector(this.props.contacto.apellido_paterno).value,
apellido_materno: form.querySelector(this.props.contacto.apellido_materno).value,
email: form.querySelector(this.props.contacto.email).value,
telefono: form.querySelector(this.props.contacto.telefono).value.replace(/\D/g, ''),
}
}
const body = new FormData()
body.append('proveedores[]', JSON.stringify(data))
const url = '{{$urls->api}}/inmobiliarias/proveedores/add'
const method = 'post'
APIClient.fetch(url, {method, body})
.then(response => (response) ? response.json() : null)
.then(data => {
if (data.success.filter(s => s).length > 0) {
window.location.reload()
}
})
}
setup(formatters) {
$(this.props.modal).modal({
onApprove: () => {
this.add()
}
})
const form = document.getElementById(this.props.form)
form.querySelector(this.props.rut).addEventListener('input', (e) => {
e.currentTarget.value = formatters.rut(e.currentTarget.value)
form.querySelector(this.props.digito).textContent = Rut.digitoVerificador(e.currentTarget.value)
})
if (form.querySelector(this.props.rut).value.length > 0) {
form.querySelector(this.props.rut).value = formatters.rut(form.querySelector(this.props.rut).value)
form.querySelector(this.props.digito).textContent = Rut.digitoVerificador(form.querySelector(this.props.rut).value)
}
form.querySelector(this.props.contacto.rut).addEventListener('input', (e) => {
e.currentTarget.value = formatters.rut(e.currentTarget.value)
form.querySelector(this.props.contacto.digito).textContent = Rut.digitoVerificador(e.currentTarget.value)
})
if (form.querySelector(this.props.contacto.rut).value.length > 0) {
form.querySelector(this.props.contacto.rut).value = formatters.rut(form.querySelector(this.props.contacto.rut).value)
form.querySelector(this.props.contacto.digito).textContent = Rut.digitoVerificador(form.querySelector(this.props.contacto.rut).value)
}
form.querySelector(this.props.contacto.telefono).addEventListener('input', (e) => {
e.currentTarget.value = formatters.telefono(e.currentTarget.value)
})
if (form.querySelector(this.props.contacto.telefono).value.length > 0) {
form.querySelector(this.props.contacto.telefono).value = formatters.telefono(form.querySelector(this.props.contacto.telefono).value)
}
}
}
</script>
@endpush