100 lines
5.0 KiB
TypeScript
100 lines
5.0 KiB
TypeScript
import { Head, useForm, Link } from '@inertiajs/react';
|
|
import React from 'react';
|
|
import type { FormEvent } from 'react';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
|
import { Input } from '@/components/ui/input';
|
|
import { Label } from '@/components/ui/label';
|
|
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
|
|
import AppLayout from '@/layouts/app-layout';
|
|
|
|
export default function Create() {
|
|
const { data, setData, post, processing, errors } = useForm({
|
|
name: '',
|
|
email: '',
|
|
password: '',
|
|
nip: '',
|
|
position: '',
|
|
status: 'PKWT',
|
|
join_date: '',
|
|
});
|
|
|
|
const submit = (e: FormEvent) => {
|
|
e.preventDefault();
|
|
post('/admin/employees');
|
|
};
|
|
|
|
return (
|
|
<AppLayout>
|
|
<Head title="Tambah Karyawan" />
|
|
<div className="p-8 max-w-2xl mx-auto">
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>Tambah Karyawan</CardTitle>
|
|
<CardDescription>Masukkan data detail karyawan baru.</CardDescription>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<form onSubmit={submit} className="space-y-4">
|
|
<div className="space-y-2">
|
|
<Label>Nama Lengkap</Label>
|
|
<Input value={data.name} onChange={e => setData('name', e.target.value)} />
|
|
{errors.name && <p className="text-xs text-red-500">{errors.name}</p>}
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
<Label>Email</Label>
|
|
<Input type="email" value={data.email} onChange={e => setData('email', e.target.value)} />
|
|
{errors.email && <p className="text-xs text-red-500">{errors.email}</p>}
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
<Label>Password Default</Label>
|
|
<Input type="password" value={data.password} onChange={e => setData('password', e.target.value)} />
|
|
</div>
|
|
|
|
<div className="grid grid-cols-2 gap-4">
|
|
<div className="space-y-2">
|
|
<Label>NIP</Label>
|
|
<Input value={data.nip} onChange={e => setData('nip', e.target.value)} />
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label>Tanggal Masuk</Label>
|
|
<Input type="date" value={data.join_date} onChange={e => setData('join_date', e.target.value)} />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-2 gap-4">
|
|
<div className="space-y-2">
|
|
<Label>Jabatan</Label>
|
|
<Select onValueChange={(val) => setData('position', val)}>
|
|
<SelectTrigger><SelectValue placeholder="Pilih" /></SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="Staff">Staff</SelectItem>
|
|
<SelectItem value="Supervisor">Supervisor</SelectItem>
|
|
<SelectItem value="Manager">Manager</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label>Status</Label>
|
|
<Select onValueChange={(val) => setData('status', val)}>
|
|
<SelectTrigger><SelectValue placeholder="Pilih" /></SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="PKWT">PKWT</SelectItem>
|
|
<SelectItem value="PKWTT">PKWTT</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex justify-end gap-2 pt-4">
|
|
<Button variant="outline" asChild><Link href="/admin/employees">Batal</Link></Button>
|
|
<Button type="submit" disabled={processing}>Simpan</Button>
|
|
</div>
|
|
</form>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</AppLayout>
|
|
);
|
|
} |