Files
oficial/app/resources/views/proyectos/brokers/contracts/show.blade.php
2025-04-24 19:23:39 -04:00

489 lines
25 KiB
PHP

@extends('proyectos.brokers.base')
@section('brokers_title')
{{ $contract->broker->name }} - {{ $contract->project->descripcion }}
@endsection
@section('brokers_header')
{{ $contract->broker->name }} - {{ $contract->project->descripcion }}
@endsection
@include('layout.body.scripts.stats')
@prepend('page_scripts')
<script>
class TableHandler {
commission
constructor(commission) {
this.commission = commission
}
draw() {}
prices(units) {
return units.map(unit => {
let price = unit.valor ?? (unit.precio?.valor ?? 0)
const broker = price / (1 - this.commission)
const promotions = unit.promotions?.map(promotion => {
if (promotion.type === 1) {
return {
name: promotion.description,
type: promotion.type,
amount: promotion.amount,
final: broker + promotion.amount
}
}
return {
name: promotion.description,
type: promotion.type,
amount: promotion.amount,
final: broker / (1 - promotion.amount)
}
}) ?? []
return {
id: unit.id,
base: price,
commission: this.commission,
broker,
promotions
}
})
}
}
class GroupedTableHandler extends TableHandler {
promotions = {
names: new Set(),
values: []
}
process() {
return {
prices: prices => {
let promotions = {}
prices.map(price => price.promotions).forEach(promotionArray => {
promotionArray.forEach(p => {
if (!Object.hasOwn(promotions, p.name)) {
promotions[p.name] = {
name: p.name,
type: p.type,
amount: [],
final: []
}
}
promotions[p.name].amount.push(p.amount)
promotions[p.name].final.push(p.final)
})
})
return promotions
},
promotions: () => {
return {
names: promotions => {
Object.keys(promotions).forEach(name => {
this.add().promotion().name(name)
})
},
values: ({promotions, formatters}) => {
const temp = Object.values(promotions)
if (temp.length > 0) {
const data = temp.map(p => {
return {
name: p.name,
type: p.type,
amount: {
min: Math.min(...p.amount),
max: Math.max(...p.amount),
desv: Stat.standardDeviation(p.amount),
mean: Stat.mean(p.amount)
},
final: {
min: Math.min(...p.final),
max: Math.max(...p.final),
desv: Stat.standardDeviation(p.final),
mean: Stat.mean(p.final)
}
}
})
this.add().promotion().values({promotions: data, formatters})
return
}
this.promotions.values.push([])
}
}
}
}
}
add() {
return {
promotion: () => {
return {
name: name => {
this.promotions.names.add(name)
},
values: ({promotions, formatters}) => {
this.promotions.values.push(promotions.map(promotion => {
const amount_tooltip = [
`Min: ${promotion.type === 1 ? 'UF ' + formatters.ufs.format(promotion.amount.min) : formatters.percent.format(promotion.amount.min)}`,
`Max: ${promotion.type === 1 ? 'UF ' + formatters.ufs.format(promotion.amount.max) : formatters.percent.format(promotion.amount.max)}`,
`Desv: ${promotion.type === 1 ? 'UF ' + formatters.ufs.format(promotion.amount.desv) : formatters.percent.format(promotion.amount.desv)}`
].join("\n").replaceAll(' ', '&nbsp;')
const final_tooltip = [
`Min: UF ${formatters.ufs.format(promotion.final.min)}`,
`Max: UF ${formatters.ufs.format(promotion.final.max)}`,
`Desv: UF ${formatters.ufs.format(promotion.final.desv)}`
].join("\n").replaceAll(' ', '&nbsp;')
return {
name: promotion.name,
value: [
`<td class="right aligned"><span data-tooltip="${amount_tooltip}" data-position="right center" data-variation="wide multiline">${promotion.type === 1 ? formatters.ufs.format(promotion.amount.mean) : formatters.percent.format(promotion.amount.mean)}</td>`,
`<td class="right aligned"><span data-tooltip="${final_tooltip}" data-position="right center" data-variation="wide multiline">UF ${formatters.ufs.format(promotion.final.mean)}</td></td>`,
].join("\n")
}
}))
}
}
}
}
}
build() {
return {
promotions: (table, tbody) => {
if (this.promotions.names.size > 0) {
const title = document.getElementById(this.ids.promotions)
title.innerHTML = this.promotions.names.size > 0 ? Array.from(this.promotions.names)[0] : ''
title.setAttribute('colspan', '2')
if (this.promotions.names.size > 1) {
const thead = table.querySelector('thead')
Array.from(this.promotions.names).slice(1).forEach(name => {
thead.insertAdjacentHTML('beforeend', `<th class="right aligned" style="text-decoration: overline" colspan="2">${name}</th>`)
})
}
const trs = tbody.querySelectorAll('tr')
this.promotions.values.forEach((row, i) => {
const tr = trs[i]
const td = tr.querySelector('td.promotions')
if (row.length === 0) {
td.setAttribute('colspan', 2 * this.promotions.names.size)
return
}
td.remove()
this.promotions.names.forEach(name => {
const index = row.findIndex(r => r.name === name)
if (index === -1) {
tr.insertAdjacentHTML('beforeend', '<td colspan="2"></td>')
return
}
tr.insertAdjacentHTML('beforeend', row[index].value)
})
})
}
}
}
}
}
</script>
@endprepend
@section('brokers_content')
<div class="ui statistic">
<div class="value">{{ $format->percent($contract->commission, 2, true) }}</div>
<div class="label">
Comisión desde {{ $contract->current()->date->format('d/m/Y') }}
</div>
</div>
<br />
<div class="ui card">
<div class="content">
<div class="header">
Promociones Aplicadas
</div>
<div class="description">
@if (count($contract->promotions()) === 0)
- Ninguna
@else
<div class="ui list">
@foreach ($contract->promotions() as $promotion)
<div class="item">
{{ $promotion->description }} {{ $format->percent($promotion->amount, 2, true) }} {{ ucwords($promotion->type->name()) }}
</div>
@endforeach
</div>
@endif
</div>
</div>
</div>
<div class="ui very basic segment">
<div class="ui active inline loader" id="loader"></div>
<div class="ui indicating progress" id="load_progress">
<div class="bar">
<div class="progress"></div>
</div>
</div>
</div>
<div id="results">
<div class="ui top attached tabular menu">
<a class="item active" data-tab="tipos">Tipos</a>
<a class="item" data-tab="lineas">Líneas</a>
<a class="item" data-tab="unidades">Unidades</a>
</div>
<div class="ui top attached indicating progress" id="values_progress">
<div class="bar"></div>
</div>
<div class="ui bottom attached tab basic fitted segment active" data-tab="tipos">
@include('proyectos.brokers.contracts.show.tipo')
</div>
<div class="ui bottom attached tab basic fitted segment" data-tab="lineas">
@include('proyectos.brokers.contracts.show.linea')
</div>
<div class="ui bottom attached tab basic fitted segment" data-tab="unidades">
@include('proyectos.brokers.contracts.show.unidades')
</div>
</div>
@endsection
@include('layout.body.scripts.datatables')
@include('layout.body.scripts.datatables.searchbuilder')
@include('layout.body.scripts.datatables.buttons')
@push('page_scripts')
<script>
const units = {
ids: {
units: '',
loader: '',
progress: '',
load_progress: ''
},
data: {
project_id: {{ $contract->project->id }},
commission: {{ $contract->commission }},
units: []
},
formatters: {
ufs: new Intl.NumberFormat('es-CL', { style: 'decimal', minimumFractionDigits: 2, maximumFractionDigits: 2 }),
percent: new Intl.NumberFormat('es-CL', { style: 'percent', minimumFractionDigits: 2 })
},
handlers: {
tipo: null,
linea: null,
unit: null
},
get() {
return {
units: () => {
const url = `{{ $urls->api }}/proyecto/${units.data.project_id}/unidades`
return APIClient.fetch(url).then(response => response.json()).then(json => {
if (json.unidades.length === 0) {
console.error(json.errors)
return
}
units.data.units = []
Object.entries(json.unidades).forEach(([tipo, unidades]) => {
units.data.units = [...units.data.units, ...unidades]
})
})
},
promotions: progress_bar => {
const chunkSize = 100
const chunks = []
for (let i = 0; i < units.data.units.length; i += chunkSize) {
chunks.push(units.data.units.slice(i, i + chunkSize).map(u => u.id))
}
const promises = []
const url = `{{ $urls->api }}/proyectos/broker/{{ $contract->broker->rut }}/contract/{{ $contract->id }}/promotions`
const method = 'post'
chunks.forEach(chunk => {
const body = new FormData()
chunk.forEach(id => body.append('unidad_ids[]', id))
promises.push(APIClient.fetch(url, {method, body}).then(response => response.json()).then(json => {
progress_bar.progress('increment', json.input.unidad_ids.length)
if (json.unidades.length === 0) {
return
}
json.unidades.forEach(unidad => {
const idx = units.data.units.findIndex(u => u.id === parseInt(unidad.id))
units.data.units[idx].promotions = unidad.promotions
})
}))
})
return Promise.all(promises)
},
prices: progress_bar => {
/*const unsold = [...units.data.units.filter(unit => !unit.sold), ...units.data.units.filter(unit => unit.sold && unit.proyecto_tipo_unidad.tipo_unidad.descripcion !== 'departamento')]
const current_total = progress_bar.progress('get total')
progress_bar.progress('set total', current_total + unsold.length)*/
const chunkSize = 100
const chunks = []
for (let i = 0; i < units.data.units.length; i += chunkSize) {
chunks.push(units.data.units.slice(i, i + chunkSize).map(u => u.id))
}
const promises = []
const url = `{{ $urls->api }}/proyecto/{{ $contract->project->id }}/unidades/precios`
const method = 'post'
chunks.forEach(chunk => {
const body = new FormData()
chunk.forEach(id => body.append('unidad_ids[]', id))
promises.push(APIClient.fetch(url, {method, body}).then(response => response.json()).then(json => {
progress_bar.progress('increment', json.input.unidad_ids.length)
if (json.precios.length === 0) {
return
}
json.precios.forEach(unidad => {
const idx = units.data.units.findIndex(u => u.id === parseInt(unidad.id))
units.data.units[idx].precio = unidad.precio
})
}))
})
return Promise.all(promises)
},
values: progress_bar => {
const sold = units.data.units.filter(unit => unit.sold && unit.proyecto_tipo_unidad.tipo_unidad.descripcion === 'departamento')
progress_bar.progress('set total', sold.length)
const chunkSize = 10
const chunks = []
for (let i = 0; i < sold.length; i += chunkSize) {
chunks.push(sold.slice(i, i + chunkSize).map(u => u.id))
}
const promises = []
const url = `{{ $urls->api }}/ventas/by/unidades`
const method = 'post'
chunks.forEach(chunk => {
const body = new FormData()
chunk.forEach(id => body.append('unidad_ids[]', id))
promises.push(APIClient.fetch(url, {method, body}).then(response => response.json()).then(json => {
progress_bar.progress('increment', json.input.unidad_ids.length)
if (json.ventas.length === 0) {
return
}
json.ventas.forEach(({unidad_id, venta}) => {
const unidades = venta.propiedad.unidades
const otras_unidades = unidades.filter(unit => unit.id !== parseInt(unidad_id) && unit.proyecto_tipo_unidad.tipo_unidad.descripcion !== 'departamento')
const departamentos = unidades.filter(unit => unit.proyecto_tipo_unidad.tipo_unidad.descripcion === 'departamento' && unit.id !== parseInt(unidad_id))
const precios = otras_unidades.map(unit => {
const idx = units.data.units.findIndex(u => u.id === unit.id)
return units.data.units[idx].precio?.valor ?? 0
}).reduce((sum, precio) => sum + precio, 0)
if (departamentos.length === 0) {
const idx = units.data.units.findIndex(unit => unit.id === parseInt(unidad_id))
units.data.units[idx].valor = venta.valor - precios
units.data.units[idx].venta = venta
return
}
const sum_precios = departamentos.map(departamento => {
const idx = units.data.units.findIndex(unit => unit.id === departamento.id)
return units.data.units[idx].precio
}).reduce((sum, precio) => sum + precio, 0)
departamentos.forEach(departamento => {
const idx = units.data.units.findIndex(unit => unit.id === departamento.id)
const saldo = venta.valor - precios
units.data.units[idx].valor = saldo / sum_precios * departamento.precio
units.data.units[idx].venta = venta
})
})
}))
})
return Promise.all(promises)
},
sold: progress_bar => {
const chunkSize = 100
const chunks = []
for (let i = 0; i < units.data.units.length; i += chunkSize) {
chunks.push(units.data.units.slice(i, i + chunkSize).map(u => u.id))
}
const promises = []
const url = `{{ $urls->api }}/proyecto/{{ $contract->project->id }}/unidades/estados`
const method = 'post'
chunks.forEach(chunk => {
const body = new FormData()
chunk.forEach(id => body.append('unidad_ids[]', id))
promises.push(APIClient.fetch(url, {method, body}).then(response => response.json()).then(json => {
progress_bar.progress('increment', json.input.unidad_ids.length)
if (json.estados.length === 0) {
return
}
json.estados.forEach(unidad => {
const idx = units.data.units.findIndex(u => u.id === parseInt(unidad.id))
units.data.units[idx].sold = unidad.sold
})
}))
})
return Promise.all(promises)
},
}
},
draw() {
return {
units: () => {
units.handlers.units.draw({units: units.data.units, formatters: units.formatters})
},
tipos: () => {
units.handlers.tipo.draw({units: units.data.units, formatters: units.formatters})
},
lineas: () => {
units.handlers.lineas.draw({units: units.data.units, formatters: units.formatters})
}
}
},
setup(ids) {
units.ids = ids
units.handlers.tipo = new TipoTable(units.data.commission)
units.handlers.lineas = new LineasTable(units.data.commission)
units.handlers.units = new UnitsTable(units.data.commission)
$(`#${units.ids.results}`).find('.tabular.menu .item').tab({
onVisible: function(tabPath) {
if (tabPath !== 'unidades') {
return
}
$(this.querySelector('table')).DataTable().columns.adjust().draw()
this.querySelector('table').style.width = ''
}
})
document.getElementById(units.ids.results).style.visibility = 'hidden'
document.getElementById(units.ids.progress).style.visibility = 'hidden'
document.getElementById(units.ids.load_progress).style.visibility = 'hidden'
const loader = $(`#${units.ids.loader}`)
units.get().units().then(() => {
document.getElementById(units.ids.load_progress).style.visibility = 'visible'
const units_length = units.data.units.length
const progress_bar = $(`#${units.ids.load_progress}`)
progress_bar.progress({ total: units_length * 3 })
loader.hide()
units.get().promotions(progress_bar).then(() => {
units.get().sold(progress_bar).then(() => {
units.get().prices(progress_bar).then(() => {
document.getElementById(units.ids.results).style.visibility = 'visible'
loader.parent().remove()
units.draw().units()
units.draw().tipos()
units.draw().lineas()
document.getElementById(units.ids.progress).style.visibility = 'visible'
const progress_bar = $(`#${units.ids.progress}`)
progress_bar.progress()
units.get().values(progress_bar).then(() => {
document.getElementById(units.ids.progress).remove()
units.draw().units()
units.draw().tipos()
units.draw().lineas()
})
})
})
})
})
}
}
$(document).ready(function () {
units.setup({results: 'results', loader: 'loader', progress: 'values_progress', load_progress: 'load_progress'})
})
</script>
@endpush