mirror of
https://github.com/Buriburizaem0n/admin-frontend-domain.git
synced 2026-02-05 13:10:08 +00:00
feat: responsive header, search boxes (#10)
This commit is contained in:
@@ -54,6 +54,7 @@ export default function AlertRulePage() {
|
||||
{
|
||||
header: "Name",
|
||||
accessorKey: "name",
|
||||
accessorFn: row => row.name,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -121,8 +122,8 @@ export default function AlertRulePage() {
|
||||
|
||||
return (
|
||||
<div className="px-8">
|
||||
<div className="flex mt-6 mb-4 gap-[60%]">
|
||||
<NotificationTab className="flex-1" />
|
||||
<div className="flex mt-6 mb-4">
|
||||
<NotificationTab className="flex-1 mr-4 sm:max-w-[40%]" />
|
||||
<HeaderButtonGroup className="flex-2 flex gap-2 ml-auto" delete={{
|
||||
fn: deleteAlertRules,
|
||||
id: selectedRows.map(r => r.original.id),
|
||||
|
||||
@@ -99,19 +99,27 @@ export default function CronPage() {
|
||||
{
|
||||
header: "Coverage",
|
||||
accessorKey: "cover",
|
||||
accessorFn: row => {
|
||||
switch (row.cover) {
|
||||
case 0: {
|
||||
return "Ignore All"
|
||||
}
|
||||
case 1: {
|
||||
return "Cover All"
|
||||
}
|
||||
case 2: {
|
||||
return "On alert"
|
||||
}
|
||||
}
|
||||
},
|
||||
accessorFn: row => row.cover,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
<div className="max-w-48 whitespace-normal break-words">
|
||||
{(() => {
|
||||
switch (s.cover) {
|
||||
case 0: {
|
||||
return <span>Ignore All</span>
|
||||
}
|
||||
case 1: {
|
||||
return <span>Cover All</span>
|
||||
}
|
||||
case 2: {
|
||||
return <span>On alert</span>
|
||||
}
|
||||
}
|
||||
})()}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
header: "Specific Servers",
|
||||
@@ -121,7 +129,15 @@ export default function CronPage() {
|
||||
{
|
||||
header: "Last Execution",
|
||||
accessorKey: "lastExecution",
|
||||
accessorFn: row => row.last_executed_at
|
||||
accessorFn: row => row.last_executed_at,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
<div className="max-w-24 whitespace-normal break-words">
|
||||
{s.last_executed_at}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
header: "Last Result",
|
||||
|
||||
@@ -62,6 +62,7 @@ export default function DDNSPage() {
|
||||
{
|
||||
header: "Name",
|
||||
accessorKey: "name",
|
||||
accessorFn: row => row.name,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -89,6 +90,7 @@ export default function DDNSPage() {
|
||||
{
|
||||
header: "Domains",
|
||||
accessorKey: "domains",
|
||||
accessorFn: row => row.domains,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
|
||||
@@ -50,7 +50,7 @@ export default () => {
|
||||
<FormItem>
|
||||
<FormLabel>Username</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="shadcn" {...field} />
|
||||
<Input placeholder="shadcn" autoComplete="username" {...field} />
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
This is your public display name.
|
||||
@@ -66,7 +66,7 @@ export default () => {
|
||||
<FormItem>
|
||||
<FormLabel>Password</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="password" placeholder="shadcn" {...field} />
|
||||
<Input type="password" placeholder="shadcn" autoComplete="current-password" {...field} />
|
||||
</FormControl>
|
||||
<FormDescription>
|
||||
This is your public display name.
|
||||
|
||||
@@ -53,6 +53,7 @@ export default function NATPage() {
|
||||
{
|
||||
header: "Name",
|
||||
accessorKey: "name",
|
||||
accessorFn: row => row.name,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -70,6 +71,7 @@ export default function NATPage() {
|
||||
{
|
||||
header: "Local service",
|
||||
accessorKey: "host",
|
||||
accessorFn: row => row.host,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -82,6 +84,7 @@ export default function NATPage() {
|
||||
{
|
||||
header: "Bind hostname",
|
||||
accessorKey: "domain",
|
||||
accessorFn: row => row.domain,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
|
||||
@@ -54,6 +54,7 @@ export default function NotificationGroupPage() {
|
||||
{
|
||||
header: "Name",
|
||||
accessorKey: "name",
|
||||
accessorFn: row => row.group.name,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -96,8 +97,8 @@ export default function NotificationGroupPage() {
|
||||
|
||||
return (
|
||||
<div className="px-8">
|
||||
<div className="flex mt-6 mb-4 gap-[60%]">
|
||||
<GroupTab className="flex-1" />
|
||||
<div className="flex mt-6 mb-4">
|
||||
<GroupTab className="flex-1 mr-4 sm:max-w-[40%]" />
|
||||
<HeaderButtonGroup className="flex-2 flex gap-2 ml-auto" delete={{
|
||||
fn: deleteNotificationGroups,
|
||||
id: selectedRows.map(r => r.original.group.id),
|
||||
|
||||
@@ -56,6 +56,7 @@ export default function NotificationPage() {
|
||||
{
|
||||
header: "Name",
|
||||
accessorKey: "name",
|
||||
accessorFn: row => row.name,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -77,6 +78,7 @@ export default function NotificationPage() {
|
||||
{
|
||||
header: "URL",
|
||||
accessorKey: "url",
|
||||
accessorFn: row => row.url,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -119,8 +121,8 @@ export default function NotificationPage() {
|
||||
|
||||
return (
|
||||
<div className="px-8">
|
||||
<div className="flex mt-6 mb-4 gap-[60%]">
|
||||
<NotificationTab className="flex-1" />
|
||||
<div className="flex mt-6 mb-4">
|
||||
<NotificationTab className="flex-1 mr-4 sm:max-w-[40%]" />
|
||||
<HeaderButtonGroup className="flex-2 flex gap-2 ml-auto" delete={{
|
||||
fn: deleteNotification,
|
||||
id: selectedRows.map(r => r.original.id),
|
||||
|
||||
@@ -54,6 +54,7 @@ export default function ServerGroupPage() {
|
||||
{
|
||||
header: "Name",
|
||||
accessorKey: "name",
|
||||
accessorFn: row => row.group.name,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -96,8 +97,8 @@ export default function ServerGroupPage() {
|
||||
|
||||
return (
|
||||
<div className="px-8">
|
||||
<div className="flex mt-6 mb-4 gap-[60%]">
|
||||
<GroupTab className="flex-1" />
|
||||
<div className="flex mt-6 mb-4">
|
||||
<GroupTab className="flex-1 mr-4 sm:max-w-[40%]" />
|
||||
<HeaderButtonGroup className="flex-2 flex ml-auto gap-2" delete={{
|
||||
fn: deleteServerGroups,
|
||||
id: selectedRows.map(r => r.original.group.id),
|
||||
|
||||
@@ -59,6 +59,7 @@ export default function ServerPage() {
|
||||
{
|
||||
header: "Name",
|
||||
accessorKey: "name",
|
||||
accessorFn: row => row.name,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
@@ -81,6 +82,7 @@ export default function ServerPage() {
|
||||
id: "ip",
|
||||
header: "IP",
|
||||
accessorKey: "host.ip",
|
||||
accessorFn: row => row.host?.ip,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
return (
|
||||
|
||||
@@ -54,6 +54,7 @@ export default function ServicePage() {
|
||||
},
|
||||
{
|
||||
header: "Name",
|
||||
accessorFn: row => row.service.name,
|
||||
accessorKey: "service.name",
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
@@ -66,6 +67,7 @@ export default function ServicePage() {
|
||||
},
|
||||
{
|
||||
header: "Target",
|
||||
accessorFn: row => row.service.target,
|
||||
accessorKey: "service.target",
|
||||
cell: ({ row }) => {
|
||||
const s = row.original;
|
||||
@@ -79,15 +81,23 @@ export default function ServicePage() {
|
||||
{
|
||||
header: "Coverage",
|
||||
accessorKey: "service.cover",
|
||||
accessorFn: row => {
|
||||
switch (row.service.cover) {
|
||||
case 0: {
|
||||
return "Cover All"
|
||||
}
|
||||
case 1: {
|
||||
return "Ignore All"
|
||||
}
|
||||
}
|
||||
accessorFn: row => row.service.cover,
|
||||
cell: ({ row }) => {
|
||||
const s = row.original.service;
|
||||
return (
|
||||
<div className="max-w-48 whitespace-normal break-words">
|
||||
{(() => {
|
||||
switch (s.cover) {
|
||||
case 0: {
|
||||
return <span>Cover All</span>
|
||||
}
|
||||
case 1: {
|
||||
return <span>Ignore All</span>
|
||||
}
|
||||
}
|
||||
})()}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -98,7 +108,8 @@ export default function ServicePage() {
|
||||
{
|
||||
header: "Type",
|
||||
accessorKey: "service.type",
|
||||
accessorFn: row => serviceTypes[row.service.type] || '',
|
||||
accessorFn: row => row.service.type,
|
||||
cell: ({ row }) => serviceTypes[row.original.service.type] || '',
|
||||
},
|
||||
{
|
||||
header: "Interval",
|
||||
|
||||
Reference in New Issue
Block a user