refactor: standardize import statements and replace anchor tags with Link component in multiple files #63
@ -1,70 +1,74 @@
|
||||
"use client"
|
||||
'use client';
|
||||
|
||||
import { Link, usePage } from "@inertiajs/react";
|
||||
import { Link, usePage } from '@inertiajs/react';
|
||||
import {
|
||||
SidebarGroup,
|
||||
SidebarGroupLabel,
|
||||
SidebarMenu,
|
||||
SidebarMenuButton,
|
||||
SidebarMenuItem
|
||||
} from "@/components/ui/sidebar";
|
||||
SidebarGroup,
|
||||
SidebarGroupLabel,
|
||||
SidebarMenu,
|
||||
SidebarMenuButton,
|
||||
SidebarMenuItem,
|
||||
} from '@/components/ui/sidebar';
|
||||
|
||||
export type NavItem = {
|
||||
name: string
|
||||
url: string
|
||||
icon: React.ComponentType<{ className?: string }>
|
||||
}
|
||||
name: string;
|
||||
url: string;
|
||||
icon: React.ComponentType<{ className?: string }>;
|
||||
};
|
||||
|
||||
export type NavGroup = {
|
||||
label: string
|
||||
items: NavItem[]
|
||||
}
|
||||
|
||||
export function NavMain({
|
||||
items,
|
||||
}: {
|
||||
items: (NavGroup | NavItem)[]
|
||||
}) {
|
||||
const { url } = usePage()
|
||||
|
||||
return (
|
||||
<>
|
||||
{items.map((item) => {
|
||||
if ("label" in item) {
|
||||
return (
|
||||
<SidebarGroup key={item.label}>
|
||||
<SidebarGroupLabel>{item.label}</SidebarGroupLabel>
|
||||
<SidebarMenu>
|
||||
{item.items.map((child) => (
|
||||
<SidebarMenuItem key={child.name}>
|
||||
<SidebarMenuButton asChild isActive={url === child.url} tooltip={child.name}>
|
||||
<Link href={child.url}>
|
||||
<child.icon className="h-4 w-4" />
|
||||
<span>{child.name}</span>
|
||||
</Link>
|
||||
</SidebarMenuButton>
|
||||
</SidebarMenuItem>
|
||||
))}
|
||||
</SidebarMenu>
|
||||
</SidebarGroup>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<SidebarGroup key={item.name}>
|
||||
<SidebarMenu>
|
||||
<SidebarMenuItem>
|
||||
<SidebarMenuButton asChild isActive={url === item.url} tooltip={item.name}>
|
||||
<a href={item.url}>
|
||||
<item.icon className="h-4 w-4" />
|
||||
<span>{item.name}</span>
|
||||
</a>
|
||||
</SidebarMenuButton>
|
||||
</SidebarMenuItem>
|
||||
</SidebarMenu>
|
||||
</SidebarGroup>
|
||||
)
|
||||
})}
|
||||
</>
|
||||
)
|
||||
label: string;
|
||||
items: NavItem[];
|
||||
};
|
||||
|
||||
export function NavMain({ items }: { items: (NavGroup | NavItem)[] }) {
|
||||
const { url } = usePage();
|
||||
|
||||
return (
|
||||
<>
|
||||
{items.map((item) => {
|
||||
if ('label' in item) {
|
||||
return (
|
||||
<SidebarGroup key={item.label}>
|
||||
<SidebarGroupLabel>{item.label}</SidebarGroupLabel>
|
||||
<SidebarMenu>
|
||||
{item.items.map((child) => (
|
||||
<SidebarMenuItem key={child.name}>
|
||||
<SidebarMenuButton
|
||||
asChild
|
||||
isActive={url === child.url}
|
||||
tooltip={child.name}
|
||||
>
|
||||
<Link href={child.url}>
|
||||
<child.icon className="h-4 w-4" />
|
||||
<span>{child.name}</span>
|
||||
</Link>
|
||||
</SidebarMenuButton>
|
||||
</SidebarMenuItem>
|
||||
))}
|
||||
</SidebarMenu>
|
||||
</SidebarGroup>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<SidebarGroup key={item.name}>
|
||||
<SidebarMenu>
|
||||
<SidebarMenuItem>
|
||||
<SidebarMenuButton
|
||||
asChild
|
||||
isActive={url === item.url}
|
||||
tooltip={item.name}
|
||||
>
|
||||
<Link href={item.url}>
|
||||
<item.icon className="h-4 w-4" />
|
||||
<span>{item.name}</span>
|
||||
</Link>
|
||||
</SidebarMenuButton>
|
||||
</SidebarMenuItem>
|
||||
</SidebarMenu>
|
||||
</SidebarGroup>
|
||||
);
|
||||
})}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@ -1,42 +1,43 @@
|
||||
"use client"
|
||||
'use client';
|
||||
|
||||
import type {Icon} from "@tabler/icons-react";
|
||||
import * as React from "react"
|
||||
import { Link } from '@inertiajs/react';
|
||||
import type { Icon } from '@tabler/icons-react';
|
||||
import * as React from 'react';
|
||||
|
||||
import {
|
||||
SidebarGroup,
|
||||
SidebarGroupContent,
|
||||
SidebarMenu,
|
||||
SidebarMenuButton,
|
||||
SidebarMenuItem,
|
||||
} from "@/components/ui/sidebar"
|
||||
SidebarGroup,
|
||||
SidebarGroupContent,
|
||||
SidebarMenu,
|
||||
SidebarMenuButton,
|
||||
SidebarMenuItem,
|
||||
} from '@/components/ui/sidebar';
|
||||
|
||||
export function NavSecondary({
|
||||
items,
|
||||
...props
|
||||
items,
|
||||
...props
|
||||
}: {
|
||||
items: {
|
||||
title: string
|
||||
url: string
|
||||
icon: Icon
|
||||
}[]
|
||||
items: {
|
||||
title: string;
|
||||
url: string;
|
||||
icon: Icon;
|
||||
}[];
|
||||
} & React.ComponentPropsWithoutRef<typeof SidebarGroup>) {
|
||||
return (
|
||||
<SidebarGroup {...props}>
|
||||
<SidebarGroupContent>
|
||||
<SidebarMenu>
|
||||
{items.map((item) => (
|
||||
<SidebarMenuItem key={item.title}>
|
||||
<SidebarMenuButton asChild tooltip={item.title}>
|
||||
<a href={item.url}>
|
||||
<item.icon />
|
||||
<span>{item.title}</span>
|
||||
</a>
|
||||
</SidebarMenuButton>
|
||||
</SidebarMenuItem>
|
||||
))}
|
||||
</SidebarMenu>
|
||||
</SidebarGroupContent>
|
||||
</SidebarGroup>
|
||||
)
|
||||
return (
|
||||
<SidebarGroup {...props}>
|
||||
<SidebarGroupContent>
|
||||
<SidebarMenu>
|
||||
{items.map((item) => (
|
||||
<SidebarMenuItem key={item.title}>
|
||||
<SidebarMenuButton asChild tooltip={item.title}>
|
||||
<Link href={item.url}>
|
||||
<item.icon />
|
||||
<span>{item.title}</span>
|
||||
</Link>
|
||||
</SidebarMenuButton>
|
||||
</SidebarMenuItem>
|
||||
))}
|
||||
</SidebarMenu>
|
||||
</SidebarGroupContent>
|
||||
</SidebarGroup>
|
||||
);
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Head, router } from '@inertiajs/react';
|
||||
import { Head, Link, router } from '@inertiajs/react';
|
||||
import type { ColumnDef } from '@tanstack/react-table';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Pencil, Plus, Trash2 } from 'lucide-react';
|
||||
@ -161,10 +161,10 @@ export default function SubmissionIndex({
|
||||
title="Pengumpulan Tugas"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={assignmentIndex.url()}>
|
||||
<Link href={assignmentIndex.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Head, router } from '@inertiajs/react';
|
||||
import { Head, Link, router } from '@inertiajs/react';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, CheckCircle2, Save, XCircle } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
@ -86,10 +86,10 @@ export default function AttendanceSession({
|
||||
title="Kehadiran"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={attendanceIndex.url()}>
|
||||
<Link href={attendanceIndex.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Head, router } from '@inertiajs/react';
|
||||
import { Head, Link, router } from '@inertiajs/react';
|
||||
import type { ColumnDef } from '@tanstack/react-table';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Paperclip, Pencil, Plus, Trash2 } from 'lucide-react';
|
||||
@ -176,10 +176,10 @@ export default function TuitionPaymentIndex({ invoice, payments }: Props) {
|
||||
title="Pembayaran"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={tuitionInvoiceIndex.url()}>
|
||||
<Link href={tuitionInvoiceIndex.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Head, router } from '@inertiajs/react';
|
||||
import { Head, Link, router } from '@inertiajs/react';
|
||||
import type { ColumnDef } from '@tanstack/react-table';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Trash2, UserPlus } from 'lucide-react';
|
||||
@ -109,10 +109,10 @@ export default function ClassEnrollmentIndex({
|
||||
title="Peserta Kelas"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={courseClassIndex.url()}>
|
||||
<Link href={courseClassIndex.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Form, Head } from '@inertiajs/react';
|
||||
import { Form, Head, Link } from '@inertiajs/react';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Save } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
@ -7,7 +7,13 @@ import InputError from '@/components/input-error';
|
||||
import { PageHeader } from '@/components/page-header';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Combobox, ComboboxContent, ComboboxInput, ComboboxItem, ComboboxList } from '@/components/ui/combobox';
|
||||
import {
|
||||
Combobox,
|
||||
ComboboxContent,
|
||||
ComboboxInput,
|
||||
ComboboxItem,
|
||||
ComboboxList,
|
||||
} from '@/components/ui/combobox';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { PhoneInput } from '@/components/ui/phone-input';
|
||||
@ -35,10 +41,10 @@ export default function AdministratorCreate({ roles }: Props) {
|
||||
title="Tambah Administrator"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={index.url()}>
|
||||
<Link href={index.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
@ -53,29 +59,62 @@ export default function AdministratorCreate({ roles }: Props) {
|
||||
<CardContent className="grid gap-4 md:grid-cols-3">
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="username">
|
||||
Username <span className="text-red-500">*</span>
|
||||
Username{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Input id="username" name="username" placeholder="Masukkan username" />
|
||||
<Input
|
||||
id="username"
|
||||
name="username"
|
||||
placeholder="Masukkan username"
|
||||
/>
|
||||
<InputError message={errors.username} />
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="email">
|
||||
Email <span className="text-red-500">*</span>
|
||||
Email{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Input id="email" name="email" type="email" placeholder="Masukkan email" />
|
||||
<Input
|
||||
id="email"
|
||||
name="email"
|
||||
type="email"
|
||||
placeholder="Masukkan email"
|
||||
/>
|
||||
<InputError message={errors.email} />
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label>
|
||||
Role <span className="text-red-500">*</span>
|
||||
Role{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<input type="hidden" name="role" value={role} />
|
||||
<Combobox value={role} onValueChange={(v) => setRole(v ?? '')}>
|
||||
<ComboboxInput placeholder="Pilih role" className="w-full" />
|
||||
<input
|
||||
type="hidden"
|
||||
name="role"
|
||||
value={role}
|
||||
/>
|
||||
<Combobox
|
||||
value={role}
|
||||
onValueChange={(v) =>
|
||||
setRole(v ?? '')
|
||||
}
|
||||
>
|
||||
<ComboboxInput
|
||||
placeholder="Pilih role"
|
||||
className="w-full"
|
||||
/>
|
||||
<ComboboxContent>
|
||||
<ComboboxList>
|
||||
{roles.map((r) => (
|
||||
<ComboboxItem key={r.id} value={r.name}>
|
||||
<ComboboxItem
|
||||
key={r.id}
|
||||
value={r.name}
|
||||
>
|
||||
{r.name}
|
||||
</ComboboxItem>
|
||||
))}
|
||||
@ -94,57 +133,138 @@ export default function AdministratorCreate({ roles }: Props) {
|
||||
<CardContent className="grid gap-4 md:grid-cols-2">
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="full_name">
|
||||
Nama Lengkap <span className="text-red-500">*</span>
|
||||
Nama Lengkap{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Input id="full_name" name="full_name" placeholder="Masukkan nama lengkap" />
|
||||
<InputError message={errors.full_name} />
|
||||
<Input
|
||||
id="full_name"
|
||||
name="full_name"
|
||||
placeholder="Masukkan nama lengkap"
|
||||
/>
|
||||
<InputError
|
||||
message={errors.full_name}
|
||||
/>
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="phone_number">
|
||||
Nomor Telepon <span className="text-red-500">*</span>
|
||||
Nomor Telepon{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<PhoneInput id="phone_number" name="phone_number" placeholder="08xx xxxx xxxx" />
|
||||
<InputError message={errors.phone_number} />
|
||||
<PhoneInput
|
||||
id="phone_number"
|
||||
name="phone_number"
|
||||
placeholder="08xx xxxx xxxx"
|
||||
/>
|
||||
<InputError
|
||||
message={errors.phone_number}
|
||||
/>
|
||||
</div>
|
||||
<div className="grid gap-4 md:col-span-2 md:grid-cols-3">
|
||||
<div className="grid gap-2">
|
||||
<Label>
|
||||
Jenis Kelamin <span className="text-red-500">*</span>
|
||||
Jenis Kelamin{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<input type="hidden" name="gender" value={gender} />
|
||||
<RadioGroup value={gender} onValueChange={setGender} className="flex gap-4">
|
||||
<input
|
||||
type="hidden"
|
||||
name="gender"
|
||||
value={gender}
|
||||
/>
|
||||
<RadioGroup
|
||||
value={gender}
|
||||
onValueChange={setGender}
|
||||
className="flex gap-4"
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<RadioGroupItem value="male" id="male" />
|
||||
<Label htmlFor="male" className="font-normal">Laki-laki</Label>
|
||||
<RadioGroupItem
|
||||
value="male"
|
||||
id="male"
|
||||
/>
|
||||
<Label
|
||||
htmlFor="male"
|
||||
className="font-normal"
|
||||
>
|
||||
Laki-laki
|
||||
</Label>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<RadioGroupItem value="female" id="female" />
|
||||
<Label htmlFor="female" className="font-normal">Perempuan</Label>
|
||||
<RadioGroupItem
|
||||
value="female"
|
||||
id="female"
|
||||
/>
|
||||
<Label
|
||||
htmlFor="female"
|
||||
className="font-normal"
|
||||
>
|
||||
Perempuan
|
||||
</Label>
|
||||
</div>
|
||||
</RadioGroup>
|
||||
<InputError message={errors.gender} />
|
||||
<InputError
|
||||
message={errors.gender}
|
||||
/>
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label>
|
||||
Tempat Lahir <span className="text-red-500">*</span>
|
||||
Tempat Lahir{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Input name="birth_place" placeholder="Masukkan tempat lahir" />
|
||||
<InputError message={errors.birth_place} />
|
||||
<Input
|
||||
name="birth_place"
|
||||
placeholder="Masukkan tempat lahir"
|
||||
/>
|
||||
<InputError
|
||||
message={errors.birth_place}
|
||||
/>
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label>
|
||||
Tanggal Lahir <span className="text-red-500">*</span>
|
||||
Tanggal Lahir{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<input type="hidden" name="birth_date" value={birthDate ? format(birthDate, 'yyyy-MM-dd') : ''} />
|
||||
<DatePicker value={birthDate} onChange={setBirthDate} />
|
||||
<InputError message={errors.birth_date} />
|
||||
<input
|
||||
type="hidden"
|
||||
name="birth_date"
|
||||
value={
|
||||
birthDate
|
||||
? format(
|
||||
birthDate,
|
||||
'yyyy-MM-dd',
|
||||
)
|
||||
: ''
|
||||
}
|
||||
/>
|
||||
<DatePicker
|
||||
value={birthDate}
|
||||
onChange={setBirthDate}
|
||||
/>
|
||||
<InputError
|
||||
message={errors.birth_date}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid gap-2 md:col-span-2">
|
||||
<Label htmlFor="address">
|
||||
Alamat <span className="text-red-500">*</span>
|
||||
Alamat{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Textarea id="address" name="address" placeholder="Masukkan alamat" />
|
||||
<Textarea
|
||||
id="address"
|
||||
name="address"
|
||||
placeholder="Masukkan alamat"
|
||||
/>
|
||||
<InputError message={errors.address} />
|
||||
</div>
|
||||
</CardContent>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Form, Head } from '@inertiajs/react';
|
||||
import { Form, Head, Link } from '@inertiajs/react';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Save } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
@ -7,7 +7,13 @@ import InputError from '@/components/input-error';
|
||||
import { PageHeader } from '@/components/page-header';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Combobox, ComboboxContent, ComboboxInput, ComboboxItem, ComboboxList } from '@/components/ui/combobox';
|
||||
import {
|
||||
Combobox,
|
||||
ComboboxContent,
|
||||
ComboboxInput,
|
||||
ComboboxItem,
|
||||
ComboboxList,
|
||||
} from '@/components/ui/combobox';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { PhoneInput } from '@/components/ui/phone-input';
|
||||
@ -21,7 +27,14 @@ type User = {
|
||||
id: number;
|
||||
username: string;
|
||||
email: string;
|
||||
profile: { full_name: string; phone_number: string; address: string; gender: string; birth_date: string; birth_place: string } | null;
|
||||
profile: {
|
||||
full_name: string;
|
||||
phone_number: string;
|
||||
address: string;
|
||||
gender: string;
|
||||
birth_date: string;
|
||||
birth_place: string;
|
||||
} | null;
|
||||
roles: { id: number; name: string }[];
|
||||
};
|
||||
|
||||
@ -33,7 +46,9 @@ type Props = {
|
||||
export default function AdministratorEdit({ user, roles }: Props) {
|
||||
const [gender, setGender] = useState(user.profile?.gender ?? '');
|
||||
const [birthDate, setBirthDate] = useState<Date | undefined>(
|
||||
user.profile?.birth_date ? new Date(user.profile.birth_date) : undefined
|
||||
user.profile?.birth_date
|
||||
? new Date(user.profile.birth_date)
|
||||
: undefined,
|
||||
);
|
||||
const [role, setRole] = useState(user.roles?.[0]?.name ?? '');
|
||||
|
||||
@ -46,10 +61,10 @@ export default function AdministratorEdit({ user, roles }: Props) {
|
||||
title="Edit Administrator"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={index.url()}>
|
||||
<Link href={index.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
@ -64,29 +79,62 @@ export default function AdministratorEdit({ user, roles }: Props) {
|
||||
<CardContent className="grid gap-4 md:grid-cols-3">
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="username">
|
||||
Username <span className="text-red-500">*</span>
|
||||
Username{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Input id="username" name="username" defaultValue={user.username} />
|
||||
<Input
|
||||
id="username"
|
||||
name="username"
|
||||
defaultValue={user.username}
|
||||
/>
|
||||
<InputError message={errors.username} />
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="email">
|
||||
Email <span className="text-red-500">*</span>
|
||||
Email{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Input id="email" name="email" type="email" defaultValue={user.email} />
|
||||
<Input
|
||||
id="email"
|
||||
name="email"
|
||||
type="email"
|
||||
defaultValue={user.email}
|
||||
/>
|
||||
<InputError message={errors.email} />
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label>
|
||||
Role <span className="text-red-500">*</span>
|
||||
Role{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<input type="hidden" name="role" value={role} />
|
||||
<Combobox value={role} onValueChange={(v) => setRole(v ?? '')}>
|
||||
<ComboboxInput placeholder="Pilih role" className="w-full" />
|
||||
<input
|
||||
type="hidden"
|
||||
name="role"
|
||||
value={role}
|
||||
/>
|
||||
<Combobox
|
||||
value={role}
|
||||
onValueChange={(v) =>
|
||||
setRole(v ?? '')
|
||||
}
|
||||
>
|
||||
<ComboboxInput
|
||||
placeholder="Pilih role"
|
||||
className="w-full"
|
||||
/>
|
||||
<ComboboxContent>
|
||||
<ComboboxList>
|
||||
{roles.map((r) => (
|
||||
<ComboboxItem key={r.id} value={r.name}>
|
||||
<ComboboxItem
|
||||
key={r.id}
|
||||
value={r.name}
|
||||
>
|
||||
{r.name}
|
||||
</ComboboxItem>
|
||||
))}
|
||||
@ -105,57 +153,147 @@ export default function AdministratorEdit({ user, roles }: Props) {
|
||||
<CardContent className="grid gap-4 md:grid-cols-2">
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="full_name">
|
||||
Nama Lengkap <span className="text-red-500">*</span>
|
||||
Nama Lengkap{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Input id="full_name" name="full_name" defaultValue={user.profile?.full_name ?? ''} />
|
||||
<InputError message={errors.full_name} />
|
||||
<Input
|
||||
id="full_name"
|
||||
name="full_name"
|
||||
defaultValue={
|
||||
user.profile?.full_name ?? ''
|
||||
}
|
||||
/>
|
||||
<InputError
|
||||
message={errors.full_name}
|
||||
/>
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="phone_number">
|
||||
Nomor Telepon <span className="text-red-500">*</span>
|
||||
Nomor Telepon{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<PhoneInput id="phone_number" name="phone_number" value={user.profile?.phone_number ?? ''} />
|
||||
<InputError message={errors.phone_number} />
|
||||
<PhoneInput
|
||||
id="phone_number"
|
||||
name="phone_number"
|
||||
value={
|
||||
user.profile?.phone_number ?? ''
|
||||
}
|
||||
/>
|
||||
<InputError
|
||||
message={errors.phone_number}
|
||||
/>
|
||||
</div>
|
||||
<div className="grid gap-4 md:col-span-2 md:grid-cols-3">
|
||||
<div className="grid gap-2">
|
||||
<Label>
|
||||
Jenis Kelamin <span className="text-red-500">*</span>
|
||||
Jenis Kelamin{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<input type="hidden" name="gender" value={gender} />
|
||||
<RadioGroup value={gender} onValueChange={setGender} className="flex gap-4">
|
||||
<input
|
||||
type="hidden"
|
||||
name="gender"
|
||||
value={gender}
|
||||
/>
|
||||
<RadioGroup
|
||||
value={gender}
|
||||
onValueChange={setGender}
|
||||
className="flex gap-4"
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<RadioGroupItem value="male" id="male" />
|
||||
<Label htmlFor="male" className="font-normal">Laki-laki</Label>
|
||||
<RadioGroupItem
|
||||
value="male"
|
||||
id="male"
|
||||
/>
|
||||
<Label
|
||||
htmlFor="male"
|
||||
className="font-normal"
|
||||
>
|
||||
Laki-laki
|
||||
</Label>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<RadioGroupItem value="female" id="female" />
|
||||
<Label htmlFor="female" className="font-normal">Perempuan</Label>
|
||||
<RadioGroupItem
|
||||
value="female"
|
||||
id="female"
|
||||
/>
|
||||
<Label
|
||||
htmlFor="female"
|
||||
className="font-normal"
|
||||
>
|
||||
Perempuan
|
||||
</Label>
|
||||
</div>
|
||||
</RadioGroup>
|
||||
<InputError message={errors.gender} />
|
||||
<InputError
|
||||
message={errors.gender}
|
||||
/>
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label>
|
||||
Tempat Lahir <span className="text-red-500">*</span>
|
||||
Tempat Lahir{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Input name="birth_place" defaultValue={user.profile?.birth_place ?? ''} />
|
||||
<InputError message={errors.birth_place} />
|
||||
<Input
|
||||
name="birth_place"
|
||||
defaultValue={
|
||||
user.profile?.birth_place ??
|
||||
''
|
||||
}
|
||||
/>
|
||||
<InputError
|
||||
message={errors.birth_place}
|
||||
/>
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<Label>
|
||||
Tanggal Lahir <span className="text-red-500">*</span>
|
||||
Tanggal Lahir{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<input type="hidden" name="birth_date" value={birthDate ? format(birthDate, 'yyyy-MM-dd') : ''} />
|
||||
<DatePicker value={birthDate} onChange={setBirthDate} />
|
||||
<InputError message={errors.birth_date} />
|
||||
<input
|
||||
type="hidden"
|
||||
name="birth_date"
|
||||
value={
|
||||
birthDate
|
||||
? format(
|
||||
birthDate,
|
||||
'yyyy-MM-dd',
|
||||
)
|
||||
: ''
|
||||
}
|
||||
/>
|
||||
<DatePicker
|
||||
value={birthDate}
|
||||
onChange={setBirthDate}
|
||||
/>
|
||||
<InputError
|
||||
message={errors.birth_date}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid gap-2 md:col-span-2">
|
||||
<Label htmlFor="address">
|
||||
Alamat <span className="text-red-500">*</span>
|
||||
Alamat{' '}
|
||||
<span className="text-red-500">
|
||||
*
|
||||
</span>
|
||||
</Label>
|
||||
<Textarea id="address" name="address" defaultValue={user.profile?.address ?? ''} />
|
||||
<Textarea
|
||||
id="address"
|
||||
name="address"
|
||||
defaultValue={
|
||||
user.profile?.address ?? ''
|
||||
}
|
||||
/>
|
||||
<InputError message={errors.address} />
|
||||
</div>
|
||||
</CardContent>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Head, router } from '@inertiajs/react';
|
||||
import { Head, Link, router } from '@inertiajs/react';
|
||||
import { Plus, RotateCcw } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
import { ConfirmDialog } from '@/components/confirm-dialog';
|
||||
@ -118,10 +118,10 @@ export default function AdministratorIndex({ administrators, filters }: Props) {
|
||||
title="Administrator"
|
||||
actions={
|
||||
<Button asChild>
|
||||
<a href={create.url()}>
|
||||
<Link href={create.url()}>
|
||||
<Plus className="h-4 w-4" />
|
||||
Tambah
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Form, Head } from '@inertiajs/react';
|
||||
import { Form, Head, Link } from '@inertiajs/react';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Save } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
@ -49,10 +49,10 @@ export default function LecturerCreate({ departments }: Props) {
|
||||
title="Tambah Dosen"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={index.url()}>
|
||||
<Link href={index.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Form, Head } from '@inertiajs/react';
|
||||
import { Form, Head, Link } from '@inertiajs/react';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Save } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
@ -76,10 +76,10 @@ export default function LecturerEdit({ user, departments }: Props) {
|
||||
title="Edit Dosen"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={index.url()}>
|
||||
<Link href={index.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Head, router } from '@inertiajs/react';
|
||||
import { Head, Link, router } from '@inertiajs/react';
|
||||
import { FileSpreadsheet, Plus, RotateCcw } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
import { ConfirmDialog } from '@/components/confirm-dialog';
|
||||
@ -147,10 +147,10 @@ export default function LecturerIndex({
|
||||
</a>
|
||||
</Button>
|
||||
<Button asChild>
|
||||
<a href={create.url()}>
|
||||
<Link href={create.url()}>
|
||||
<Plus className="h-4 w-4" />
|
||||
Tambah
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Form, Head } from '@inertiajs/react';
|
||||
import { Form, Head, Link } from '@inertiajs/react';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Save } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
@ -56,10 +56,10 @@ export default function StudentCreate({ departments, lecturers }: Props) {
|
||||
title="Tambah Mahasiswa"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={index.url()}>
|
||||
<Link href={index.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Form, Head } from '@inertiajs/react';
|
||||
import { Form, Head, Link } from '@inertiajs/react';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Save } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
@ -85,10 +85,10 @@ export default function StudentEdit({ user, departments, lecturers }: Props) {
|
||||
title="Edit Mahasiswa"
|
||||
actions={
|
||||
<Button variant="outline" asChild>
|
||||
<a href={index.url()}>
|
||||
<Link href={index.url()}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Kembali
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Head, router } from '@inertiajs/react';
|
||||
import { Head, Link, router } from '@inertiajs/react';
|
||||
import { FileSpreadsheet, Info, Plus, RotateCcw } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
import { ConfirmDialog } from '@/components/confirm-dialog';
|
||||
@ -179,10 +179,10 @@ export default function StudentIndex({
|
||||
</a>
|
||||
</Button>
|
||||
<Button asChild>
|
||||
<a href={create.url()}>
|
||||
<Link href={create.url()}>
|
||||
<Plus className="h-4 w-4" />
|
||||
Tambah
|
||||
</a>
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user