avance con muestra de rutas
Francisco Sandoval
parent
8bf7c13ccc
commit
518d07d736
|
|
@ -31,6 +31,10 @@
|
|||
<i class="align-middle bi bi-map fs-4" />
|
||||
<span class="align-middle">Paraderos</span>
|
||||
</SideLink>
|
||||
<SideLink to="/mapas/rutas">
|
||||
<i class="align-middle bi bi-map fs-4" />
|
||||
<span class="align-middle">Rutas</span>
|
||||
</SideLink>
|
||||
|
||||
<li class="sidebar-header">Mantenedores</li>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,92 @@
|
|||
<script>
|
||||
import PageTitle from "$/components/PageTitle.svelte";
|
||||
import GoogleMap from '$/components/GoogleMap.svelte'
|
||||
import IconLoading from "$/components/IconLoading.svelte";
|
||||
import { getServicios } from "$/services/lineas";
|
||||
import { getRutasServicio } from "$/services/mapas";
|
||||
|
||||
let data_map = null
|
||||
let lineas = []
|
||||
let servicios = []
|
||||
let id_linea = '';
|
||||
let id_servicio = '';
|
||||
let loading = false
|
||||
|
||||
cargar_servicios()
|
||||
$: cargar_rutas(id_linea, id_servicio)
|
||||
|
||||
async function cargar_servicios() {
|
||||
try {
|
||||
servicios = await getServicios()
|
||||
lineas = [ ...new Set(servicios.map(el => el.id_linea))]
|
||||
} catch (error) {
|
||||
alert(error)
|
||||
}
|
||||
}
|
||||
|
||||
async function cargar_rutas(id_linea, service_id) {
|
||||
try {
|
||||
if (!id_linea || !service_id) return;
|
||||
const data = await getRutasServicio({ id_linea, service_id })
|
||||
console.log({ data })
|
||||
} catch (error) {
|
||||
alert(error)
|
||||
}
|
||||
}
|
||||
|
||||
async function init_google_map(data_inicial) {
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<PageTitle>Paraderos</PageTitle>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<button class="btn btn-outline-secondary" on:click|preventDefault={() => init_google_map(null)}><i class="bi bi-arrow-repeat"></i> Refrescar</button>
|
||||
</div>
|
||||
<div class="col-md-auto">
|
||||
<div class="input-group">
|
||||
<div class="input-group-text">Linea</div>
|
||||
<select bind:value={id_linea} class="form-select" on:change={() => id_servicio = ''}>
|
||||
<option value=""></option>
|
||||
{#each lineas as linea}
|
||||
<option value={linea}>{linea}</option>
|
||||
{/each}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-auto">
|
||||
<div class="input-group">
|
||||
<div class="input-group-text">Comuna</div>
|
||||
<select bind:value={id_servicio} class="form-select">
|
||||
<option value=""></option>
|
||||
{#each servicios.filter(el => el.id_linea === id_linea) as servicio}
|
||||
<option value={servicio.service_id}>{servicio.service_id}</option>
|
||||
{/each}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md">
|
||||
{#if loading}
|
||||
<span>Cargando rutas...</span>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
{#if data_map}
|
||||
<GoogleMap
|
||||
google_api_key={data_map.google_api_key}
|
||||
center={data_map.center}
|
||||
zoom={data_map.zoom}
|
||||
marks={[]}
|
||||
on:loading={ev => loading = ev.detail}
|
||||
/>
|
||||
{:else}
|
||||
<IconLoading />
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -10,6 +10,7 @@ import PagePersonas from '$/pages/personas/Admin.svelte'
|
|||
import PagePersonaCreate from '$/pages/personas/Persona.svelte'
|
||||
import PagePersonaModifica from '$/pages/personas/Persona.svelte'
|
||||
import PageMapaParaderos from '$/pages/mapas/Paraderos.svelte'
|
||||
import PageMapaRutas from '$/pages/mapas/Rutas.svelte'
|
||||
|
||||
export const routes = [
|
||||
{ path: '/', component: PageHome },
|
||||
|
|
@ -23,5 +24,6 @@ export const routes = [
|
|||
{ path: '/personas/nuevo', component: PagePersonaCreate },
|
||||
{ path: '/personas/:rut', component: PagePersonaModifica },
|
||||
{ path: '/mapas/paraderos', component: PageMapaParaderos },
|
||||
{ path: '/mapas/rutas', component: PageMapaRutas },
|
||||
{ path: '*', component: PageError },
|
||||
]
|
||||
|
|
@ -0,0 +1,56 @@
|
|||
|
||||
import { base, getToken } from './_config'
|
||||
|
||||
export async function getLineas(params) {
|
||||
const query = !params ? '' : '?' + (new URLSearchParams(params).toString());
|
||||
const res = await fetch(`${base}/lineas/${query}`, {
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function getServicios() {
|
||||
const res = await fetch(`${base}/lineas/servicios/`, {
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function getLinea(id) {
|
||||
const res = await fetch(`${base}/lineas/${id}/`, {
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function createLinea(data) {
|
||||
const res = await fetch(`${base}/lineas/`, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(data),
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function updateLinea({ id_paradero: id = null, ...data }) {
|
||||
const res = await fetch(`${base}/lineas/${id}/`, {
|
||||
method: 'PATCH',
|
||||
body: JSON.stringify(data),
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function deleteLinea(id) {
|
||||
const res = await fetch(`${base}/lineas/${id}/`, {
|
||||
method: 'DELETE',
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
|
@ -8,4 +8,13 @@ export async function getMarcasParaderos(params) {
|
|||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function getRutasServicio(params) {
|
||||
const query = !params ? '' : '?' + (new URLSearchParams(params).toString());
|
||||
const res = await fetch(`${base}/mapas/rutas/${query}`, {
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
|
||||
import { base, getToken } from './_config'
|
||||
|
||||
export async function getRutas(params) {
|
||||
const query = !params ? '' : '?' + (new URLSearchParams(params).toString());
|
||||
const res = await fetch(`${base}/rutas/${query}`, {
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function getRuta(id) {
|
||||
const res = await fetch(`${base}/rutas/${id}/`, {
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function createRuta(data) {
|
||||
const res = await fetch(`${base}/rutas/`, {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(data),
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function updateRuta({ id_paradero: id = null, ...data }) {
|
||||
const res = await fetch(`${base}/rutas/${id}/`, {
|
||||
method: 'PATCH',
|
||||
body: JSON.stringify(data),
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function deleteRuta(id) {
|
||||
const res = await fetch(`${base}/rutas/${id}/`, {
|
||||
method: 'DELETE',
|
||||
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
|
||||
})
|
||||
if (!res.ok) throw await res.text()
|
||||
return res.json()
|
||||
}
|
||||
Loading…
Reference in New Issue