исправил хранилище и слайсы для страницы каиалога

This commit is contained in:
Joe_Peach committed 2025-11-21 18:32:59 +03:00
1 parent 8dc704c466
commit a9b5d57fc9
3 files changed
+28 -21

No files matched your search

+4 -3
View File
@@ -3,12 +3,13 @@ import catalogReducer from "../features/catalog/catalogSlice";
export const store = configureStore({ export const store = configureStore({
reducer: { reducer: {
catalog: catalogReducer, categories: categoriesReducer,
products: productsReducer,
}, },
middleware: (getDefaultMiddleware) => /*middleware: (getDefaultMiddleware) =>
getDefaultMiddleware({ getDefaultMiddleware({
serializableCheck: false, // отключаем для async thunk serializableCheck: false, // отключаем для async thunk
}), }),*/
}); });
export type RootState = ReturnType<typeof store.getState>; export type RootState = ReturnType<typeof store.getState>;
+20 -15
View File
@@ -2,6 +2,7 @@ import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import type {PayloadAction} from "@reduxjs/toolkit"; import type {PayloadAction} from "@reduxjs/toolkit";
import { fetchCategoryProducts, fetchCategories } from "../../api/catalogApi"; import { fetchCategoryProducts, fetchCategories } from "../../api/catalogApi";
import type { Product } from "../../types/product"; import type { Product } from "../../types/product";
import axios from "axios";
interface CatalogState { interface CatalogState {
products: Product[]; products: Product[];
@@ -21,21 +22,21 @@ const initialState: CatalogState = {
currentCategory: null, currentCategory: null,
}; };
export const getCategories = createAsyncThunk( export const fetchProductsByCategory = createAsyncThunk(
"catalog/getCategories", "products/fetchProductsByCategory",
async (categoryid: string) => { async (categoryId: number) => {
const data = await fetchCategories(categoryid); const res = await axios.get(`/api/products?category=${categoryId}`);
return data; return res.data;
} }
); );
export const getCategoryProducts = createAsyncThunk( export const fetchCategoryParameters = createAsyncThunk(
"catalog/getCategoryProducts", "products/fetchCategoryParametrs",
async (category: string) => { async (categoryId: number) => {
const data = await fetchCategoryProducts(category); const res = await axios.get(`/api/category-params/${categoryId}`);
return data; return res.data;
} }
); )
const catalogSlice = createSlice({ const catalogSlice = createSlice({
name: "catalog", name: "catalog",
@@ -58,19 +59,23 @@ const catalogSlice = createSlice({
}, },
extraReducers: (builder) => { extraReducers: (builder) => {
builder builder
.addCase(getCategoryProducts.pending, (state) => { .addCase(fetchProductsByCategory.pending, (state) => {
state.loading = true; state.loading = true;
state.error = null; state.error = null;
}) })
.addCase(getCategoryProducts.fulfilled, (state, action) => { .addCase(fetchProductsByCategory.fulfilled, (state, action) => {
state.loading = false; state.loading = false;
state.products = action.payload; state.products = action.payload;
state.filtered = action.payload; state.filtered = action.payload;
}) })
.addCase(getCategoryProducts.rejected, (state, action) => { .addCase(fetchCategoryParameters.fulfilled, (state, action) => {
state.loading = false;
state.filters = action.payload
})
/*.addCase(getCategoryProducts.rejected, (state, action) => {
state.loading = false; state.loading = false;
state.error = action.error.message || "Ошибка загрузки данных"; state.error = action.error.message || "Ошибка загрузки данных";
}); });*/
}, },
}); });
@@ -1,11 +1,12 @@
import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; import { createSlice, createAsyncThunk } from "@reduxjs/toolkit";
import type { Category } from "../../types/categories"; import type { Category } from "../../types/categories";
import axios from "axios";
export const fetchCategories = createAsyncThunk<Category[]>( export const fetchCategories = createAsyncThunk<Category[]>(
"categories/fetch", "categories/fetchCategories",
async () => { async () => {
const res = await fetch("/api/categories"); const res = await axios.get("/api/categories");
return await res.json(); return res.data;
} }
); );