Snad fix 404ky

This commit is contained in:
Michal Kváček
2024-02-01 17:32:12 +01:00
parent d69ceac14b
commit b22773b2ae
8 changed files with 66 additions and 32 deletions
+4 -3
View File
@@ -60,7 +60,6 @@ export default (({store, router}) => {
return handleRefreshToken(store, router, forward, operation); return handleRefreshToken(store, router, forward, operation);
} else if (error.message.includes("404") || error.message.includes("Not found")) { } else if (error.message.includes("404") || error.message.includes("Not found")) {
useAppStore(store).appStatus = 404; useAppStore(store).appStatus = 404;
console.log("not found");
} else { } else {
Notify.create(errorObject("API error: " + error.message)); Notify.create(errorObject("API error: " + error.message));
} }
@@ -81,11 +80,13 @@ export default (({store, router}) => {
.then((response) => response) .then((response) => response)
.catch(err => { .catch(err => {
const errStr = err.toString(); const errStr = err.toString();
if (errStr.includes('Not found')) { if (errStr.includes('Not found') || errStr.includes("No row was found")) {
useAppStore(store).appStatus = 404; useAppStore(store).appStatus = 404;
return Promise.resolve();
} }
else if (!errStr.includes("401") && !errStr.includes("Not authorized")) else if (!errStr.includes("401") && !errStr.includes("Not authorized")) {
console.error("Error during query: ", err) console.error("Error during query: ", err)
}
return Promise.reject(err); return Promise.reject(err);
}) })
}; };
+24 -3
View File
@@ -1,7 +1,8 @@
<script setup> <script setup>
import {commonProps} from "src/composables/inputs"; import {commonProps} from "src/composables/inputs";
import {ref, watch} from "vue"; import {onMounted, ref, watch} from "vue";
import {debounce} from "quasar"; import {debounce} from "quasar";
import {useRoute, useRouter} from "vue-router";
const props = defineProps({ const props = defineProps({
emitDebounce: { emitDebounce: {
@@ -16,13 +17,33 @@ const filters = ref({
search: "" search: ""
}); });
const $route = useRoute();
const $router = useRouter();
watch((() => filters.value), debounce(() => { watch((() => filters.value), debounce(() => {
emits("filtersChanged", filters.value) emits("filtersChanged", filters.value);
const query = {...$route.query};
for (const key in filters.value) {
if (filters.value[key] === "" || filters.value['key'] === null) {
delete query[key];
} else {
query[key] = filters.value[key];
}
}
$router.replace({query});
}, props.emitDebounce), {deep: true}); }, props.emitDebounce), {deep: true});
onMounted(() => {
const search = $route.query.search;
if (search) {
filters.value.search = search;
}
})
</script> </script>
<template> <template>
<q-input v-model="filters.search" v-bind="commonProps" clearable> <q-input v-model="filters.search" placeholder="Vyhledávání..." v-bind="commonProps" clearable>
<template #prepend> <template #prepend>
<q-icon name="search"/> <q-icon name="search"/>
</template> </template>
+3 -2
View File
@@ -16,7 +16,7 @@ export const aircraftKeywords = (aircraft) => {
return [aircraft.callSign, aircraft.manufacturer, aircraft.model] return [aircraft.callSign, aircraft.manufacturer, aircraft.model]
}; };
export const metaData = ({title, description, keywords, image}) => { export const metaData = ({title, description, keywords, image, index = true}) => {
const filteredKeywords = (keywords || []).filter(kw => !!kw); const filteredKeywords = (keywords || []).filter(kw => !!kw);
const filteredDescription = stripHtml(description); const filteredDescription = stripHtml(description);
@@ -38,7 +38,8 @@ export const metaData = ({title, description, keywords, image}) => {
}, },
ogDescription: { ogDescription: {
property: "og:description", content: filteredDescription, property: "og:description", content: filteredDescription,
} },
robots: {name: "robots", content: index ? "index" : "noindex"},
} }
} }
} }
+4 -2
View File
@@ -4,9 +4,11 @@ import {ref} from "vue";
export const paginationLimit = ref(10); export const paginationLimit = ref(10);
export const paginationOffset = ref(0); export const paginationOffset = ref(0);
export const loadPage = ({fetchFunc, filters, appendItems}) => { export const filters = ref({});
export const loadPage = ({fetchFunc, appendItems}) => {
return fetchFunc({ return fetchFunc({
...filters, ...filters.value,
limit: paginationLimit.value, limit: paginationLimit.value,
offset: paginationOffset.value, offset: paginationOffset.value,
appendItems appendItems
+15 -6
View File
@@ -15,7 +15,7 @@
color="white" color="white"
text-color="blue" text-color="blue"
unelevated unelevated
:to="{name: 'homepage'}" @click="backToHomepage"
label="Zpět na titulní stranu" label="Zpět na titulní stranu"
no-caps no-caps
/> />
@@ -23,10 +23,19 @@
</div> </div>
</template> </template>
<script> <script setup>
import { defineComponent } from 'vue' import {useAppStore} from "stores/App";
import {useRouter} from "vue-router";
import {metaData} from "src/composables/meta";
import {useMeta} from "quasar";
export default defineComponent({ useAppStore().setPageTitle("Nenalezeno");
name: 'ErrorNotFound' useMeta(() => metaData({
}) title: "Nenalezeno"
}))
const $router = useRouter();
const backToHomepage = () => {
$router.push({name: "homepage"}).then(() => useAppStore().appStatus = 200);
}
</script> </script>
@@ -6,20 +6,20 @@ import BasicListSkeleton from "components/basicSkeletons/BasicListSkeleton.vue";
import BasicInfoBanner from "components/banners/BasicInfoBanner.vue"; import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
import {usePointsOfInterestStore} from "stores/PointsOfInterest"; import {usePointsOfInterestStore} from "stores/PointsOfInterest";
import {storeToRefs} from "pinia"; import {storeToRefs} from "pinia";
import {loadPage, paginationLimit, paginationOffset} from "src/composables/pagination"; import {filters, loadPage, paginationLimit, paginationOffset} from "src/composables/pagination";
import ListFilters from "components/ListFilters.vue"; import ListFilters from "components/ListFilters.vue";
useAppStore().setPageTitle("Zajímavá místa"); useAppStore().setPageTitle("Zajímavá místa");
paginationLimit.value = 15; paginationLimit.value = 15;
const loadNextPage = (appendItems, filters = {}) => loadPage({ const loadNextPage = (appendItems) => loadPage({
fetchFunc: usePointsOfInterestStore().fetch, fetchFunc: usePointsOfInterestStore().fetch, appendItems
filters, appendItems
}); });
loadNextPage(false); loadNextPage(false);
const handleFiltersChanged = (filters) => { const handleFiltersChanged = (newFilters) => {
paginationOffset.value = 0; paginationOffset.value = 0;
loadNextPage(false, filters); filters.value = newFilters;
loadNextPage(false);
} }
const {isQueryRunning, totalItemsCount, pointsOfInterest} = storeToRefs(usePointsOfInterestStore()); const {isQueryRunning, totalItemsCount, pointsOfInterest} = storeToRefs(usePointsOfInterestStore());
@@ -6,7 +6,7 @@ import POIList from "components/poi/POIList.vue";
import {useAppStore} from "stores/App"; import {useAppStore} from "stores/App";
import {useMeta} from "quasar"; import {useMeta} from "quasar";
import {metaData} from "src/composables/meta"; import {metaData} from "src/composables/meta";
import {loadPage, paginationLimit, paginationOffset} from "src/composables/pagination"; import {filters, loadPage, paginationLimit, paginationOffset} from "src/composables/pagination";
import ListFilters from "components/ListFilters.vue"; import ListFilters from "components/ListFilters.vue";
useAppStore().setPageTitle("Místa"); useAppStore().setPageTitle("Místa");
@@ -18,21 +18,22 @@ useMeta(() => metaData({
title: "Místa" title: "Místa"
})) }))
const loadNextPage = (appendItems, filters) => loadPage({ const loadNextPage = (appendItems) => loadPage({
fetchFunc: usePointsOfInterestStore().fetchPublic, fetchFunc: usePointsOfInterestStore().fetchPublic, appendItems
filters, appendItems
}); });
loadNextPage(false); loadNextPage(false);
const handleFiltersChanged = (filters) => {
const handleFiltersChanged = (newFilters) => {
paginationOffset.value = 0; paginationOffset.value = 0;
loadNextPage(false, filters); filters.value = newFilters;
loadNextPage(false);
} }
const {pointsOfInterest, totalItemsCount, isQueryRunning} = storeToRefs(usePointsOfInterestStore()); const {pointsOfInterest, totalItemsCount, isQueryRunning} = storeToRefs(usePointsOfInterestStore());
</script> </script>
<template> <template>
<div class="q-pa-md"> <div>
<ListFilters @filters-changed="handleFiltersChanged"/> <ListFilters @filters-changed="handleFiltersChanged"/>
<BasicListSkeleton :items="paginationLimit" v-if="isQueryRunning && !pointsOfInterest.length"/> <BasicListSkeleton :items="paginationLimit" v-if="isQueryRunning && !pointsOfInterest.length"/>
+2 -3
View File
@@ -5,12 +5,11 @@ import {paginationLimit, paginationOffset} from "src/composables/pagination";
export const useAppStore = defineStore('App', () => { export const useAppStore = defineStore('App', () => {
const pageTitle = ref(null); const pageTitle = ref(null);
const breadcrumbs = ref(null); const breadcrumbs = ref(null);
const appStatus = ref(200); // TODO: toto nejspis nebude potreba! const appStatus = ref(200);
const resetAfterRouteChange = () => { const resetAfterRouteChange = () => {
console.log("reset after route change");
pageTitle.value = null; pageTitle.value = null;
appStatus.value = 200; // appStatus.value = 200; // tohle dela problem pri renderu 404 na serveru
breadcrumbs.value = null; breadcrumbs.value = null;
// reset strankovani po prechodu na strankach // reset strankovani po prechodu na strankach