resolve merge conflic

public/assets/js/master-provinsi.js

@@ -1,10 +1,5 @@
-/**
- * Page User List
- */
-
 'use strict';
 
-// Datatable (js)
 document.addEventListener('DOMContentLoaded', function (e) {
   let borderColor, bodyBg, headingColor;
 
@@ -12,14 +7,7 @@ document.addEventListener('DOMContentLoaded', function (e) {
   bodyBg = config.colors.bodyBg;
   headingColor = config.colors.headingColor;
 
-  // Variable declaration for table
-  const dt_user_table = document.querySelector('.datatables-users'),
-    userView = 'app-user-view-account.html',
-    statusObj = {
-      1: { title: 'Pending', class: 'bg-label-warning' },
-      2: { title: 'Active', class: 'bg-label-success' },
-      3: { title: 'Inactive', class: 'bg-label-secondary' }
-    };
+  const dt_provinsi_table = document.querySelector('.datatables-provinsi');
   var select2 = $('.select2');
 
   if (select2.length) {
@@ -30,11 +18,10 @@ document.addEventListener('DOMContentLoaded', function (e) {
     });
   }
 
-  if (dt_user_table) {
-      const dt_user = new DataTable(dt_user_table, {
+  if (dt_provinsi_table) {
+      const dt_provinsi = new DataTable(dt_provinsi_table, {
         ajax: provinsiListUrl,
         columns: [
-            { data: 'id' },
             { data: 'id' },
             { data: 'kode' }, 
             { data: 'nama' }, 
@@ -43,29 +30,20 @@ document.addEventListener('DOMContentLoaded', function (e) {
         columnDefs: [
             {
                 targets: 0,
-                className: 'control',
                 searchable: false,
                 orderable: false,
-                render: function() { return ''; }
-            },
-            {
-                targets: 1,
-                orderable: false,
-                checkboxes: {
-                    selectAllRender: '<input type="checkbox" class="form-check-input">'
-                },
-                render: function() {
-                    return '<input type="checkbox" class="dt-checkboxes form-check-input">';
+                render: function (data, type, full, meta) {
+                    return '<span class="text-truncate d-flex align-items-center text-heading">' + (meta.row + 1) + '</span>';
                 }
             },
             {
-                targets: 2,
+                targets: 1,
                 render: function (data, type, full, meta) {
                     return '<span class="text-truncate d-flex align-items-center text-heading">' + full['kode'] + '</span>';
                 }
             },
             {
-                targets: 3,
+                targets: 2,
                 render: function (data, type, full, meta) {
                     var name = full['nama'], iso = full['iso'];
                     var stateNum = Math.floor(Math.random() * 6);
@@ -95,8 +73,9 @@ document.addEventListener('DOMContentLoaded', function (e) {
                 render: function (data, type, full, meta) {
                     return `
                         <div class="d-flex align-items-center">
-                            <a href="javascript:;" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill delete-record"><i class="ti tabler-trash ti-md"></i></a>
-                            <a href="javascript:;" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill"><i class="ti tabler-eye ti-md"></i></a>
+                            <a href="javascript:;" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill view-edit-record" data-id="${full.id}"><i class="ti tabler-edit ti-md"></i></a>
+                            <a href="javascript:;" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill delete-record" data-id="${full.id}"><i class="ti tabler-trash ti-md"></i></a>
+                            <a href="javascript:;" class="btn btn-icon btn-text-secondary waves-effect waves-light rounded-pill view-record" data-id="${full.id}"><i class="ti tabler-eye ti-md"></i></a>
                         </div>`;
                 }
             }
@@ -148,8 +127,6 @@ document.addEventListener('DOMContentLoaded', function (e) {
     });
   }
 
-  // Filter form control to default size
-  // ? setTimeout used for user-list table initialization
   setTimeout(() => {
     const elementsToModify = [
       { selector: '.dt-buttons .btn', classToRemove: 'btn-secondary' },
@@ -166,7 +143,6 @@ document.addEventListener('DOMContentLoaded', function (e) {
       { selector: '.dt-layout-full', classToRemove: 'col-md col-12', classToAdd: 'table-responsive' }
     ];
 
-    // Delete record
     elementsToModify.forEach(({ selector, classToRemove, classToAdd }) => {
       document.querySelectorAll(selector).forEach(element => {
         if (classToRemove) {
@@ -179,43 +155,35 @@ document.addEventListener('DOMContentLoaded', function (e) {
     });
   }, 100);
 
-  // Validation & Phone mask
-  const phoneMaskList = document.querySelectorAll('.phone-mask'),
-    addNewUserForm = document.getElementById('addNewUserForm');
-
-  // Phone Number
-  if (phoneMaskList) {
-    phoneMaskList.forEach(function (phoneMask) {
-      phoneMask.addEventListener('input', event => {
-        const cleanValue = event.target.value.replace(/\D/g, '');
-        phoneMask.value = formatGeneral(cleanValue, {
-          blocks: [3, 3, 4],
-          delimiters: [' ', ' ']
-        });
-      });
-      registerCursorTracker({
-        input: phoneMask,
-        delimiter: ' '
-      });
-    });
-  }
-  // Add New User Form Validation
-  const fv = FormValidation.formValidation(addNewUserForm, {
+  const fv = FormValidation.formValidation(addNewProvinsiForm, {
     fields: {
-      userFullname: {
+      kode: {
         validators: {
           notEmpty: {
-            message: 'Please enter fullname '
+            message: 'Silakan masukkan kode provinsi'
+          },
+          stringLength: {
+            min: 2,
+            max: 2,
+            message: 'Kode provinsi harus terdiri dari 2 karakter'
           }
         }
       },
-      userEmail: {
+      nama: {
         validators: {
           notEmpty: {
-            message: 'Please enter your email'
+            message: 'Silakan masukkan nama provinsi'
+          }
+        }
+      },
+      iso: {
+        validators: {
+          notEmpty: {
+            message: 'Silakan masukkan kode ISO provinsi'
           },
-          emailAddress: {
-            message: 'The value is not a valid email address'
+          regexp: {
+            regexp: /^[A-Z]{2}-[A-Z]{2}$/,
+            message: 'The value is not a valid ISO code (e.g., ID-AC)'
           }
         }
       }
@@ -223,44 +191,200 @@ document.addEventListener('DOMContentLoaded', function (e) {
     plugins: {
       trigger: new FormValidation.plugins.Trigger(),
       bootstrap5: new FormValidation.plugins.Bootstrap5({
-        // Use this for enabling/changing valid/invalid class
         eleValidClass: '',
-        rowSelector: function (field, ele) {
-          // field is the field name & ele is the field element
-          return '.form-control-validation';
-        }
+        rowSelector: '.form-control-validation'
       }),
       submitButton: new FormValidation.plugins.SubmitButton(),
-      // Submit the form when all fields are valid
-      // defaultSubmit: new FormValidation.plugins.DefaultSubmit(),
       autoFocus: new FormValidation.plugins.AutoFocus()
-    }
+    },
+  }).on('core.form.valid', function () {
+      const form = document.getElementById('addNewProvinsiForm');
+      const formData = new FormData(form);
+      const offcanvasAdd = bootstrap.Offcanvas.getInstance(document.querySelector('#offcanvasAddProvinsi'));
+
+      $.ajax({
+          url: form.action,
+          type: 'POST',
+          data: $(form).serialize(),
+          success: function (response) {
+              if (response.status === 'success') {
+                  offcanvasAdd.hide();
+                  form.reset();
+                  Swal.fire({
+                      icon: 'success',
+                      title: 'Berhasil!',
+                      text: response.message,
+                      showConfirmButton: false,
+                      timer: 2000,
+                      customClass: { confirmButton: 'btn btn-primary' }
+                  });
+
+                  $('.datatables-provinsi').DataTable().ajax.reload();
+              }
+          },
+          error: function (xhr) {
+              let msg = 'Terjadi kesalahan saat menyimpan data.';
+              if (xhr.responseJSON && xhr.responseJSON.message) {
+                  msg = xhr.responseJSON.message;
+              }
+              
+              Swal.fire({
+                  icon: 'error',
+                  title: 'Gagal!',
+                  text: msg,
+                  customClass: { confirmButton: 'btn btn-primary' }
+              });
+          }
+      });
   });
 });
 
-$('.datatables-users tbody').on('click', '.verify-user', function () {
-    const userId = $(this).data('id');
-    const currentStatus = $(this).data('status'); // 1 = Active, 2 = Pending
-    const actionText = (currentStatus === 1) ? 'menonaktifkan (set Pending)' : 'mengaktifkan';
+$(function () {
+  var offcanvasElement = document.getElementById('offcanvasViewProvinsi');
+  var offcanvasView = new bootstrap.Offcanvas(offcanvasElement);
 
-    if (confirm('Apakah Anda yakin ingin ' + actionText + ' user ini?')) {
-        $.ajax({
-            url: '/users/' + userId + '/verify',
-            type: 'POST',
-            data: {
-                _token: $('meta[name="csrf-token"]').attr('content'),
-                _method: 'PATCH'
-            },
-            success: function (response) {
-                // Reload tabel tanpa reset posisi pagination (false)
-                $('.datatables-users').DataTable().ajax.reload(null, false);
-                
-                // Opsional: Notifikasi kecil di pojok (jika pakai library toastr)
-                // toastr.success('Status berhasil diperbarui');
-            },
-            error: function (xhr) {
-                alert('Gagal mengubah status user.');
+  $(document).on('click', '.view-record', function () {
+    var provinsiId = $(this).data('id'); 
+    
+    var $btn = $(this);
+    $btn.addClass('disabled');
+
+    $.ajax({
+      url: '/provinsi/' + provinsiId,
+      type: 'GET',
+      success: function (response) {
+        $btn.removeClass('disabled');
+        
+        if (response.status === 'success') {
+          var data = response.data;
+          $('#view-provinsi-code').val(data.kode);
+          $('#view-provinsi-name').val(data.nama);
+          $('#view-provinsi-path').val(data.path);
+          $('#view-provinsi-iso').val(data.iso);
+
+          offcanvasView.show();
+        }
+      },
+      error: function (xhr) {
+        $btn.removeClass('disabled');
+        alert('Gagal mengambil data: ' + xhr.statusText);
+      }
+    });
+  });
+});
+
+$(function () {
+    const offcanvasEl = document.getElementById('offcanvasEditProvinsi');
+    const offcanvasEdit = new bootstrap.Offcanvas(offcanvasEl);
+
+    $(document).on('click', '.view-edit-record', function () {
+        const id = $(this).data('id');
+        
+        $.get(`/provinsi/${id}`, function (response) {
+            if (response.status === 'success') {
+                const d = response.data;
+                $('#edit-provinsi-id').val(d.id);
+                $('#edit-provinsi-code').val(d.kode);
+                $('#edit-provinsi-name').val(d.nama);
+                $('#edit-provinsi-path').val(d.path);
+                $('#edit-provinsi-iso').val(d.iso);
+
+                offcanvasEdit.show();
             }
         });
-    }
+    });
+
+    $('#editProvinsiForm').on('submit', function (e) {
+      e.preventDefault();
+      
+      const id = $('#edit-provinsi-id').val();
+      const formData = $(this).serialize();
+
+      $.ajax({
+          url: `/provinsi/${id}`,
+          type: 'PUT',
+          data: formData,
+          headers: {
+              'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
+          },
+          success: function (response) {
+              if (response.status === 'success') {
+                  offcanvasEdit.hide();
+                  
+                  Swal.fire({
+                      icon: 'success',
+                      title: 'Berhasil!',
+                      text: response.message,
+                      showConfirmButton: false,
+                      timer: 1500
+                  });
+                  
+                  $('.datatables-provinsi').DataTable().ajax.reload();
+              }
+          },
+          error: function (xhr) {
+              let errorMsg = 'Terjadi kesalahan sistem.';
+              if (xhr.responseJSON && xhr.responseJSON.message) {
+                  errorMsg = xhr.responseJSON.message;
+              }
+
+              Swal.fire({
+                  icon: 'error',
+                  title: 'Oops...',
+                  text: errorMsg,
+                  confirmButtonColor: '#7367f0'
+              });
+          }
+      });
+  });
+});
+
+$(document).on('click', '.delete-record', function () {
+    const id = $(this).data('id');
+    const name = $(this).closest('tr').find('.fw-medium').text();
+
+    Swal.fire({
+        title: 'Apakah Anda yakin?',
+        text: `Provinsi "${name}" akan dihapus secara permanen!`,
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Ya, Hapus!',
+        cancelButtonText: 'Batal',
+        customClass: {
+            confirmButton: 'btn btn-primary me-3',
+            cancelButton: 'btn btn-label-secondary'
+        },
+        buttonsStyling: false
+    }).then(function (result) {
+        if (result.value) {
+            $.ajax({
+                url: `/provinsi/${id}`,
+                type: 'DELETE',
+                headers: {
+                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
+                },
+                success: function (response) {
+                    if (response.status === 'success') {
+                        Swal.fire({
+                            icon: 'success',
+                            title: 'Terhapus!',
+                            text: response.message,
+                            showConfirmButton: false,
+                            timer: 1500
+                        });
+
+                        $('.datatables-provinsi').DataTable().ajax.reload();
+                    }
+                },
+                error: function (xhr) {
+                    Swal.fire({
+                        icon: 'error',
+                        title: 'Oops...',
+                        text: 'Terjadi kesalahan saat menghapus data.',
+                        customClass: { confirmButton: 'btn btn-primary' }
+                    });
+                }
+            });
+        }
+    });
 });