Mostrar reservations
This commit is contained in:
Juan Pablo Vial
@ -3,6 +3,11 @@ use Incoviba\Controller\API\Ventas\Reservations;
|
|||||||
|
|
||||||
$app->group('/reservations', function($app) {
|
$app->group('/reservations', function($app) {
|
||||||
$app->post('/add[/]', [Reservations::class, 'add']);
|
$app->post('/add[/]', [Reservations::class, 'add']);
|
||||||
|
$app->group('/project/{project_id}', function($app) {
|
||||||
|
$app->get('/active[/]', [Reservations::class, 'active']);
|
||||||
|
$app->get('/pending[/]', [Reservations::class, 'pending']);
|
||||||
|
$app->get('/rejected[/]', [Reservations::class, 'rejected']);
|
||||||
|
});
|
||||||
$app->get('[/]', Reservations::class);
|
$app->get('[/]', Reservations::class);
|
||||||
});
|
});
|
||||||
$app->group('/reservation/{reservation_id}', function($app) {
|
$app->group('/reservation/{reservation_id}', function($app) {
|
||||||
|
|||||||
@ -25,70 +25,73 @@
|
|||||||
@endif
|
@endif
|
||||||
</div>
|
</div>
|
||||||
<h3 class="ui header" id="project"></h3>
|
<h3 class="ui header" id="project"></h3>
|
||||||
<div class="ui right aligned top attached basic segment" id="controls">
|
<div class="ui active inline loader" id="loader"></div>
|
||||||
<div class="ui tiny icon buttons">
|
<div id="results">
|
||||||
<button class="ui button" id="up_button">
|
<div class="ui right aligned top attached basic segment" id="controls">
|
||||||
<i class="up arrow icon"></i>
|
<div class="ui tiny icon buttons">
|
||||||
</button>
|
<button class="ui button" id="up_button">
|
||||||
<button class="ui button" id="refresh_button">
|
<i class="up arrow icon"></i>
|
||||||
<i class="refresh icon"></i>
|
</button>
|
||||||
</button>
|
<button class="ui button" id="refresh_button">
|
||||||
<button class="ui green icon button" id="add_button">
|
<i class="refresh icon"></i>
|
||||||
<i class="plus icon"></i>
|
</button>
|
||||||
</button>
|
<button class="ui green icon button" id="add_button">
|
||||||
|
<i class="plus icon"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ui top attached tabular menu" id="tabs">
|
||||||
|
<div class="yellow active item" data-tab="pending">Pendientes</div>
|
||||||
|
<div class="green item" data-tab="active">Activas</div>
|
||||||
|
<div class="red item" data-tab="rejected">Rechazadas</div>
|
||||||
|
</div>
|
||||||
|
<div class="ui bottom attached tab fitted segment active" data-tab="pending">
|
||||||
|
<table class="ui yellow striped table" id="pending_reservations">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Unidades</th>
|
||||||
|
<th>Cliente</th>
|
||||||
|
<th>Fecha</th>
|
||||||
|
<th>Oferta</th>
|
||||||
|
<th>¿Valida?</th>
|
||||||
|
<th>Operador</th>
|
||||||
|
<th></th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="ui bottom attached tab fitted segment" data-tab="active">
|
||||||
|
<table class="ui green striped table" id="active_reservations">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Unidades</th>
|
||||||
|
<th>Cliente</th>
|
||||||
|
<th>Fecha</th>
|
||||||
|
<th>Oferta</th>
|
||||||
|
<th>Operador</th>
|
||||||
|
<th></th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="ui bottom attached tab fitted segment" data-tab="rejected">
|
||||||
|
<table class="ui red striped table" id="rejected_reservations">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Unidades</th>
|
||||||
|
<th>Cliente</th>
|
||||||
|
<th>Fecha</th>
|
||||||
|
<th>Oferta</th>
|
||||||
|
<th>Estado</th>
|
||||||
|
<th>Operador</th>
|
||||||
|
<th>Comentarios</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="ui top attached tabular menu" id="tabs">
|
|
||||||
<div class="yellow active item" data-tab="pending">Pendientes</div>
|
|
||||||
<div class="green item" data-tab="active">Activas</div>
|
|
||||||
<div class="red item" data-tab="rejected">Rechazadas</div>
|
|
||||||
</div>
|
|
||||||
<div class="ui bottom attached tab fitted segment active" data-tab="pending">
|
|
||||||
<table class="ui yellow striped table" id="pending_reservations">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Unidades</th>
|
|
||||||
<th>Cliente</th>
|
|
||||||
<th>Fecha</th>
|
|
||||||
<th>Oferta</th>
|
|
||||||
<th>¿Valida?</th>
|
|
||||||
<th>Operador</th>
|
|
||||||
<th></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody></tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<div class="ui bottom attached tab fitted segment" data-tab="active">
|
|
||||||
<table class="ui green striped table" id="active_reservations">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Unidades</th>
|
|
||||||
<th>Cliente</th>
|
|
||||||
<th>Fecha</th>
|
|
||||||
<th>Oferta</th>
|
|
||||||
<th>Operador</th>
|
|
||||||
<th></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody></tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
<div class="ui bottom attached tab fitted segment" data-tab="rejected">
|
|
||||||
<table class="ui red striped table" id="rejected_reservations">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>Unidades</th>
|
|
||||||
<th>Cliente</th>
|
|
||||||
<th>Fecha</th>
|
|
||||||
<th>Oferta</th>
|
|
||||||
<th>Estado</th>
|
|
||||||
<th>Operador</th>
|
|
||||||
<th>Comentarios</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody></tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@endsection
|
@endsection
|
||||||
@ -131,6 +134,8 @@
|
|||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
|
|
||||||
const project_id = event.currentTarget.dataset.id
|
const project_id = event.currentTarget.dataset.id
|
||||||
|
reservations.show().results()
|
||||||
|
|
||||||
if (project_id === this.current_project) {
|
if (project_id === this.current_project) {
|
||||||
this.hide()
|
this.hide()
|
||||||
this.title_component.innerHTML = event.currentTarget.innerHTML
|
this.title_component.innerHTML = event.currentTarget.innerHTML
|
||||||
@ -140,9 +145,10 @@
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
this.current_project = project_id
|
this.current_project = project_id
|
||||||
reservations.get().reservations(project_id)
|
|
||||||
|
|
||||||
|
reservations.get().reservations(project_id)
|
||||||
this.hide()
|
this.hide()
|
||||||
|
|
||||||
this.title_component.innerHTML = event.currentTarget.innerHTML
|
this.title_component.innerHTML = event.currentTarget.innerHTML
|
||||||
}
|
}
|
||||||
watch() {
|
watch() {
|
||||||
@ -295,6 +301,16 @@
|
|||||||
</button>
|
</button>
|
||||||
</td>`
|
</td>`
|
||||||
}
|
}
|
||||||
|
empty() {
|
||||||
|
const tbody = this.component.querySelector('tbody')
|
||||||
|
tbody.innerHTML = ''
|
||||||
|
const col_span = this.columnNames.length + 1
|
||||||
|
const tr = document.createElement('tr')
|
||||||
|
tr.innerHTML = `<td colspan="${col_span}">No hay cierres</td>`
|
||||||
|
tbody.appendChild(tr)
|
||||||
|
|
||||||
|
this.show()
|
||||||
|
}
|
||||||
|
|
||||||
show() {
|
show() {
|
||||||
this.component.style.display = this.display.reservations
|
this.component.style.display = this.display.reservations
|
||||||
@ -352,6 +368,8 @@
|
|||||||
const reservations = {
|
const reservations = {
|
||||||
components: {
|
components: {
|
||||||
projects: null,
|
projects: null,
|
||||||
|
loader: null,
|
||||||
|
results: null,
|
||||||
controls: null,
|
controls: null,
|
||||||
reservations: {
|
reservations: {
|
||||||
active: null,
|
active: null,
|
||||||
@ -359,86 +377,74 @@
|
|||||||
rejected: null
|
rejected: null
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
display: {
|
||||||
|
loader: '',
|
||||||
|
results: '',
|
||||||
|
},
|
||||||
get() {
|
get() {
|
||||||
return {
|
return {
|
||||||
active: project_id => {
|
send: (project_id, url_segment, component) => {
|
||||||
const reservations = [
|
const url = `/api/ventas/reservations/project/${project_id}/${url_segment}`
|
||||||
{
|
return APIClient.fetch(url).then(response => response.json()).then(json => {
|
||||||
id: 1,
|
if (json.reservations.length === 0) {
|
||||||
summary: 'D1',
|
component.empty()
|
||||||
buyer: {
|
return
|
||||||
rut: '12345678-9',
|
|
||||||
nombreCompleto: 'Juan Perez'
|
|
||||||
},
|
|
||||||
fecha: '2021-01-01',
|
|
||||||
offer: 3000,
|
|
||||||
valid: true,
|
|
||||||
broker: {
|
|
||||||
name: 'Operador 1'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
]
|
component.set().reservations(json.reservations).draw()
|
||||||
this.components.reservations.active.set().reservations(reservations).draw()
|
})
|
||||||
|
},
|
||||||
|
active: project_id => {
|
||||||
|
return this.get().send(project_id, 'active', this.components.reservations.active)
|
||||||
|
/*const url = `/ventas/reservations/project/${project_id}/active`
|
||||||
|
return APIClient.fetch(url).then(json => {
|
||||||
|
if (json.reservations.length === 0) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.components.reservations.active.set().reservations(json.reservations).draw()
|
||||||
|
})*/
|
||||||
},
|
},
|
||||||
pending: project_id => {
|
pending: project_id => {
|
||||||
const reservations = [
|
return this.get().send(project_id, 'pending', this.components.reservations.pending)
|
||||||
{
|
/*const url = `/ventas/reservations/project/${project_id}/pending`
|
||||||
id: 2,
|
return APIClient.fetch(url).then(json => {
|
||||||
summary: 'D2',
|
if (json.reservations.length === 0) {
|
||||||
buyer: {
|
return
|
||||||
rut: '12345678-9',
|
|
||||||
nombreCompleto: 'Pedro Jimenez'
|
|
||||||
},
|
|
||||||
fecha: '2021-10-01',
|
|
||||||
offer: 1000,
|
|
||||||
valid: false,
|
|
||||||
broker: {
|
|
||||||
name: 'Operador 2'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
]
|
this.components.reservations.pending.set().reservations(json.reservations).draw()
|
||||||
this.components.reservations.pending.set().reservations(reservations).draw()
|
})*/
|
||||||
},
|
},
|
||||||
rejected: project_id => {
|
rejected: project_id => {
|
||||||
const reservations = [
|
return this.get().send(project_id, 'rejected', this.components.reservations.rejected)
|
||||||
{
|
/*const url = `/ventas/reservations/project/${project_id}/rejected`
|
||||||
id: 3,
|
return APIClient.fetch(url).then(json => {
|
||||||
summary: 'D3',
|
if (json.reservations.length === 0) {
|
||||||
buyer: {
|
return
|
||||||
rut: '12345678-9',
|
|
||||||
nombreCompleto: 'Fernando Dominguez'
|
|
||||||
},
|
|
||||||
fecha: '2021-01-10',
|
|
||||||
offer: 1000,
|
|
||||||
valid: false,
|
|
||||||
state: 'rechazado',
|
|
||||||
broker: {
|
|
||||||
name: 'Operador 3'
|
|
||||||
},
|
|
||||||
comments: ['Comentarios']
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
summary: 'D4',
|
|
||||||
buyer: {
|
|
||||||
rut: '12345678-9',
|
|
||||||
nombreCompleto: 'Domingo Gomez'
|
|
||||||
},
|
|
||||||
fecha: '2021-02-01',
|
|
||||||
offer: 1000,
|
|
||||||
valid: false,
|
|
||||||
state: 'abandonado',
|
|
||||||
broker: {
|
|
||||||
name: 'Operador 4'
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
]
|
this.components.reservations.rejected.set().reservations(json.reservations).draw()
|
||||||
this.components.reservations.rejected.set().reservations(reservations).draw()
|
})*/
|
||||||
},
|
},
|
||||||
reservations: project_id => {
|
reservations: project_id => {
|
||||||
this.get().active(project_id)
|
this.loading().show()
|
||||||
this.get().pending(project_id)
|
|
||||||
this.get().rejected(project_id)
|
const promises = []
|
||||||
|
|
||||||
|
promises.push(this.get().active(project_id))
|
||||||
|
promises.push(this.get().pending(project_id))
|
||||||
|
promises.push(this.get().rejected(project_id))
|
||||||
|
|
||||||
|
return Promise.any(promises).then(() => {
|
||||||
|
this.loading().hide()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
loading() {
|
||||||
|
return {
|
||||||
|
show: () => {
|
||||||
|
this.components.loader.style.display = this.display.loader
|
||||||
|
},
|
||||||
|
hide: () => {
|
||||||
|
this.components.loader.style.display = 'none'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -451,13 +457,13 @@
|
|||||||
this.components.reservations[key].reservations = []
|
this.components.reservations[key].reservations = []
|
||||||
this.components.reservations[key].hide()
|
this.components.reservations[key].hide()
|
||||||
})
|
})
|
||||||
this.components.projects.show()
|
this.show().projects()
|
||||||
return false
|
return false
|
||||||
},
|
},
|
||||||
up: event => {
|
up: event => {
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
Object.values(this.components.reservations).forEach(reservations => reservations.hide())
|
Object.values(this.components.reservations).forEach(reservations => reservations.hide())
|
||||||
this.components.projects.show()
|
this.show().projects()
|
||||||
return false
|
return false
|
||||||
},
|
},
|
||||||
add: event => {
|
add: event => {
|
||||||
@ -472,18 +478,37 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
show() {
|
||||||
|
return {
|
||||||
|
projects: () => {
|
||||||
|
this.components.projects.show()
|
||||||
|
this.components.results.style.display = 'none'
|
||||||
|
},
|
||||||
|
results: () => {
|
||||||
|
this.components.projects.hide()
|
||||||
|
this.components.results.style.display = this.display.results
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
setup(configuration) {
|
setup(configuration) {
|
||||||
const formatters = {
|
const formatters = {
|
||||||
date: new Intl.DateTimeFormat('es-CL', {year: 'numeric', month: 'long', day: 'numeric'}),
|
date: new Intl.DateTimeFormat('es-CL', {year: 'numeric', month: 'long', day: 'numeric'}),
|
||||||
ufs: new Intl.NumberFormat('es-CL', {minimumFractionDigits: 2, maximumFractionDigits: 2})
|
ufs: new Intl.NumberFormat('es-CL', {minimumFractionDigits: 2, maximumFractionDigits: 2})
|
||||||
}
|
}
|
||||||
|
this.components.loader = document.getElementById(configuration.ids.loader)
|
||||||
this.components.projects = new Projects({component_id: configuration.ids.projects, title_id: configuration.ids.project})
|
this.components.projects = new Projects({component_id: configuration.ids.projects, title_id: configuration.ids.project})
|
||||||
this.components.controls = new Controls({component_id: configuration.ids.controls})
|
this.components.controls = new Controls({component_id: configuration.ids.controls})
|
||||||
this.components.reservations.active = new ActiveReservations({component_id: configuration.ids.active, formatters})
|
this.components.reservations.active = new ActiveReservations({component_id: configuration.ids.active, formatters})
|
||||||
this.components.reservations.pending = new PendingReservations({component_id: configuration.ids.pending, formatters})
|
this.components.reservations.pending = new PendingReservations({component_id: configuration.ids.pending, formatters})
|
||||||
this.components.reservations.rejected = new RejectedReservations({component_id: configuration.ids.rejected, formatters})
|
this.components.reservations.rejected = new RejectedReservations({component_id: configuration.ids.rejected, formatters})
|
||||||
|
|
||||||
|
this.display.loader = this.components.loader.style.display
|
||||||
|
this.loading().hide()
|
||||||
|
|
||||||
$(`#${configuration.ids.tabs} .item`).tab()
|
$(`#${configuration.ids.tabs} .item`).tab()
|
||||||
|
this.components.results = document.getElementById(configuration.ids.results)
|
||||||
|
this.display.results = this.components.results.style.display
|
||||||
|
this.show().projects()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$(document).ready(() => {
|
$(document).ready(() => {
|
||||||
@ -491,6 +516,8 @@
|
|||||||
ids: {
|
ids: {
|
||||||
projects: 'projects',
|
projects: 'projects',
|
||||||
project: 'project',
|
project: 'project',
|
||||||
|
results: 'results',
|
||||||
|
loader: 'loader',
|
||||||
controls: 'controls',
|
controls: 'controls',
|
||||||
tabs: 'tabs',
|
tabs: 'tabs',
|
||||||
active: 'active_reservations',
|
active: 'active_reservations',
|
||||||
|
|||||||
Reference in New Issue
Block a user