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");
+});

resources/views/layouts/partials/header.blade.php

@@ -19,7 +19,7 @@
             <div class="kt-header__topbar-wrapper" data-toggle="dropdown" data-offset="0px,0px">
                 <div class="kt-header__topbar-user">
                     <span class="kt-header__topbar-welcome kt-hidden-mobile">Hi,</span>
-                    <span class="kt-header__topbar-username kt-hidden-mobile">John Doe</span>
+                    <span class="kt-header__topbar-username kt-hidden-mobile">{{ Auth::user()->name ?? '' }}</span>
                 </div>
             </div>
 
@@ -27,7 +27,7 @@
                 <!--begin: Head -->
                 <div class="kt-user-card kt-user-card--skin-dark kt-notification-item-padding-x" style="background-image: url('{{ url('assets/media/misc/bg-1.jpg') }}')">
                     <div class="kt-user-card__name">
-                        John Doe
+                        {{ Auth::user()->name ?? '' }}
                     </div>
                 </div>
                 <!--end: Head -->

resources/views/warehouse_management/opnames/create.blade.php

@@ -0,0 +1,59 @@
+@extends('layouts.backapp')
+
+@section('content')
+<div class="kt-portlet kt-portlet--mobile" id="kt_blockui_datatable">
+  <div class="kt-portlet__head kt-portlet__head--lg">
+    <div class="kt-portlet__head-label">
+      <span class="kt-portlet__head-icon">
+        <i class="kt-font-brand flaticon2-plus"></i>
+      </span>
+      <h3 class="kt-portlet__head-title">Tambah Opnames</h3>
+    </div>
+  </div>
+
+  <div class="kt-portlet__body">
+    <form id="opname-form" action="{{ route('opnames.store') }}" method="POST">
+      @csrf
+      <div class="form-group">
+        <label for="dealer">Dealer</label>
+        <select name="dealer" id="dealer" class="form-control">
+          <option value="">Pilih Dealer</option>
+          @foreach($dealers as $dealer)
+            <option value="{{ $dealer->id }}">{{ $dealer->name }}</option>
+          @endforeach
+        </select>
+      </div>
+
+      <div id="product-container" data-url="{{ route('products.all') }}">
+        <div class="form-row align-items-end product-row">
+          <div class="form-group col-md-4">
+            <label for="product[]">Produk</label>
+            <select name="product[]" class="form-control product-select" >
+              <option value="">Pilih Produk</option>
+            </select>
+          </div>
+          <div class="form-group col-md-3">
+            <label>Stok Sistem</label>
+            <input type="text" name="system_quantity[]" class="form-control" placeholder="Stok sistem">
+          </div>
+          <div class="form-group col-md-3">
+            <label>Stok Fisik</label>
+            <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-success btn-add-row"><i class="flaticon2-plus"></i></button>
+          </div>
+        </div>
+      </div>
+
+      <div class="form-group mt-4">
+        <button type="submit" class="btn btn-primary">Simpan</button>
+      </div>
+    </form>
+  </div>
+</div>
+@endsection
+
+@section('javascripts')
+<script src="{{ mix('js/warehouse_management/opnames/create.js') }}"></script>
+@endsection

resources/views/warehouse_management/opnames/index.blade.php

@@ -39,6 +39,34 @@
       </div>
   </div>
 </div>
+
+<div class="modal fade" id="dealerStockModal" tabindex="-1" role="dialog" aria-labelledby="dealerStockModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-lg" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title">Dealer Stock for <span id="product-name-title"></span></h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span>&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <table id="dealer-stock-table" class="table table-bordered">
+            <thead>
+              <tr>
+                <th>Dealer</th>
+                <th>System Stock</th>
+                <th>Physical Stock</th>
+                <th>Difference</th>
+                <th>Opname Date</th>
+              </tr>
+            </thead>
+            <tbody></tbody>
+          </table>
+        </div>
+      </div>
+    </div>
+</div>  
+  
 @endsection
 
 @section('javascripts')