115 lines
4.3 KiB
PHP
115 lines
4.3 KiB
PHP
<div class="ui modal" id="add_broker_modal">
|
|
<div class="header">
|
|
Agregar Operador
|
|
</div>
|
|
<div class="content">
|
|
<form class="ui form" id="add_broker_form">
|
|
<div class="fields">
|
|
<div class="field">
|
|
<label>RUT</label>
|
|
<div class="ui right labeled input">
|
|
<input type="text" name="rut" placeholder="RUT" maxlength="10" required />
|
|
<div class="ui basic label">-<span id="digit"></span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="fields">
|
|
<div class="field">
|
|
<label>Nombre</label>
|
|
<input type="text" name="name" placeholder="Nombre" required />
|
|
</div>
|
|
<div class="six wide field">
|
|
<label>Razón Social</label>
|
|
<input type="text" name="legal_name" placeholder="Razón Social" required />
|
|
</div>
|
|
</div>
|
|
<div class="fields">
|
|
<div class="field">
|
|
<label>Contacto</label>
|
|
<input type="text" name="contact" placeholder="Contacto" />
|
|
</div>
|
|
</div>
|
|
<div class="fields">
|
|
<div class="field">
|
|
<label>Correo</label>
|
|
<input type="email" name="email" placeholder="Correo" />
|
|
</div>
|
|
<div class="field">
|
|
<label>Teléfono</label>
|
|
<input type="text" name="phone" placeholder="Teléfono" />
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="actions">
|
|
<div class="ui deny button">
|
|
Cancelar
|
|
</div>
|
|
<div class="ui positive right labeled icon button">
|
|
Agregar
|
|
<i class="checkmark icon"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@include('layout.body.scripts.rut')
|
|
@push('page_scripts')
|
|
<script>
|
|
class AddModal {
|
|
ids
|
|
modal
|
|
handler
|
|
constructor(handler) {
|
|
this.handler = handler
|
|
this.ids = {
|
|
modal: 'add_broker_modal',
|
|
form: 'add_broker_form',
|
|
digit: 'digit'
|
|
}
|
|
this.modal = $(`#${this.ids.modal}`)
|
|
this.modal.modal({
|
|
onApprove: () => {
|
|
const form = document.getElementById(this.ids.form)
|
|
const data = {
|
|
rut: form.querySelector('[name="rut"]').value.replace(/\D/g, ''),
|
|
digit: Rut.digitoVerificador(form.querySelector('[name="rut"]').value),
|
|
name: form.querySelector('[name="name"]').value,
|
|
legal_name: form.querySelector('[name="legal_name"]').value,
|
|
contact: form.querySelector('[name="contact"]').value || '',
|
|
email: form.querySelector('[name="email"]').value || '',
|
|
phone: form.querySelector('[name="phone"]').value || ''
|
|
}
|
|
this.handler.execute().add(data)
|
|
}
|
|
})
|
|
this.modal.modal('hide')
|
|
const value = document.querySelector(`#${this.ids.form} input[name="rut"]`).value
|
|
this.update().digit(value)
|
|
this.watch().rut()
|
|
}
|
|
update() {
|
|
return {
|
|
digit: value => {
|
|
if (value.length > 3) {
|
|
document.getElementById(this.ids.digit).textContent = Rut.digitoVerificador(value)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
watch() {
|
|
return {
|
|
rut: () => {
|
|
document.querySelector(`#${this.ids.form} input[name="rut"]`).addEventListener('input', event => {
|
|
const value = event.currentTarget.value
|
|
this.update().digit(value)
|
|
})
|
|
}
|
|
}
|
|
}
|
|
show() {
|
|
this.modal.modal('show')
|
|
}
|
|
}
|
|
</script>
|
|
@endpush
|