Commit 3e9a1b16 authored by Choi Ga Young's avatar Choi Ga Young
Browse files

studyplan관련

parent 13c2b712
...@@ -13,6 +13,7 @@ const StudyPlanCard = () => { ...@@ -13,6 +13,7 @@ const StudyPlanCard = () => {
<> <>
<div className="d-flex justify-content-center mt-3"> <div className="d-flex justify-content-center mt-3">
<div className="card" style={{ width: "20rem" }}> <div className="card" style={{ width: "20rem" }}>
<Link className="text-decoration-none link-dark" to="/studyplan/:">
<div className="card-body"> <div className="card-body">
<div className="d-flex justify-content-between"> <div className="d-flex justify-content-between">
<h5 className="card-title col-10">운영체제</h5> <h5 className="card-title col-10">운영체제</h5>
...@@ -31,6 +32,7 @@ const StudyPlanCard = () => { ...@@ -31,6 +32,7 @@ const StudyPlanCard = () => {
<input className={`form-check-input shadow-none ${styles.checkBox}`} type="checkbox" /> <input className={`form-check-input shadow-none ${styles.checkBox}`} type="checkbox" />
</div> </div>
</div> </div>
</Link>
</div> </div>
</div> </div>
{/*계획 없을 때 보여질 카드*/} {/*계획 없을 때 보여질 카드*/}
......
...@@ -13,7 +13,7 @@ const StudyPlanEditForm = () => { ...@@ -13,7 +13,7 @@ const StudyPlanEditForm = () => {
useEffect(() => { useEffect(() => {
let isMounted = true; let isMounted = true;
const checkInfo = { studyplanTitle: studyplan.studyplanTitle, endDate: studyplan.endDate, memo: studyplan.memo } const checkInfo = { studyplanTitle: studyplan.studyplanTitle, endDate: studyplan.endDate}
if (studyplan.deadline !== "on") { if (studyplan.deadline !== "on") {
checkInfo.endTime = studyplan.endTime checkInfo.endTime = studyplan.endTime
} else { } else {
......
...@@ -12,7 +12,7 @@ const SubjectForm = () => { ...@@ -12,7 +12,7 @@ const SubjectForm = () => {
useEffect(() => { useEffect(() => {
let isMounted = true; let isMounted = true;
const checkInfo = { lectureName: subject.lectureName, prof: subject.prof, classRoom: subject.classRoom } const checkInfo = { lectureName: subject.lectureName }
if (isMounted) { if (isMounted) {
const isSubject = Object.values(checkInfo).every((el) => Boolean(el)); const isSubject = Object.values(checkInfo).every((el) => Boolean(el));
...@@ -34,15 +34,15 @@ const SubjectForm = () => { ...@@ -34,15 +34,15 @@ const SubjectForm = () => {
<div> <div>
<div className="mb-5 d-flex flex-row"> <div className="mb-5 d-flex flex-row">
<label className="form-label fs-4" style={{ width: "100px" }}>강의명</label> <label className="form-label fs-4" style={{ width: "100px" }}>강의명</label>
<input className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0" name="lectureName" onChange={handleChange} /> <input className={`form-control shadow-none rounded-0 ${styles.textInput}`} name="lectureName" onChange={handleChange} />
</div> </div>
<div className="mb-5 pt-2 d-flex flex-row"> <div className="mb-5 pt-2 d-flex flex-row">
<label className="form-label fs-4" style={{ width: "100px" }}>교수명</label> <label className="form-label fs-4" style={{ width: "100px" }}>교수명</label>
<input className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0" name="prof" onChange={handleChange} /> <input className={`form-control shadow-none rounded-0 ${styles.textInput}`} name="prof" onChange={handleChange} />
</div> </div>
<div className="mb-5 pt-2 d-flex flex-row"> <div className="mb-5 pt-2 d-flex flex-row">
<label className="form-label fs-4 " style={{ width: "100px" }}>&nbsp;&nbsp;</label> <label className="form-label fs-4 " style={{ width: "100px", letterSpacing: "15px" }}></label>
<input className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0" name="classRoom" onChange={handleChange} /> <input className={`form-control shadow-none rounded-0 ${styles.textInput}`} name="classRoom" onChange={handleChange} />
</div> </div>
</div> </div>
<div className="pt-2"> <div className="pt-2">
......
import PlanItem from "./PlanItem.js";
import styles from "./studyplan.module.scss";
const AddplanList = () => {
return (
<div className={`mt-5 ${styles.list}`}>
<div className={`accordion accordion-flush`} id="addplanlist">
<PlanItem />
<PlanItem />
<PlanItem />
</div>
</div>
)
}
export default AddplanList
\ No newline at end of file
import { useState } from "react";
import { Link } from "react-router-dom";
import catchErrors from "../../utils/catchErrors.js";
import styles from "../Schedule/schedule.module.scss";
import styles2 from "./studyplan.module.scss";
const PlanItem = () => {
const [error, setError] = useState("")
async function delSchedule() {
try {
setError("")
alert("해당 일정을 삭제했습니다.")
window.location.reload()
} catch (error) {
catchErrors(error, setError)
}
}
return (
<div className="d-flex">
<input className={`form-check-input rounded-0 shadow-none mt-1 ${styles2.checkBox}`} style={{width:"5%"}} type="checkbox" />
<div className="accordion-item border-0 col" style={{width:"95%"}}>
<button className={`d-flex flex-column align-items-start accordion-button collapsed bg-white shadow-none px-0 pt-0 ps-3 ${styles.activeBtn}`} type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">
<h5 className={`accordion-header ${styles.title}`} id="flush-headingOne">
과제02 제출하기, 코딩과제 있음ssssssssss
</h5>
<p className={`text-secondary mb-0 ${styles.time}`}>~21.09.30 16:00</p>
</button>
<div id="flush-collapseOne" className="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="S#addplanlist">
<div className={`accordion-body px-0 pt-2 pb-0 mb-3 ${styles.textBox}`}>
컴퓨터의 프로세스 체크하는 프로그램 만들기 과제<br />결과화면 캡쳐해서 exe파일이랑 함께 압축하여 제출하기
<div className="d-flex justify-content-end mt-3">
<Link className="btn btn-light btn-sm border-dark" to="/studyplan/edit">수정</Link>
<button type="button" className="btn btn-crimson btn-sm ms-2" onClick={delSchedule}>삭제</button>
</div>
</div>
</div>
</div>
</div>
)
}
export default PlanItem;
\ No newline at end of file
.list {
height: 70vh;
overflow-y: auto;
}
.checkBox {
border-color: black;
&:focus {
border-color: black;
}
&:checked {
border-color: crimson;
background-color: crimson;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' d='M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}
}
import Menu from "../components/Menu/Menu.js"; import Menu from "../components/Menu/Menu.js";
import BackBtn from "../components/Buttons/BackBtn.js"; import BackBtn from "../components/Buttons/BackBtn.js";
import Footer from "../components/Footer.js"; import Footer from "../components/Footer.js";
import AddplanList from "../components/StudyPlan/AddplanList.js";
const StudyPlanPage = () => { const StudyPlanPage = () => {
return ( return (
<> <>
<Menu /> <Menu />
<BackBtn /> <BackBtn />
<h2 className="text-center">운영체제</h2>
<AddplanList />
<Footer pathname="studyplan/edit" /> <Footer pathname="studyplan/edit" />
</> </>
) )
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment