256 lines
11 KiB
PHP
256 lines
11 KiB
PHP
@extends('layout.base')
|
|
|
|
@section('page_content')
|
|
<div class="ui container">
|
|
<h2 class="ui header">
|
|
Editar Propiedad - {{$proyecto->descripcion}}
|
|
<a href="{{$urls->base}}/venta/{{$venta->id}}">
|
|
{{$propiedad->summary()}}
|
|
</a>
|
|
</h2>
|
|
<table class="ui table">
|
|
<thead>
|
|
<tr>
|
|
<th>Tipo</th>
|
|
<th>Unidad</th>
|
|
<th>Valor</th>
|
|
<th class="right aligned">
|
|
<button class="ui small green circular icon button" id="add_unidad">
|
|
<i class="plus icon"></i>
|
|
</button>
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="unidades">
|
|
@foreach($propiedad->unidades as $unidad)
|
|
<tr>
|
|
<td>{{ucwords($unidad->proyectoTipoUnidad->tipoUnidad->descripcion)}}</td>
|
|
<td>{{$unidad->descripcion}}</td>
|
|
<td>
|
|
<div class="ui right labeled input">
|
|
<input type="text" name="precio{{$unidad->pu_id}}" class="precio" data-pid="{{$unidad->pu_id}}" value="{{($unidad->valor > 0) ? $unidad->valor : $unidad->precio($venta->fecha)->valor}}" />
|
|
<div class="ui basic label">UF</div>
|
|
</div>
|
|
</td>
|
|
<td class="right aligned">
|
|
<button class="ui small red circular icon button remove_unidad" data-pid="{{$unidad->pu_id}}">
|
|
<i class="remove icon"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="ui modal" id="add_modal">
|
|
<div class="content">
|
|
<h3 class="header">Agregar</h3>
|
|
<form class="ui form" id="add_form">
|
|
<div class="field">
|
|
<label for="tipo">Tipo</label>
|
|
<select id="tipo" name="tipo" class="ui search selection dropdown">
|
|
@foreach ($tiposUnidades as $tipoUnidad)
|
|
<option value="{{$tipoUnidad->id}}">{{ucwords($tipoUnidad->descripcion)}}</option>
|
|
@endforeach
|
|
</select>
|
|
</div>
|
|
<div class="field">
|
|
<label for="unidad">Unidad</label>
|
|
<select id="unidad" name="unidad" class="ui search selection dropdown" size="4"></select>
|
|
</div>
|
|
<div class="field">
|
|
<label for="valor">Valor Venta</label>
|
|
<input id="valor" type="text" name="valor" />
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="actions">
|
|
<button class="ui approve button">Agregar</button>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@push('page_scripts')
|
|
<script>
|
|
const propiedad = {
|
|
unidades: [
|
|
@foreach($propiedad->unidades as $unidad)
|
|
{
|
|
id: {{$unidad->id}},
|
|
tipo: '{{ucwords($unidad->proyectoTipoUnidad->tipoUnidad->descripcion)}}',
|
|
tipo_id: {{$unidad->proyectoTipoUnidad->tipoUnidad->id}},
|
|
descripcion: '{{$unidad->descripcion}}',
|
|
pid: {{$unidad->pu_id}},
|
|
valor: {{($unidad->valor > 0) ? $unidad->valor : ($unidad->precio($venta->fecha)->valor ?? 0)}}
|
|
},
|
|
@endforeach
|
|
],
|
|
tipos: {
|
|
@foreach($tiposUnidades as $tipoUnidad)
|
|
{{$tipoUnidad->id}}: [
|
|
@foreach($unidades as $unidad)
|
|
@if ($unidad->proyectoTipoUnidad->tipoUnidad->id === $tipoUnidad->id)
|
|
{
|
|
value: {{$unidad->id}},
|
|
text: '{{$unidad->descripcion}}',
|
|
name: '{{$unidad->descripcion}}'
|
|
},
|
|
@endif
|
|
@endforeach
|
|
],
|
|
@endforeach
|
|
},
|
|
changeTipoUnidad: function(tipo_unidad_id) {
|
|
$('#unidad').dropdown('change values', this.tipos[tipo_unidad_id].sort((a, b) => a.text.padStart(4, '0').localeCompare(b.text.padStart(4, '0'))))
|
|
},
|
|
addUnidad: function() {
|
|
$('#add_modal').modal('show')
|
|
},
|
|
doAddUnidad: function() {
|
|
const url = '{{$urls->api}}/ventas/propiedades/unidades/add'
|
|
const body = new FormData(document.getElementById('add_form'))
|
|
body.set('propiedad', {{$propiedad->id}})
|
|
if (body.get('valor') === '') {
|
|
body.set('valor', '0')
|
|
}
|
|
return fetchAPI(url, {method: 'post', body}).then(response => {
|
|
if (response.ok) {
|
|
return response.json()
|
|
}
|
|
}).then(json => {
|
|
if (!json.added) {
|
|
return
|
|
}
|
|
const tipo = json.propiedad_unidad.proyecto_tipo_unidad.tipo_unidad.descripcion
|
|
this.unidades.push({
|
|
id: json.propiedad_unidad.id,
|
|
tipo: tipo.charAt(0).toUpperCase() + tipo.slice(1),
|
|
tipo_id: json.propiedad_unidad.proyecto_tipo_unidad.tipo_unidad.id,
|
|
descripcion: json.propiedad_unidad.descripcion,
|
|
pid: json.propiedad_unidad.pu_id,
|
|
valor: parseFloat(json.propiedad_unidad.valor)
|
|
})
|
|
this.draw()
|
|
const idx = this.tipos[json.propiedad_unidad.proyecto_tipo_unidad.tipo_unidad.id].findIndex(unidad => unidad.value === json.propiedad_unidad.id)
|
|
this.tipos[json.propiedad_unidad.proyecto_tipo_unidad.tipo_unidad.id].splice(idx,1)
|
|
})
|
|
},
|
|
removeUnidad: function(unidad_id) {
|
|
const url = '{{$urls->api}}/ventas/propiedades/unidad/' + unidad_id
|
|
return fetchAPI(url, {method: 'delete'}).then(response => {
|
|
if (response.ok) {
|
|
return response.json()
|
|
}
|
|
}).then(json => {
|
|
if (!json.removed) {
|
|
return
|
|
}
|
|
const idx = this.unidades.findIndex(unidad => unidad.pid === json.propiedad_unidad_id)
|
|
const unidad = this.unidades.splice(idx,1)[0]
|
|
this.draw()
|
|
this.tipos[unidad.tipo_id].push({
|
|
value: unidad.id,
|
|
text: unidad.descripcion,
|
|
name: unidad.descripcion
|
|
})
|
|
})
|
|
},
|
|
updatePrecio: function(pid, valor) {
|
|
const idx = this.unidades.findIndex(unidad => unidad.pid === pid)
|
|
if (idx === -1) {
|
|
return
|
|
}
|
|
const old_value = this.unidades[idx].valor
|
|
if (old_value === parseFloat(valor)) {
|
|
return
|
|
}
|
|
const url = '{{$urls->api}}/ventas/propiedades/unidad/' + pid + '/edit'
|
|
const data = new FormData()
|
|
data.set('valor', valor)
|
|
return fetchAPI(url, {method: 'post', body: data}).then(response => {
|
|
if (response.ok) {
|
|
return response.json()
|
|
}
|
|
}).then(json => {
|
|
if (!json.edited) {
|
|
return
|
|
}
|
|
const idx = this.unidades.findIndex(unidad => unidad.pid === json.propiedad_unidad_id)
|
|
this.unidades[idx].valor = parseFloat(json.input.valor)
|
|
this.draw()
|
|
})
|
|
},
|
|
draw: function() {
|
|
const tbody = $('#unidades')
|
|
tbody.html('')
|
|
this.unidades.forEach(unidad => {
|
|
const row = $('<tr></tr>').append(
|
|
$('<td></td>').html(unidad.tipo)
|
|
).append(
|
|
$('<td></td>').html(unidad.descripcion)
|
|
).append(
|
|
$('<td></td>').append(
|
|
$('<div></div>').addClass('ui right labeled input').append(
|
|
$('<input />').addClass('precio').attr('type', 'text').attr('data-pid', unidad.pid).attr('value', unidad.valor)
|
|
).append(
|
|
$('<div></div>').addClass('ui basic label').html('UF')
|
|
)
|
|
)
|
|
).append(
|
|
$('<td></td>').addClass('right aligned').append(
|
|
$('<button></button>').addClass('ui small red circular icon button remove_unidad').attr('data-pid', unidad.pid).append(
|
|
$('<i></i>').addClass('remove icon')
|
|
)
|
|
)
|
|
)
|
|
tbody.append(row)
|
|
})
|
|
$('.price').change(event => {
|
|
const pid = $(event.currentTarget).data('pid')
|
|
const val = $(event.currentTarget).val()
|
|
this.updatePrecio(pid, val)
|
|
})
|
|
$('.remove_unidad').click(event => {
|
|
const unidad_id = $(event.currentTarget).data('pid')
|
|
this.removeUnidad(unidad_id)
|
|
})
|
|
},
|
|
setup: function() {
|
|
$('#add_unidad').click(event => {
|
|
this.addUnidad()
|
|
})
|
|
$('.remove_unidad').click(event => {
|
|
const unidad_id = $(event.currentTarget).data('pid')
|
|
this.removeUnidad(unidad_id)
|
|
})
|
|
$('#add_modal').modal({
|
|
onApprove: ($element) => {
|
|
this.doAddUnidad()
|
|
}
|
|
})
|
|
const tipo = $('#tipo')
|
|
tipo.dropdown()
|
|
tipo.change(event => {
|
|
this.changeTipoUnidad(tipo.val())
|
|
})
|
|
$('#unidad').dropdown()
|
|
this.changeTipoUnidad(tipo.val())
|
|
$('#add_form').submit(event => {
|
|
event.preventDefault()
|
|
this.doAddUnidad()
|
|
tipo.modal('hide')
|
|
return false
|
|
})
|
|
$('.precio').change(event => {
|
|
const pid = $(event.currentTarget).data('pid')
|
|
const val = $(event.currentTarget).val()
|
|
this.updatePrecio(pid, val)
|
|
})
|
|
}
|
|
}
|
|
$(document).ready(() => {
|
|
propiedad.setup()
|
|
})
|
|
</script>
|
|
@endpush
|