Changeset 6221ab6 for reactapp/src/Pages


Ignore:
Timestamp:
08/20/22 21:12:04 (2 years ago)
Author:
unknown <mlviktor23@…>
Branches:
main
Children:
2fcbde4
Parents:
702ca77
Message:

finished add post func. in react, fixed user dashboard details not loading upon login redirect

Location:
reactapp/src/Pages
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • reactapp/src/Pages/Home.js

    r702ca77 r6221ab6  
    66import AuthApi from "../api/AuthApi";
    77
    8 function Home() {
     8function Home({ user, userLoaded }) {
    99  const { auth, setAuth } = useContext(AuthApi);
    1010
    … …  
    2424      </a>{" "}
    2525      <Search />
    26       {auth && <UserHeader />}
     26      {auth && <UserHeader user={user} userLoaded={userLoaded} />}
    2727      <div style={{ marginTop: "140px" }}></div>
    2828      <Outlet />

  • reactapp/src/Pages/Professor.js

    r702ca77 r6221ab6  
    2222import AuthApi from "../api/AuthApi";
    2323import { useNavigate } from "react-router-dom";
     24import axios from "../api/axios";
    2425
    25 function Professor() {
     26function Professor(user, userLoaded) {
    2627  let params = useParams();
    2728
    2829  let [professor, setProfessor] = useState(null);
    2930  let [loaded, setLoaded] = useState(null);
    30   let [modalDisplay, setModalDisplay] = useState("none");
     31  let [postModalDisplay, setPostModalDisplay] = useState("none");
    3132  let navigate = useNavigate();
    3233  const { auth, setAuth } = useContext(AuthApi);
    33   const [addPostTitle, setAddPostTitle] = useState("");
    34   const [addPostContent, setAddPostContent] = useState("");
     34  const [postTitle, setPostTitle] = useState("");
     35  const [postContent, setPostContent] = useState("");
    3536
    3637  useEffect(() => {
    37     const url = `http://192.168.0.17:8080/public/professor/${params.professorId}`;
     38    const url = `http://192.168.0.19:8080/public/professor/${params.professorId}`;
    3839
    3940    const fetchData = async () => {
    … …  
    5556  const handleAddOpinionButtonClick = () => {
    5657    if (auth) {
    57       setModalDisplay("block");
     58      setPostModalDisplay("block");
    5859    } else {
    5960      navigate("/login");
    … …  
    6263
    6364  const handleModalCloseClick = () => {
    64     setModalDisplay("none");
    65     console.log("here");
     65    setPostModalDisplay("none");
    6666  };
    6767
    68   const handlePostSubmit = () => {};
     68  const handlePostSubmit = async (e) => {
     69    e.preventDefault();
     70
     71    const response = await axios(
     72      `http://192.168.0.19:8080/secure/professor/${professor.professorId}/addOpinion`,
     73      {
     74        method: "post",
     75        data: {
     76          title: postTitle,
     77          content: postContent,
     78        },
     79        withCredentials: true,
     80      }
     81    );
     82
     83    window.location.reload(false);
     84  };
    6985
    7086  const handleTitleChange = (e) => {
    71     setAddPostTitle(e.target.value);
     87    setPostTitle(e.target.value);
    7288  };
    7389
    7490  const handleContentChange = (e) => {
    75     setAddPostContent(e.target.value);
     91    setPostContent(e.target.value);
    7692  };
    7793
    … …  
    100116            {professor.relatedOpinions.length !== 1 ? "мислења" : "мислење"}
    101117          </h3>
    102           <AddOpinionButton onClick={handleAddOpinionButtonClick}>
    103             Објави мислење
    104           </AddOpinionButton>
     118          {auth && (
     119            <AddOpinionButton onClick={handleAddOpinionButtonClick}>
     120              Објави мислење
     121            </AddOpinionButton>
     122          )}
    105123        </div>
    106124
    107         <Modal display={modalDisplay}>
     125        <Modal display={postModalDisplay}>
    108126          <ModalContent>
    109127            <ModalHeader>
    … …  
    113131              </h3>
    114132            </ModalHeader>
    115             <ModalBody>
    116               <form onSubmit={handlePostSubmit}>
    117                 <label for="title">
     133            <form onSubmit={handlePostSubmit}>
     134              <ModalBody>
     135                <label htmlFor="title">
    118136                  <b>Наслов</b>:
    119137                  <ModalInput
    120138                    id="title"
    121139                    type="text"
    122                     value={addPostTitle}
     140                    value={postTitle}
    123141                    onChange={handleTitleChange}
    124142                  />
    125143                </label>
    126                 <label for="content">
     144                <label htmlFor="content">
    127145                  <b>Содржина</b>:
    128146                  <ModalTextarea
    … …  
    130148                    rows="8"
    131149                    cols="100"
    132                     value={addPostContent}
     150                    value={postContent}
    133151                    onChange={handleContentChange}
    134152                  />
    135153                </label>
    136               </form>
    137             </ModalBody>
    138             <ModalFooter>
    139               <h2 style={{ textAlign: "center" }}>ОБЈАВИ</h2>
    140             </ModalFooter>
     154              </ModalBody>
     155              <ModalFooter type="submit">ОБЈАВИ</ModalFooter>
     156            </form>
    141157          </ModalContent>
    142158        </Modal>
    143159
    144160        <div className="opinionTree">
    145           <OpinionTree professor={professor} />
     161          <OpinionTree
     162            professor={professor}
     163            user={user}
     164            userLoaded={userLoaded}
     165          />
    146166        </div>
    147167        <Outlet />

  • reactapp/src/Pages/UserDashboard.js

    r702ca77 r6221ab6  
    1 import React, { useState, useEffect } from "react";
    2 import JSOG from "jsog";
    3 import axios from "../api/axios";
     1import React, { useEffect } from "react";
    42import {
    53  OpinionCard,
    … …  
    1412import { dateConverter } from "../Util/dateConverter";
    1513
    16 function UserDashboard() {
    17   const [user, setUser] = useState(null);
    18   const [loaded, setLoaded] = useState(false);
    19 
     14function UserDashboard({ user, userLoaded }) {
    2015  useEffect(() => {
    21     const fetchData = async () => {
    22       try {
    23         const response = await axios.get(
    24           "http://192.168.0.17:8080/secure/currentUser",
    25           { withCredentials: true }
    26         );
    27         var cyclicGraph = await response.data;
    28         var jsogStructure = JSOG.encode(cyclicGraph);
    29         cyclicGraph = JSOG.decode(jsogStructure);
    30         setUser(cyclicGraph);
    31         setLoaded(true);
    32       } catch (error) {
    33         console.log("Fetching error", error);
    34       }
    35     };
    36 
    37     fetchData();
     16    const timer = setTimeout(() => {
     17      if (user === null) window.location.reload(false);
     18    }, 3000);
     19    return () => clearTimeout(timer);
    3820  }, []);
    3921
    40   return loaded ? (
     22  return userLoaded ? (
    4123    <>
    4224      <h3>Кориснички податоци:</h3>
Note: See TracChangeset for help on using the changeset viewer.