[a2e5735] | 1 | import React, { useContext, useEffect, useReducer, useState } from "react";
|
---|
| 2 | import Button from "react-bootstrap/Button";
|
---|
| 3 | import "../styles/AdminDashboard.css";
|
---|
| 4 | import { Store } from "../Store";
|
---|
| 5 | import { useNavigate, Link } from "react-router-dom";
|
---|
| 6 | import { Helmet } from "react-helmet-async";
|
---|
| 7 | import Form from "react-bootstrap/Form";
|
---|
| 8 | import Axios from "axios";
|
---|
| 9 | import { toast } from "react-toastify";
|
---|
| 10 | import axios from "axios";
|
---|
| 11 |
|
---|
| 12 | // Mesto podkategorii cuvaj stringovi od slugovite na podkategoriite vo kategoriite. Posle koga ce treba da gi stavas
|
---|
| 13 | //ce pravis get povik i ce gi zemis site podkategorii so tia slugovi zacuvani u kategorijata, i vnesi gi vo lista i vrati
|
---|
| 14 | //gi kako objekti (podkategorija)
|
---|
| 15 |
|
---|
| 16 | const reducer = (state, action) => {
|
---|
| 17 | switch (action.type) {
|
---|
| 18 | case "FETCH_REQUEST":
|
---|
| 19 | return { ...state, loading: true };
|
---|
| 20 | case "FETCH_SUCCESS":
|
---|
| 21 | return {
|
---|
| 22 | ...state,
|
---|
| 23 | getCategories: action.payload,
|
---|
| 24 | loading: false,
|
---|
| 25 | };
|
---|
| 26 | case "FETCH_FAIL":
|
---|
| 27 | return { ...state, loading: false, error: action.payload };
|
---|
| 28 | default:
|
---|
| 29 | return state;
|
---|
| 30 | }
|
---|
| 31 | };
|
---|
| 32 |
|
---|
| 33 | function AdminDashboardScreen() {
|
---|
| 34 | const navigate = useNavigate();
|
---|
| 35 | const { state } = useContext(Store);
|
---|
| 36 | const { userInfo } = state;
|
---|
| 37 | useEffect(() => {
|
---|
| 38 | if (!userInfo || !userInfo.isAdmin) {
|
---|
| 39 | return navigate("/");
|
---|
| 40 | }
|
---|
| 41 | }, [userInfo, navigate]);
|
---|
| 42 |
|
---|
| 43 | const [category, setCategory] = useState("");
|
---|
| 44 | const [categorySlug, setCategorySlug] = useState("");
|
---|
| 45 | const [categories, setCategories] = useState([]);
|
---|
| 46 | const [subCategory, setSubCategory] = useState("");
|
---|
| 47 | const [subCategorySlug, setSubCategorySlug] = useState("");
|
---|
| 48 | let counter = 0;
|
---|
| 49 | const addCategoryHandler = async (e) => {
|
---|
| 50 | e.preventDefault();
|
---|
| 51 | setCategories([]);
|
---|
| 52 | try {
|
---|
| 53 | const { data } = await Axios.post("/api/category/addCategory", {
|
---|
| 54 | category,
|
---|
| 55 | categorySlug,
|
---|
| 56 | categories,
|
---|
| 57 | });
|
---|
| 58 | toast.success("Категоријата е додадена");
|
---|
| 59 | counter++;
|
---|
| 60 | } catch (err) {
|
---|
| 61 | console.log(err);
|
---|
| 62 | toast.error("Грешка");
|
---|
| 63 | }
|
---|
| 64 | };
|
---|
| 65 |
|
---|
| 66 | const addSubCategoryHandler = async (e) => {
|
---|
| 67 | e.preventDefault();
|
---|
| 68 |
|
---|
| 69 | try {
|
---|
| 70 | const data3 = await Axios.get(
|
---|
| 71 | `/api/category/getCategory?category=${category}`
|
---|
| 72 | );
|
---|
| 73 |
|
---|
| 74 | //console.log("<=============KATEGORII POCETNA SOSTOJBA==============>");
|
---|
| 75 | //console.log(categories);
|
---|
| 76 | let subcategoriesSlugs = data3.data[0].subCategories;
|
---|
| 77 | for (let i = 0; i < subcategoriesSlugs.length; i++) {
|
---|
| 78 | categories.push(subcategoriesSlugs[i]);
|
---|
| 79 | }
|
---|
| 80 |
|
---|
| 81 | console.log(
|
---|
| 82 | "<=============KATEGORII PO DOBIVANJETO NA PODKATEGORIITE==============>"
|
---|
| 83 | );
|
---|
| 84 | console.log(categories);
|
---|
| 85 |
|
---|
| 86 | const { data } = await Axios.post("/api/category/addSubCategory", {
|
---|
| 87 | subCategory,
|
---|
| 88 | subCategorySlug,
|
---|
| 89 | });
|
---|
| 90 |
|
---|
| 91 | categories.push(data.subCategory.subCategorySlug);
|
---|
| 92 | console.log("<=============KATEGORII POSLE PUSH==============>");
|
---|
| 93 | console.log(categories);
|
---|
| 94 |
|
---|
| 95 | //categories.push(data.subCategory);
|
---|
| 96 | //console.log(categories);
|
---|
| 97 |
|
---|
| 98 | const { data1 } = await Axios.put("/api/category/updateCategory", {
|
---|
| 99 | category,
|
---|
| 100 | //categorySlug,
|
---|
| 101 | categories,
|
---|
| 102 | });
|
---|
| 103 | toast.success("Категоријата е додадена");
|
---|
| 104 | categories.splice(0, categories.length);
|
---|
| 105 |
|
---|
| 106 | counter++;
|
---|
| 107 | } catch (err) {
|
---|
| 108 | console.log(err);
|
---|
| 109 | toast.error("Грешка");
|
---|
| 110 | } finally {
|
---|
| 111 | }
|
---|
| 112 | };
|
---|
| 113 |
|
---|
| 114 | const [{ loading, getCategories }, dispatch] = useReducer(reducer, {
|
---|
| 115 | loading: true,
|
---|
| 116 | error: "",
|
---|
| 117 | });
|
---|
| 118 |
|
---|
| 119 | const flag = 1;
|
---|
| 120 | useEffect(() => {
|
---|
| 121 | const fetchData = async () => {
|
---|
| 122 | try {
|
---|
| 123 | dispatch({ type: "FETCH_REQUEST" });
|
---|
| 124 | /*
|
---|
| 125 | const { data } = await axios.get(
|
---|
| 126 | `/api/products/search?page=${page}&query=${query}&category=${category}&subCategory=${subCategory}&order=${order}`
|
---|
| 127 | );*/
|
---|
| 128 | const { data } = await Axios.get(`/api/category/getCategories`);
|
---|
| 129 | dispatch({ type: "FETCH_SUCCESS", payload: data });
|
---|
| 130 | } catch (err) {
|
---|
| 131 | dispatch({ type: "FETCH_FAIL", payload: err });
|
---|
| 132 | }
|
---|
| 133 | console.log(counter);
|
---|
| 134 | };
|
---|
| 135 | fetchData();
|
---|
| 136 | }, [counter]);
|
---|
| 137 | if (getCategories) foo(getCategories);
|
---|
| 138 | function foo(getCategories) {
|
---|
| 139 | let container = document.getElementById("selectContainer");
|
---|
| 140 | container.innerHTML = "";
|
---|
| 141 | for (let i = 0; i < getCategories.length; i++) {
|
---|
| 142 | let option = document.createElement("option");
|
---|
| 143 | option.setAttribute("value", getCategories[i].categorySlug);
|
---|
| 144 | option.innerHTML = getCategories[i].categoryName;
|
---|
| 145 | container.appendChild(option);
|
---|
| 146 | }
|
---|
| 147 | }
|
---|
| 148 |
|
---|
| 149 | return (
|
---|
| 150 | <div id="pgContainer">
|
---|
| 151 | <Helmet>
|
---|
| 152 | <title>Dashboard</title>
|
---|
| 153 | </Helmet>
|
---|
| 154 | <div id="sidebarMenu">
|
---|
| 155 | <Link
|
---|
| 156 | to={"/admin/addProduct"}
|
---|
| 157 | style={{ textDecoration: "none", width: "100%" }}
|
---|
| 158 | >
|
---|
| 159 | <div className="dashboard-btn" to="/admin/addProduct">
|
---|
| 160 | Додади нов производ
|
---|
| 161 | </div>
|
---|
| 162 | </Link>
|
---|
| 163 | <Link
|
---|
| 164 | to={"/admin/addCategory"}
|
---|
| 165 | style={{ textDecoration: "none", width: "100%" }}
|
---|
| 166 | >
|
---|
| 167 | <div className="dashboard-btn">Додади категорија</div>
|
---|
| 168 | </Link>
|
---|
| 169 | <Link
|
---|
| 170 | to={"/admin/products"}
|
---|
| 171 | style={{ textDecoration: "none", width: "100%" }}
|
---|
| 172 | >
|
---|
| 173 | <div className="dashboard-btn">Производи</div>
|
---|
| 174 | </Link>
|
---|
| 175 | <Link
|
---|
| 176 | to={"/admin/orders"}
|
---|
| 177 | style={{ textDecoration: "none", width: "100%" }}
|
---|
| 178 | >
|
---|
| 179 | <div className="dashboard-btn">Нарачки</div>
|
---|
| 180 | </Link>
|
---|
| 181 | </div>
|
---|
| 182 | <div
|
---|
| 183 | style={{
|
---|
| 184 | display: "flex",
|
---|
| 185 | justifyContent: "space-around",
|
---|
| 186 | width: "100%",
|
---|
| 187 | }}
|
---|
| 188 | >
|
---|
| 189 | <div
|
---|
| 190 | id="category-form-container"
|
---|
| 191 | style={{
|
---|
| 192 | display: "flex",
|
---|
| 193 | flexDirection: "column",
|
---|
| 194 | alignItems: "center",
|
---|
| 195 | marginTop: "40px",
|
---|
| 196 | }}
|
---|
| 197 | >
|
---|
| 198 | <h2>Додади категорија</h2>
|
---|
| 199 | <Form
|
---|
| 200 | className="formCointainer"
|
---|
| 201 | onSubmit={addCategoryHandler}
|
---|
| 202 | style={{ marginTop: "30px" }}
|
---|
| 203 | >
|
---|
| 204 | <Form.Group controlId="category">
|
---|
| 205 | <Form.Control
|
---|
| 206 | type="text"
|
---|
| 207 | placeholder="Категорија"
|
---|
| 208 | required
|
---|
| 209 | onChange={(e) => setCategory(e.target.value)}
|
---|
| 210 | />
|
---|
| 211 | </Form.Group>
|
---|
| 212 | <Form.Group controlId="categorySlug" style={{ marginTop: "20px" }}>
|
---|
| 213 | <Form.Control
|
---|
| 214 | type="text"
|
---|
| 215 | placeholder="slug"
|
---|
| 216 | required
|
---|
| 217 | onChange={(e) => setCategorySlug(e.target.value)}
|
---|
| 218 | />
|
---|
| 219 | </Form.Group>
|
---|
| 220 | <div className="submitBtnContainer">
|
---|
| 221 | <Button variant="danger" size="lg" type="submit">
|
---|
| 222 | Додади категорија
|
---|
| 223 | </Button>
|
---|
| 224 | </div>
|
---|
| 225 | </Form>
|
---|
| 226 | </div>
|
---|
| 227 | <div
|
---|
| 228 | id="subcategory-form-container"
|
---|
| 229 | style={{
|
---|
| 230 | display: "flex",
|
---|
| 231 | flexDirection: "column",
|
---|
| 232 | alignItems: "center",
|
---|
| 233 | marginTop: "40px",
|
---|
| 234 | }}
|
---|
| 235 | >
|
---|
| 236 | <h2>Додади подкатегорија</h2>
|
---|
| 237 | <Form
|
---|
| 238 | className="formCointainer"
|
---|
| 239 | onSubmit={addSubCategoryHandler}
|
---|
| 240 | style={{ marginTop: "30px" }}
|
---|
| 241 | >
|
---|
| 242 | <Form.Group>
|
---|
| 243 | <Form.Select
|
---|
| 244 | id="selectContainer"
|
---|
| 245 | value={category}
|
---|
| 246 | onChange={(e) => {
|
---|
| 247 | setCategory(e.target.value);
|
---|
| 248 | }}
|
---|
| 249 | ></Form.Select>
|
---|
| 250 | </Form.Group>
|
---|
| 251 | <Form.Group controlId="subcategory" style={{ marginTop: "20px" }}>
|
---|
| 252 | <Form.Control
|
---|
| 253 | type="text"
|
---|
| 254 | placeholder="Подкатегорија"
|
---|
| 255 | required
|
---|
| 256 | onChange={(e) => setSubCategory(e.target.value)}
|
---|
| 257 | />
|
---|
| 258 | </Form.Group>
|
---|
| 259 | <Form.Group
|
---|
| 260 | controlId="subcategorySlug"
|
---|
| 261 | style={{ marginTop: "20px" }}
|
---|
| 262 | >
|
---|
| 263 | <Form.Control
|
---|
| 264 | type="text"
|
---|
| 265 | placeholder="slug"
|
---|
| 266 | required
|
---|
| 267 | onChange={(e) => setSubCategorySlug(e.target.value)}
|
---|
| 268 | />
|
---|
| 269 | </Form.Group>
|
---|
| 270 | <div className="submitBtnContainer">
|
---|
| 271 | <Button variant="danger" size="lg" type="submit">
|
---|
| 272 | Додади подкатегорија
|
---|
| 273 | </Button>
|
---|
| 274 | </div>
|
---|
| 275 | </Form>
|
---|
| 276 | </div>
|
---|
| 277 | </div>
|
---|
| 278 | </div>
|
---|
| 279 | );
|
---|
| 280 | }
|
---|
| 281 |
|
---|
| 282 | export default AdminDashboardScreen;
|
---|