Skip to content

Commit

Permalink
Merge pull request #35 from carnasci/user2
Browse files Browse the repository at this point in the history 
User2
  • Loading branch information
@wiegmank
wiegmank committed Apr 23, 2024
2 parents ac9ec2a + d1518c5 commit cb8eb00
Show file tree
Hide file tree
Showing 30 changed files with 800 additions and 434 deletions.
95 changes: 55 additions & 40 deletions ReactFrontEnd/src/Components/CreateReview.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,35 +13,41 @@ const CreateReview = () => {
//breaks down JSON into single park object
const parkDetails = singlePark.data[0]

const user = {
id: 2,
username: "paulUser",
password: "userPaul",
};

const [review, setReview] = useState({
id: "",
parkCode: parkDetails.parkCode,
content: "",
user: user,
});


//confirms above declarations in console // remove if not needed for testing
console.log("HERE IS THE REACT QUERY CACHED DATA FROM PARK DETAILS")
console.log(singlePark)
console.log(parkDetails)
console.log("HERE IS THE REACT QUERY CACHED DATA FROM PARK DETAILS");
console.log(singlePark);
console.log(parkDetails);

const navigate = useNavigate();

const handleChange = (e) => {
const value = e.target.value;
setReview({ ...review, [e.target.name]: value });
setReview({ ...review, content: value });
};

const saveReview = (e) => {
e.preventDefault();
ReviewServices.createReview(review)
.then((response) => {
console.log(response)
navigate("/home")
console.log(response);
//navigate("/home");
})
.catch((error) => {
console.log(error)
});
console.log(error);
});
};

const reset = (e) => {
Expand All @@ -50,6 +56,7 @@ const CreateReview = () => {
id: "",
parkCode: parkDetails.parkCode,
content: "",
userId: user,
});
};

Expand All @@ -62,41 +69,49 @@ const CreateReview = () => {
<>
<Header />
{/* <div className="h-full bg-gray-400 mx-10 my-20 pt-10 pb-4"> */}
<div className="bg-nps-green-300 flex flex-col justify-center h-full">
<div className="flex justify-center px-5">
<h1 className="flex underline underline-offset-4 text-amber-950">Create a review for {parkDetails.name}</h1>
</div>

<div name="image" className=" p-20 flex justify-center">
<img src={parkDetails.images[0].url} className="rounded-xl drop-shadow-2xl" />
</div>

<div className="flex flex-col items-center">
<div className="justify-center pt-6">
<label className="font-semibold text-2xl">Describe your visit:</label>
</div>

<div className="justify-center pt-6 rounded-xl drop-shadow-2xl">
<textarea className="rounded-xl"
name="content"
value={review.content}
onChange={(e) => handleChange(e)}
rows={10}
cols={100}
></textarea>
</div>
</div>

<div className="flex justify-center space-x-10 py-6">
<button className=" bg-green-700 hover:bg-green-900 font-semibold text-amber-950" onClick={saveReview}>
Submit
</button>
<div className="flex justify-center px-5 py-4">
<h1 className="flex underline underline-offset-4 text-amber-950">
Create a review for {parkDetails.name}
</h1>
</div>

<div name="image" className="h-full pt-20">
<img src={parkDetails.images[0].url} className="" />
</div>

<div className="flex flex-col items-center">
<div className="justify-center pt-6">
<label className="font-semibold text-2xl">Describe your visit:</label>
</div>

<button className="bg-red-700 hover:bg-red-900 font-semibold text-amber-950" onClick={reset}>
Clear
</button>
<div className="justify-center pt-6">
<textarea
name="content"
value={review.content}
onChange={(e) => handleChange(e)}
rows={10}
cols={100}
></textarea>
</div>
</div>

<div className="flex justify-center space-x-10 py-6">
<button
className=" bg-green-700 hover:bg-green-900 font-semibold text-amber-950"
onClick={saveReview}
>
Submit
</button>

<button
className="bg-red-700 hover:bg-red-900 font-semibold text-amber-950"
onClick={reset}
>
Clear
</button>
</div>
{/* </div> */}
</>
);
};
Expand Down
147 changes: 77 additions & 70 deletions ReactFrontEnd/src/Components/Itinerary.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,98 +23,105 @@ const [startDate, setStartDate] = useState(new Date());

const [endDate, setEndDate] = useState(new Date());

const user = {
id: 2,
username: "paulUser",
password: "userPaul",
};

const [itinerary, setItinerary] = useState({
id: "",
startDate: new Date(),
endDate: new Date(),
parkCode: parkDetails.parkCode,
user: user,
});

const navigate = useNavigate();

const handleChange = (name, date) => {

setItinerary({...itinerary, [name]: date})
setItinerary({ ...itinerary, [name]: date });
};

const saveItinerary = (e) => {
setItinerary({ ...itinerary, user: user });
e.preventDefault();
ItineraryServices.CreateItinerary(itinerary)
.then((response) => {
console.log(response)
navigate("/home")
console.log(response);
//navigate("/home")
})
.catch((error) => {
console.log(error)
console.log(error);
});
};
};

const reset = (e) => {
e.preventDefault();
setItinerary({
id: "",
startDate: new Date(),
endDate: new Date(),
parkCode: "",
});
};

return (
<>
<Header />
const reset = (e) => {
e.preventDefault();
setItinerary({
id: "",
startDate: new Date(),
endDate: new Date(),
parkCode: parkDetails.parkCode,
user: user,
});
};

return (
<>
<Header />

<div className="bg-gray-400 pt-10 pb-4 mt-10 mx-10 mb-20">
<div>
<h1 className="underline underline-offset-4 px-5 py-4 text-amber-950">
Create Itinerary for {parkDetails.name}
</h1>
</div>
<div>
<p className="font-semibold">Trip Start date:</p>
<DatePicker
showIcon
toggleCalendarOnIconClick
selected={itinerary.startDate}
selectsStart
startDate={startDate}
endDate={endDate}
minDate={startDate}
onChange={(date) => handleChange("startDate", date)}
name="startDate"
/>
</div>
<div>
<p className="font-semibold">Trip End date:</p>
<DatePicker
showIcon
toggleCalendarOnIconClick
selected={itinerary.endDate}
selectsEnd
startDate={startDate}
endDate={endDate}
minDate={startDate}
onChange={(date) => handleChange("endDate", date)}
name="endDate"
/>
</div>
<div className="flex justify-center space-x-10 pt-6">
<button
className=" bg-green-700 hover:bg-green-900 font-semibold text-amber-950"
onClick={saveItinerary}
>
Submit
</button>
<div className="bg-gray-400 pt-10 pb-4 mt-10 mx-10 mb-20">
<div>
<h1 className="underline underline-offset-4 px-5 py-4 text-amber-950">
Create Itinerary for {parkDetails.name}
</h1>
</div>
<div>
<p className="font-semibold">Trip Start date:</p>
<DatePicker
showIcon
toggleCalendarOnIconClick
selected={itinerary.startDate}
selectsStart
startDate={startDate}
endDate={endDate}
onChange={(date) => handleChange("startDate", date)}
name="startDate"
/>
</div>
<div>
<p className="font-semibold">Trip End date:</p>
<DatePicker
showIcon
toggleCalendarOnIconClick
selected={itinerary.endDate}
selectsEnd
startDate={startDate}
endDate={endDate}
minDate={startDate}
onChange={(date) => handleChange("endDate", date)}
name="endDate"
/>
</div>
<div className="flex justify-center space-x-10 pt-6">
<button
className=" bg-green-700 hover:bg-green-900 font-semibold text-amber-950"
onClick={saveItinerary}
>
Submit
</button>

<button
className="bg-red-700 hover:bg-red-900 font-semibold text-amber-950"
onClick={reset}
>
Reset
</button>
</div>
<button
className="bg-red-700 hover:bg-red-900 font-semibold text-amber-950"
onClick={reset}
>
Reset
</button>
</div>
</>
);
</div>
</>
);
}

export default Itinerary
export default Itinerary

0 comments on commit cb8eb00

Please sign in to comment.