120 lines
5.4 KiB
PHP
120 lines
5.4 KiB
PHP
@extends('proyectos.brokers.base')
|
|
|
|
@section('brokers_content')
|
|
@include('proyectos.brokers.proyectos')
|
|
<div id="brokers"></div>
|
|
@endsection
|
|
|
|
@push('page_scripts')
|
|
<script>
|
|
const brokers = {
|
|
data: {
|
|
contracts: {},
|
|
project_id: null
|
|
},
|
|
formatters: {
|
|
date: new Intl.DateTimeFormat('es-CL', {dateStyle: 'medium'}),
|
|
percent: new Intl.NumberFormat('es-CL', {style: 'percent', minimumFractionDigits: 2, maximumFractionDigits: 2})
|
|
},
|
|
draw() {
|
|
return {
|
|
brokers: project_id => {
|
|
$('#projects').hide()
|
|
const div = document.getElementById('brokers')
|
|
const table = document.createElement('table')
|
|
table.classList.add('ui', 'table')
|
|
table.innerHTML = [
|
|
"<thead>",
|
|
"<tr>",
|
|
"<th>Operador</th>",
|
|
"<th>Comisión</th>",
|
|
"<th>Fecha Inicio</th>",
|
|
"<th class='right aligned'><button class='ui small tertiary green icon button' id='add_button'><i class='plus icon'></i></button></th>",
|
|
"</tr>",
|
|
"</thead>"].join('')
|
|
const tbody = document.createElement('tbody')
|
|
brokers.data.contracts[project_id].forEach(contract => {
|
|
const dateParts = contract.current.date.split('-')
|
|
const date = new Date([dateParts[0], parseInt(dateParts[1]) - 1, dateParts[2]].join('-'))
|
|
date.setMonth(date.getMonth() + 1)
|
|
tbody.insertAdjacentHTML('beforeend', [
|
|
"<tr>",
|
|
`<td>${contract.broker.name}</td>`,
|
|
`<td>${brokers.formatters.percent.format(contract.commission)}</td>`,
|
|
`<td>${brokers.formatters.date.format(date)}</td>`,
|
|
`<td class="right aligned"><button class="ui small tertiary red icon button remove_button" data-id="${contract.id}"><i class="remove icon"></i></button></td>`,
|
|
"</tr>"].join(''))
|
|
})
|
|
table.append(tbody)
|
|
div.innerHTML = ''
|
|
div.append(table)
|
|
$('#brokers').show()
|
|
|
|
}
|
|
}
|
|
},
|
|
get() {
|
|
return {
|
|
contracts: project_id => {
|
|
brokers.actions().startSpinner()
|
|
brokers.data.project_id = project_id
|
|
const url = `{{$urls->api}}/proyecto/${project_id}/brokers`
|
|
APIClient.fetch(url).then(response => {
|
|
if (!response.ok) {
|
|
return
|
|
}
|
|
return response.json().then(json => {
|
|
brokers.data.contracts[json.proyecto_id] = json.contracts
|
|
const promises = []
|
|
json.contracts.forEach(contract => {
|
|
promises.push(brokers.get().broker(contract.broker_rut).then(broker => {
|
|
brokers.data.contracts[json.proyecto_id].find(contract => contract.broker_rut === broker.rut).broker = broker
|
|
}))
|
|
})
|
|
Promise.all(promises).then(() => {
|
|
brokers.draw().brokers(json.proyecto_id)
|
|
})
|
|
})
|
|
}).finally(() => {
|
|
brokers.actions().stopSpinner()
|
|
})
|
|
},
|
|
broker: broker_rut => {
|
|
const url = `{{$urls->api}}/proyectos/broker/${broker_rut}`
|
|
return APIClient.fetch(url).then(response => {
|
|
if (!response.ok) {
|
|
return
|
|
}
|
|
return response.json().then(json => {
|
|
return json.broker
|
|
})
|
|
})
|
|
}
|
|
}
|
|
},
|
|
actions() {
|
|
return {
|
|
startSpinner: () => {
|
|
$('#refresh_button').addClass('loading')
|
|
},
|
|
stopSpinner: () => {
|
|
$('#refresh_button').removeClass('loading')
|
|
},
|
|
refresh: () => {
|
|
brokers.get().contracts(brokers.data.project_id)
|
|
},
|
|
up: () => {
|
|
$('#brokers').hide()
|
|
$('#projects').show()
|
|
brokers.data.project_id = null
|
|
document.getElementById('brokers').innerHTML = ''
|
|
}
|
|
}
|
|
}
|
|
}
|
|
$(document).ready(() => {
|
|
$('#brokers').hide()
|
|
})
|
|
</script>
|
|
@endpush
|