<template>
    <div>
        <!-- <Link href="/app">Home</Link>
		<br /> -->
        <h1>Register</h1>
        <form @submit.prevent="submit()" class="max-w-sm">
            <!-- <form @submit.prevent="form.post('/app/register')" class="max-w-sm"> -->
            <!-- <n-input type="email" v-model:value="form.email" placeholder="email" class="mb-3" />
			<n-input type="password" v-model:value="form.password" placeholder="Password" class="mb-3" /> -->
            <form-input v-bind:label="'Emai22l'" v-bind:type="'email'" v-model="form.email" />
            <form-input v-bind:label="'Password'" v-bind:type="'password'" v-model="form.password" />

            <!-- <n-button attr-type="submit"> Register </n-button> -->
        </form>
    </div>
</template>

<script>
// import AuthLayout from '../../Layouts/Auth.vue';
import AuthLayout from '@/Layouts/Auth.vue';
import { reactive } from 'vue';
import { useForm } from '@inertiajs/vue3';
import { Inertia } from '@inertiajs/inertia';
// import { NButton, NInput } from 'naive-ui';
// import { useForm } from '@inertiajs/inertia-vue3'
import FormInput from '@/Components/FormInput.vue';

export default {
    layout: AuthLayout,

    components: {
        NButton,
        // NInput,
        FormInput,
    },

    setup() {
        // const form = useForm({
        // 	email: '',
        // 	password: ''
        // });
        const form = reactive({
            email: null,
            password: null,
        });

        const submit = async () => {
            await Inertia.post('/app/register', form);
        };

        return { form, submit };
    },
};
</script>

<!-- <script setup>
import { Link } from '@inertiajs/vue3';
// import DefaultLayout from '../../Layouts/Default.vue';
</script> -->
