Add Button for action on constraint

chapdel · Jun 26, 2023 · 4cbcf0f · 4cbcf0f
1 parent 2013bc0
commit 4cbcf0f
Show file tree

Hide file tree

Showing 5 changed files with 117 additions and 3 deletions.
diff --git a/routes/api.php b/routes/api.php
@@ -7,5 +7,8 @@
     Route::get('getAudit', [DisplayController::class, 'getAudit']);
     Route::get('getTableData/{table}', [DisplayController::class, 'getTableData']);
     Route::get('gettableconstraint/{table}', [DisplayController::class, 'getTableConstraint']);
+
+
+    Route::post('change-constraint', [DisplayController::class, 'changeConstraint']);
 });
 
diff --git a/src/Controllers/DisplayController.php b/src/Controllers/DisplayController.php
@@ -3,6 +3,7 @@
 namespace Vcian\LaravelDBAuditor\Controllers;
 
 use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
 use Vcian\LaravelDBAuditor\Constants\Constant;
 use Vcian\LaravelDBAuditor\Traits\Audit;
 use Vcian\LaravelDBAuditor\Traits\Rules;
@@ -67,6 +68,9 @@ public function getTableData(string $tableName) : JsonResponse
     public function getTableConstraint(string $tableName) : JsonResponse
     {
 
+        $noConstraintFields = $this->getNoConstraintFields($tableName);
+        $constraintList = $this->getConstraintList($tableName, $noConstraintFields);
+
         $data = [
             "fields" => $this->getFieldsDetails($tableName),
             'constrain' => [
@@ -111,11 +115,22 @@ public function getTableConstraint(string $tableName) : JsonResponse
                 }
             }
 
+            if($primaryKey === "-" && $indexing === "-" && $uniqueKey === "-" && $foreignKey === "-") {
+                $indexing = '<img src=' . asset("auditor/icon/add.png") . ' alt="key" class="m-auto add-constraint-'.$table->COLUMN_NAME.'" style="height:30px" onclick="addIndex(`'.$table->COLUMN_NAME.'`)"/>';
+            }
+
             $response[] = ["column" => $table->COLUMN_NAME, "primaryKey" =>  $primaryKey, "indexing" => $indexing, "uniqueKey" => $uniqueKey, "foreignKey" => $foreignKey];
         }
 
         return response()->json(array(
             "data" => $response
         ));
     }
+
+    public function changeConstraint(Request $request)
+    {
+        $data = $request->all();
+        $this->addConstraint($data['table_name'], $data['colum_name'], "INDEX");
+        return $data['colum_name'];
+    }
 }
diff --git a/src/resource/images/add.png b/src/resource/images/add.png
diff --git a/src/views/auditor/layouts/default.blade.php b/src/views/auditor/layouts/default.blade.php
@@ -169,6 +169,7 @@
             background-image: url({{ asset('auditor/icon/bg.png') }});
         }
     </style>
+    @stack('css')
 </head>
 
 <body class="bg-black bg-main bg-[length:100%] text-white font-raleway h-[85vh] mb-10">

diff --git a/src/views/auditor/pages/audit.blade.php b/src/views/auditor/pages/audit.blade.php
@@ -1,6 +1,52 @@
 @extends('DBAuditor::auditor.layouts.default')
 
+@push('css')
+    <style>
+        #myDialog {
+            width: 300px;
+            padding: 20px;
+            background-color: #f2f2f2;
+            border: 1px solid #ccc;
+        }
+
+        #myDialog h2 {
+            margin-top: 0;
+        }
+
+        #myDialog button {
+            margin-top: 10px;
+        }
+
+        /* Toast Container */
+        .toast-container {
+        position: fixed;
+        top: 20px;
+        right: 20px;
+        z-index: 9999;
+        }
+        
+        /* Toast Message */
+        .toast {
+        background-color: #333;
+        color: #fff;
+        padding: 15px;
+        border-radius: 5px;
+        font-family: Arial, sans-serif;
+        font-size: 14px;
+        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
+        opacity: 0;
+        transition: opacity 0.3s ease-in-out;
+        }
+        
+        /* Toast Animation */
+        .toast.show {
+        opacity: 1;
+        }
+    </style>
+@endpush
+
 @section('section')
+<div id="toasts"></div>
     <div class="tabs flex items-center pt-3 mb-3">
         <button data-tab-value="#tab_standard"
             class="active uppercase d-flex items-center me-3 text-[13px] pb-2 relative custom-action">
@@ -93,6 +139,20 @@ class="btn dropdown-toggle bg-light-black border-0 rounded-2xl text-white w-64 t
             </table>
         </div>
     </div>
+
+    <div class="toast-container">
+        <div class="toast">This is a toast message</div>
+      </div>
+
+<dialog id="myDialog">
+  <h2>Dialog Title</h2>
+  <p>This is the content of the dialog.</p>
+
+
+
+  <button onclick="closeDialog()">Close</button>
+</dialog>
+
 @endsection
 
 @section('script')
@@ -178,11 +238,13 @@ className: 'dt-control',
 
             // Constraint
             $('#tbl-dropdown').on('change', function() {
-
                 changeTable(this.value);
+            });    
 
-            });
-
+            setTimeout(function() {
+                var toast = document.querySelector('.toast');
+                toast.classList.add('show');
+            }, 1000);
         });
 
         function format(d) {
@@ -318,6 +380,39 @@ function changeTable(tableName) {
             });
         }
 
+        // function openDialog() {
+        //     var dialog = document.getElementById("myDialog");
+        // dialog.showModal();
+        // }
+
+        // function closeDialog() {
+        //     var dialog = document.getElementById("myDialog");
+        // dialog.close();
+        // }
+
+        function addIndex(columnName) {
+            $.ajax({
+            url: 'api/change-constraint',
+            type: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
+            },
+            data: JSON.stringify({"colum_name" : columnName, "table_name" : $('#tbl-dropdown').val(), "constraint" : 'index'}),
+            success: function(response) {
+                if(response) {
+                    var newElement = $('<img src="auditor/icon/gray-key.svg" alt="key" class="m-auto" />');
+                    $(".add-constraint-"+response).replaceWith(newElement);
+                }
+            },
+            error: function(xhr, status, error) {
+                console.error(error);
+            }
+            });
+   
+        }
+
+
         $(document).on("click", ".custom-action", function() {
             $("#constraints").DataTable().draw();
             $("#standards").DataTable().draw();