TDTP
/
Sistema_Gestion_Transporte
mirror of https://gitlab.com/m3f_usm/T_digital_Transporte_USM.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

se agrega informacion de dispositivos del paradero

develop/frontend
Francisco Sandoval 2023-11-25 19:32:43 -03:00
parent fd182216b9
commit a4b53f5a6d
8 changed files with 155 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
package-lock.json generated
View File

@ -13,7 +13,8 @@
"bootstrap-icons": "^1.10.5",
"history": "^5.3.0",
"svelte-navigator": "^3.2.2",
"svelte-pagination": "^0.0.1"
"svelte-pagination": "^0.0.1",
"svelte-qrcode": "^1.0.0"
},
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "^2.0.4",
@ -899,6 +900,11 @@
"resolved": "https://registry.npmjs.org/svelte-pagination/-/svelte-pagination-0.0.1.tgz",
"integrity": "sha512-CSGrZmwouUixUTWpRSFjmQB86VnhCemc6Vl/AxAPcuOOHKOQp3GLF1ZNLCK1Ik8Nrnf5osLwwwTHctPHfTtGfw=="
},
"node_modules/svelte-qrcode": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/svelte-qrcode/-/svelte-qrcode-1.0.0.tgz",
"integrity": "sha512-WrOvyyxtUzu32gVIDxcFMy0A7uUpbl/8yHaTNOsUaI8W5V4wa7AmReCjffhNY2aS42CqCLJ6qdwUoj/KxmeZzA=="
},
"node_modules/svelte2tsx": {
"version": "0.1.193",
"resolved": "https://registry.npmjs.org/svelte2tsx/-/svelte2tsx-0.1.193.tgz",

3
package.json
View File

@ -19,6 +19,7 @@
"bootstrap-icons": "^1.10.5",
"history": "^5.3.0",
"svelte-navigator": "^3.2.2",
"svelte-pagination": "^0.0.1"
"svelte-pagination": "^0.0.1",
"svelte-qrcode": "^1.0.0"
}
}

56
src/pages/mapas/FormParaderoDispositivos.svelte
View File

@ -1,5 +1,40 @@
<script>
import QrCode from 'svelte-qrcode'
import IconLoading from "../../components/IconLoading.svelte";
import { getDispositivos } from "../../services/dispositivos";
import { url_base } from "../../services/_config";
import { getInfoPublic } from '../../services/paraderos';
export let parada = null
let loading = false;
let dispositivos = []
let url_qrcode = null;
async function fetchDispositivos({ id_paradero = null }) {
try {
if (!id_paradero) return;
loading = true
dispositivos = await getDispositivos({ id_paradero })
url_qrcode = `${url_base}/public/infoStop?codigoParadero=${id_paradero}`;
} catch (error) {
console.log({ error });
} finally {
loading = false
}
}
async function fetchInfoPublico({ id_paradero = null }) {
try {
if (!id_paradero) return;
const info = await getInfoPublic(id_paradero)
url_qrcode = info.url_public
} catch (error) {
console.log({ error });
}
}
$: Promise.all([fetchDispositivos(parada), fetchInfoPublico(parada)])
</script>
<div>
@ -12,19 +47,26 @@
</tr>
</thead>
<tbody>
{#each dispositivos as disp}
<tr>
<td>AAAAAAAAAA</td>
<td>Panel Led</td>
</tr>
<tr>
<td>BBBBBBBBBB</td>
<td>Totem</td>
<td>{disp.id_dispositivo}</td>
<td>{disp.tipo_dispositivo?.descripcion || '--'}</td>
</tr>
{/each}
</tbody>
</table>
{#if loading}
<div>
<IconLoading />
Cargando información
</div>
{/if}
<div class="text-center mb-3">
<img loading="lazy" width="300" height="300" src="https://play-lh.googleusercontent.com/lomBq_jOClZ5skh0ELcMx4HMHAMW802kp9Z02_A84JevajkqD87P48--is1rEVPfzGVf=w240-h480-rw" alt="">
{#if url_qrcode}
<QrCode value={url_qrcode} />
{/if}
</div>
<div class="text-center">
<button class="btn btn-secondary">Imprimir QR</button>

99
src/pages/mapas/FormParaderoServicios.svelte
View File

@ -1,76 +1,54 @@
<script>
import IconLoading from "../../components/IconLoading.svelte";
import { getLinea } from "../../services/lineas";
import { getLinea } from "../../services/lineas";
import { getOperador } from "../../services/operadores";
import { getLineasParadero } from "../../services/paraderos";
// import { createLineaParadero, deleteLineaParadero, getLineasParadero } from "../../services/paraderos";
// import ModalRutas from "../rutas/ModalRutas.svelte";
export let parada = null
// let showModalRutas = false
let servicios = []
let loading = false
export let parada = null;
let servicios = [];
let loading = false;
async function fetchData({id_paradero = null}) {
async function fetchData({ id_paradero = null }) {
try {
if (!id_paradero) return;
loading = true
const resultado = await getLineasParadero(id_paradero)
loading = true;
const resultado = await getLineasParadero(id_paradero);
const lineas = await Promise.all(
resultado.map(({id_linea}) => getLinea(id_linea))
)
const id_operadores = [ ...new Set(lineas.map(linea => linea.id_operador)) ]
resultado.map(({ id_linea }) => getLinea(id_linea)),
);
const id_operadores = [
...new Set(lineas.map((linea) => linea.id_operador)),
];
const operadores = await Promise.all(
id_operadores.map(id_operador => getOperador(id_operador))
)
id_operadores.map((id_operador) => getOperador(id_operador)),
);
servicios = resultado.map(el => {
const { id_paradero_linea, id_linea } = el
const linea = lineas.find(el => id_linea === el.id_linea) || {}
const {nombre_operador} = operadores.find(op => op.id_operador === linea.id_operador) || {}
return { id_paradero_linea, ...linea, nombre_operador }
})
servicios = resultado.map((el) => {
const { id_paradero_linea, id_linea } = el;
const linea =
lineas.find((el) => id_linea === el.id_linea) || {};
const { nombre_operador } =
operadores.find(
(op) => op.id_operador === linea.id_operador,
) || {};
return { id_paradero_linea, ...linea, nombre_operador };
});
} catch (error) {
console.log({ error })
console.log({ error });
} finally {
loading = false
loading = false;
}
}
$: fetchData(parada)
// async function onAgregarRuta({ linea, operador }) {
// try {
// const { id_paradero_linea} = await createLineaParadero(parada.id_paradero, linea.id_linea)
// const { id_linea, route_short_name, route_long_name } = linea;
// const { nombre_operador } = operador;
// servicios = [ ...servicios, { id_paradero_linea, id_linea, route_short_name, route_long_name, nombre_operador } ]
// } catch (error) {
// console.log({ error })
// }
// }
// async function onEliminarRuta({ id_paradero_linea }) {
// try {
// await deleteLineaParadero(id_paradero_linea)
// servicios = servicios.filter(el => el.id_paradero_linea !== id_paradero_linea)
// } catch (error) {
// console.log({ error })
// }
// }
$: fetchData(parada);
</script>
<div>
<h4 class="mb-3">Servicios</h4>
<div class="p-3 bg-white">
<!-- <button class="btn btn-secondary" on:click|preventDefault={() => showModalRutas = true}>
<i class="bi bi-plus-lg"></i> Agregar Servicio
</button>
<div class="my-3"></div> -->
{#if loading}
<div>
<IconLoading />
@ -80,23 +58,14 @@ import { getLinea } from "../../services/lineas";
<ul class="list-group">
{#each servicios as servicio}
<li class="list-group-item d-flex justify-content-between align-items-start">
<!-- <a href={"#"} on:click|preventDefault={() => onEliminarRuta(servicio)}>
<i class="bi bi-trash text-danger"></i>
</a> -->
<div class="ms-2 me-auto">
<div class="fw-bold">{servicio.nombre_operador}</div>
Destino: {servicio.route_long_name}
</div>
<span class="badge bg-primary rounded-pill">{servicio.route_short_name}</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="ms-2 me-auto">
<div class="fw-bold">{servicio.nombre_operador}</div>
Destino: {servicio.route_long_name}
</div>
<span class="badge bg-primary rounded-pill">{servicio.route_short_name}</span>
</li>
{/each}
</ul>
</div>
</div>
<!-- <ModalRutas
show={showModalRutas}
on:select={ev => onAgregarRuta(ev.detail)}
on:close={() => showModalRutas = false}
/> -->

1
src/services/_config.js
View File

@ -1,2 +1,3 @@
export const url_base = document.location.origin;
export const base = import.meta.env.VITE_BACKEND || '/api';
export const getToken = () => sessionStorage.getItem('token') || null;

41
src/services/dispositivos.js 100644
View File

@ -0,0 +1,41 @@
import { base, getToken } from './_config'
export async function getDispositivos(params) {
const query = !params ? '' : '?' + (new URLSearchParams(params).toString());
const res = await fetch(`${base}/dispositivos/${query}`, {
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
})
if (!res.ok) throw await res.text()
return res.json()
}
export async function createDispositivo(data) {
const res = await fetch(`${base}/dispositivos/`, {
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 updateDispositivo({ id_comuna: id, ...data }) {
const res = await fetch(`${base}/dispositivos/${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 deleteDispositivo(id) {
const res = await fetch(`${base}/dispositivos/${id}/`, {
method: 'DELETE',
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
})
if (!res.ok) throw await res.text()
return res.text()
}

11
src/services/paraderos.js
View File

@ -111,4 +111,13 @@ export async function deleteLineaParadero(id_paradero_linea) {
})
if (!res.ok) throw await res.text()
return res.text()
}
}
export async function getInfoPublic(id_paradero) {
const res = await fetch(`${base}/paraderos/info-public/${id_paradero}`, {
headers: { "Authorization": `Bearer ${getToken()}` }
})
if (!res.ok) throw await res.text()
return res.json()
}

11
src/services/tipos_dispositivo.js 100644
View File

@ -0,0 +1,11 @@
import { base, getToken } from './_config'
export async function getTiposDispositivo(params) {
const query = !params ? '' : '?' + (new URLSearchParams(params).toString());
const res = await fetch(`${base}/tipos/dispositivo/${query}`, {
headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
})
if (!res.ok) throw await res.json()
return res.json()
}