fix:#5 updated packages and added table filter for

This commit is contained in:
Elmar Kresse
2024-01-25 17:24:54 +01:00
parent b04432342a
commit 167a0432bf
4 changed files with 55 additions and 46 deletions

View File

@ -34,7 +34,7 @@ func AddRoutes(app *pocketbase.PocketBase) {
},
Middlewares: []echo.MiddlewareFunc{
apis.ActivityLogger(app),
// apis.RequireAdminAuth(),
apis.RequireAdminAuth(),
},
})
if err != nil {

View File

@ -17,7 +17,7 @@
"pinia": "^2.1.7",
"primeflex": "^3.3.1",
"primeicons": "^6.0.1",
"primevue": "^3.47.1",
"primevue": "^3.47.2",
"source-sans": "^3.46.0",
"vue": "^3.4.11",
"vue-i18n": "^9.9.0",
@ -1957,9 +1957,9 @@
}
},
"node_modules/caniuse-lite": {
"version": "1.0.30001579",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001579.tgz",
"integrity": "sha512-u5AUVkixruKHJjw/pj9wISlcMpgFWzSrczLZbrqBSxukQixmg0SJ5sZTpvaFvxU0HoQKd4yoyAogyrAz9pzJnA==",
"version": "1.0.30001580",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001580.tgz",
"integrity": "sha512-mtj5ur2FFPZcCEpXFy8ADXbDACuNFXg6mxVDqp7tqooX6l3zwm+d8EPoeOSIFRDvHs8qu7/SLFOGniULkcH2iA==",
"dev": true,
"funding": [
{
@ -2215,9 +2215,9 @@
}
},
"node_modules/electron-to-chromium": {
"version": "1.4.643",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.643.tgz",
"integrity": "sha512-QHscvvS7gt155PtoRC0dR2ilhL8E9LHhfTQEq1uD5AL0524rBLAwpAREFH06f87/e45B9XkR6Ki5dbhbCsVEIg==",
"version": "1.4.645",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.645.tgz",
"integrity": "sha512-EeS1oQDCmnYsRDRy2zTeC336a/4LZ6WKqvSaM1jLocEk5ZuyszkQtCpsqvuvaIXGOUjwtvF6LTcS8WueibXvSw==",
"dev": true,
"peer": true
},
@ -3685,9 +3685,9 @@
"integrity": "sha512-KDeO94CbWI4pKsPnYpA1FPjo79EsY9I+M8ywoPBSf9XMXoe/0crjbUK7jcQEDHuc0ZMRIZsxH3TYLv4TUtHmAA=="
},
"node_modules/primevue": {
"version": "3.47.1",
"resolved": "https://registry.npmjs.org/primevue/-/primevue-3.47.1.tgz",
"integrity": "sha512-khBr3xu63dlsJDnLISlplMuS/2R1mqjEArpHQE1jpw8+S3dI5MTabnL6Q/RM+o6SYbknafMH/8mjwkO+m8Cvjw==",
"version": "3.47.2",
"resolved": "https://registry.npmjs.org/primevue/-/primevue-3.47.2.tgz",
"integrity": "sha512-/vgIhc2vxNW8amBGBJX/NMBgWi/THOwT0DIPgy/aswJ86x+uwLwGtjNz22c/uSE5UkHu4E5rpktWOJtFvTbRPg==",
"peerDependencies": {
"vue": "^3.0.0"
}

View File

@ -22,7 +22,7 @@
"pinia": "^2.1.7",
"primeflex": "^3.3.1",
"primeicons": "^6.0.1",
"primevue": "^3.47.1",
"primevue": "^3.47.2",
"source-sans": "^3.46.0",
"vue": "^3.4.11",
"vue-i18n": "^9.9.0",

View File

@ -1,35 +1,3 @@
<script setup lang="ts">
import { computed, Ref, ref } from "vue";
import DynamicPage from "@/view/DynamicPage.vue";
import { requestFreeRooms } from "@/api/requestFreeRooms.ts";
const date: Ref<Date> = ref(new Date(Date.now()));
const start: Ref<Date> = ref(new Date(Date.now()));
const end: Ref<Date> = ref(new Date(Date.now() + 3600000));
async function loadFreeRooms(): Promise<void> {
availableRooms.value = [];
const startDate = new Date(date.value.getTime());
startDate.setHours(start.value.getHours());
startDate.setMinutes(start.value.getMinutes());
const endDate = new Date(date.value.getTime());
endDate.setHours(end.value.getHours());
endDate.setMinutes(end.value.getMinutes());
await requestFreeRooms(startDate.toISOString(), endDate.toISOString()).then((data) => {
availableRooms.value = data.map((room, index) => {
return { id: index, room: room };
});
});
}
const isLater = computed(() => {
return start.value > end.value;
});
const availableRooms: Ref<{id: number, room: string}[]> = ref([]);
</script>
<template>
<DynamicPage
:hide-content="availableRooms.length === 0"
@ -69,14 +37,55 @@ const availableRooms: Ref<{id: number, room: string}[]> = ref([]);
/>
</template>
<template #content>
<DataTable :value="availableRooms">
<DataTable v-model:filters="filters" :value="availableRooms" data-key="id" filter-display="row" paginator :rows="10" :global-filter-fields="['room']" >
<Column field="id" header="ID"></Column>
<Column field="room" header="Room"></Column>
<Column field="room" sortable header="Room">
<template #filter="{ filterModel, filterCallback }">
<InputText v-model="filterModel.value" type="text" class="p-column-filter" placeholder="Search by Room" @input="filterCallback()" />
</template>
</Column>
</DataTable>
</template>
</DynamicPage>
</template>
<script setup lang="ts">
import { computed, Ref, ref } from "vue";
import DynamicPage from "@/view/DynamicPage.vue";
import { requestFreeRooms } from "@/api/requestFreeRooms.ts";
import { FilterMatchMode } from "primevue/api";
const filters = ref({
room: { value: null, matchMode: FilterMatchMode.CONTAINS },
});
const date: Ref<Date> = ref(new Date(Date.now()));
const start: Ref<Date> = ref(new Date(Date.now()));
const end: Ref<Date> = ref(new Date(Date.now() + 3600000));
async function loadFreeRooms(): Promise<void> {
availableRooms.value = [];
const startDate = new Date(date.value.getTime());
startDate.setHours(start.value.getHours());
startDate.setMinutes(start.value.getMinutes());
const endDate = new Date(date.value.getTime());
endDate.setHours(end.value.getHours());
endDate.setMinutes(end.value.getMinutes());
await requestFreeRooms(startDate.toISOString(), endDate.toISOString()).then((data) => {
availableRooms.value = data.map((room, index) => {
return { id: index, room: room };
});
});
}
const isLater = computed(() => {
return start.value > end.value;
});
const availableRooms: Ref<{id: number, room: string}[]> = ref([]);
</script>
<style scoped>
.break {
flex-basis: 100%;