partial update create modal list dealers

resources/js/warehouse_management/opnames/create.js

@@ -0,0 +1,60 @@
+const productUrl = $("#product-container").data("url");
+
+function createProductSelectOptions(callback) {
+    $.ajax({
+        url: productUrl,
+        method: "GET",
+        success: function (data) {
+            let options = '<option value="">Pilih Produk</option>';
+            data.forEach((product) => {
+                options += `<option value="${product.id}">${product.name}</option>`;
+            });
+            callback(options);
+        },
+        error: function () {
+            alert("Gagal memuat produk.");
+        },
+    });
+}
+
+$(document).ready(function () {
+    // Initial load only for the first row
+    createProductSelectOptions((options) => {
+        $(".product-select").first().html(options);
+    });
+
+    // When adding a new row
+    $(document).on("click", ".btn-add-row", function () {
+        const row = `
+          <div class="form-row align-items-end product-row">
+            <div class="form-group col-md-4">
+              <select name="product[]" class="form-control product-select">
+                <option>Loading...</option>
+              </select>
+            </div>
+            <div class="form-group col-md-3">
+              <input type="text" name="system_quantity[]" class="form-control" placeholder="Stok sistem">
+            </div>
+            <div class="form-group col-md-3">
+              <input type="text" name="physical_quantity[]" class="form-control" placeholder="Stok fisik">
+            </div>
+            <div class="form-group col-md-2">
+              <button type="button" class="btn btn-danger btn-remove-row"><i class="flaticon2-delete"></i></button>
+            </div>
+          </div>
+        `;
+
+        const $newRow = $(row);
+        $("#product-container").append($newRow);
+
+        // Load options only for the new select
+        createProductSelectOptions((options) => {
+            $newRow.find(".product-select").html(options);
+        });
+    });
+
+    // Remove row
+    $(document).on("click", ".btn-remove-row", function () {
+        $(this).closest(".product-row").remove();
+    });
+});

resources/js/warehouse_management/opnames/index.js

@@ -16,3 +16,34 @@ let table = $("#opnames-table").DataTable({
         { data: "action", name: "action", orderable: false, searchable: false },
     ],
 });
+$(document).on("click", ".btn-product-stock-dealers", function () {
+    const productId = $(this).data("id");
+    const productName = $(this).data("name");
+    const ajaxUrl = $(this).data("url");
+
+    // Set product name in modal title
+    $("#product-name-title").text(productName);
+
+    // Initialize or reload DataTable inside modal
+    $("#dealer-stock-table").DataTable({
+        destroy: true, // reinit if exists
+        processing: true,
+        serverSide: true,
+        ajax: {
+            url: ajaxUrl,
+            data: {
+                product_id: productId,
+            },
+        },
+        columns: [
+            { data: "dealer_name", name: "dealer_name" },
+            { data: "system_stock", name: "system_stock" },
+            { data: "physical_stock", name: "physical_stock" },
+            { data: "difference", name: "difference" },
+            { data: "opname_date", name: "opname_date" },
+        ],
+    });
+
+    // Show the modal
+    $("#dealerStockModal").modal("show");
+});