Mostrar reservas
This commit is contained in:
Juan Pablo Vial
@ -24,8 +24,14 @@
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<h3 class="ui header" id="project"></h3>
|
||||
<div class="ui active inline loader" id="loader"></div>
|
||||
<div class="ui two column grid">
|
||||
<div class="column">
|
||||
<h3 class="ui header" id="project"></h3>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="ui active inline loader" id="loader"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="results">
|
||||
<div class="ui right aligned top attached basic segment" id="controls">
|
||||
<div class="ui tiny icon buttons">
|
||||
@ -94,6 +100,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@include('ventas.reservations.add_modal')
|
||||
@endsection
|
||||
|
||||
@push('page_styles')
|
||||
@ -134,19 +142,20 @@
|
||||
event.preventDefault()
|
||||
|
||||
const project_id = event.currentTarget.dataset.id
|
||||
reservations.show().results()
|
||||
reservations.show.results()
|
||||
|
||||
if (project_id === this.current_project) {
|
||||
this.hide()
|
||||
this.title_component.innerHTML = event.currentTarget.innerHTML
|
||||
|
||||
reservations.action().reservations()
|
||||
reservations.action.reservations()
|
||||
|
||||
return
|
||||
}
|
||||
this.current_project = project_id
|
||||
|
||||
reservations.get().reservations(project_id)
|
||||
reservations.get.reservations(project_id)
|
||||
reservations.components.modals.add.load(project_id)
|
||||
this.hide()
|
||||
|
||||
this.title_component.innerHTML = event.currentTarget.innerHTML
|
||||
@ -196,7 +205,7 @@
|
||||
watch() {
|
||||
Object.entries(this.buttons).forEach(([key, value]) => {
|
||||
const name = key.replace('_button', '')
|
||||
value.addEventListener('click', reservations.action()[name].bind(reservations))
|
||||
value.addEventListener('click', this.action[name].bind(this))
|
||||
})
|
||||
}
|
||||
hide() {
|
||||
@ -207,6 +216,24 @@
|
||||
this.buttons.up.style.display = 'none'
|
||||
this.buttons.reset.style.display = 'none'
|
||||
}
|
||||
|
||||
action = {
|
||||
reset: event => {
|
||||
event.preventDefault()
|
||||
reservations.action.reset(event)
|
||||
return false
|
||||
},
|
||||
up: event => {
|
||||
event.preventDefault()
|
||||
reservations.action.up(event)
|
||||
return false
|
||||
},
|
||||
add: event => {
|
||||
event.preventDefault()
|
||||
reservations.action.add(event)
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
class Reservations {
|
||||
display = {
|
||||
@ -375,119 +402,114 @@
|
||||
active: null,
|
||||
pending: null,
|
||||
rejected: null
|
||||
},
|
||||
modals: {
|
||||
add: null
|
||||
}
|
||||
},
|
||||
display: {
|
||||
loader: '',
|
||||
results: '',
|
||||
},
|
||||
get() {
|
||||
return {
|
||||
send: (project_id, url_segment, component) => {
|
||||
const url = `/api/ventas/reservations/project/${project_id}/${url_segment}`
|
||||
return APIClient.fetch(url).then(response => response.json()).then(json => {
|
||||
if (json.reservations.length === 0) {
|
||||
component.empty()
|
||||
return
|
||||
}
|
||||
component.set().reservations(json.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 => {
|
||||
return this.get().send(project_id, 'pending', this.components.reservations.pending)
|
||||
/*const url = `/ventas/reservations/project/${project_id}/pending`
|
||||
return APIClient.fetch(url).then(json => {
|
||||
if (json.reservations.length === 0) {
|
||||
return
|
||||
}
|
||||
this.components.reservations.pending.set().reservations(json.reservations).draw()
|
||||
})*/
|
||||
},
|
||||
rejected: project_id => {
|
||||
return this.get().send(project_id, 'rejected', this.components.reservations.rejected)
|
||||
/*const url = `/ventas/reservations/project/${project_id}/rejected`
|
||||
return APIClient.fetch(url).then(json => {
|
||||
if (json.reservations.length === 0) {
|
||||
return
|
||||
}
|
||||
this.components.reservations.rejected.set().reservations(json.reservations).draw()
|
||||
})*/
|
||||
},
|
||||
reservations: project_id => {
|
||||
this.loading().show()
|
||||
get: {
|
||||
send: (project_id, url_segment, component) => {
|
||||
const url = `/api/ventas/reservations/project/${project_id}/${url_segment}`
|
||||
return APIClient.fetch(url).then(response => response.json()).then(json => {
|
||||
if (json.reservations.length === 0) {
|
||||
component.empty()
|
||||
return
|
||||
}
|
||||
component.set().reservations(json.reservations).draw()
|
||||
})
|
||||
},
|
||||
active: project_id => {
|
||||
return reservations.get.send(project_id, 'active', reservations.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 => {
|
||||
return reservations.get.send(project_id, 'pending', reservations.components.reservations.pending)
|
||||
/*const url = `/ventas/reservations/project/${project_id}/pending`
|
||||
return APIClient.fetch(url).then(json => {
|
||||
if (json.reservations.length === 0) {
|
||||
return
|
||||
}
|
||||
this.components.reservations.pending.set().reservations(json.reservations).draw()
|
||||
})*/
|
||||
},
|
||||
rejected: project_id => {
|
||||
return reservations.get.send(project_id, 'rejected', reservations.components.reservations.rejected)
|
||||
/*const url = `/ventas/reservations/project/${project_id}/rejected`
|
||||
return APIClient.fetch(url).then(json => {
|
||||
if (json.reservations.length === 0) {
|
||||
return
|
||||
}
|
||||
this.components.reservations.rejected.set().reservations(json.reservations).draw()
|
||||
})*/
|
||||
},
|
||||
reservations: project_id => {
|
||||
reservations.loading.show()
|
||||
|
||||
const promises = []
|
||||
const promises = []
|
||||
|
||||
promises.push(this.get().active(project_id))
|
||||
promises.push(this.get().pending(project_id))
|
||||
promises.push(this.get().rejected(project_id))
|
||||
promises.push(reservations.get.active(project_id))
|
||||
promises.push(reservations.get.pending(project_id))
|
||||
promises.push(reservations.get.rejected(project_id))
|
||||
|
||||
return Promise.any(promises).then(() => {
|
||||
this.loading().hide()
|
||||
})
|
||||
}
|
||||
return Promise.any(promises).then(() => {
|
||||
reservations.loading.hide()
|
||||
})
|
||||
}
|
||||
},
|
||||
loading() {
|
||||
return {
|
||||
show: () => {
|
||||
this.components.loader.style.display = this.display.loader
|
||||
},
|
||||
hide: () => {
|
||||
this.components.loader.style.display = 'none'
|
||||
}
|
||||
loading: {
|
||||
show: () => {
|
||||
reservations.components.loader.style.display = reservations.display.loader
|
||||
},
|
||||
hide: () => {
|
||||
reservations.components.loader.style.display = 'none'
|
||||
}
|
||||
},
|
||||
action() {
|
||||
return {
|
||||
reset: event => {
|
||||
event.preventDefault()
|
||||
this.components.projects.current_project = null
|
||||
Object.entries(this.components.reservations).forEach(([key, value]) => {
|
||||
this.components.reservations[key].reservations = []
|
||||
this.components.reservations[key].hide()
|
||||
})
|
||||
this.show().projects()
|
||||
return false
|
||||
},
|
||||
up: event => {
|
||||
event.preventDefault()
|
||||
Object.values(this.components.reservations).forEach(reservations => reservations.hide())
|
||||
this.show().projects()
|
||||
return false
|
||||
},
|
||||
add: event => {
|
||||
event.preventDefault()
|
||||
console.debug('Add')
|
||||
return false
|
||||
},
|
||||
reservations: () => {
|
||||
Object.values(this.components.reservations).forEach(reservations => {
|
||||
reservations.draw()
|
||||
})
|
||||
}
|
||||
action: {
|
||||
reset: event => {
|
||||
event.preventDefault()
|
||||
reservations.components.projects.current_project = null
|
||||
Object.entries(reservations.components.reservations).forEach(([key, value]) => {
|
||||
reservations.components.reservations[key].reservations = []
|
||||
reservations.components.reservations[key].hide()
|
||||
})
|
||||
reservations.show.projects()
|
||||
return false
|
||||
},
|
||||
up: event => {
|
||||
event.preventDefault()
|
||||
Object.values(reservations.components.reservations).forEach(reservations => reservations.hide())
|
||||
reservations.show.projects()
|
||||
return false
|
||||
},
|
||||
add: event => {
|
||||
event.preventDefault()
|
||||
reservations.components.modals.add.show()
|
||||
return false
|
||||
},
|
||||
reservations: () => {
|
||||
Object.values(reservations.components.reservations).forEach(reservations => {
|
||||
reservations.draw()
|
||||
})
|
||||
}
|
||||
},
|
||||
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
|
||||
}
|
||||
show: {
|
||||
projects: () => {
|
||||
reservations.components.projects.show()
|
||||
reservations.components.results.style.display = 'none'
|
||||
},
|
||||
results: () => {
|
||||
reservations.components.projects.hide()
|
||||
reservations.components.results.style.display = reservations.display.results
|
||||
}
|
||||
},
|
||||
setup(configuration) {
|
||||
@ -503,12 +525,14 @@
|
||||
this.components.reservations.rejected = new RejectedReservations({component_id: configuration.ids.rejected, formatters})
|
||||
|
||||
this.display.loader = this.components.loader.style.display
|
||||
this.loading().hide()
|
||||
this.loading.hide()
|
||||
|
||||
$(`#${configuration.ids.tabs} .item`).tab()
|
||||
this.components.results = document.getElementById(configuration.ids.results)
|
||||
this.display.results = this.components.results.style.display
|
||||
this.show().projects()
|
||||
this.show.projects()
|
||||
|
||||
this.components.modals.add = new AddReservationModal()
|
||||
}
|
||||
}
|
||||
$(document).ready(() => {
|
||||
|
||||
Reference in New Issue
Block a user