86 lines
1.9 KiB
TypeScript
86 lines
1.9 KiB
TypeScript
|
import DT from 'datatables.net-dt'
|
||
|
|
import DataTable from 'datatables.net-react'
|
||
|
|
import { Link, useRouteLoaderData } from 'react-router'
|
||
|
|
|
||
|
|
import { Button } from '~/components/ui/button'
|
||
|
|
import { UiTable } from '~/components/ui/table'
|
||
|
|
import { TitleDashboard } from '~/components/ui/title-dashboard'
|
||
|
|
import type { loader } from '~/routes/_admin.lg-admin._dashboard'
|
||
|
|
|
||
|
|
export const SubscribePlanPage = () => {
|
||
|
|
const loaderData = useRouteLoaderData<typeof loader>(
|
||
|
|
'routes/_admin.lg-admin._dashboard',
|
||
|
|
)
|
||
|
|
|
||
|
|
DataTable.use(DT)
|
||
|
|
const dataTable = loaderData?.subscriptionsData
|
||
|
|
|
||
|
|
const dataColumns = [
|
||
|
|
{
|
||
|
|
title: 'No',
|
||
|
|
render: (
|
||
|
|
data: unknown,
|
||
|
|
type: unknown,
|
||
|
|
row: unknown,
|
||
|
|
meta: { row: number },
|
||
|
|
) => {
|
||
|
|
return meta.row + 1
|
||
|
|
},
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: 'Nama',
|
||
|
|
data: 'name',
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: 'Kode',
|
||
|
|
data: 'code',
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: 'Action',
|
||
|
|
data: 'id',
|
||
|
|
},
|
||
|
|
]
|
||
|
|
|
||
|
|
const dataSlot = {
|
||
|
|
3: (value: string) => (
|
||
|
|
<Button
|
||
|
|
as="a"
|
||
|
|
href={`/lg-admin/subscribe-plan/update/${value}`}
|
||
|
|
className="text-md rounded-md"
|
||
|
|
size="sm"
|
||
|
|
>
|
||
|
|
Update Subscribe Plan
|
||
|
|
</Button>
|
||
|
|
),
|
||
|
|
}
|
||
|
|
return (
|
||
|
|
<div className="relative">
|
||
|
|
<TitleDashboard title="Subscribe Plan" />
|
||
|
|
<div className="mb-8 flex items-end justify-between">
|
||
|
|
<div className="flex-1">{/* TODO: Filter */}</div>
|
||
|
|
<Button
|
||
|
|
as={Link}
|
||
|
|
to="/lg-admin/subscribe-plan/create"
|
||
|
|
className="text-md h-[42px] rounded-md"
|
||
|
|
size="lg"
|
||
|
|
>
|
||
|
|
Buat Subscribe Plan
|
||
|
|
</Button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<UiTable
|
||
|
|
data={dataTable}
|
||
|
|
columns={dataColumns}
|
||
|
|
slots={dataSlot}
|
||
|
|
options={{
|
||
|
|
paging: true,
|
||
|
|
searching: true,
|
||
|
|
ordering: true,
|
||
|
|
info: true,
|
||
|
|
}}
|
||
|
|
title=" Daftar Subscribe Plan"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|