"use client"
import PageBreadcrumb from "@/components/common/PageBreadCrumb2";
import CtBoardDetail from '@/components/CtBoardDetail';
import Button from '@/components/ui/button/Button2';
import React from "react";
import { useEffect, useState } from 'react';
import api, { convertDateTime3, getUrlParam } from '@/lib/_AG';



let g_voc_id : string = "";


export default function VocDetail() {
  const [title, setTitle] = useState("");
  const [content, setContent] = useState("");

  // function part
  function reqVocDetail() {
    //alert(g_voc_id);

    const params = {
      id: g_voc_id
    }
    
    api.post('/api/get-voc-detail.do', params).then((resp) => {
      console.log(resp);
      
      if (resp.data.errCode == 0) {
        setTitle(resp.data.result.title);
        setContent(resp.data.result.content);
          //resp.data.result.title
          //resp.data.values.content
          //resp.data.values.content
          //...
      }
      else {
          alert("일시적으로 사용할 수 없습니다 : " + resp.data.errCode);
      }
    })
    .catch((err) => console.error(err))
  }

  useEffect(() => {
    g_voc_id = getUrlParam("vid")!;
    reqVocDetail();
  }, []);

  

  return (
    <div>
      <PageBreadcrumb pageTitle1="게시판" pageTitle2="VOC" pageLink2="/voc" pageTitle3="VOC 상세보기" />

      <CtBoardDetail title={title} desc={"작성자 닉네임"} regDate={"respresp.data.values.reg_date useState"}>
        <div>
          <p>{content}</p>
          {/*<Button onClick={() => handleRowClickModify()}>수정</Button>*/}
          <Button>삭제 </Button>
        </div>
      </CtBoardDetail>

    </div>
  );
}
