update

resources/views/administrator/layout/master.blade.php

@@ -92,6 +92,8 @@
 
     @include('administrator.layout.partials.toast')
 
+    <x-modal-confirm-delete />
+
     @stack('custom-scripts')
 </body>
 

resources/views/administrator/pages/block/ModuleVCenter.blade.php

@@ -1,9 +1,12 @@
-<a href="{{ route('module.vcenter.create') }}" class="btn btn-outline-secondary"><i class="fas fa-plus-circle"></i> Add New Server</a>
+<x-button-crm type="button" variant="primary" size="sm" route="module.vcenter.create" icon="plus-circle">Add
+    Server</x-button-crm>
 <form action="{{ route('module.vcenter.import') }}" class="d-lg-inline" enctype="multipart/form-data" method="post">
     @csrf
-    <input type="file" name="file" class="d-none file-selector" accept=".csv,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" onchange="form.submit()" />
-    <button type="button" class="btn btn-outline-secondary btn-import__from">
-        <i class="fas fa-plus-circle"></i> Import From Excel
-    </button>
+    <input type="file" name="file" class="d-none file-selector"
+        accept=".csv,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" onchange="form.submit()" />
+    <x-button-crm type="button" variant="success" size="sm" route="module.vcenter.import" icon="plus-circle">Import
+        From
+        Excel</x-button-crm>
 </form>
-<a href="{{ url('file/vCenter.xlsx') }}"  class="btn btn-outline-secondary"><i class="fas fa-download"></i> File Import Demo</a>
+<x-button-crm type="button" variant="secondary" size="sm" url="file/vCenter.xlsx" icon="download">File Import
+    Demo</x-button-crm>

resources/views/administrator/pages/module/dns/add.blade.php

@@ -76,14 +76,15 @@
                         </div>
                     </div>
                 </div>
-                <div class="card-footer bg-white border-top p-3 d-flex justify-content-end gap-2">
+                {{-- Fixed Bottom Actions --}}
+                <x-fixed-action-bar>
                     <x-button-c-r-m route="module.dns.index" variant="secondary" icon="arrow-left">
                         Cancel
                     </x-button-c-r-m>
                     <x-button-c-r-m type="submit" variant="primary" icon="save">
-                        Save DNS Server
+                        Create
                     </x-button-c-r-m>
-                </div>
+                </x-fixed-action-bar>
             </form>
         </div>
     @else

resources/views/administrator/pages/module/dns/edit.blade.php

@@ -7,11 +7,11 @@
 
 @section('breadcrumb')
     @php
-$breadcrumbItems = [
-    ['label' => 'Modules'],
-    ['label' => 'DNS Server', 'url' => route('module.dns.index')],
-    ['label' => 'Edit DNS Server', 'active' => true],
-];
+        $breadcrumbItems = [
+            ['label' => 'Modules'],
+            ['label' => 'DNS Server', 'url' => route('module.dns.index')],
+            ['label' => 'Edit DNS Server', 'active' => true],
+        ];
     @endphp
     <x-admin-breadcrumb :items="$breadcrumbItems" />
 @endsection
@@ -79,16 +79,22 @@ $breadcrumbItems = [
                         </div>
                     </div>
                 </div>
-                <div class="card-footer bg-white border-top p-3 d-flex justify-content-end gap-2">
+                {{-- Fixed Bottom Actions --}}
+                <x-fixed-action-bar>
                     <x-button-c-r-m route="module.dns.index" variant="secondary" icon="arrow-left">
                         Cancel
                     </x-button-c-r-m>
+
                     <x-button-c-r-m type="submit" variant="primary" icon="save">
-                        Save Changes
+                        Update
                     </x-button-c-r-m>
-                </div>
-                </form>
-                </div>
+                    <x-button-c-r-m type="delete" variant="danger" icon="trash"
+                        :confirm-url="route('module.dns.destroy', ['id' => $server->id])" :confirm-name="$server->name">
+                        Delete
+                    </x-button-c-r-m>
+                </x-fixed-action-bar>
+            </form>
+        </div>
     @else
         <div class="alert alert-danger alert-dismissible">
             <h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module dns
@@ -105,4 +111,4 @@ $breadcrumbItems = [
             $('.select2').select2();
         });
     </script>
-@endpush
+@endpush

resources/views/administrator/pages/module/vcenter/edit.blade.php

@@ -112,6 +112,10 @@ $breadcrumbItems = [
                 <x-button-c-r-m route="module.vcenter.index" variant="secondary" icon="arrow-left">
                     Cancel
                 </x-button-c-r-m>
+                <x-button-c-r-m type="delete" variant="danger" icon="trash"
+                    :confirm-url="route('module.vcenter.destroy', ['id' => $server->id])" :confirm-name="$server->host">
+                    Delete
+                </x-button-c-r-m>
                 <x-button-c-r-m type="submit" variant="primary" icon="save">
                     Save Changes
                 </x-button-c-r-m>

resources/views/administrator/pages/module/vcenter/index.blade.php

@@ -7,18 +7,17 @@
 
 @section('breadcrumb')
     @php
-$breadcrumbItems = [
-    ['label' => 'Modules'],
-    ['label' => 'Package vCenter'],
-    ['label' => 'Datacenter', 'active' => true],
-];
+        $breadcrumbItems = [
+            ['label' => 'Modules'],
+            ['label' => 'Vcenter', 'active' => true],
+        ];
     @endphp
     <x-admin-breadcrumb :items="$breadcrumbItems" />
 @endsection
 @section('content')
     @if(auth()->guard('admins')->user()->can("manager module vcenter"))
         <div class="card card-primary card-outline">
-            <div class="card-header">
+            <div class="card-header d-flex justify-content-end gap-2">
                 @include("administrator.pages.block.ModuleVCenter")
             </div>
             <div class="card-body">
@@ -28,14 +27,14 @@ $breadcrumbItems = [
                     ['key' => 'status', 'label' => 'Status'],
                     ['key' => 'action', 'label' => 'Action'],
                 ]" />
-                    </div>
-                </div>
-    @else
-            <div class="alert alert-danger alert-dismissible">
-                <h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module vCenter
-                    management department</h5>
             </div>
-        @endif
+        </div>
+    @else
+        <div class="alert alert-danger alert-dismissible">
+            <h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Module vCenter
+                management department</h5>
+        </div>
+    @endif
 @endsection
 @push('plugin-scripts')
     @foreach (config('assets.datatable.js') as $datatable)

resources/views/components/button-c-r-m.blade.php

@@ -1,8 +1,15 @@
 @php
     $tag = 'button';
     $href = null;
+    $buttonType = $type;
 
-    if ($route) {
+    if ($type === 'delete' || $confirm) {
+        $tag = 'button';
+        $buttonType = 'button';
+        $attributes = $attributes->merge([
+            'onclick' => "confirmDelete('$confirmUrl', '$confirmName')",
+        ]);
+    } elseif ($route) {
         $href = route($route, $params);
         $tag = 'a';
     } elseif ($url) {
@@ -13,7 +20,7 @@
         $tag = 'a';
     }
 
-    $baseClasses = 'd-inline-flex gap-2 align-items-center justify-content-center text-white border-0 shadow-lg px-3 py-2 rounded-pill';
+    $baseClasses = 'd-inline-flex gap-2 align-items-center justify-content-center text-white border-0 px-3 py-2 rounded-pill';
 
     $variants = [
         'primary' => 'bg-primary',
@@ -34,24 +41,24 @@
         'icon' => 'h-10',
     ];
 
-    $variantClass = $variants[$variant] ?? $variants['primary'];
-    $sizeClass = $sizes[$size] ?? $sizes['default'];
+    $variantClass = $variants[$variant ?? 'primary'] ?? $variants['primary'];
+    $sizeClass = $sizes[$size ?? 'md'] ?? $sizes['default'];
 
     $classes = "{$baseClasses} {$variantClass} {$sizeClass}";
 @endphp
-
-@if($tag === 'a')
-    <a href="{{ $href }}" {{ $attributes->merge(['class' => $classes]) }}>
-        @if($icon)
-            <i data-lucide="{{ $icon }}" class="mr-2" style="height: 15px; width: 15px"></i>
-        @endif
-        {{ $slot }}
-    </a>
-@else
-    <button type="{{ $type }}" {{ $attributes->merge(['class' => $classes]) }}>
-        @if($icon)
-            <i data-lucide="{{ $icon }}" class="mr-2" style="height: 15px; width: 15px"></i>
-        @endif
-        {{ $slot }}
-    </button>
-@endif
+    
+    @if($tag === 'a')
+        <a href="{{ $href }}" {{ $attributes->merge(['class' => $classes]) }}>
+            @if($icon)
+                <i data-lucide="{{ $icon }}" class="mr-2" style="height: 15px; width: 15px"></i>
+            @endif
+            {{ $slot }}
+        </a>
+    @else
+        <button type="{{ $buttonType }}" {{ $attributes->merge(['class' => $classes]) }}>
+            @if($icon)
+                <i data-lucide="{{ $icon }}" class="mr-2" style="height: 15px; width: 15px"></i>
+            @endif
+            {{ $slot }}
+        </button>
+    @endif

resources/views/components/modal-confirm-delete.blade.php

@@ -0,0 +1,52 @@
+<!-- Generic Delete Confirmation Modal -->
+<div class="modal micromodal-slide" id="deleteConfirmationModal" aria-hidden="true">
+    <div class="modal__overlay" tabindex="-1" data-micromodal-close>
+        <div class="modal__container modal--sm" role="dialog" aria-modal="true" aria-labelledby="deleteConfirmationModalLabel">
+            <header class="modal__header bg-primary text-white">
+                <h6 class="modal__title" id="deleteConfirmationModalLabel">
+                    <i data-lucide="trash-2" class="w-15px h-15px me-2"></i>
+                    Confirm Delete
+                </h6>
+                <button class="modal__close" aria-label="Close modal" data-micromodal-close>
+                    <i data-lucide="x"></i>
+                </button>
+            </header>
+            <main class="modal__content">
+                <div class="text-center">
+                    <i data-lucide="alert-triangle" class="text-warning mb-3" style="width: 48px; height: 48px;"></i>
+                    <h6 class="mb-2">Are you sure?</h6>
+                    <p class="text-muted small mb-1">Delete item:</p>
+                    <p class="fw-bold mb-2"><span id="confirmDeleteItemName"></span></p>
+                    <p class="text-danger small mb-0">This action cannot be undone!</p>
+                </div>
+            </main>
+            <footer class="modal__footer">
+                <x-button-crm type="button" variant="secondary" size="sm" icon="x" data-micromodal-close>Cancel</x-button-crm>
+                <form id="confirmDeleteForm" method="POST" class="d-inline">
+                    @csrf
+                    @method('DELETE')
+                    <x-button-crm type="submit" variant="danger" size="sm" icon="trash-2">Confirm Delete</x-button-crm>
+                </form>
+            </footer>
+        </div>
+    </div>
+</div>
+
+@push('custom-scripts')
+<script>
+    window.confirmDelete = function(url, name) {
+        const nameElement = document.getElementById('confirmDeleteItemName');
+        const formElement = document.getElementById('confirmDeleteForm');
+        
+        if (nameElement && formElement) {
+            nameElement.textContent = name;
+            formElement.action = url;
+            if (typeof ModalManager !== 'undefined') {
+                ModalManager.show('deleteConfirmationModal');
+            } else {
+                MicroModal.show('deleteConfirmationModal');
+            }
+        }
+    };
+</script>
+@endpush