Refactor pagination, optimize seo

frontend/app.vue

@@ -33,7 +33,7 @@ const getPath = (path: string) => {
 const langRefs = locales.value.map((it) => ({
 	rel: 'alternate',
 	hreflang: it.code,
-	href: `${config.public.domain}/${it.code}${getPath(route.path)}`
+	href: `https://${config.public.domain}/${it.code}${getPath(route.path)}`
 }));
 useHead({
 	link: [
@@ -44,17 +44,21 @@ useHead({
 		},
 		{
 			rel: 'canonical',
-			href: `${config.public.domain}/${locale.value}${getPath(route.path)}`
+			href: `https://${config.public.domain}/${locale.value}${getPath(route.path)}`
 		},
 		{
 			rel: 'alternate',
 			hreflang: 'x-default',
-			href: `${config.public.domain}/ru${getPath(route.path)}`
+			href: `https://${config.public.domain}/ru${getPath(route.path)}`
 		},
 		...langRefs
 	],
 	title: `${t('meta.default_title.first')} | ${t('meta.default_title.second')}`,
 	meta: [
+		{
+			name: 'keywords',
+			content: t('meta.default_keywords')
+		},
 		{
 			name: 'description',
 			content: t('meta.default_description')

frontend/components/search/Pagination.vue

@@ -2,7 +2,7 @@
 import { countries as supportedCountries } from '../../../common/const/supportedCountries';
 import { useRoute } from 'vue-router';
 
 const { t, locale } = useI18n();
 
 interface ResponsiveDevice {
 	value: boolean;
@@ -38,7 +38,7 @@
 
 const {
 	data: posterEvents,
 	error: errorEvents,
 	pending
 } = await apiRouter.filters.findEventsPagination.useQuery({
 	data: {
@@ -55,6 +55,14 @@
 	}
 });
 
+useHead({
+	script: [
+		posterEvents.value
+			? getJSONEventList(posterEvents.value.docs, locale.value, route.path)
+			: undefined
+	]
+});
+
 watch(
 	() => route.query,
 	(value) => {
@@ -77,7 +85,6 @@
 watch(
 	() => posterEvents,
 	(posterEvents) => {
-		console.log(posterEvents);
 		if (posterEvents.value.page > posterEvents.value.totalPages) {
 			const currentParams = { ...route.query, ...{ page: 1 } };
 			navigateTo({ query: currentParams });
@@ -188,6 +195,14 @@
 					/>
 				</NuxtLink>
 			</div>
+			<SearchLoader
+				v-if="pending"
+				:size="mobile ? 'middle' : 'big'"
+			/>
+			<SearchNotFound
+				v-if="!pending && (!posterEvents || posterEvents.docs.length === 0)"
+				:title="$t('event.filteredEvents.no_events_found')"
+			/>
 			<SearchEventCardsList
 				v-if="posterEvents.docs && posterEvents.docs.length !== 0"
 				:events="posterEvents.docs"

frontend/components/search/PaginationCity.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { countries as supportedCountries } from '../../../common/const/supportedCountries';
 import { useRoute } from 'vue-router';
+import { CommonErrorsEnum } from '../../../common/const';
 
 const { t, locale } = useI18n();
 
@@ -78,6 +79,26 @@ const {
 	}
 });
 
+if (errorEvents.value) {
+	if (
+		errorEvents.value.data &&
+		errorEvents.value.data.message === CommonErrorsEnum.CITY_NOT_FOUND
+	) {
+		throw createError({
+			statusCode: 404,
+			data: { message: t(`errors.${CommonErrorsEnum.CITY_NOT_FOUND}`, { city: city }) }
+		});
+	}
+}
+
+useHead({
+	script: [
+		posterEvents.value
+			? getJSONEventList(posterEvents.value.docs, locale.value, route.path)
+			: undefined
+	]
+});
+
 watch(
 	() => route.query,
 	(value) => {
@@ -201,6 +222,14 @@ watch(
 					/>
 				</NuxtLink>
 			</div>
+			<SearchLoader
+				v-if="pending"
+				:size="mobile ? 'middle' : 'big'"
+			/>
+			<SearchNotFound
+				v-if="!pending && !posterEvents"
+				:title="$t('event.filteredEvents.no_events_found')"
+			/>
 			<SearchEventCardsList
 				v-if="posterEvents.docs && posterEvents.docs.length !== 0"
 				:events="posterEvents.docs"

frontend/components/search/PaginationCountry.vue

@@ -1,11 +1,7 @@
 <script setup lang="ts">
-import {
-	declinationCountries,
-	countries as supportedCountries,
-	queryToCountryLocaleName,
-	queryToCountryCode
-} from '../../../common/const/supportedCountries';
+import { queryToCountryLocaleName } from '../../../common/const/supportedCountries';
 import { useRoute } from 'vue-router';
+import { CommonErrorsEnum } from '../../../common/const';
 
 const { t, locale } = useI18n();
 
@@ -62,6 +58,28 @@ const {
 	}
 });
 
+if (errorEvents.value) {
+	if (
+		errorEvents.value.data &&
+		errorEvents.value.data.message === CommonErrorsEnum.COUNTRY_NOT_FOUND
+	) {
+		throw createError({
+			statusCode: 404,
+			data: {
+				message: t(`errors.${CommonErrorsEnum.COUNTRY_NOT_FOUND}`, { country: country })
+			}
+		});
+	}
+}
+
+useHead({
+	script: [
+		posterEvents.value
+			? getJSONEventList(posterEvents.value.docs, locale.value, route.path)
+			: undefined
+	]
+});
+
 watch(
 	() => route.query,
 	(value) => {
@@ -185,6 +203,14 @@ watch(
 					/>
 				</NuxtLink>
 			</div>
+			<SearchLoader
+				v-if="pending"
+				:size="mobile ? 'middle' : 'big'"
+			/>
+			<SearchNotFound
+				v-if="!pending && !posterEvents"
+				:title="$t('event.filteredEvents.no_events_found')"
+			/>
 			<SearchEventCardsList
 				v-if="posterEvents.docs && posterEvents.docs.length !== 0"
 				:events="posterEvents.docs"

frontend/i18n/locales/en-GB/meta.ts

@@ -4,6 +4,8 @@ export default {
 		first: 'Events  Serbia ',
 		second: 'Events Montenegro - Peredelano Afisha'
 	},
+	default_keywords:
+		'best events in Serbia, best events in Montenegro, Belgrade, Cetinje, great variety of events, event poster 2025, schedule, tickets, events, exhibitions, excursions, shows, concerts, rock concerts, festivals, performances, flash mobs, parties, children, scheme, address, photos',
 	default_description:
 		'The catalog features dozens of events in Serbia, Montenegro across various categories: concerts, meetings, exhibitions, festivals, masterclasses',
 	about_us: {

frontend/i18n/locales/ru-RU/meta.ts

@@ -2,9 +2,10 @@ export default {
 	site_name: 'Афиша Peredelano',
 	default_title: {
 		first: 'Афиша мероприятий Сербии',
-		second: 'Афиша мероприятий Черногории - Peredelano Afisha'
+		second: 'Афиша мероприятий Черногории - Афиша Переделано'
 	},
-
+	default_keywords:
+		'лучшие мероприятия Сербии, лучшие мероприятия Черногории, Белград, Цетине, огромный выбор мероприятий, афиша событий 2025, расписание, билеты, мероприятия, выставки, экскурсии, шоу, концерты, рок-концерты, фестивали, спектакли, флешмобы, вечеринки, детям, схема, адрес, фото',
 	default_description:
 		'В каталоге представлены десятки мероприятий Сербии, Черногории по различным направлениям: концерты, встречи, выставки, фестивали, мастер-классы',
 	about_us: {

frontend/pages/city/[city].vue

@@ -1,17 +1,16 @@
 <script setup lang="ts">
 import { useUserStore } from '../../stores/user.store';
+import {
+	declinationCountries,
+	countries as supportedCountries
+} from '../../../common/const/supportedCountries';
 
 const route = useRoute();
 
 const userStore = useUserStore();
 
 const { locale, t } = useI18n();
 const mobile = inject('mobile');
-import { CommonErrorsEnum } from '../../../common/const/common-errors';
-import {
-	declinationCountries,
-	countries as supportedCountries
-} from '../../../common/const/supportedCountries';
 
 const { sendAnalytics } = useSendTrackingEvent();
 
@@ -50,44 +49,11 @@
 	})
 });
 
-const dateStart = computed(() =>
-	dateFromQueryToFilter('first', getFirstQuery(route.query.startDate as string))
-);
-const dateEnd = computed(() => {
-	return dateFromQueryToFilter('second', getFirstQuery(route.query.endDate as string));
-});
 const tags = computed(() =>
 	getFirstQuery(route.query.tags)
 		.split(', ')
 		.filter((item) => item !== '')
 );
-const {
-	data: posterEvents,
-	error: errorEvents,
-	pending
-} = await apiRouter.filters.findEventsByCity.useQuery({
-	data: {
-		city,
-		query: {
-			tags,
-			startDate: dateStart,
-			endDate: dateEnd
-		},
-		watch: [tags.value, dateStart.value, dateEnd.value]
-	}
-});
-
-if (errorEvents.value) {
-	if (
-		errorEvents.value.data &&
-		errorEvents.value.data.message === CommonErrorsEnum.CITY_NOT_FOUND
-	) {
-		throw createError({
-			statusCode: 404,
-			data: { message: t(`errors.${CommonErrorsEnum.CITY_NOT_FOUND}`, { city: city }) }
-		});
-	}
-}
 
 export type Option = { label: string; value: string };
 
@@ -118,14 +84,6 @@
 	return filtered;
 });
 
-useHead({
-	script: [
-		posterEvents.value
-			? getJSONEventList(posterEvents.value, locale.value, route.path)
-			: undefined
-	]
-});
-
 watch(
 	() => route.query,
 	(value) => {
@@ -152,14 +110,6 @@
 		</FiltersHeroWrap>
 
 		<SearchCardsWrapper>
-			<SearchLoader
-				v-if="pending"
-				:size="mobile ? 'middle' : 'big'"
-			/>
-			<SearchNotFound
-				v-if="!pending && !posterEvents"
-				:title="$t('event.filteredEvents.no_events_found')"
-			/>
 			<!--			<SearchEventCardsList-->
 			<!--				v-if="posterEvents && posterEvents.length !== 0"-->
 			<!--				:events="posterEvents"-->