Filling edit form

This commit is contained in:
Juan Pablo Vial
2025-11-12 19:49:08 -03:00
parent e278695137
commit 54969eeeab
6 changed files with 116 additions and 89 deletions

View File

@ -891,12 +891,16 @@
},
units: project_id => {
if (project_id in reservations.data.units) {
reservations.locks.units = null
return new Promise((resolve, reject) => {
resolve(reservations.data.units[project_id])
})
}
if (reservations.locks.units !== null) {
return reservations.locks.units
}
const uri = `/api/proyecto/${project_id}/unidades/disponibles`
return APIClient.fetch(uri).then(response => response.json()).then(json => {
reservations.locks.units = APIClient.fetch(uri).then(response => response.json()).then(json => {
if (json.unidades.length === 0) {
reservations.data.units[project_id] = {}
return reservations.data.units[project_id]
@ -914,6 +918,7 @@
return reservations.data.units[project_id]
})
return reservations.locks.units
},
},
loading: {

View File

@ -23,7 +23,6 @@
$modal: null,
form: null,
$date: null,
$rut: null,
rut: null,
digit: null,
$birthdate: null,
@ -90,7 +89,7 @@
this.get.brokers(project_id)
this.get.promotions(project_id).then(() => {
const promotions = reservations.data.promotions[project_id]
const promotions = structuredClone(reservations.data.promotions[project_id])
this.components.promotions.data.promotions = promotions.map(promotion => {
return {
text: promotion.description,
@ -101,7 +100,7 @@
this.components.promotions.draw.promotions()
})
this.get.units(project_id).then(() => {
const unitTypes = reservations.data.units[project_id]
const unitTypes = structuredClone(reservations.data.units[project_id])
Object.entries(unitTypes).map(([type, units]) => {
units = units.map(unit => {
return {
@ -142,24 +141,6 @@
this.components.$comuna.dropdown('set selected', this.data.current_user.direccion.comuna.id)
}
})
/*const uri = `/api/region/${region_id}/comunas`
return APIClient.fetch(uri).then(response => response.json()).then(json => {
if (json.comunas.length === 0) {
return
}
this.data.comunas[region_id] = json.comunas.map(comuna => {
return {
text: comuna.descripcion,
name: comuna.descripcion,
value: comuna.id
}
})
this.components.$comuna.dropdown('change values', this.data.comunas[region_id])
if (this.data.current_user !== null && this.data.current_user?.direccion?.comuna !== null) {
this.components.$comuna.dropdown('set selected', this.data.current_user.direccion.comuna.id)
}
})*/
},
brokers: project_id => {
if (project_id in this.data.brokers) {
@ -167,41 +148,10 @@
resolve(this.data.brokers[project_id])
})
}
return reservations.get.brokers(project_id).then(brokers => {
this.data.brokers[project_id] = brokers
return reservations.get.brokers(project_id).then(() => {
this.data.brokers[project_id] = reservations.data.brokers[project_id]
this.fill.brokers()
})
/*const uri = `/api/proyecto/${project_id}/brokers`
return APIClient.fetch(uri).then(response => response.json()).then(json => {
if (json.contracts.length === 0) {
return
}
const formatter = new Intl.NumberFormat('es-CL', { style: 'percent', minimumFractionDigits: 2 })
this.data.brokers[project_id] = json.contracts.map(contract => {
return {
id: contract.id,
broker_rut: contract.broker_rut,
commission: formatter.format(contract.commission),
name: '',
text: '',
}
})
const promises = []
json.contracts.forEach(contract => {
promises.push(this.get.broker(contract.broker_rut))
})
return Promise.all(promises).then(data => {
data.forEach(broker => {
if (!('rut' in broker)) {
return
}
const idx = this.data.brokers[project_id].findIndex(contract => contract.broker_rut === broker.rut)
this.data.brokers[project_id][idx].name = this.data.brokers[project_id][idx].text = `${broker.name} - ${this.data.brokers[project_id][idx].commission}`
})
this.fill.brokers()
})
})*/
},
broker: (broker_rut) => {
const uri = `/api/proyectos/broker/${broker_rut}`
@ -221,13 +171,6 @@
return reservations.get.promotions(project_id).then(promotions => {
this.data.promotions[project_id] = promotions
})
/*const uri = `/api/proyecto/${project_id}/promotions`
return APIClient.fetch(uri).then(response => response.json()).then(json => {
if (json.promotions.length === 0) {
return this.data.promotions[project_id] = []
}
return this.data.promotions[project_id] = json.promotions
})*/
},
units: project_id => {
if (project_id in this.data.units) {
@ -238,25 +181,6 @@
return reservations.get.units(project_id).then(units => {
this.data.units[project_id] = units
})
/*const uri = `/api/proyecto/${project_id}/unidades/disponibles`
return APIClient.fetch(uri).then(response => response.json()).then(json => {
if (json.unidades.length === 0) {
this.data.units[project_id] = {}
return this.data.units[project_id]
}
if (!(project_id in this.data.units)) {
this.data.units[project_id] = {}
}
json.unidades.forEach(unit => {
const type = unit.proyecto_tipo_unidad.tipo_unidad.descripcion
if (!(type in this.data.units[project_id])) {
this.data.units[project_id][type] = []
}
this.data.units[project_id][type].push(unit)
})
return this.data.units[project_id]
})*/
},
user: rut => {
if (this.data.current_user !== null && this.data.current_user?.rut === rut) {

View File

@ -77,6 +77,19 @@
this.hide.credit()
}
}
fill(formaPago) {
if ('pie' in formaPago && formaPago.pie !== null) {
this.components.pie.$checkbox.prop('checked', true)
//this.show.pie()
this.components.pie.value.value = formaPago.pie.valor
this.components.pie.installments.value = formaPago.pie.cuotas
}
if ('credito' in formaPago && formaPago.credito !== null) {
this.components.credit.$checkbox.prop('checked', true)
//this.show.credit()
this.components.credit.value.value = formaPago.credito.value
}
}
setup() {
this.components.pie.$checkbox = $(`#${this.ids.pie.checkbox}`)
this.components.pie.value = document.getElementById(this.ids.pie.value)

View File

@ -30,6 +30,7 @@
const idx = Math.max(this.data.selected.length, 0, Math.max(...this.data.selected) + 1)
this.data.selected.push(idx)
this.draw.promotions()
return idx
}
reset() {
this.data.selected = []
@ -86,6 +87,16 @@
})
}
}
async fill(promotions) {
if (reservations.locks.promotions !== null) {
await reservations.locks.promotions
}
promotions.forEach(promotion => {
const idx = this.add()
const dropdown = $(this.components.promotions.querySelector(`div.promotion[data-id="${idx}"]`).querySelector('div.dropdown'))
dropdown.dropdown('set selected', promotion.id)
})
}
setup() {
this.components.button = document.getElementById(this.ids.button)
this.components.promotions = document.getElementById(this.ids.elements)

View File

@ -113,17 +113,19 @@
].join('')
}
}
const type = unit.type.charAt(0).toUpperCase() + unit.type.slice(1)
return [
'<div class="fields">',
`<div class="fields unit" data-id="${unit.idx}">`,
'<div class="four wide field">',
`<label>${unit.type.charAt(0).toUpperCase() + unit.type.slice(1)}</label>`,
`<label>${type}</label>`,
`<div class="ui search selection dropdown ${this.prefix}_units">`,
`<input type="hidden" name="${this.prefix}_units[]" />`,
'<i class="dropdown icon"></i>',
`<div class="default text">${unit.type.charAt(0).toUpperCase() + unit.type.slice(1)}</div>`,
`<div class="default text">${type}</div>`,
'<div class="menu">',
this.data.types[unit.type].map(unit => {
return `<div class="item" data-value="${unit.value}">${unit.name}</div>`
this.data.types[unit.type].map(u => {
return `<div class="item" data-value="${u.value}">${u.name}</div>`
}).join(''),
'</div>',
'</div>',
@ -146,17 +148,31 @@
}
reset() {
this.data.units = []
this.components.units.innerHTML = ''
this.draw.units()
}
add(type) {
const idx = Math.max(this.data.units.length, 0, Math.max(...this.data.units.map(unit => unit.idx)) + 1)
this.data.units.push({idx, type})
this.draw.units()
return idx
}
remove(idx) {
this.data.units = this.data.units.filter(unit => unit.idx !== idx)
this.draw.units()
}
async fill(unitValues) {
if (reservations.locks.units !== null) {
await reservations.locks.units
}
unitValues.forEach(unitValue => {
const type = unitValue.unit.proyecto_tipo_unidad.tipo_unidad.descripcion
const idx = this.add(type)
const field = this.components.units.querySelector(`div.unit[data-id="${idx}"]`)
$(field.querySelector('div.dropdown.edit_units')).dropdown('set selected', unitValue.unit.id)
$(field.querySelector('div.input')).val(unitValue.value)
})
}
setup() {
this.components.buttons_holder = document.getElementById(this.ids.buttons_holder)
this.components.units = document.getElementById(this.ids.units)

View File

@ -26,11 +26,64 @@
}});
}
load({project_id, type, reservation_id}) {
super.load(project_id)
show({type, reservation_id}) {
const reservation = reservations.components.reservations[type].reservations.find(r => r.id === parseInt(reservation_id))
super.show()
this.fillReservation(reservation)
}
async fillReservation(reservation) {
console.debug(this.components, reservation)
this.components.form.querySelector('#edit_reservation_id').value = reservation.id
const date = new Date(reservation.date)
date.setDate(date.getDate() + 1)
this.components.$date.calendar('set date', date)
this.components.rut.querySelector('input[name="edit_buyer_rut"]').value = Rut.format(reservation.buyer.rut) || ''
this.components.digit.textContent = reservation.buyer.digito || ''
this.components.form.querySelector('[name="edit_buyer_name"]').value = reservation.buyer.nombres || ''
this.components.form.querySelector('[name="edit_buyer_last_name"]').value = reservation.buyer.apellidoPaterno || ''
this.components.form.querySelector('[name="edit_buyer_last_name2"]').value = reservation.buyer.apellidoMaterno || ''
if ('datos' in reservation.buyer && reservation.buyer.datos !== null) {
if ('direccion' in reservation.buyer.datos && reservation.buyer.datos.direccion !== null) {
this.components.form.querySelector('[name="edit_buyer_address_street"]').value = reservation.buyer.datos.direccion.calle
this.components.form.querySelector('[name="edit_buyer_address_number"]').value = reservation.buyer.datos.direccion.numero
this.components.form.querySelector('[name="edit_buyer_address_extra"]').value = reservation.buyer.datos.direccion.extra
this.components.$region.dropdown('set selected', reservation.buyer.datos.direccion.comuna.provincia.region.id)
const delay = ms => new Promise(resolve => setTimeout(resolve, ms))
const waitComuna = async () => {
await delay(500)
this.components.$comuna.dropdown('set selected', reservation.buyer.datos.direccion.comuna.id)
}
await waitComuna()
}
this.components.form.querySelector('[name="edit_buyer_phone"]').value = reservation.buyer.datos.telefono || ''
if ('email' in reservation.buyer.datos && reservation.buyer.datos.email.includes('@') && reservation.buyer.datos.email.length > 1) {
const parts = reservation.buyer.datos.email.split('@')
this.components.form.querySelector('[name="edit_buyer_email_name"]').value = parts[0]
this.components.form.querySelector('[name="edit_buyer_email_domain"]').value = parts[1]
}
this.components.form.querySelector('[name="edit_buyer_marital_status"]').value = reservation.buyer.datos.estadoCivil || ''
this.components.form.querySelector('[name="edit_buyer_profession"]').value = reservation.buyer.datos.ocupacion || ''
if ('fechaNacimiento' in reservation.buyer.datos) {
const birthdate = new Date(reservation.buyer.datos.fechaNacimiento)
birthdate.setDate(birthdate.getDate() + 1)
this.components.$birthdate.calendar('set date', birthdate)
}
}
if (reservation.broker !== null) {
if (reservations.locks.brokers === null) {
await reservations.locks.brokers
}
this.components.$broker.dropdown('set selected', reservation.broker.rut)
}
if (reservation.promotions.length > 0) {
this.components.promotions.fill(reservation.promotions)
}
if (reservation.units.length > 0) {
this.components.units.fill(reservation.units)
}
if ('formaPago' in reservation && reservation.formaPago !== null) {
this.components.payments.fill(reservation.formaPago)
}
}
edit() {}
setup() {
@ -46,6 +99,11 @@
this.edit()
return false
})
const idInput = document.createElement('input')
idInput.type = 'hidden'
idInput.id = 'edit_reservation_id'
idInput.name = 'edit_reservation_id'
this.components.form.appendChild(idInput)
}
}
</script>