[FEAT] 산학협력 프로젝트 문의 페이지

src/app/(user)/infodesk/inquiries/page.tsx

@@ -1,3 +1,75 @@
+"use client";
+
+import React from "react";
+//import { useRouter } from "next/navigation"; // Import the Next.js router
+
+import { SubHeadNavbar } from "@/components/common/SubHeadNavbar/SubHeadNavbar";
+import { Banner } from "@/components/common/Banner/Banner";
+import { Noticeboard, IBoardItem } from "@/components/common/Noticeboard/Noticeboard";
+import { PrimaryButton } from "@/components/common/Buttons/PrimaryButton/PrimaryButton"; // Import PrimaryButton
+
+import classes from "./projectQA.module.css";
+
 export default function InquiriesPage() {
-  return <main>Hello, world!</main>;
+  // const router = useRouter(); // Initialize the router
+
+  const heading = "프로젝트 문의";
+  const classifier = {
+    labels: ["전체", "제목", "내용", "제목+내용", "작성자"],
+    defaultLabel: 0,
+    searchPlaceholder: "검색어를 입력하세요",
+  };
+
+  const items: IBoardItem[] = [
+    {
+      title: "프로젝트 문의입니다",
+      number: 1,
+      author: "관리자",
+      date: new Date("2024-08-01"),
+      view: 150,
+      pinned: true,
+      href: "/inquiries/1",
+    },
+    {
+      title: "프로젝트 문의입니다",
+      number: 2,
+      author: "관리자",
+      date: new Date("2024-08-05"),
+      view: 100,
+      pinned: false,
+      href: "/inquiries/2",
+    },
+    // More items can be added here
+  ];
+
+  //const handleButtonClick = () => {
+  //router.push("/inquiries/write");
+  //};
+
+  return (
+    <>
+      <div className={classes.subHeadNavbar}>
+        <SubHeadNavbar title="Info Desk" />
+      </div>
+
+      <div className={classes.banner}>
+        <Banner
+          type="IND_UNIV_PROJECT"
+          title="산학협력 프로젝트"
+          subtitle="Industry-Academia Collaboration Project"
+          text="성균관대학교 소프트웨어융합대학과 기업들이 협약을 맺고, 기업이 필요로 하는 주제를 바탕으로 실무 중심의 프로젝트를 수행합니다."
+          width="100%"
+        />
+      </div>
+
+      <div className={classes.mainContent}>
+        <Noticeboard heading={heading} classifier={classifier} items={items} />
+
+        <PrimaryButton
+          label="작성하기"
+          style={{ position: "absolute", bottom: "120px", right: "20px" }} // Position the button
+        />
+      </div>
+    </>
+  );
 }

src/app/(user)/infodesk/inquiries/projectQA.module.css

@@ -0,0 +1,44 @@
+/* Full-width navbar */
+.subHeadNavbar {
+  width: 100%;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+/* Banner section */
+.banner {
+  width: 100%;
+  padding: 0;
+  box-sizing: border-box;
+  margin-bottom: 20px;
+}
+
+/* Main content section */
+.mainContent {
+  width: 80%;
+  max-width: 1440px;
+  margin: 0 auto;
+  padding: 20px;
+  box-sizing: border-box;
+  padding-bottom: 200px;
+  padding-top: 80px;
+  position: relative;
+}
+
+/** 데스크탑 */
+
+@media screen and (max-width: 480px) {
+  /** 모바일 세로 */
+}
+
+@media screen and (max-width: 768px) {
+  /** 모바일 가로, 태블릿 세로 */
+}
+
+@media screen and (max-width: 1024px) {
+  /** 태블릿 가로 */
+}
+
+@media screen and (max-width: 1280px) {
+  /** 태블릿 가로, 노트북 */
+}

src/app/(user)/infodesk/inquiries/write/page.tsx

@@ -1,3 +1,94 @@
+"use client";
+
+import React from "react";
+import { SubHeadNavbar } from "@/components/common/SubHeadNavbar/SubHeadNavbar";
+import { Banner } from "@/components/common/Banner/Banner";
+import { TextInput } from "@/components/common/TextInput";
+import { CheckBox } from "@/components/common/CheckBox/CheckBox";
+import { PrimaryButton } from "@/components/common/Buttons/PrimaryButton/PrimaryButton";
+
+import classes from "./writeQA.module.css";
+
 export default function InquiryWritePage() {
-  return <main>Hello, world!</main>;
+  return (
+    <>
+      <div className={classes.subHeadNavbar}>
+        <SubHeadNavbar title="Info Desk" />
+      </div>
+
+      <div className={classes.banner}>
+        <Banner
+          type="IND_UNIV_PROJECT"
+          title="산학협력 프로젝트"
+          subtitle="Industry-Academia Collaboration Project"
+          text="성균관대학교 소프트웨어융합대학과 기업들이 협약을 맺고, 기업이 필요로 하는 주제를 바탕으로 실무 중심의 프로젝트를 수행합니다."
+          width="100%"
+        />
+      </div>
+
+      <div className={classes.mainContent}>
+        <h1 className={classes.heading}>산학협력 과제 제안</h1>
+
+        <div className={classes.formRow}>
+          <TextInput label="이메일" placeholder="이메일을 입력하세요" />
+        </div>
+
+        <div className={classes.formRow}>
+          <TextInput label="웹사이트" placeholder="웹사이트를 입력하세요" />
+        </div>
+
+        <div className={classes.formRow}>
+          <TextInput label="프로젝트명" placeholder="프로젝트명을 입력하세요" />
+        </div>
+
+        <div className={classes.formRow}>
+          <label>프로젝트 분야</label>
+          <div className={classes.checkboxGroup}>
+            <CheckBox label="AI" />
+            <CheckBox label="Web Development" />
+            <CheckBox label="Mobile App" />
+          </div>
+        </div>
+
+        <div className={classes.formRow}>
+          <TextInput label="제목" placeholder="제목을 입력하세요" />
+        </div>
+
+        <div className={classes.formRow}>
+          <TextInput label="과제 요약" placeholder="과제 요약을 입력하세요" />
+        </div>
+
+        <div className={classes.formRow}>
+          <TextInput label="과제 설명" placeholder="과제 설명을 입력하세요" />
+        </div>
+
+        <div className={classes.formRow}>
+          <PrimaryButton label="첨부파일 추가" />
+        </div>
+
+        <div className={classes.formFile}>
+          <div className={classes.InputWrapper}>
+            <TextInput label="첨부파일 1" placeholder="" />
+          </div>
+          <div className={classes.buttonWrapper}>
+            <PrimaryButton label="삭제" style={{ backgroundColor: "#FF6B6B" }} />
+          </div>
+        </div>
+
+        <div className={classes.formFile}>
+          <div className={classes.InputWrapper}>
+            <TextInput label="첨부파일 2" placeholder="" />
+          </div>
+          <div className={classes.buttonWrapper}>
+            <PrimaryButton label="삭제" style={{ backgroundColor: "#FF6B6B" }} />
+          </div>
+        </div>
+
+        <div className={classes.formActions}>
+          <PrimaryButton label="작성하기" style={{ marginRight: "10px" }} />
+          <PrimaryButton label="목록으로" />
+        </div>
+      </div>
+    </>
+  );
 }