You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
134 lines
8.2 KiB
134 lines
8.2 KiB
@extends('layouts.app') |
|
|
|
@section('title', 'LDAP Groups — ' . config('app.name')) |
|
|
|
@section('content') |
|
<div class="max-w-[1600px] mx-auto px-4 py-6 sm:py-8"> |
|
@include('partials.nav') |
|
|
|
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4 mb-6 mt-4 sm:mt-6"> |
|
<div> |
|
<h1 class="text-2xl sm:text-3xl font-bold text-white">LDAP Groups</h1> |
|
<p class="text-slate-400 mt-1 text-sm"> |
|
Host: <span class="text-cyan-400">{{ $meta['server'] }}</span> |
|
@if ($meta['domain']) |
|
· Domain: <span class="text-cyan-400">{{ $meta['domain'] }}</span> |
|
@endif |
|
</p> |
|
</div> |
|
</div> |
|
|
|
@include('partials.flash') |
|
|
|
@if ($error) |
|
<div class="mb-6 rounded-lg bg-red-950/50 border border-red-800 text-red-200 px-4 py-3">{{ $error }}</div> |
|
@endif |
|
|
|
<div class="flex flex-col xl:flex-row gap-6 items-start xl:items-stretch"> |
|
<div class="flex-1 min-w-0 bg-slate-900 border border-slate-800 rounded-2xl overflow-hidden w-full flex flex-col list-panel xl:sticky xl:top-4"> |
|
<div class="list-panel__toolbar p-4 border-b border-slate-800 flex flex-col md:flex-row gap-3 md:items-center md:justify-between"> |
|
<form method="GET" class="flex flex-wrap gap-2 w-full md:w-auto"> |
|
<input type="hidden" name="sort" value="{{ $sort }}"> |
|
<input type="hidden" name="dir" value="{{ $dir }}"> |
|
<input name="q" value="{{ $search }}" placeholder="Search group or admin note..." |
|
class="flex-1 min-w-[10rem] md:w-56 rounded-lg bg-slate-800 border border-slate-700 px-4 py-2 text-sm text-white"> |
|
<button class="rounded-lg bg-cyan-600 hover:bg-cyan-500 px-4 py-2 text-sm font-medium">Search</button> |
|
@if ($search !== '') |
|
<a href="{{ route('ldap-groups.index', ['sort' => $sort, 'dir' => $dir]) }}" |
|
class="rounded-lg border border-slate-700 px-4 py-2 text-sm text-slate-300 hover:bg-slate-800">Clear</a> |
|
@endif |
|
</form> |
|
<div class="text-sm text-slate-400">{{ $meta['total'] }} groups</div> |
|
</div> |
|
|
|
<div class="list-panel__scroll"> |
|
<table class="min-w-full text-sm list-table"> |
|
<thead class="text-slate-300"> |
|
<tr> |
|
@foreach (['name' => 'Group', 'sam_account_name' => 'sAMAccountName', 'type' => 'Type', 'members_count' => 'Members', 'description' => 'Description'] as $key => $label) |
|
@php |
|
$nextDir = ($sort === $key && $dir === 'asc') ? 'desc' : 'asc'; |
|
$arrow = $sort === $key ? ($dir === 'asc' ? ' ↑' : ' ↓') : ''; |
|
@endphp |
|
<th class="px-4 py-3 text-left font-medium whitespace-nowrap bg-slate-800 border-b border-slate-700"> |
|
<a href="?sort={{ $key }}&dir={{ $nextDir }}&q={{ urlencode($search) }}" class="hover:text-cyan-400">{{ $label }}{{ $arrow }}</a> |
|
</th> |
|
@endforeach |
|
<th class="px-4 py-3 text-left font-medium whitespace-nowrap bg-slate-800 border-b border-slate-700">Admin Note</th> |
|
<th class="px-4 py-3 text-left font-medium whitespace-nowrap bg-slate-800 border-b border-slate-700">Action</th> |
|
</tr> |
|
</thead> |
|
<tbody class="divide-y divide-slate-800"> |
|
@forelse ($groups as $group) |
|
<tr class="hover:bg-slate-800/40"> |
|
<td class="px-4 py-3 font-medium text-white whitespace-nowrap">{{ $group['name'] }}</td> |
|
<td class="px-4 py-3 text-slate-300 whitespace-nowrap">{{ $group['sam_account_name'] }}</td> |
|
<td class="px-4 py-3 text-slate-300 whitespace-nowrap">{{ $group['type'] }}</td> |
|
<td class="px-4 py-3 text-slate-300">{{ $group['members_count'] }}</td> |
|
<td class="px-4 py-3 text-slate-300 max-w-xs truncate">{{ $group['description'] }}</td> |
|
<td class="px-4 py-3 text-slate-400 max-w-xs truncate text-xs" title="{{ $group['admin_note'] ?? '' }}"> |
|
{{ ($group['admin_note'] ?? '') !== '' ? Str::limit($group['admin_note'], 50) : '—' }} |
|
</td> |
|
<td class="px-4 py-3 whitespace-nowrap"> |
|
<a href="{{ route('ldap-groups.show', $group['route_key']) }}" |
|
class="rounded bg-cyan-700 hover:bg-cyan-600 text-white text-xs px-2 py-1">View</a> |
|
</td> |
|
</tr> |
|
@empty |
|
<tr><td colspan="7" class="px-4 py-8 text-center text-slate-400">No groups found.</td></tr> |
|
@endforelse |
|
</tbody> |
|
</table> |
|
</div> |
|
</div> |
|
|
|
<aside class="w-full xl:w-96 shrink-0 space-y-6 xl:sticky xl:top-4 notes-panel"> |
|
<div class="bg-slate-900 border border-slate-800 rounded-2xl p-5"> |
|
<h2 class="text-lg font-semibold text-white mb-4">Buat Grup Baru</h2> |
|
<form method="POST" action="{{ route('ldap-groups.store') }}" class="space-y-4" |
|
onsubmit="return confirm('Create new LDAP group?');"> |
|
@csrf |
|
<div> |
|
<label for="name" class="block text-sm text-slate-300 mb-1">Group Name</label> |
|
<input type="text" name="name" id="name" required maxlength="64" pattern="[a-zA-Z0-9 _.-]+" |
|
value="{{ old('name') }}" |
|
class="w-full rounded-lg bg-slate-800 border border-slate-700 px-4 py-2 text-sm text-white"> |
|
@error('name')<p class="text-red-400 text-xs mt-1">{{ $message }}</p>@enderror |
|
</div> |
|
<div> |
|
<label for="description" class="block text-sm text-slate-300 mb-1">Description (opsional)</label> |
|
<input type="text" name="description" id="description" maxlength="255" |
|
value="{{ old('description') }}" |
|
class="w-full rounded-lg bg-slate-800 border border-slate-700 px-4 py-2 text-sm text-white"> |
|
</div> |
|
<label class="flex items-center gap-2 text-sm text-slate-300"> |
|
<input type="checkbox" name="confirm_create" value="1" required class="rounded"> |
|
Saya yakin ingin membuat grup ini |
|
</label> |
|
<button type="submit" class="w-full rounded-lg bg-emerald-700 hover:bg-emerald-600 px-4 py-2 text-sm font-medium text-white"> |
|
Create Group |
|
</button> |
|
</form> |
|
</div> |
|
|
|
<div class="bg-slate-900 border border-slate-800 rounded-2xl p-5"> |
|
<h2 class="text-lg font-semibold text-white mb-4">Catatan</h2> |
|
<dl class="space-y-3 text-sm text-slate-400"> |
|
<div> |
|
<dt class="font-medium text-cyan-400 mb-1">Search & sort</dt> |
|
<dd>Klik header kolom untuk sort. Search mencakup nama grup dan deskripsi.</dd> |
|
</div> |
|
<div> |
|
<dt class="font-medium text-emerald-400 mb-1">View</dt> |
|
<dd>Kelola anggota grup, tambah/hapus member di halaman detail.</dd> |
|
</div> |
|
<div> |
|
<dt class="font-medium text-amber-400 mb-1">Grup protected</dt> |
|
<dd>Domain Admins, Enterprise Admins, dll. tidak dapat dihapus atau dimodifikasi.</dd> |
|
</div> |
|
</dl> |
|
</div> |
|
</aside> |
|
</div> |
|
</div> |
|
@endsection
|
|
|