하석형 하석형 2023-02-16
230216 하석형 장비 문의 관리, 장비 대여 관리 페이지 추가
@c018fedc48fa02d968efa05972390376fd50b4bc
client/views/pages/AppRoute.jsx
--- client/views/pages/AppRoute.jsx
+++ client/views/pages/AppRoute.jsx
@@ -60,6 +60,8 @@
 import Questionnaire_government from "./healthcare/Questionnaire_government.jsx";
 import VisitSelect_government from "./visit/visit/VisitSelect_government.jsx";
 import QandA_government from "./callcenter/QandA_government.jsx";
+import EquipmentInquiry_admin from "./equipment/EquipmentInquiry_admin.jsx";
+import EquipmentManagementSelect_agency from "./equipment/EquipmentManagementSelect_agency.jsx";
 
 const AllAppMenuItems = [
   {
@@ -97,7 +99,7 @@
       },
       {
         title: "장비 문의 관리",
-        path: "/EquipmentManagementSelect",
+        path: "/EquipmentInquiry_admin",
         icon: (
           <SettingsIcon
             sx={{ fontSize: 20, color: "#ffffff", marginRight: 1 }}
@@ -242,8 +244,8 @@
         ),
       },
       {
-        title: "장비 대여 관리x",
-        // path: "/EquipmentInquiry",
+        title: "장비 대여 관리",
+        path: "/EquipmentManagementSelect_agency",
         icon: (
           <SettingsIcon
             sx={{ fontSize: 20, color: "#ffffff", marginRight: 1 }}
@@ -363,6 +365,8 @@
         <Route path="/Questionnaire_government" element={<Questionnaire_government />}></Route>
         <Route path="/VisitSelect_government" element={<VisitSelect_government />}></Route>
         <Route path="/QandA_government" element={<QandA_government />}></Route>
+        <Route path="/EquipmentInquiry_admin" element={<EquipmentInquiry_admin />}></Route>
+        <Route path="/EquipmentManagementSelect_agency" element={<EquipmentManagementSelect_agency />}></Route>
       </Routes>
   );
 }
 
client/views/pages/equipment/EquipmentInquiry_admin.jsx (added)
+++ client/views/pages/equipment/EquipmentInquiry_admin.jsx
@@ -0,0 +1,69 @@
+import React from "react";
+import Button from "../../component/Button.jsx";
+import Table from "../../component/Table.jsx";
+import Modal from "../../component/Modal.jsx";
+import { useNavigate } from "react-router";
+import ContentTitle from "../../component/ContentTitle.jsx";
+
+export default function EquipmentInquiry_admin() {
+  const navigate = useNavigate();
+  //게시판
+  const thead = [
+    "No",
+    "장비명",
+    "시리얼 넘버",
+    "기관명",
+    "요청자",
+    "요청일자",
+    "구분",
+    "처리여부",
+  ];
+  const key = [
+    "No",
+    "equipment_name",
+    "serialNumber",
+    "agency",
+    "name",
+    "date",
+    "category",
+    "finish"
+  ];
+  const content = [
+    {
+      No: 2,
+      equipment_name: "스마트약상자",
+      serialNumber: "ABCD-2",
+      agency: "B복지관",
+      name: "정복지",
+      date: "2023-02-02",
+      category: "수리",
+      finish: "처리중",
+    },
+    {
+      No: 1,
+      equipment_name: "스마트약상자",
+      serialNumber: "ABCD-1",
+      agency: "A복지관",
+      name: "김상냥",
+      date: "2023-01-27",
+      category: "교환",
+      finish: "처리완료",
+    },
+
+  ];
+  return (
+    <main>
+      <div className="content-wrap">
+        <ContentTitle contentTitle={"장비 문의 요청"} />
+        <div className="board-wrap">
+          <div className="btn-wrap flex-end margin-bottom">
+            <Button className={"btn-small green-btn "} btnName={"삭제"} />
+          </div>
+          <Table className="equipment-detail" head={thead} contents={content} contentKey={key} onClick={() => {
+                navigate("/CallSelect");
+              }}/>
+        </div>
+      </div>
+    </main>
+  );
+}
 
client/views/pages/equipment/EquipmentManagementSelect_agency.jsx (added)
+++ client/views/pages/equipment/EquipmentManagementSelect_agency.jsx
@@ -0,0 +1,276 @@
+import React from "react";
+import Table from "../../component/Table.jsx";
+import Button from "../../component/Button.jsx";
+import SubTitle from "../../component/SubTitle.jsx";
+import Modal from "../../component/Modal.jsx";
+import Category from "../../component/Category.jsx";
+import { useNavigate } from "react-router";
+
+
+export default function EquipmentManagementSelect_agency() {
+  
+  const [modalOpen, setModalOpen] = React.useState(false);
+  const openModal = () => {
+    setModalOpen(true);
+  };
+  const closeModal = () => {
+    setModalOpen(false);
+  };
+  const navigate = useNavigate();
+  const thead1 = [
+    "No",
+    "시리얼 넘버",
+    "기기 종류",
+    "모델 명",
+    "대여 가능 여부",
+    "기기 상태",
+    "사용자",
+    "기기 관리"
+  ];
+  const key1 = [
+    "No",
+    "serialNumber",
+    "type",
+    "equipment_name",
+    "use",
+    "state",
+    "name",
+    "management"
+  ];
+  const content1 = [
+    {
+      No: 2,
+      type: "스마트약상자",
+      equipment_name: "SMB-MB100",
+      serialNumber: "ABCD-2",
+      use: "대여 가능",
+      state: "정상",
+      name: "-",
+      management: (
+        <Button
+          className={"btn-small gray-btn"}
+          btnName={"매칭"}
+          onClick={openModal}
+        />
+      )
+    },
+    {
+      No: 1,
+      type: "스마트약상자",
+      equipment_name: "SMB-MB100",
+      serialNumber: "ABCD-1",
+      use: "대여 중",
+      state: "정상",
+      name: "홍길동",
+      management: (
+        <Button
+          className={"btn-small gray-btn"}
+          btnName={"반납"}
+          onClick={openModal}
+        />
+      )
+    },
+  ];
+
+  const thead2 = [
+    "No",
+    "시리얼 넘버",
+    "기기 종류",
+    "모델 명",
+    "대여 가능 여부",
+    "기기 상태",
+    "사용자",
+    "기기 관리"
+  ];
+  const key2 = [
+    "No",
+    "serialNumber",
+    "type",
+    "equipment_name",
+    "use",
+    "state",
+    "name",
+    "management"
+  ];
+  const content2 = [
+    {
+      No: 1,
+      type: "스마트약상자",
+      equipment_name: "SMB-MB100",
+      serialNumber: "ABCD-2",
+      use: "대여 가능",
+      state: "정상",
+      name: "-",
+      management: (
+        <Button
+          className={"btn-small gray-btn"}
+          btnName={"매칭"}
+          onClick={openModal}
+        />
+      )
+    },
+  ];
+
+  const thead3 = [
+    "No",
+    "장비명",
+    "시리얼 넘버",
+    "입고일자",
+    "납품 기관",
+  ];
+  const key3= [
+    "No",
+    "equipment_name",
+    "serialNumber",
+    "name",
+    "management",];
+  const content3 = [
+    {
+      No: 1,
+      equipment_name: "스마트약상자",
+      serialNumber: "ABCD-1",
+      name: "2022.12.02",
+      management: (
+        <Button
+          className={"btn-small gray-btn"}
+          btnName={"선택"}
+          onClick={openModal}
+        />
+      )
+    },
+    {
+      No: 2,
+      equipment_name: "스마트약상자",
+      serialNumber: "ABCD-1",
+      name: "2022.12.02",
+      management: (<Button
+      className={"btn-small gray-btn"}
+      btnName={"선택"}
+      onClick={openModal}
+    />)
+    },
+  ];
+  const thead4 = [
+    "No",
+    "기관명",
+    "선택하기",
+  ];
+  const key4 = [
+    "No",
+    "equipment_name",
+    "serialNumber",
+  ];
+  const content4 = [
+    {
+      No: 1,
+      equipment_name: (
+        <div>
+          <Category />
+        </div>
+      )
+      ,
+      serialNumber: (<Button
+        className={"btn-small gray-btn"}
+        btnName={"선택"}
+      />)
+
+    },
+  ];
+
+
+
+  const data = [
+    {
+      id: 1,
+      title: "장비 전체(100)",
+      description: (
+        <div>
+        <Table
+          className={"caregiver-user"}
+          head={thead1}
+          contents={content1}
+          contentKey={key1}
+        />
+      </div>  
+      ),
+    },
+    {
+      id: 2,
+      title: "재고 장비(1)",
+      description: (
+        <div>
+          <Table
+            className={"caregiver-user"}
+            head={thead2}
+            contents={content2}
+            contentKey={key2}
+          />
+        </div>      
+      ),
+    },
+  ];
+  const [index, setIndex] = React.useState(1);
+  return (
+    <main>
+      <Modal open={modalOpen} close={closeModal} header="납품 기관 선택">
+        <div className="board-wrap">
+          <div>
+            <Table
+              className={"caregiver-user"}
+              head={thead4}
+              contents={content4}
+              contentKey={key4}
+            />
+          </div>
+          <div>
+            <Button
+              className={"btn-100 green-btn"}
+              btnName={"닫기"}
+              onClick={closeModal}
+            />
+          </div>
+        </div>
+      </Modal>
+      <div className="tab-container">
+        <ul className="tab-menu">
+          {data.map((item) => (
+            <li
+              key={item.id}
+              className={index === item.id ? "active" : null}
+              onClick={() => setIndex(item.id)}
+            >
+              {item.title}
+            </li>
+          ))}
+        </ul>
+        <div className="content-wrap">
+          <div className="search-management flex-end margin-bottom2">
+            <select name="management-agency">
+              <option value="기관전체">기관전체</option>
+              <option value="대구보훈병원">복지재단1</option>
+              <option value="군위군청">복지재단2</option>
+              <option value="군위군청">복지재단3</option>
+            </select>
+            <select>
+              <option value="이름">이름</option>
+              <option value="아이디">아이디</option>
+            </select>
+            <input type="text" />
+            <Button
+              className={"btn-small gray-btn"}
+              btnName={"검색"}
+              onClick={() => navigate("")}
+            />
+          </div>
+          <ul className="tab-content">
+            {data
+              .filter((item) => index === item.id)
+              .map((item) => (
+                <li>{item.description}</li>
+              ))}
+          </ul>
+        </div>
+      </div>
+    </main>
+  );
+}
Add a comment
List