Merge pull request #119 from FAC-Sixteen/Feature/student-path

Update Student profile cars and RegisterPortal
FAC-Sixteen · Jun 21, 2019 · 867d280 · 867d280
2 parents 5c86ab5 + 5983c7e
commit 867d280
Show file tree

Hide file tree

Showing 8 changed files with 117 additions and 69 deletions.
diff --git a/src/components/LoginRegister/RegisterPortal/RegisterPortal.css b/src/components/LoginRegister/RegisterPortal/RegisterPortal.css
@@ -29,7 +29,7 @@
 }
 
 .form--el {
-  margin: 1rem 1rem 0 0;
+  margin: .4rem .4rem 0 0;
 }
 
 .form--title {

diff --git a/src/components/LoginRegister/RegisterPortal/RegisterPortal.js b/src/components/LoginRegister/RegisterPortal/RegisterPortal.js
@@ -6,12 +6,18 @@ import axios from "axios";
 
 const RegisterPortal = (props) => {
   const [user, setUser] = useState("");
-  const [redirect, setRedirect] = useState(false);
   const [data, setData] = useState({
     userName: "",
     email: "",
     password: "",
-    userType: ""
+    phoneNumber: "",
+    userType: "",
+    university: "",
+    yearOfStudy: "",
+    courseStudied: "",
+    skills: "",
+    aboutYou: "",
+    LinkedinURL: ""
   });
 
   const handleChange = event => {
@@ -22,71 +28,59 @@ const RegisterPortal = (props) => {
     });
   };
 
-  const handleSubmit = e => {
-    e.preventDefault();
-    setRedirect(!redirect);
+  const handleSubmit = event => {
+    event.preventDefault();
     console.log(data);
     console.log(user);
     console.log(props);
+
     const addRegister = async () => {
       console.log(`Fake submitting: ${data}`);
+      console.log(user);
       try {
-        const response = await axios.post(`/api/${user}/join`, data);
+        const response = await axios.post(`/api/${user}/sign-up`, data);
         if(response.status === 200 ) // check if response status is ok
-        {props.history.push('/StudentSignup')
+        {props.history.push('/StudentDashboard')
           //success scenario
         }
       } catch (error) {
         console.error(error);
       }
     };
     addRegister();
-
     // props.history.push("/StudentDashboard");
 
     setData({
       userName: "",
       email: "",
       password: "",
-      userType: ""
+      phoneNumber: "",
+      userType: "",
+      university: "",
+      yearOfStudy: "",
+      courseStudied: "",
+      skills: "",
+      aboutYou: "",
+      LinkedinURL: ""
     });
   }
 
-  // render() {
-  //   if (redirect === true) {
-  //     return <Redirect to='/StudentSignup' />
-  //   }
-  // }
-
   return (
-    <div className="container--div">
-      <form
-        className="form"
-        onSubmit={handleSubmit}
-        action="/api/"
-        method="post"
-      >
+    <div>
+      <form className="form" onSubmit={handleSubmit}>
         <h1 className="form--el form--title">Welcome to Groundworks.</h1>
         <p className="form--subtitle">Enter details below.</p>
 
         <fieldset id="user-type">
           <label htmlFor="student">
             Student
-            <input
-              type="radio"
-              value="student"
-              name="userType"
-              onChange={() => setUser("student")}
-            />
+            <input type="radio" value="student" name="userType"
+              onChange={() => setUser("student")} />
           </label>
           <label htmlFor="client">
             Client
-            <input
-              type="radio"
-              value="client"
-              name="userType"
-              onChange={() => setUser("client")}
-            />
+            <input type="radio" value="client" name="userType"
+              onChange={() => setUser("client")} />
           </label>
         </fieldset>
 
@@ -114,6 +108,62 @@ const RegisterPortal = (props) => {
           name="password"
           value={data.password}
         />
+        <h2 className="form--el form--input__title">Phone</h2>
+        <input
+          className="form--el input"
+          type="text"
+          onChange={handleChange}
+          name="phoneNumber"
+          value={data.phoneNumber}
+        />
+        <h2 className="form--el form--input__title">University</h2>
+        <input
+          className="form--el input"
+          type="text"
+          onChange={handleChange}
+          name="university"
+          value={data.university}
+        />
+        <h2 className="form--el form--input__title">Year of Study</h2>
+        <input
+          className="form--el input"
+          type="text"
+          onChange={handleChange}
+          name="yearOfStudy"
+          value={data.yearOfStudy}
+        />
+        <h2 className="form--el form--input__title">Course of Study</h2>
+        <input
+          className="form--el input"
+          type="text"
+          onChange={handleChange}
+          name="courseStudied"
+          value={data.courseStudied}
+        />
+        <h2 className="form--el form--input__title">Skills</h2>
+        <input
+          className="form--el input"
+          type="text"
+          onChange={handleChange}
+          name="skills"
+          value={data.skills}
+        />
+        <h2 className="form--el form--input__title">About You</h2>
+        <input
+          className="form--el input"
+          type="text"
+          onChange={handleChange}
+          name="aboutYou"
+          value={data.aboutYou}
+        />
+        <h2 className="form--el form--input__title">LinkedIn:</h2>
+        <input
+          className="form--el input"
+          type="text"
+          onChange={handleChange}
+          name="LinkedinURL"
+          value={data.LinkedinURL}
+        />
         <input
           className="form--button"
           type="submit"

diff --git a/src/components/StudentDashboard/CompletedJobCard/StudentCompletedJobCard.js b/src/components/StudentDashboard/CompletedJobCard/StudentCompletedJobCard.js
@@ -20,20 +20,20 @@ const StudentCompletedJobCard = props => {
               <div className="StudentCompletedJobCard">
                 <div className="StudentCompletedJobCard--container">
                   <h2 className="StudentCompletedJobCard--projectname">
-                    Completed Project Name: {value.projectName}
+                    {value.companyName}
                   </h2>
                   <p className="StudentCompletedJobCard--projectdesc">
-                    Project Brief: {value.projectBrief}
+                    Brief: {value.projectBrief}
                   </p>
                   <div className="StudentCompletedJobCard--contactcontainer">
                     <div className="StudentCompletedJobCard--contactdetailsdiv">
-                      <h4>Company Name: {value.companyName}</h4>
-                      <h4>Contact Person: {value.contactPerson}</h4>
+                      <h4>Project: {value.projectName}</h4>
+                      <h4>Contact: {value.contactPerson}</h4>
                     </div>
                     <div className="StudentCompletedJobCard--projectdetailsdiv">
-                      <h4>Project Price: {value.projectPrice}</h4>
-                      <h4>Estimated Workload: {value.estimatedWorkload}</h4>
-                      <h4>Project Deadline: {value.projectDeadline}</h4>
+                      <h4>Pay: {value.projectPrice}</h4>
+                      <h4>Hours: {value.estimatedWorkload}</h4>
+                      <h4>Due: {value.projectDeadline}</h4>
                     </div>
                   </div>
                   <div className="StudentCompletedJobCard--downloadbrief">

diff --git a/src/components/StudentDashboard/CurrentJobCard/CurrentJobCard.js b/src/components/StudentDashboard/CurrentJobCard/CurrentJobCard.js
@@ -20,20 +20,20 @@ const StudentCurrentJobCard = props => {
               <div className="StudentCurrentJobCard">
                 <div className="StudentCurrentJobCard--container">
                   <h2 className="StudentCurrentJobCard--projectname">
-                    Current Project Name: {value.projectName}
+                    {value.companyName}
                   </h2>
                   <p className="StudentCurrentJobCard--projectdesc">
-                    Project Brief: {value.projectBrief}
+                    Brief: {value.projectBrief}
                   </p>
                   <div className="StudentCurrentJobCard--contactcontainer">
                     <div className="StudentCurrentJobCard--contactdetailsdiv">
-                      <h4>Company Name: {value.companyName}</h4>
-                      <h4>Contact Person: {value.contactPerson}</h4>
+                      <h4>Project: {value.projectName}</h4>
+                      <h4>Contact: {value.contactPerson}</h4>
                     </div>
                     <div className="StudentCurrentJobCard--projectdetailsdiv">
-                      <h4>Project Price: {value.projectPrice}</h4>
-                      <h4>Estimated Workload: {value.estimatedWorkload}</h4>
-                      <h4>Project Deadline: {value.projectDeadline}</h4>
+                      <h4>Pay: {value.projectPrice}</h4>
+                      <h4>Hours: {value.estimatedWorkload}</h4>
+                      <h4>Due: {value.projectDeadline}</h4>
                     </div>
                   </div>
                   <div className="StudentCurrentJobCard--downloadbrief">

diff --git a/src/components/StudentDashboard/NewJobCard/NewJobCard.js b/src/components/StudentDashboard/NewJobCard/NewJobCard.js
@@ -20,20 +20,20 @@ const StudentNewJobCard = props => {
               <div className="StudentNewJobCard">
                 <div className="StudentNewJobCard--container">
                   <h2 className="StudentNewJobCard--projectname">
-                    Student Project Name: {value.projectName}
+                    {value.companyName}
                   </h2>
                   <p className="StudentNewJobCard--projectdesc">
-                    Project Brief: {value.projectBrief}
+                    Brief: {value.projectBrief}
                   </p>
                   <div className="StudentNewJobCard--contactcontainer">
                     <div className="StudentNewJobCard--contactdetailsdiv">
-                      <h4>Company Name: {value.companyName}</h4>
-                      <h4>Contact Person: {value.contactPerson}</h4>
+                      <h4>Project: {value.projectName}</h4>
+                      <h4>Contact: {value.contactPerson}</h4>
                     </div>
                     <div className="StudentNewJobCard--projectdetailsdiv">
-                      <h4>Project Price: {value.projectPrice}</h4>
-                      <h4>Estimated Workload: {value.estimatedWorkload}</h4>
-                      <h4>Project Deadline: {value.projectDeadline}</h4>
+                      <h4>Pay: {value.projectPrice}</h4>
+                      <h4>Hours: {value.estimatedWorkload}</h4>
+                      <h4>Due: {value.projectDeadline}</h4>
                     </div>
                   </div>
                   <div className="StudentNewJobCard--downloadbrief">

diff --git a/src/components/StudentDashboard/ShortStudentProfileCard/ShortStudentProfile.js b/src/components/StudentDashboard/ShortStudentProfileCard/ShortStudentProfile.js
@@ -11,12 +11,12 @@ const ShortStudentProfile = ({ name, course, university, year }) => {
         <div>
           <img
             className="StudentProfileCard--image"
-            src="./../assets/portrait-photo.png"
+            src="https://user-images.githubusercontent.com/32282170/59887196-0bf8a700-93cb-11e9-9016-e046470cb8e9.jpg"
           />
           <h4>{name}</h4>
           <h4>{course}</h4>
           <h4>{university}</h4>
-          <h4>{year}</h4>
+          <h4>Year {year}</h4>
         </div>
       </div>
     </div>

diff --git a/src/components/StudentDashboard/ShortStudentProfileCard/ShortStudentProfileCard.js b/src/components/StudentDashboard/ShortStudentProfileCard/ShortStudentProfileCard.js
@@ -7,9 +7,7 @@ const ShortStudentProfileCard = () => {
 
   useEffect(() => {
     const fetchData = async () => {
-      const result = await axios(
-        "/api/student/get-student/5d0783ded1ea443e7621cc88"
-      );
+      const result = await axios("/api/student/get-student/5d0c022affa1b43f5cbb270e");
       console.log(result.data);
       setProfile(result.data);
     };
@@ -20,10 +18,10 @@ const ShortStudentProfileCard = () => {
   return (
     <div>
       <ShortStudentProfile
-      // name={profile.firstName}
-      // university={profile.university}
-      // year={profile.yearOfStudy}
-      // course={profile.courseStudied}
+        name={profile.userName}
+        university={profile.university}
+        year={profile.yearOfStudy}
+        course={profile.courseStudied}
       />
     </div>
   );

diff --git a/src/components/StudentDashboard/StudentJobsToggle/StudentJobsToggle.js b/src/components/StudentDashboard/StudentJobsToggle/StudentJobsToggle.js
@@ -1,11 +1,11 @@
 import React, { useState } from "react";
 import "./StudentJobsToggle.css";
-import StudentCompletedJobCard from "../CompletedJobCard/StudentCompletedJobCard.js";
-import StudentCurrentJobCard from "../CurrentJobCard/CurrentJobCard.js";
-import NewJobCard from "../NewJobCard/NewJobCard.js";
+import StudentCompletedJobCard from "../CompletedJobCard/StudentCompletedJobCard";
+import StudentCurrentJobCard from "../CurrentJobCard/CurrentJobCard";
+import NewJobCard from "../NewJobCard/NewJobCard";
 
 const StudentJobsToggle = () => {
-  const [grey1, setGrey1] = useState(false);
+  const [grey1, setGrey1] = useState(true);
   const [grey2, setGrey2] = useState(false);
   const [grey3, setGrey3] = useState(false);