import { getPostsDetail } from "@/services/posts";

import { useNavigate, useSearchParams } from "react-router-dom";
import { Card, Typography, Button } from "antd";
import { useEffect, useState } from "react";

const { Title } = Typography;
export default (props) => {
  const [searchParams] = useSearchParams();
  const id = searchParams.get("id");
  const [data, setData] = useState({});
  const [url, setUrl] = useState("");
  const navigate = useNavigate();

  useEffect(() => {
    if (id) {
      getPostsDetail(id).then((res) => {
        setData(res);
        setUrl(res.filesList[0]?.fileAddr);
      });
    }
  }, [id]);

  return (
    <Card title={<Button onClick={() => navigate(-1)}> 返回</Button>}>
      <Title level={2} style={{ marginBottom: "2em" }}>
        {data.title}
      </Title>
      <div dangerouslySetInnerHTML={{ __html: data?.detail }}></div>
      {url && (
        <div style={{ marginTop: "2em" }}>
          <a
            href={`${url}`}
            download
            // rel="noopener noreferrer"
            // key="link"
          >
            {url?.substring(url?.lastIndexOf("/") + 1)}
          </a>
        </div>
      )}
    </Card>
  );
};