se agrega Toast

francisco/photos
Francisco Sandoval 2024-01-20 14:19:38 -03:00
parent 3b1e1a2387
commit 770c712e58
23 changed files with 112 additions and 70 deletions

View File

@ -0,0 +1,37 @@
<script>
let containerToast = null;
function onMessageToast(color, defaultDelay) {
return (message, delay = defaultDelay) => {
const html = `
<div class="toast align-items-center text-bg-${color} border-0"
style="min-height: 5rem;"
role="alert" aria-live="assertive" aria-atomic="true"
data-bs-autohide="true" data-bs-delay="${delay}">
<div class="d-flex">
<div class="toast-body text-light">${message}</div>
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
</div>
`;
containerToast.insertAdjacentHTML('afterbegin', html)
const elem = containerToast.querySelector('.toast')
const item = new bootstrap.Toast(elem)
elem.addEventListener('hidden.bs.toast', () => elem.remove())
item.show()
}
}
globalThis.toast = {
success: onMessageToast('success', 5000),
error: onMessageToast('danger', 3000),
danger: onMessageToast('danger', 3000),
warning: onMessageToast('warning', 5000),
info: onMessageToast('info', 5000),
primary: onMessageToast('primary', 5000),
}
</script>
<div class="toast-container position-fixed top-0 end-0 p-3" bind:this={containerToast}>
</div>

View File

@ -19,6 +19,7 @@
import { onMount } from 'svelte'
import { getInfoToken } from '$/services/login'
import { storeSession } from '$/stores/global'
import Toast from '$/components/Toast.svelte';
let triggerEvent = false;
@ -68,4 +69,5 @@
</Router>
</div>
<Notifications />
<Notifications />
<Toast />

View File

@ -31,7 +31,7 @@
aplicaciones = data.results;
count = data.count;
} catch (error) {
alert(error)
globalThis.toast.error(error)
} finally {
loading = false;
}

View File

@ -16,7 +16,7 @@
if (!id) return;
form = await getAplicacion(id) || {}
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
}
}
@ -28,14 +28,14 @@
} else {
form = await createAplicacion(form)
}
alert('Se ha guardado la aplicación')
globalThis.toast.success('Se ha guardado la aplicación')
dispatch('refresh')
dispatch('close')
} catch (error) {
if (error.detail) {
alert(error.detail)
globalThis.toast.success(error.detail)
} else {
alert(JSON.stringify(error))
globalThis.toast.success(JSON.stringify(error))
}
} finally {
loading = false;
@ -47,11 +47,11 @@
if (!confirm('Eliminará el registro?')) return;
loading = true;
await deleteAplicacion(form.id_aplicacion)
alert('Se ha eliminado la aplicación')
globalThis.toast.success('Se ha eliminado la aplicación')
dispatch('refresh')
dispatch('close')
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
} finally {
loading = false;
}

View File

@ -28,7 +28,7 @@
const offset = (page - 1) * limit;
comunas = await getComunas({ offset, limit, ordering: 'id_region' })
} catch(error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
} finally {
loading = false
}
@ -45,7 +45,7 @@
comuna = await getComuna(id_comuna)
es_nuevo = false
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
} finally {
loading = false
}
@ -58,11 +58,11 @@
} else {
await updateComuna(comuna)
}
alert('Comuna guardada con exito')
globalThis.toast.success('Comuna guardada con exito')
comuna = null; // se cierra el modal
onPage(page) // refresco la tabla de registros
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
}
}
@ -70,11 +70,11 @@
try {
if (!confirm(`Desea eliminar la comuna [${comuna.nombre_comuna}]?`)) return;
await deleteComuna(comuna.id_comuna)
alert('Comuna eliminada con exito')
globalThis.toast.success('Comuna eliminada con exito')
comuna = null; // se cierra el modal
onPage(page) // refresco la tabla de registros
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
}
}
</script>

View File

@ -11,7 +11,7 @@
try {
regiones = await getRegiones()
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
}
}
</script>

View File

@ -16,12 +16,12 @@
getOperadores({ vigente: 1 })
.then(data => data.sort((a,b) => a.nombre_operador < b.nombre_operador? -1 : 1))
.then(data => operadores = data)
.catch(error => alert(error))
.catch(error => globalThis.toast.error(error))
getLineas({ vigente: 1 })
.then(data => data.sort((a,b) => a.nombre_linea < b.nombre_linea? -1 : 1))
.then(data => lineas = data)
.catch(error => alert(error))
.catch(error => globalThis.toast.error(error))
function onChangeOperador() {
id_linea = ''

View File

@ -25,7 +25,7 @@
imagenes = await getParaderoImagenes(parada.id_paradero);
}
} catch (error) {
alert(error);
globalThis.toast.error(error);
} finally {
loading = false;
}
@ -34,9 +34,9 @@
async function onSave() {
try {
await updateParadero(form);
alert("Información guardada");
globalThis.toast.success("Información guardada");
} catch (error) {
alert(error);
globalThis.toast.error(error);
}
}
@ -47,7 +47,7 @@
imagenes = await getParaderoImagenes(parada.id_paradero);
form.file1.value = "";
} catch (error) {
alert(error);
globalThis.toast.error(error);
}
}
@ -59,7 +59,7 @@
(imagen) => imagen.id_paradero_imagen !== id_paradero_imagen,
);
} catch (error) {
alert(error);
globalThis.toast.error(error);
}
}
</script>

View File

@ -19,7 +19,7 @@
if (!id_paradero) return;
loading = true
dispositivos = await getDispositivos({ id_paradero })
url_qrcode = `${url_base}/public/infoStop?codigoParadero=${id_paradero}`;
// url_qrcode = `${url_base}/public/infoStop?codigoParadero=${id_paradero}`;
} catch (error) {
console.log({ error });
} finally {
@ -55,7 +55,7 @@
dispositivos = [ ...dispositivos, { ...nuevoDispositivo, tipo_dispositivo }]
nuevoDispositivo = null
} catch (error) {
alert(error)
globalThis.toast.error(error)
} finally {
loading = false
}
@ -68,7 +68,7 @@
await deleteDispositivo(id_dispositivo)
dispositivos = dispositivos.filter(el => el.id_dispositivo !== id_dispositivo)
} catch (error) {
alert(error)
globalThis.toast.error(error)
} finally {
loading = false
}
@ -137,14 +137,15 @@
</div>
{/if}
<div class="m-6"></div>
{#if url_qrcode}
<div class="m-6"></div>
<div class="text-center mb-3">
{#if url_qrcode}
<div class="text-center mb-3">
<QrCode value={url_qrcode} />
{/if}
</div>
<div class="text-center">
<button class="btn btn-secondary">Imprimir QR</button>
</div>
</div>
<a class="d-block my-3 text-center" target="_blank" href={url_qrcode}>Link</a>
<div class="text-center">
<button class="btn btn-secondary">Imprimir QR</button>
</div>
{/if}
</div>

View File

@ -17,27 +17,27 @@
if (!id_paradero) return;
form = await getParadero(id_paradero)
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
async function onSaveParadero() {
try {
form = form.id_paradero ? await updateParadero(form) : await createParadero(form)
alert('Información guardada')
globalThis.toast.success('Información guardada')
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
async function onDeleteParadero() {
try {
await deleteParadero(form.id_paradero)
alert('Paradero eliminado')
globalThis.toast.success('Paradero eliminado')
dispatch('delete', form)
dispatch('close')
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -45,9 +45,9 @@
try {
const { url_image } = await saveImageParadero(paradero.id_paradero, inputfile.files[0])
imagenEl.src = url_image + '?nocache=' + (new Date()).valueOf()
alert('Imagen cambiada')
globalThis.toast.success('Imagen cambiada')
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
</script>

View File

@ -70,7 +70,7 @@
regiones = await getRegiones()
comunas = await getComunas()
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -80,7 +80,7 @@
const paraderos = data_default || await getMarcasParaderos()
storeParaderos.set(paraderos)
} catch (error) {
alert(error)
globalThis.toast.error(error)
} finally {
loading = false
}

View File

@ -124,7 +124,7 @@
}
} catch (error) {
alert(error)
globalThis.toast.error(error)
} finally {
loading = false;
}

View File

@ -26,7 +26,7 @@
const offset = (page - 1) * limit;
personas = await getPersonas({ offset, limit })
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
} finally {
loading = false;
}

View File

@ -14,7 +14,7 @@
try {
tipos_tratamiento = await getTiposPersona()
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
}
}

View File

@ -30,7 +30,7 @@
loading = true
form = await getPersona(rut)
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
} finally {
loading = false
}
@ -44,10 +44,10 @@
} else {
await updatePersona(form)
}
alert('Datos guardados con exito!')
globalThis.toast.success('Datos guardados con exito!')
navigate('/personas')
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
}
}
</script>

View File

@ -31,7 +31,7 @@
roles = data.results;
count = data.count;
} catch (error) {
alert(error)
globalThis.toast.error(error)
} finally {
loading = false;
}

View File

@ -27,7 +27,7 @@
await fetchPermisosAplicaciones(id_rol)
await fetchPermisosLineas(id_rol)
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -44,7 +44,7 @@
return { ...app, id_rol_app, acceso, solo_visualizar, modificado: false }
})
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -59,7 +59,7 @@
return { ...linea, id_rol_linea: item?.id_rol_linea || null, acceso, modificado: false }
})
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -73,9 +73,9 @@
await fetchPermisosLineas(form.id_rol)
}
dispatch('refresh')
alert('Propiedades del Rol guardadas.')
globalThis.toast.success('Propiedades del Rol guardadas.')
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -83,7 +83,7 @@
try {
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -104,9 +104,9 @@
await updateRolyaplicacion({ id_rol_app, solo_visualizar })
}
}
alert('Permisos de aplicaciones guardadas')
globalThis.toast.success('Permisos de aplicaciones guardadas')
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -124,10 +124,10 @@
await createRolLinea({ id_rol, id_linea })
}
}
alert('Permisos de lineas guardadas')
globalThis.toast.success('Permisos de lineas guardadas')
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}

View File

@ -46,6 +46,8 @@
bgcolor2,
color2,
});
globalThis.toast.success('Datos de ruta guardados correctamente.')
dispatch("close");
} catch (error) {
const data = JSON.parse(error) || null;

View File

@ -17,7 +17,7 @@
try {
operadores = await getOperadores({ ordering: 'nombre_operador' })
} catch (error) {
alert(error)
globalThis.toast.error(error)
}
}
@ -28,7 +28,7 @@
if (id_operador) conditions.id_operador = id_operador;
lineas = await getLineas(conditions)
} catch (error) {
alert(error)
globalThis.toast.error(error)
} finally {
loading = false
}

View File

@ -25,7 +25,7 @@
const offset = (page - 1) * limit;
usuarios = await getUsuarios({ offset, limit, ordering: 'login' })
} catch(error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
} finally {
loading = false;
}

View File

@ -6,7 +6,7 @@
export let clave2 = ''
let roles = []
getRoles().then(data => roles = data).catch(error => alert(error))
getRoles().then(data => roles = data).catch(error => globalThis.toast.error(error))
</script>
<div class="row">

View File

@ -38,7 +38,7 @@
form_usuario = data;
} catch (error) {
console.error(error)
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
} finally {
loading = false;
}
@ -47,7 +47,7 @@
async function onSave() {
try {
if (form_usuario.clave && form_usuario.clave !== clave2) {
return alert('Segunda contraseña debe coincidir')
return globalThis.toast.success('Segunda contraseña debe coincidir')
}
if (es_nuevo) {
// para crear un usuario, es requerido enviar los datos de la persona ademas.
@ -56,10 +56,10 @@
await updateUsuario(form_usuario)
await updatePersona(form_persona)
}
alert('Datos guardados con exito!')
globalThis.toast.success('Datos guardados con exito!')
navigate('/usuarios')
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
}
}
@ -67,10 +67,10 @@
try {
if (!confirm(`Desea eliminar a ${form_usuario.login}?`)) return;
await deleteUsuario($params.login)
alert('Registro eliminado con exito!')
globalThis.toast.success('Registro eliminado con exito!')
navigate('/usuarios')
} catch (error) {
alert(error.detail || error)
globalThis.toast.success(error.detail || error)
}
}
</script>

View File

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