Files
oficial/app/resources/views/proyectos/brokers/contracts/show/unidades.blade.php
2025-04-25 20:03:11 -04:00

255 lines
12 KiB
PHP

<table class="ui table" id="unidades">
<thead>
<tr>
<th>Estado</th>
<th>Tipo</th>
<th>Tipo Order</th>
<th class="right aligned">Unidad</th>
<th>Unidad Orden</th>
<th>Tipología</th>
<th>Piso</th>
<th>Orientación</th>
<th>m&#0178; Interior</th>
<th>m&#0178; Terraza</th>
<th>m&#0178; Vendibles</th>
<th>m&#0178; Total</th>
<th class="right aligned">Precio Base</th>
<th class="right aligned">Comisión</th>
<th class="right aligned">Precio Operador</th>
<th class="right aligned">UF/</th>
<th class="center aligned" id="unit_promotions">Promociones</th>
</tr>
</thead>
<tbody></tbody>
</table>
@push('page_scripts')
<script>
class UnitsTable extends TableHandler {
ids = {
units: 'unidades',
}
columns = [
'estado',
'tipo',
'tipo_order',
'unidad',
'unidad_order',
'tipologia',
'piso',
'orientacion',
'metros_interior',
'metros_terraza',
'metros',
'metros_total',
'precio_base',
'commission',
'precio_operador',
'UF/m²',
'promociones',
]
set = {
table: false,
titles: false
}
table
constructor(commission) {
super(commission)
}
setup() {
return {
titles: promotions_names => {
if (this.set.titles || promotions_names.size === 0) {
return
}
const nameArray = Array.from(promotions_names)
this.columns.pop()
this.columns.push(`${nameArray[0].toLowerCase().replaceAll(' ', '_')}.amount`)
this.columns.push(`${nameArray[0].toLowerCase().replaceAll(' ', '_')}.final`)
const table = document.getElementById(this.ids.units)
const thead = table.querySelector('thead')
const tr = thead.querySelector('tr')
const th = tr.querySelector('th#unit_promotions')
th.innerHTML = `${nameArray[0]}<br />Porcentaje`
tr.insertAdjacentHTML('beforeend', `<th class="right aligned">${nameArray[0]}<br />Precio Final</th>`)
if (promotions_names.size > 1) {
nameArray.slice(1).forEach(name => {
this.columns.push(`${name.toLowerCase().replaceAll(' ', '_')}.amount`)
this.columns.push(`${name.toLowerCase().replaceAll(' ', '_')}.final`)
tr.insertAdjacentHTML('beforeend', `<th class="right aligned">${name}<br />Porcentaje</th>`)
tr.insertAdjacentHTML('beforeend', `<th class="right aligned">${name}<br />Precio Final</th>`)
})
}
this.set.titles = true
},
table: () => {
if (typeof this.table !== 'undefined' || this.set.table) {
return
}
const dto = structuredClone(datatables_defaults)
dto.pageLength = 100
dto.columnDefs = [
{
target: ['tipo_order', 'unidad_order', 'tipologia', 'piso', 'orientacion', 'metros'].map(column => this.columns.indexOf(column)),
visible: false
},
{
target: ['tipo'].map(column => this.columns.indexOf(column)),
orderData: ['tipo_order'].map(column => this.columns.indexOf(column)),
},
{
target: ['unidad'].map(column => this.columns.indexOf(column)),
orderData: ['unidad_order'].map(column => this.columns.indexOf(column)),
},
{
target: ['unidad', 'precio_base', 'commission', 'precio_operador', 'UF/m²', 'porcentaje', 'precio_final']
.map(column => this.columns.indexOf(column)),
className: 'dt-right right aligned'
}
]
dto.order = ['tipo_order', 'unidad_order'].map(column => [this.columns.indexOf(column), 'asc'])
dto.language.searchBuilder = searchBuilder
const exportColumns = ['tipo', 'unidad', 'tipologia', 'piso', 'orientacion', 'metros_interior', 'metros_terraza', 'metros', 'metros_total', 'precio_operador', 'promociones']
if (typeof this.columns['promotions'] === 'undefined') {
exportColumns.pop()
this.columns.slice(this.columns.indexOf('UF/m²')+1).forEach(name => {
exportColumns.push(name)
})
}
dto.layout = {
top1Start: {
searchBuilder: {
columns: this.columns.filter(column => !['tipo_order', 'unidad_order'].includes(column))
.map(column => this.columns.indexOf(column)),
}
},
top1End: {
buttons: [
{
extend: 'excelHtml5',
className: 'green',
text: 'Exportar a Excel <i class="file excel icon"></i>',
title: 'Lista de Precios - {{ $contract->broker->name }} - {{ $contract->project->descripcion }} - {{ (new DateTime())->format('Y-m-d') }}',
download: 'open',
exportOptions: {
columns: exportColumns
.map(column => this.columns.indexOf(column)),
rows: (idx, data, node) => {
return data[this.columns.indexOf('estado')] === 'Libre'
},
format: {
body: (data, row, columnIdx, node) => {
if (typeof data === 'string' && data.includes('<span')) {
return data.replace(/<span.*>(.*)<\/span>/, '$1')
}
if (typeof data === 'string' && data.includes('UF ')) {
return data.replace('UF ', '').replaceAll('.', '').replaceAll(',', '.')
}
const formatColumns = ['metros', 'metros_interior', 'metros_terraza', 'metros_total']
if (this.set.titles) {
this.columns.filter(column => column.includes('.amount') || column.includes('.final')).forEach(name => {
formatColumns.push(name)
})
}
if (formatColumns.map(column => this.columns.indexOf(column)).includes(columnIdx)) {
return data.replaceAll('.', '').replaceAll(',', '.')
}
return data
}
}
},
}
]
}
}
this.table = $(`#${this.ids.units}`).DataTable(dto)
this.set.table = true
}
}
}
draw({units, formatters}) {
const prices = this.prices(units)
const promotions_names = new Set()
const tableData = []
units.forEach(unidad => {
const tipo = unidad.proyecto_tipo_unidad.tipo_unidad.descripcion
const price = prices.find(p => p.id === unidad.id)
let promotions = []
price.promotions.forEach(p => {
if (Object.hasOwn(promotions, p.name)) {
return
}
promotions[p.name] = {
name: p.name,
type: p.type,
amount: p.type === 1 ? 'UF ' + formatters.ufs.format(p.amount) : formatters.percent.format(p.amount),
final: `UF ${formatters.ufs.format(p.final)}`
}
})
Object.keys(promotions).forEach(name => {
promotions_names.add(name)
})
const temp = Object.values(promotions)
const data = [
unidad.sold ? `<span class="ui yellow text">Vendida</span>` : 'Libre',
tipo.charAt(0).toUpperCase() + tipo.slice(1),
unidad.proyecto_tipo_unidad.tipo_unidad.orden,
unidad.sold && unidad.venta ? `<a href="{{ $urls->base }}/venta/${unidad.venta?.id }" data-tooltip="Valor Promesa: UF ${formatters.ufs.format(unidad.venta?.valor ?? 0)}" data-position="left center">${unidad.descripcion}</a>` : unidad.descripcion,
unidad.descripcion.padStart(4, '0'),
unidad.proyecto_tipo_unidad.tipologia,
unidad.piso,
unidad.orientacion,
formatters.ufs.format(unidad.proyecto_tipo_unidad.util) ?? 0,
formatters.ufs.format(unidad.proyecto_tipo_unidad.terraza) ?? 0,
formatters.ufs.format(unidad.proyecto_tipo_unidad.vendible) ?? 0,
formatters.ufs.format(unidad.proyecto_tipo_unidad.superficie) ?? 0,
'UF ' + formatters.ufs.format(price.base ?? 0),
formatters.percent.format(price.commission ?? 0),
'UF ' + formatters.ufs.format(price.broker ?? 0),
formatters.ufs.format(price.broker / unidad.proyecto_tipo_unidad.vendible),
''
]
if (temp.length > 0) {
data.pop()
temp.forEach((p, i) => {
data.push(p.amount)
data.push(p.final)
})
} else {
if (promotions_names.size > 0) {
Array.from(promotions_names).forEach(name => {
data.push('')
data.push('')
})
}
}
tableData.push(data)
})
this.setup().titles(promotions_names)
this.setup().table()
const table = this.table
table.clear()
table.rows.add(tableData)
table.draw()
}
}
</script>
@endpush