80 lines
2.9 KiB
JavaScript
80 lines
2.9 KiB
JavaScript
//Page2.js
|
|
|
|
import React, { useState } from "react";
|
|
import { Link } from "react-router-dom";
|
|
import './Page2.css'; // CSS File import
|
|
|
|
// Import images from the src/components folder
|
|
import image from './components/image.png';
|
|
import somaiyatrust from './components/somaiyatrust.png';
|
|
import redlines from './components/redlines.png';
|
|
|
|
const Page2 = () => {
|
|
const [selectedStream, setSelectedStream] = useState(null);
|
|
|
|
// Handle stream click to display content
|
|
const handleStreamClick = (stream) => {
|
|
setSelectedStream(stream);
|
|
};
|
|
|
|
return (
|
|
<div className="page-container">
|
|
{/* Header Bar */}
|
|
<header className="header-bar">
|
|
<img src={image} alt="Left Logo" className="leftlogo" />
|
|
<h1 className="college-name">Somaiya Scheduler</h1>
|
|
<img src={somaiyatrust} alt="Right Logo" className="rightlogo" />
|
|
</header>
|
|
|
|
{/* Navigation Bar */}
|
|
<nav className="navbar">
|
|
<ul>
|
|
<li><Link to="/page2">Home</Link></li>
|
|
<li><a href="#">Schedule</a></li>
|
|
<li><Link to="/page5">Meeting DataBase</Link></li>
|
|
<li><Link to="/page6">Edit DataBase</Link></li>
|
|
<li><Link to="/">Log Out</Link></li>
|
|
</ul>
|
|
</nav>
|
|
|
|
{/* Main Content Container */}
|
|
<div className="main-container">
|
|
{/* Stream Bar (Right Side) */}
|
|
<div className="stream-bar" id="streamBar">
|
|
<h3>Streams</h3>
|
|
<ul>
|
|
<li onClick={() => handleStreamClick("Engineering & Technology")}><Link to="/page4">Engineering & Technology</Link></li>
|
|
<li onClick={() => handleStreamClick("Management")}>Management Studies</li>
|
|
<li onClick={() => handleStreamClick("Education")}>Education</li>
|
|
<li onClick={() => handleStreamClick("Dharama")}>Dharama Studies</li>
|
|
<li onClick={() => handleStreamClick("Commerce")}>Commerce & Business Studies</li>
|
|
<li onClick={() => handleStreamClick("Science")}>Science</li>
|
|
<li onClick={() => handleStreamClick("Humanities")}>Humanities & Social Science</li>
|
|
<li onClick={() => handleStreamClick("Music")}>Music Performance & Art</li>
|
|
<li onClick={() => handleStreamClick("Language")}>Language & Literature</li>
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Content Area (Left Side) */}
|
|
<div className="content-area" id="contentArea">
|
|
{selectedStream ? (
|
|
<p>You selected <strong>{selectedStream}</strong>. Here are the programs and faculty details.</p>
|
|
) : (
|
|
<p>Select a stream to view its programs and faculty.</p>
|
|
)}
|
|
</div>
|
|
</div>
|
|
|
|
{/* Footer */}
|
|
<footer>
|
|
<div className="terms">
|
|
<a href="#">Terms and Policies</a>
|
|
<img src={redlines} alt="Footer Logo" className="footer-image" />
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Page2;
|