Mostrar reservas
This commit is contained in:
Juan Pablo Vial
@ -1,5 +1,6 @@
|
||||
<?php
|
||||
use Incoviba\Controller\Ventas\Cierres;
|
||||
//use Incoviba\Controller\Ventas\Cierres;
|
||||
use Incoviba\Controller\Ventas\Reservations as Cierres;
|
||||
|
||||
$app->group('/cierres', function($app) {
|
||||
$app->get('[/]', Cierres::class);
|
||||
|
||||
287
app/resources/views/ventas/reservations.blade.php
Normal file
287
app/resources/views/ventas/reservations.blade.php
Normal file
@ -0,0 +1,287 @@
|
||||
@extends('layout.base')
|
||||
|
||||
@section('page_title')
|
||||
Cierres -Reservas
|
||||
@endsection
|
||||
|
||||
@section('page_content')
|
||||
<div class="ui container">
|
||||
<h2 class="ui header">Cierres - Reservas</h2>
|
||||
|
||||
<div class="ui compact segment" id="projects">
|
||||
<div class="ui header">Proyectos</div>
|
||||
@if (count($projects) == 0)
|
||||
<div class="ui message">
|
||||
No hay proyectos en venta.
|
||||
</div>
|
||||
@else
|
||||
<div class="ui link list">
|
||||
@foreach ($projects as $project)
|
||||
<div class="item link" data-id="{{ $project->id }}">
|
||||
{{ $project->descripcion }}
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<h4 class="ui header" id="project"></h4>
|
||||
<div class="ui right aligned top attached basic segment" id="controls">
|
||||
<div class="ui tiny icon buttons">
|
||||
<button class="ui button" id="up_button">
|
||||
<i class="up arrow icon"></i>
|
||||
</button>
|
||||
<button class="ui button" id="refresh_button">
|
||||
<i class="refresh icon"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<table class="ui striped table" id="reservations">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Unidades</th>
|
||||
<th>Cliente</th>
|
||||
<th>Fecha</th>
|
||||
<th>Oferta</th>
|
||||
<th>¿Valida?</th>
|
||||
<th>Operador</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>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
@endsection
|
||||
|
||||
@push('page_styles')
|
||||
<style>
|
||||
.item.link {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
||||
@endpush
|
||||
|
||||
@push('page_scripts')
|
||||
<script>
|
||||
class Projects {
|
||||
display = {
|
||||
projects: '',
|
||||
project: ''
|
||||
}
|
||||
component_id = ''
|
||||
component = null
|
||||
current_project = null;
|
||||
title_id = ''
|
||||
title_component = null
|
||||
|
||||
constructor({component_id, title_id}) {
|
||||
this.component_id = component_id
|
||||
this.component = document.getElementById(this.component_id)
|
||||
this.display.projects = this.component.style.display
|
||||
this.title_id = title_id
|
||||
this.title_component = document.getElementById(this.title_id)
|
||||
this.display.project = this.title_component.style.display
|
||||
|
||||
this.show()
|
||||
this.watch()
|
||||
}
|
||||
|
||||
select(event) {
|
||||
event.preventDefault()
|
||||
|
||||
const project_id = event.currentTarget.dataset.id
|
||||
if (project_id === this.curent_project) {
|
||||
this.hide()
|
||||
this.title_component.innerHTML = event.currentTarget.innerHTML
|
||||
|
||||
reservations.action().reservations()
|
||||
|
||||
return
|
||||
}
|
||||
this.curent_project = project_id
|
||||
reservations.get().reservations(project_id)
|
||||
|
||||
this.hide()
|
||||
this.title_component.innerHTML = event.currentTarget.innerHTML
|
||||
}
|
||||
watch() {
|
||||
this.component.querySelectorAll('.item.link').forEach(item => {
|
||||
item.addEventListener('click', this.select.bind(this))
|
||||
})
|
||||
}
|
||||
show() {
|
||||
this.component.style.display = this.display.projects
|
||||
this.title_component.style.display = 'none'
|
||||
}
|
||||
hide() {
|
||||
this.component.style.display = 'none'
|
||||
this.title_component.style.display = this.display.project
|
||||
}
|
||||
}
|
||||
class Reservations {
|
||||
display = {
|
||||
reservations: '',
|
||||
controls: ''
|
||||
}
|
||||
component_id = ''
|
||||
component = null
|
||||
controls_id = ''
|
||||
controls = null
|
||||
formatters = {
|
||||
date: null,
|
||||
ufs: null
|
||||
}
|
||||
|
||||
reservations = []
|
||||
|
||||
constructor({component_id, controls_id, formatters = {date, ufs}}) {
|
||||
this.component_id = component_id
|
||||
this.component = document.getElementById(this.component_id)
|
||||
this.display.reservations = this.component.style.display
|
||||
this.controls_id = controls_id
|
||||
this.controls = document.getElementById(this.controls_id)
|
||||
this.display.controls = this.controls.style.display
|
||||
this.formatters = formatters
|
||||
|
||||
this.watch()
|
||||
this.hide()
|
||||
}
|
||||
|
||||
watch() {
|
||||
const buttons = this.controls.querySelectorAll('button')
|
||||
const up_button = buttons[0]
|
||||
const reset_button = buttons[1]
|
||||
up_button.addEventListener('click', reservations.action().up.bind(reservations))
|
||||
reset_button.addEventListener('click', reservations.action().reset.bind(reservations))
|
||||
}
|
||||
|
||||
set() {
|
||||
return {
|
||||
reservations: reservations => {
|
||||
this.reservations = reservations
|
||||
return this
|
||||
}
|
||||
}
|
||||
}
|
||||
draw() {
|
||||
const tbody = this.component.querySelector('tbody')
|
||||
tbody.innerHTML = ''
|
||||
this.reservations.forEach(reservation => {
|
||||
const tr = document.createElement('tr')
|
||||
const date = new Date(Date.parse(reservation.fecha) + 24 * 60 * 60 * 1000)
|
||||
tr.innerHTML = `
|
||||
<td>${reservation.summary}</td>
|
||||
<td>${reservation.buyer.nombreCompleto}</td>
|
||||
<td>${this.formatters.date.format(date)}</td>
|
||||
<td>${this.formatters.ufs.format(reservation.offer)} UF</td>
|
||||
<td>${reservation.valid ? 'Si' : 'No'}</td>
|
||||
<td>${reservation.broker?.name ?? ''}</td>
|
||||
<td class="right aligned">
|
||||
<button class="ui small icon button" data-id="${reservation.id}">
|
||||
<i class="edit icon"></i>
|
||||
</button>
|
||||
<button class="ui small icon button" data-id="${reservation.id}">
|
||||
<i class="trash icon"></i>
|
||||
</button>
|
||||
</td>
|
||||
`
|
||||
tbody.appendChild(tr)
|
||||
})
|
||||
this.show()
|
||||
}
|
||||
|
||||
show() {
|
||||
this.component.style.display = this.display.reservations
|
||||
this.controls.style.display = this.display.controls
|
||||
}
|
||||
hide() {
|
||||
this.component.style.display = 'none'
|
||||
this.controls.style.display = 'none'
|
||||
}
|
||||
}
|
||||
const reservations = {
|
||||
components: {
|
||||
projects: null,
|
||||
reservations: null
|
||||
},
|
||||
get() {
|
||||
return {
|
||||
reservations: project_id => {
|
||||
const reservations = [
|
||||
{
|
||||
id: 1,
|
||||
summary: 'D1',
|
||||
buyer: {
|
||||
rut: '12345678-9',
|
||||
nombreCompleto: 'Juan Perez'
|
||||
},
|
||||
fecha: '2021-01-01',
|
||||
offer: 1000,
|
||||
valid: false,
|
||||
broker: {
|
||||
name: 'Operador 1'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
summary: 'D2',
|
||||
buyer: {
|
||||
rut: '12345678-9',
|
||||
nombreCompleto: 'Pedro Gonzalez'
|
||||
},
|
||||
fecha: '2021-10-01',
|
||||
offer: 1200,
|
||||
valid: true,
|
||||
broker: null
|
||||
}
|
||||
]
|
||||
this.components.reservations.set().reservations(reservations).draw()
|
||||
}
|
||||
}
|
||||
},
|
||||
action() {
|
||||
return {
|
||||
reset: event => {
|
||||
event.preventDefault()
|
||||
this.components.projects.current_project = null
|
||||
this.components.reservations.reservations = []
|
||||
this.components.reservations.hide()
|
||||
this.components.projects.show()
|
||||
return false
|
||||
},
|
||||
up: event => {
|
||||
event.preventDefault()
|
||||
this.components.reservations.hide()
|
||||
this.components.projects.show()
|
||||
return false
|
||||
},
|
||||
reservations: () => {
|
||||
this.components.reservations.draw()
|
||||
}
|
||||
}
|
||||
},
|
||||
setup(configuration) {
|
||||
const formatters = {
|
||||
date: new Intl.DateTimeFormat('es-CL', {year: 'numeric', month: 'long', day: 'numeric'}),
|
||||
ufs: new Intl.NumberFormat('es-CL', {minimumFractionDigits: 2, maximumFractionDigits: 2})
|
||||
}
|
||||
this.components.projects = new Projects({component_id: configuration.ids.projects, title_id: configuration.ids.project})
|
||||
this.components.reservations = new Reservations({component_id: configuration.ids.reservations, controls_id: configuration.ids.controls, formatters})
|
||||
}
|
||||
}
|
||||
$(document).ready(() => {
|
||||
reservations.setup({
|
||||
ids: {
|
||||
projects: 'projects',
|
||||
project: 'project',
|
||||
controls: 'controls',
|
||||
reservations: 'reservations'
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@endpush
|
||||
22
app/src/Controller/Ventas/Reservations.php
Normal file
22
app/src/Controller/Ventas/Reservations.php
Normal file
@ -0,0 +1,22 @@
|
||||
<?php
|
||||
namespace Incoviba\Controller\Ventas;
|
||||
|
||||
use Psr\Http\Message\ResponseInterface;
|
||||
use Psr\Http\Message\ServerRequestInterface;
|
||||
use Incoviba\Common\Alias\View;
|
||||
use Incoviba\Common\Implement\Exception\EmptyResult;
|
||||
use Incoviba\Repository;
|
||||
use Incoviba\Service;
|
||||
|
||||
class Reservations
|
||||
{
|
||||
public function __invoke(ServerRequestInterface $request, ResponseInterface $response,
|
||||
Service\Proyecto $proyectoService, View $view): ResponseInterface
|
||||
{
|
||||
$projects = [];
|
||||
try {
|
||||
$projects = $proyectoService->getVendibles('descripcion');
|
||||
} catch (EmptyResult) {}
|
||||
return $view->render($response, 'ventas.reservations', compact('projects'));
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user