Skip to content

Commit

Permalink
Merge
Browse files Browse the repository at this point in the history
  • Loading branch information
erica-dong committed Jan 13, 2024
2 parents 87113e7 + 7160fb1 commit dbfb3ac
Show file tree
Hide file tree
Showing 5 changed files with 338 additions and 72 deletions.
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -21,3 +21,5 @@
npm-debug.log*
yarn-debug.log*
yarn-error.log*

*/package-lock.json
5 changes: 4 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,14 @@
"private": true,
"dependencies": {
"@ant-design/icons": "^5.2.6",
"@ant-design/pro-components": "^2.6.43",
"@emotion/react": "^11.11.3",
"@table-library/react-table-library": "^4.1.7",
"antd": "^5.12.8",
"antd": "^5.13.0",
"dayjs": "^1.11.10",
"elkjs": "^0.9.1",
"install": "^0.13.0",
"npm": "^10.3.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-firebase-hooks": "^5.1.1",
Expand Down
169 changes: 159 additions & 10 deletions src/components/Dashboard/Dashboard.js
Original file line number Diff line number Diff line change
@@ -1,24 +1,61 @@
import { useState } from "react";
import { useNavigate } from "react-router";
import "./Dashboard.css";
import { Button, Form, Layout, Menu, theme } from "antd";
import { Button, ConfigProvider, Dropdown, Form, Input, Layout, Menu, Modal, Select, theme } from "antd";

import { MenuFoldOutlined, MenuUnfoldOutlined, ApartmentOutlined, FileTextOutlined } from "@ant-design/icons";

import { MenuFoldOutlined, MenuUnfoldOutlined, ApartmentOutlined, FileTextOutlined, UserOutlined } from "@ant-design/icons";
import ReactFlow, { Background, MarkerType } from 'reactflow';
import Flow from './Flow.js';
import RequirementsSidebar from './Requirements/Requirements.js';
import Table from "../Table/Table.jsx"

import 'reactflow/dist/style.css';

var data = require('./Courses.json');

const { Option } = Select;
const { Header, Sider, Content } = Layout;
var data = require('./Courses.json');

function Dashboard() {

const [collapsed, setCollapsed] = useState(false);

const handleClose = () => {
setSignup(false);
}

let [first, setFirst] = useState("");
let [last, setLast] = useState("");
let [year, setYear] = useState("");
let [major, setMajor] = useState("");

const items2 = [
{
key: '1',
label: (
<a target="_blank" rel="noopener noreferrer" href="https://www.antgroup.com">
1st menu item
</a>
),
},
{
key: '2',
label: (
<a target="_blank" rel="noopener noreferrer" href="https://www.aliyun.com">
2nd menu item
</a>
),
},
{
key: '3',
label: (
<a target="_blank" rel="noopener noreferrer" href="https://www.luohanacademy.com">
3rd menu item
</a>
),
},
];

const initialNodes = [
{ id: '1', position: { x: 0, y: 0 }, data: { label: '1' } },
{ id: '2', position: { x: 0, y: 100 }, data: { label: '2' } },
Expand All @@ -28,6 +65,10 @@ function Dashboard() {

let [edges, setEdges] = useState({});

let [tab, setTab] = useState(0);

let [signup, setSignup] = useState(true);


const initialEdges = [{ id: 'e1-2', source: '1', target: '2' }];

Expand Down Expand Up @@ -204,7 +245,7 @@ function Dashboard() {

const navigate = useNavigate();

let [tab, setTab] = useState(1);
let [q, setQ] = useState(1);

let windowContent
if (tab == 1) {
Expand All @@ -221,17 +262,23 @@ function Dashboard() {
{/* <ReactFlow nodes={nodes} edges={initialEdges} /> */}
</Content>;
} else {
windowContent = <Table />
// windowContent = <Table />
}

return (
<>
<ConfigProvider
theme={{
token: {
colorPrimary: '#AB2B37',

},
}}
>
<Layout style={{ height: "100vh" }}>
<Sider trigger={null} collapsible collapsed={collapsed}>
<div className="demo-logo-vertical" />
<Menu
onClick={(e) => {
setTab(e.key);
}}
theme="dark"
mode="inline"
defaultSelectedKeys={['1']}
Expand All @@ -240,12 +287,26 @@ function Dashboard() {
key: '1',
icon: <ApartmentOutlined />,
label: 'Roadmap',
onClick: () => {
setTab(0);
}
},
{
key: '2',
icon: <FileTextOutlined />,
label: 'Tracking Sheet',
onClick: () => {
setTab(1);
}
},
{
key: '3',
icon: <UserOutlined />,
label: 'Profile',
onClick: () => {
setTab(2);
}
}
]}
/>
</Sider>
Expand Down Expand Up @@ -279,10 +340,98 @@ function Dashboard() {
}}
/>
</Header>
{windowContent}
<Content
style={{
margin: '24px 16px',
padding: 24,
minHeight: 280,
background: colorBgContainer,
borderRadius: borderRadiusLG,
}}
>
{
tab == 0 ? <Flow initialNodes={nodes} initialEdges={edges} /> : tab == 1 ? <h1>Tracking Sheet</h1> :
<><h1>Profile</h1>
<h3>First Name: {first}</h3>
<h3>Last Name: {last}</h3>
<h3>Year: {year}</h3>
<h3>Major: {major}</h3>
</>
}

{/* <ReactFlow nodes={nodes} edges={initialEdges} /> */}
</Content>
<RequirementsSidebar switchTree={() => { }} />
</Layout>
</Layout>
<Modal title="Get Started!" open={signup} onClose={handleClose} footer={[]}>

<p>Tell us a little bit about yourself to customize your roadmap experience!</p>
<br></br>
<Form>
<Form.Item style={{
width: "50%",
}}>
<Input placeholder="First Name" size="medium" width={200} onChange={(e) => { setFirst(e.target.value)
}}></Input>
</Form.Item>
<Form.Item style={{
width: "50%",
}}>
<Input placeholder="Last Name" size="medium" width={200} onChange={(e) => { setLast(e.target.value)
}}
/>
</Form.Item>
<Form.Item style={{
width: "50%",
}}>
<Select
size="medium"
onChange={(value) => {
setYear(value);
}}
>
<Option value="Freshman">Freshman</Option>
<Option value="Sophomore">Sophomore</Option>
<Option value="Junior">Junior</Option>
<Option value="Senior">Senior</Option>
</Select>
</Form.Item>

<Form.Item style={{
width: "50%",
}}>
<Select
size="medium"
onChange={(value) => {
setMajor(value);
}}
>
<Option value="Computer Science">Computer Science</Option>
<Option value="Mechanical Engineering">Mechanical Engineering</Option>
<Option value="Robotics Engineering">Robotics Engineering</Option>
<Option value="Electrical Engineering">Electrical Engineering</Option>
<Option value="Biomedical Engineering">Biomedical Engineering</Option>
<Option value="Chemical Engineering">Chemical Engineering</Option>
<Option value="Aerospace Engineering">Aerospace Engineering</Option>
<Option value="Civil Engineering">Civil Engineering</Option>
<Option value="Biology">Biology</Option>
<Option value="Physics">Physics</Option>
<Option value="IMGD">IMGD</Option>
<Option value="Humanities">Humanities</Option>
</Select>
</Form.Item>

<Form.Item>
<Button type="primary" htmlType="submit" onClick={() => { setSignup(false) }}>
Signup
</Button>
</Form.Item>
</Form>
</Modal>
</ConfigProvider>

</>
);
}

Expand Down
4 changes: 2 additions & 2 deletions src/components/DataParse/DataParse.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ function DataParse({ course_code }) {
for (let i = 0; i < data["Report_Entry"].length; i++) {
// console.log(data["Report_Entry"][i]["Course_Title"].slice(0, data["Report_Entry"][i]["Course_Title"].indexOf(" - ")).trim());
console.log(data["Report_Entry"][i] && data["Report_Entry"][i]["Course_Title"].slice(0, data["Report_Entry"][i]["Course_Title"].indexOf(" - ")).trim(), course_code);
if (data["Report_Entry"][i] && data["Report_Entry"][i]["Course_Title"].slice(0, data["Report_Entry"][i]["Course_Title"].indexOf(" - ")).trim() == course_code.trim()) {
if (data["Report_Entry"][i] && data["Report_Entry"][i]["Course_Title"].slice(0, data["Report_Entry"][i]["Course_Title"].indexOf(" - ")).trim() == course_code.trim() && data["Report_Entry"][i].Instructors != "") {
classComponents.push(<ClassCard key={i} index={i} />);
console.log("pushed");
}
Expand All @@ -35,7 +35,7 @@ function DataParse({ course_code }) {
<ClassCard key={value} index={value} />
))} */}
<br></br>
{arraything.length > 0 && <Pagination simple defaultCurrent={1} defaultPageSize={1} current={currentSlide} total={arraything.length} onChange={(page, pageSize) => setCurrentSlide(page)} />}
{arraything.length > 0 && <Pagination simple defaultCurrent={0} defaultPageSize={1} current={currentSlide} total={arraything.length - 1} onChange={(page, pageSize) => setCurrentSlide(page)} />}
</>
);
}
Expand Down
Loading

0 comments on commit dbfb3ac

Please sign in to comment.