delf/profile-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add tags

Browse Source
This commit is contained in:
Andrey Kuvshinov
2025-12-13 23:29:25 +03:00
parent 40aa3d7814
commit 80fb06e420
8 changed files with 574 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
astro.config.mjs
View File

@@ -1,11 +1,21 @@
// @ts-check
import { defineConfig } from 'astro/config'; import { defineConfig } from 'astro/config';
import node from '@astrojs/node'; import node from '@astrojs/node';
// https://astro.build/config
export default defineConfig({ export default defineConfig({
adapter: node({ adapter: node({
mode: 'standalone' mode: 'standalone'
}) }),
vite: {
resolve: {
alias: {
'@': '/src',
'@utils': '/src/lib/utils',
'@layouts': '/src/layouts',
'@components': '/src/components',
'@api': '/src/lib/api'
}
}
}
}); });

2
src/layouts/MainLayout.astro
View File

@@ -15,7 +15,7 @@ import '../styles/global.css';
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<title>{`${title}`}</title> <title>{`${title}`} - Деловой журнал Профиль</title>
<meta name="description" content={description}> <meta name="description" content={description}>
</head> </head>
<body> <body>

101
src/lib/api/menu.ts
View File

@@ -1,50 +1,71 @@
import { fetchGraphQL } from './graphql-client.js'; import { fetchGraphQL } from './graphql-client.js';
import type { MenuItem } from '../types/graphql.js';
interface MenuItemNode {
uri: string;
url: string;
order: number;
label: string;
}
interface MenuNode {
name: string;
menuItems: {
nodes: MenuItemNode[];
};
}
// Функция ДЛЯ ГЛАВНОГО МЕНЮ (максимум 5 пунктов) interface MenusResponse {
export async function getMainHeaderMenu(): Promise<MenuItem[]> { menus: {
const query = ` nodes: MenuNode[];
query GetMainHeaderMenu { };
menu(id: "103245", idType: DATABASE_ID) { }
menuItems(
first: 5, # Берем только 5 /**
where: {parentId: null} # Только верхний уровень * Get navigation menu from WordPress
) { */
nodes { export async function navQuery(): Promise<MenusResponse> {
id try {
label const query = `{
url menus(where: {location: PRIMARY}) {
target nodes {
order name
cssClasses menuItems {
nodes {
uri
url
order
label
}
} }
} }
} }
} }`;
`;
try { return await executeQuery<MenusResponse>(query, {}, "navigation");
const data = await fetchGraphQL(query); } catch (error) {
const items = data.menu?.menuItems?.nodes || []; log.error("Error fetching nav: " + error);
// Return fallback data for development
// Сортируем по order и гарантируем максимум 5 return {
return items menus: {
.sort((a: MenuItem, b: MenuItem) => a.order - b.order) nodes: [
.slice(0, 5); {
name: "Primary",
} catch (error) { menuItems: {
console.error('Ошибка загрузки главного меню:', error); nodes: [
{ uri: "/", url: "/", order: 1, label: "Home" },
// Запасной вариант на случай ошибки (ровно 5 пунктов) { uri: "/about/", url: "/about/", order: 2, label: "About" },
return [ {
{ id: '1', label: 'Главная', url: '/', order: 0 }, uri: "/contact/",
{ id: '2', label: 'Каталог', url: '/catalog', order: 1 }, url: "/contact/",
{ id: '3', label: 'О нас', url: '/about', order: 2 }, order: 3,
{ id: '4', label: 'Контакты', url: '/contacts', order: 3 }, label: "Contact",
{ id: '5', label: 'Блог', url: '/blog', order: 4 } },
]; ],
} },
},
],
},
};
}
} }

296
src/lib/api/posts.ts
View File

@@ -1,7 +1,13 @@
import { fetchGraphQL } from './graphql-client.js'; import { fetchGraphQL } from './graphql-client.js';
import type { ProfileArticle } from '../types/graphql.js'; import type { ProfileArticle } from '../types/graphql.js';
// lib/api/posts.js export interface AnewsPost {
title: string;
uri: string;
date: string;
}
//последние статьи
export async function getLatestPosts(first = 12, after = null) { export async function getLatestPosts(first = 12, after = null) {
const query = ` const query = `
query GetLatestProfileArticles($first: Int!, $after: String) { query GetLatestProfileArticles($first: Int!, $after: String) {
@@ -75,12 +81,7 @@ export async function getLatestPosts(first = 12, after = null) {
} }
export interface AnewsPost { //последние новости
title: string;
uri: string;
date: string;
}
export async function getLatestAnews(count = 12): Promise<AnewsPost[]> { export async function getLatestAnews(count = 12): Promise<AnewsPost[]> {
const query = ` const query = `
query GetAnews($count: Int!) { query GetAnews($count: Int!) {
@@ -96,4 +97,283 @@ export async function getLatestAnews(count = 12): Promise<AnewsPost[]> {
const data = await fetchGraphQL(query, { count }); const data = await fetchGraphQL(query, { count });
return data.aNews?.nodes || []; // Исправлено: aNews вместо anews return data.aNews?.nodes || []; // Исправлено: aNews вместо anews
} }
// Получить ProfileArticle по databaseId
export async function getProfileArticleById(databaseId) {
const query = `
query GetProfileArticleById($id: ID!) {
profileArticle(id: $id, idType: DATABASE_ID) {
id
databaseId
title
content
excerpt
uri
slug
date
modified
status
featuredImage {
node {
id
sourceUrl
altText
caption
mediaDetails {
width
height
}
}
}
author {
node {
id
name
firstName
lastName
avatar {
url
}
description
uri
}
}
categories {
nodes {
id
name
slug
uri
description
}
}
tags {
nodes {
id
name
slug
uri
}
}
}
}
`;
const data = await fetchGraphQL(query, { id: databaseId });
return data?.profileArticle || null;
}
/**
* Получить тег по slug
*/
export async function getTagBySlug(slug) {
const query = `
query GetTagBySlug($slug: ID!) {
tag(id: $slug, idType: SLUG) {
id
databaseId
name
slug
description
count
seo {
title
metaDesc
canonical
opengraphTitle
opengraphDescription
opengraphImage {
sourceUrl
}
}
}
}
`;
try {
const data = await fetchGraphQL(query, { slug });
return data?.tag || null;
} catch (error) {
console.error('Error fetching tag:', error);
return null;
}
}
/**
* Получить посты тега с пагинацией (offset-based)
*/
export async function getTagPostsPaginated(tagSlug, perPage = 12, page = 1) {
const offset = (page - 1) * perPage;
const query = `
query GetTagPostsPaginated($slug: ID!, $first: Int!, $offset: Int!) {
tag(id: $slug, idType: SLUG) {
id
databaseId
name
slug
description
count
seo {
title
metaDesc
canonical
}
posts(
first: $first
offset: $offset
where: {
orderby: { field: DATE, order: DESC }
}
) {
nodes {
id
databaseId
title
excerpt
uri
slug
date
modified
featuredImage {
node {
sourceUrl(size: MEDIUM_LARGE)
altText
caption
mediaDetails {
width
height
}
}
}
author {
node {
id
name
firstName
lastName
avatar {
url
}
}
}
categories {
nodes {
id
name
slug
uri
}
}
tags {
nodes {
id
name
slug
}
}
seo {
title
metaDesc
}
}
pageInfo {
offsetPagination {
total
}
}
}
}
}
`;
try {
const data = await fetchGraphQL(query, {
slug: tagSlug,
first: perPage,
offset
});
const tag = data?.tag;
if (!tag) {
return {
tag: null,
posts: [],
total: 0,
totalPages: 0,
currentPage: page,
hasNext: false,
hasPrevious: false
};
}
const posts = tag.posts?.nodes || [];
const total = tag.posts?.pageInfo?.offsetPagination?.total || 0;
const totalPages = Math.ceil(total / perPage);
return {
tag,
posts,
total,
totalPages,
currentPage: page,
hasNext: page < totalPages,
hasPrevious: page > 1,
perPage
};
} catch (error) {
console.error('Error fetching tag posts:', error);
return {
tag: null,
posts: [],
total: 0,
totalPages: 0,
currentPage: page,
hasNext: false,
hasPrevious: false
};
}
}
/**
* Получить общее количество постов для всех тегов
*/
export async function getAllTagsWithCount(first = 100) {
const query = `
query GetAllTagsWithCount($first: Int!) {
tags(first: $first, where: { hideEmpty: true }) {
nodes {
id
databaseId
name
slug
count
posts(first: 1) {
pageInfo {
offsetPagination {
total
}
}
}
}
}
}
`;
const data = await fetchGraphQL(query, { first });
return data?.tags?.nodes || [];
}

70
src/lib/utils/slugParser.js Normal file
View File

@@ -0,0 +1,70 @@
/**
* Функция для разбора slug тегов и авторов
*/
export interface SlugParseResult {
slug: string;
page: number;
}
export function slugParse(slug: string | string[]): SlugParseResult {
// Если ничего нет
if (!slug) return { slug: '', page: 1 };
// Если массив
if (Array.isArray(slug)) {
if (slug.length === 0) return { slug: '', page: 1 };
// Берем последний элемент
const last = slug[slug.length - 1];
const num = Number(last);
// Если последний - положительное целое число
if (Number.isInteger(num) && num > 0) {
// Убираем номер страницы
const slugWithoutPage = slug.slice(0, -1);
return {
slug: slugWithoutPage.join('/'),
page: num
};
}
// Весь массив - это slug
return {
slug: slug.join('/'),
page: 1
};
}
// Если строка
if (typeof slug === 'string') {
if (slug === '') return { slug: '', page: 1 };
// Делим строку
const parts = slug.split('/').filter(p => p !== '');
if (parts.length === 0) return { slug: '', page: 1 };
// Смотрим на последнюю часть
const last = parts[parts.length - 1];
const num = Number(last);
if (Number.isInteger(num) && num > 0) {
// Убираем номер страницы
const slugWithoutPage = parts.slice(0, -1).join('/');
return {
slug: slugWithoutPage,
page: num
};
}
// Вся строка - это slug
return {
slug: slug,
page: 1
};
}
// Если другой тип
return { slug: '', page: 1 };
}

109
src/pages/[category]/[...slug].astro Normal file
View File

@@ -0,0 +1,109 @@
---
import { getProfileArticleById } from '@api/posts.js';
import MainLayout from '@layouts/MainLayout.astro';
export const prerender = false; // динамический роутинг
const { category, slug } = Astro.params;
// ищем ID поста
function findPostId(slug) {
const lastItem = Array.isArray(slug) ? slug[slug.length - 1] : slug;
// Находим последний дефис
const dashIndex = lastItem.lastIndexOf('-');
if (dashIndex === -1) return null;
// Берем всё после дефиса
const idStr = lastItem.substring(dashIndex + 1);
// Преобразуем в число
const id = Number(idStr);
return Number.isInteger(id) ? id : null;
}
const postId = findPostId(slug);
let article;
try {
article = await getProfileArticleById(postId);
} catch (error) {
return Astro.redirect('/404');
}
if (!article) {
return Astro.redirect('/404');
}
// Валидация: проверяем категорию
const articleCategory = article.categories?.nodes?.[0]?.slug;
// Если категория не совпадает, делаем редирект
if (articleCategory && category !== articleCategory) {
debugLog(`Редирект: категория не совпадает (${category} != ${articleCategory})`);
// Строим правильный URL
const correctUri = article.uri
.replace(/^\//, '')
.replace(/\/$/, '');
return Astro.redirect(`/${correctUri}/`, 301);
}
// Валидация: проверяем полный путь
const currentPath = `${category}/${Array.isArray(slug) ? slug.join('/') : slug}`;
const correctPath = article.uri
.replace(/^\//, '')
.replace(/\/$/, '');
if (currentPath !== correctPath) {
debugLog(`Редирект: путь не совпадает (${currentPath} != ${correctPath})`);
return Astro.redirect(`/${correctPath}/`, 301);
}
---
<MainLayout
title={article.title}
description="Информационное агентство Деловой журнал Профиль"
>
<h1 class="article-title">{article.title}</h1>
{article.tags?.nodes?.length > 0 && (
<div class="tags-list">
<strong>Метки:</strong>
{article.tags.nodes.map(tag => (
<a href={tag.uri} class="tag" key={tag.id}>{tag.name}</a>
))}
</div>
)}
{article.featuredImage?.node?.sourceUrl && (
<figure class="featured-image">
<img
src={article.featuredImage.node.sourceUrl}
alt={article.featuredImage.node.altText || article.title}
loading="eager"
class="article-image"
/>
{article.featuredImage.node.caption && (
<figcaption class="image-caption" set:html={article.featuredImage.node.caption} />
)}
</figure>
)}
<div class="article-content" set:html={article.content} />
</MainLayout>

14
src/pages/index.astro
View File

@@ -1,18 +1,18 @@
--- ---
import { getSiteInfo } from "../lib/wp-api.js"; import { getSiteInfo } from "../lib/wp-api.js";
import { getLatestPosts } from '../lib/api/posts.js'; import { getLatestPosts } from '@api/posts.js';
const site = await getSiteInfo(); const site = await getSiteInfo();
const initialPosts = await getLatestPosts(36); // Начальная загрузка 12 постов const initialPosts = await getLatestPosts(36); // Начальная загрузка 12 постов
// визуальные компоненты // визуальные компоненты
import MainLayout from '../layouts/MainLayout.astro'; import MainLayout from '@layouts/MainLayout.astro';
import ContentGrid from '../components/ContentGrid.astro'; import ContentGrid from '@components/ContentGrid.astro';
import EndnewsList from '../components/EndnewsList.astro'; import EndnewsList from '@components/EndnewsList.astro';
export const prerender = { //export const prerender = {
isr: { expiration: 3 } // ISR: обновлять раз в 3 секунды // isr: { expiration: 3 } // ISR: обновлять раз в 3 секунды
}; //};
--- ---
<MainLayout <MainLayout

24
src/pages/tag/[...slug].astro Normal file
View File

@@ -0,0 +1,24 @@
---
import { parseSlug } from '@utils/slugParser';
import SimplePagination from '@components/Pagination.astro';
import { getTagBySlug, getPostsByTagPaginated } from '@api/posts.js';
import MainLayout from '@layouts/MainLayout.astro';
export const prerender = false; // динамический роутинг
const { slug: rawSlug } = Astro.params;
// Используем функцию
const { slug: tagSlug, page: currentPage } = parseSlug(rawSlug);
---
<MainLayout
title='Тег'
description="Информационное агентство Деловой журнал Профиль"
>
<p>Current page:{currentPage}</p>
</MainLayout>