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";
import RestoreFromTrashIcon from '@mui/icons-material/RestoreFromTrash';


export default function QandASelect() {
  const navigate = useNavigate();
  //게시판
  const thead = [
    "No",
    "장비명",
    "시리얼 넘버",
    "작성자",
    "기관명",
    "요청일자",
    "구분",
    "처리여부",
    "내용상세보기",
    "삭제"
  ];
  const key = [
    "No",
    "equipment_name",
    "serialNumber",
    "writer",
    "name",
    "date",
    "category",
    "finish",
    "show",
    "delete"
  ];
  const content = [
    {
      No: 1,
      equipment_name: "스마트약상자",
      serialNumber: "ABCD-1",
      writer: "홍길동",
      name: "A복지관",
      date: "2023-01-27",
      category: "교환",
      finish:"처리중", 
      show:  (
        <Button
          className={"btn-small gray-btn"}
          btnName={"상세보기"}
          onClick={() => {
            navigate("/QandAConfirm");
          }}
        />
      ),
      delete: (
        <RestoreFromTrashIcon sx={{ width: "30px", height: "30px", }} />
      ),
    },

  ];
  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={"등록"}
              onClick={() => {
                navigate("/QandAInsert");
              }}
            />
          </div>
          <Table className="equipment-detail" head={thead} contents={content} contentKey={key} />
        </div>
      </div>
    </main>
  );
}