adding whitelist

This commit is contained in:
José Conde 2023-01-06 19:13:17 +01:00
parent b979ba83b7
commit 0841c24f3c
3 changed files with 97 additions and 57 deletions

1
.env
View File

@ -1,3 +1,4 @@
# VITE_API_BASE=http://192.168.1.112:3101/api/v1 # VITE_API_BASE=http://192.168.1.112:3101/api/v1
VITE_API_BASE=http://localhost:3000/api/v1 VITE_API_BASE=http://localhost:3000/api/v1
VITE_API_PATH_LIST=/ivao/list/today VITE_API_PATH_LIST=/ivao/list/today
VITE_API_PATH_WHITELIST=/ivao/whitelist

View File

@ -4,12 +4,14 @@
import moment from 'moment'; import moment from 'moment';
import FormatTime from './components/FormatTime.vue'; import FormatTime from './components/FormatTime.vue';
import { getMonthlyList } from './data/http/listRequest'; import { getMonthlyList, getWhitelist } from './data/http/listRequest';
export default { export default {
data() { data() {
return { return {
loading: true,
list: [], list: [],
whitelist: []
} }
}, },
async mounted() { async mounted() {
@ -25,6 +27,7 @@ export default {
d._formattedTime = `${hours}:${minutes}`; d._formattedTime = `${hours}:${minutes}`;
return d; return d;
}); });
this.whitelist = await getWhitelist();
console.log(this.list); console.log(this.list);
}, },
dateTime(value) { dateTime(value) {
@ -44,62 +47,92 @@ export default {
</script> </script>
<template> <template>
<section class="section"> <header class="container is-fluid level block mt-2">
<div class="container"> <div class="level-left">
<h1 class="title"> <img src="@/assets/images/logo_28.png" alt="Latin Streaming Alliance" class="logo">
<img class="logo" src="@/assets/images/logo_28.png" />Horas mensuales </div>
</h1> </header>
<div class="container">
<section class="section">
<table class="table is-striped is-hoverable is-fullwidth"> <h1 class="title">Pilotos activos con mas de 200 horas en ACARS</h1>
<thead> <table class="table is-striped is-hoverable is-fullwidth">
<tr> <thead>
<th class="has-text-centered">VID</th> <tr>
<th class="">Nombre</th> <th class="has-text-centered">VID</th>
<th class="has-text-centered">División</th> <th class="">Nombre</th>
<th class="has-text-centered">Horas totales</th> <th class="has-text-centered">Total Vuelos</th>
<th class="has-text-centered">Último vuelo</th> <th class="has-text-centered">Horas totales</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr v-for="item in list" :key="item.vid"> <tr v-for="item in whitelist" :key="item.vid">
<td class="has-text-centered"> <td class="has-text-centered">
{{ item.vid }} {{ item.vid }}
</td> </td>
<td> <td>
{{ item.name }} {{ item.name }}
</td> </td>
<td class="has-text-centered"> <td class="has-text-centered">
{{ item.division }} <img v-if="item.division" :src="flagIcon(item.division.toLowerCase())" :alt="item.division" :title="item.division"> {{ item.flights }}
</td> </td>
<td class="has-text-centered"> <td class="has-text-centered">
<FormatTime :value="item.time / 60" /> <FormatTime :value="item.flightTime" />
</td> </td>
<td class=""> </tr>
<div class="is-size-6"> </tbody>
{{ item.lastFlight.departureId }} - {{ item.lastFlight.arrivalId }} <span class="is-size-7 ml-1 has-text-grey-light">{{ dateTime(item.lastFlightDate) }}</span> </table>
</div> </section>
<div class="field is-grouped is-grouped-multiline"> <section class="section">
<div class="control"> <h1 class="title">Status mensual IVAO</h1>
<div class="tags has-addons"> <table class="table is-striped is-hoverable is-fullwidth">
<span class="tag is-dark">Callsign</span> <thead>
<span class="tag">{{ item.lastCallsign }}</span> <tr>
</div> <th class="has-text-centered">VID</th>
</div> <th class="">Nombre</th>
<div class="control"> <th class="has-text-centered">División</th>
<div class="tags has-addons"> <th class="has-text-centered">Horas totales</th>
<span class="tag is-dark">Aircraft</span> <th class="has-text-centered">Último vuelo</th>
<span class="tag">{{ item.lastFlight.aircraftId }}</span> </tr>
</div> </thead>
</div> <tbody>
<tr v-for="item in list" :key="item.vid">
</div> <td class="has-text-centered">
</td> {{ item.vid }}
</tr> </td>
</tbody> <td>
</table> {{ item.name }}
</td>
<td class="has-text-centered">
{{ item.division }} <img v-if="item.division" :src="flagIcon(item.division.toLowerCase())" :alt="item.division" :title="item.division">
</td>
<td class="has-text-centered">
<FormatTime :value="item.time / 60" />
</td>
<td class="">
<div class="is-size-6">
{{ item.lastFlight.departureId }} - {{ item.lastFlight.arrivalId }} <span class="is-size-7 ml-1 has-text-grey-light">{{ dateTime(item.lastFlightDate) }}</span>
</div>
<div class="field is-grouped is-grouped-multiline">
<div class="control">
<div class="tags has-addons">
<span class="tag is-dark">Callsign</span>
<span class="tag">{{ item.lastCallsign }}</span>
</div>
</div>
<div class="control">
<div class="tags has-addons">
<span class="tag is-dark">Aircraft</span>
<span class="tag">{{ item.lastFlight.aircraftId }}</span>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</section>
</div> </div>
</section>
<!-- <RouterView /> --> <!-- <RouterView /> -->
</template> </template>

View File

@ -6,3 +6,9 @@ export async function getMonthlyList() {
const response = await request(`${VITE_API_BASE}${VITE_API_PATH_LIST}`); const response = await request(`${VITE_API_BASE}${VITE_API_PATH_LIST}`);
return response; return response;
} }
export async function getWhitelist() {
const { VITE_API_BASE, VITE_API_PATH_WHITELIST } =
import.meta.env;
const response = await request(`${VITE_API_BASE}${VITE_API_PATH_WHITELIST}`);
return response;
}