articleForm

'use client'

import { useEffect, useState } from 'react';

import { useQuery } from '@tanstack/react-query';
import api from "@/util/api";
import DefaultLayout from "@/components/Layouts/DefaultLayout";
import Link from 'next/link'
import { useRouter, useParams } from 'next/navigation';

export default function ArticleForm() {
    const params = useParams();
    const router = useRouter();
    

    const [article, setArticle] = useState({ subject: '', content: ''});

    const handleSubmit = async (e) => {
        e.preventDefault();
        await api
            .post('/api/v1/articles', { ...article, club: { id: params.id } })
            .then((response) => {
                console.log(response);
                setArticle({ subject: '', content: '' });
                router.push('/article');
            })
            .catch((error) => {
                console.log(error);
            });
    };

    const handleChange = (e) => {
        const { name, value } = e.target;
        setArticle({ ...article, [name]: value });
    };

    

    return (
        <DefaultLayout>

            <h3>게시글 작성</h3>
            <form onSubmit={handleSubmit}>
            <div>
                    <label>제목:</label>
                    <input type="text" name="subject" value={article.subject} onChange={handleChange} />
                </div>
                <div>
                    <label>내용:</label>
                    <textarea name="content" value={article.content} onChange={handleChange} />
                </div>
                <button type="submit">등록</button>
            </form>

            
        </DefaultLayout>
    );
}