Incoviba/oficial
1
0
Fork 0
Code Issues Pull Requests 2 Releases Wiki Activity

Agregar Proveedor

Browse Source
This commit is contained in:
Juan Pablo Vial
2024-12-03 16:45:20 -03:00
parent 5b44260245
commit 42e1dcdff7
19 changed files with 473 additions and 283 deletions
Download Patch File Download Diff File Expand all files Collapse all files

214
app/resources/views/inmobiliarias/proveedores.blade.php
View File

@ -8,7 +8,7 @@
<th>Nombre</th>
<th>Contacto</th>
<th class="right aligned">
<button class="ui green icon button" id="add_button">
<button class="ui tertiary green icon button" id="add_button">
<i class="plus icon"></i>
</button>
</th>
@ -20,10 +20,10 @@
<td>{{$proveedor->nombre}}</td>
<td>{{$proveedor->contacto->nombreCompleto()}}</td>
<td class="right aligned">
<button class="ui icon button" data-sociedad="{{$proveedor->rut}}">
<button class="ui tertiary icon button" data-proveedor="{{$proveedor->rut}}">
<i class="edit icon"></i>
</button>
<button class="ui red icon button" data-sociedad="{{$proveedor->rut}}">
<button class="ui tertiary red icon button" data-proveedor="{{$proveedor->rut}}">
<i class="remove icon"></i>
</button>
</td>
@ -32,74 +32,16 @@
</tbody>
</table>
</div>
<div class="ui modal" id="add_modal">
<div class="content">
<form class="ui 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>
@include('inmobiliarias.proveedores.add_modal')
@endsection
@include('layout.body.scripts.rut')
@push('page_scripts')
<script>
const proveedores = {
ids: {
modal: '',
buttons: {
add: '',
edit: '',
@ -111,7 +53,6 @@
dv: '',
nombre: '',
razon: '',
tipo: '',
contacto: {
rut: '',
dv: '',
@ -125,69 +66,18 @@
proveedores: ''
},
data: JSON.parse('{!! json_encode($proveedores) !!}'),
add() {
return {
sociedad: () => {
const data = {
rut: $(this.ids.add.rut).val().replace(/\D/g, ''),
digito: $(this.ids.add.dv).text(),
nombre: $(this.ids.add.nombre).val(),
razon: $(this.ids.add.razon).val(),
tipo_sociedad_id: $(this.ids.add.tipo).dropdown('get value'),
contacto: {
rut: $(this.ids.add.contacto.rut).val().replace(/\D/g, ''),
digito: $(this.ids.add.contacto.dv).text(),
nombres: $(this.ids.add.contacto.nombre).val(),
apellido_paterno: $(this.ids.add.contacto.apellido_paterno).val(),
apellido_materno: $(this.ids.add.contacto.apellido_materno).val(),
email: $(this.ids.add.contacto.email).val(),
telefono: $(this.ids.add.contacto.telefono).val().replace(/\D/g, ''),
}
}
const body = new FormData()
body.append('sociedades[]', JSON.stringify(data))
const url = '{{$urls->api}}/sociedades/add'
const method = 'post'
fetchAPI(url, {method, body})
.then(response => (response) ? response.json() : null)
.then(data => {
if (data.sociedades !== null) {
data.sociedades.forEach(sociedad => {
const exists = this.data.find(s => s.rut === sociedad.rut)
if (typeof exists !== 'undefined') {
return
}
this.data.push(sociedad)
})
this.draw().sociedades()
$(this.ids.modal).find('form.form').trigger('reset')
}
})
}
}
},
edit() {
},
remove() {
return {
sociedad: rut => {
const body = new FormData()
body.append('sociedades_ruts[]', rut)
const url = '{{$urls->api}}/sociedades/delete'
const method = 'post'
fetchAPI(url, {method, body})
proveedor: rut => {
const url = `{{$urls->api}}/inmobiliarias/proveedor/${rut}/delete`
const method = 'delete'
APIClient.fetch(url, {method})
.then(response => (response) ? response.json() : null)
.then(data => {
if (data.sociedades !== null) {
data.sociedades.forEach(sociedad => {
if (sociedad.sociedad.rut !== rut) {
return
}
if (!sociedad.deleted) {
return
}
$(this.ids.proveedores).find(`button[data-sociedad="${rut}"]`).closest('tr').remove()
})
if (data.success) {
window.location.reload()
}
})
@ -196,18 +86,18 @@
},
draw() {
return {
sociedades: () => {
proveedores: () => {
$(this.ids.proveedores).empty()
this.data.forEach(sociedad => {
this.data.forEach(proveedor => {
$(this.ids.proveedores).append(`
<tr>
<td>${sociedad.nombre}</td>
<td>${sociedad.contacto.nombreCompleto}</td>
<td>${proveedor.nombre}</td>
<td>${proveedor.contacto.nombreCompleto}</td>
<td class="right aligned">
<button class="ui icon button" data-sociedad="${sociedad.rut}">
<button class="ui icon button" data-proveedor="${proveedor.rut}">
<i class="edit icon"></i>
</button>
<button class="ui red icon button" data-sociedad="${sociedad.rut}">
<button class="ui red icon button" data-proveedor="${proveedor.rut}">
<i class="remove icon"></i>
</button>
</td>
@ -215,7 +105,7 @@
`)
})
$(this.ids.buttons.remove).click((e) => {
this.remove().sociedad($(e.target).data('sociedad'))
this.remove().proveedor($(e.target).data('proveedor'))
})
}
}
@ -223,11 +113,7 @@
formatters() {
return {
rut: value => {
const rut = value.replace(/[^0-9]/g, '')
if (rut.length <= 1) {
return rut
}
return rut.replace(/\B(?=(\d{3})+(?!\d))/g, '.')
return Rut.format(value)
},
telefono: value => {
const phone = value.replace(/[^0-9]/g, '')
@ -238,77 +124,35 @@
}
}
},
digitoVerificador(value) {
let rut = value.replace(/[^0-9kK]/g, '')
if (rut.length < 1) {
return ''
}
let suma = 0
let mul = 2
for (let i = rut.length - 1; i >= 0; i--) {
suma += parseInt(rut[i]) * mul
mul = (mul + 1) % 8 || 2
}
const dv = 11 - suma % 11
return dv === 10 ? 'K' : (dv === 11 ? '0' : dv.toString())
},
setup(ids) {
this.ids = ids
const addModal = new AddModal(this.ids.add, this.formatters())
$(this.ids.buttons.add).click(() => {
$(this.ids.modal).modal('show')
})
$(this.ids.add.rut).on('input', (e) => {
e.target.value = this.formatters().rut(e.target.value)
$(this.ids.add.dv).text(this.digitoVerificador(e.target.value))
})
if ($(this.ids.add.rut).val().length > 0) {
$(this.ids.add.rut).val(this.formatters().rut($(this.ids.add.rut).val()))
$(this.ids.add.dv).text(this.digitoVerificador($(this.ids.add.rut).val()))
}
$(this.ids.tipo).dropdown()
$(this.ids.add.contacto.rut).on('input', (e) => {
e.target.value = this.formatters().rut(e.target.value)
$(this.ids.add.contacto.dv).text(this.digitoVerificador(e.target.value))
})
if ($(this.ids.add.contacto.rut).val().length > 0) {
$(this.ids.add.contacto.rut).val(this.formatters().rut($(this.ids.add.contacto.rut).val()))
$(this.ids.add.contacto.dv).text(this.digitoVerificador($(this.ids.add.contacto.rut).val()))
}
$(this.ids.add.contacto.telefono).on('input', (e) => {
e.target.value = this.formatters().telefono(e.target.value)
})
if ($(this.ids.add.contacto.telefono).val().length > 0) {
$(this.ids.add.contacto.telefono).val(this.formatters().telefono($(this.ids.add.contacto.telefono).val()))
}
$(this.ids.modal).modal({
onApprove: () => {
this.add().sociedad()
}
addModal.show()
})
$(this.ids.buttons.remove).click((e) => {
this.remove().sociedad($(e.target).data('sociedad'))
this.remove().proveedor(e.currentTarget.parentNode.dataset.proveedor)
})
}
}
$(document).ready(() => {
proveedores.setup({
modal: '#add_modal',
buttons: {
add: '#add_button',
edit: '.edit',
remove: '.remove'
},
add: {
form: '#add_modal form.form',
modal: '#add_modal',
form: 'add_form',
rut: '#rut',
dv: '#dv',
digito: '#dv',
nombre: '#nombre',
razon: '#razon',
tipo: '#tipo',
contacto: {
rut: '#rut_contacto',
dv: '#dv_contacto',
nombre: '#nombre_contacto',
digito: '#dv_contacto',
nombres: '#nombre_contacto',
apellido_paterno: '#apellido_paterno_contacto',
apellido_materno: '#apellido_materno_contacto',
email: '#email_contacto',

137
app/resources/views/inmobiliarias/proveedores/add_modal.blade.php Normal file
View File

@ -0,0 +1,137 @@
<div class="ui modal" id="add_modal">
<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