fix structure product categories table and crud product

This commit is contained in:
2025-06-02 16:21:33 +07:00
parent 59e23ae535
commit 6bf8bc4965
21 changed files with 573 additions and 141 deletions

View File

@@ -10,13 +10,8 @@ let table = $("#product-categories-table").DataTable({
serverSide: true,
ajax: url,
columns: [
{
data: "DT_RowIndex",
name: "DT_RowIndex",
orderable: false,
searchable: false,
},
{ data: "name", name: "name" },
{ data: "parent", name: "parent" },
{ data: "action", name: "action", orderable: false, searchable: false },
],
});
@@ -27,6 +22,7 @@ $(document).ready(function () {
$("#category_id").val("");
$("#modalTitle").text("Tambah Kategori");
$("#productCategoryModal").modal("show");
loadParentCategories();
});
// Submit form (baik tambah maupun edit)
@@ -67,6 +63,26 @@ $(document).on("click", ".btn-edit-product-category", function () {
success: function (response) {
$("#category_id").val(response.id);
$("#name").val(response.name);
// Get parent categories and populate select
$.ajax({
url: "/warehouse/categories/parents", // Adjust to match your route
method: "GET",
success: function (parents) {
let options =
'<option value="">-- Tidak ada (Parent)</option>';
parents.forEach(function (parent) {
// Avoid self-select
if (parent.id !== response.id) {
options += `<option value="${parent.id}" ${
response.parent_id === parent.id
? "selected"
: ""
}>${parent.name}</option>`;
}
});
$("#parent_id").html(options);
},
});
$("#modalTitle").text("Edit Kategori");
$("#productCategoryModal").modal("show");
},
@@ -107,3 +123,24 @@ $(document).on("click", ".btn-destroy-product-category", function () {
}
});
});
function loadParentCategories(selectedId = null) {
$.ajax({
url: "/warehouse/categories/parents", // create this route
type: "GET",
success: function (data) {
$("#parent_id")
.empty()
.append(
'<option value="">-- Tidak ada (Kategori Utama) --</option>'
);
data.forEach(function (category) {
$("#parent_id").append(
`<option value="${category.id}" ${
selectedId == category.id ? "selected" : ""
}>${category.name}</option>`
);
});
},
});
}

View File

@@ -0,0 +1,43 @@
document.addEventListener("DOMContentLoaded", function () {
const addBtn = document.getElementById("addDealerRow");
const dealerRows = document.getElementById("dynamicDealerRows");
// Get dealer data from Blade
const dealerDataDiv = document.getElementById("dealerData");
const dealers = JSON.parse(dealerDataDiv.getAttribute("data-dealers")); // 👈 this reads JSON from Blade
let rowCount = 0;
function createDealerRow(index) {
const dealerOptions = dealers
.map((d) => `<option value="${d.id}">${d.name}</option>`)
.join("");
return `
<div class="form-group row align-items-center dealer-row" data-index="${index}">
<div class="col-md-5">
<select name="dealer_stock[${index}][dealer_id]" class="form-control" required>
<option value="">-- Pilih Dealer --</option>
${dealerOptions}
</select>
</div>
<div class="col-md-4">
<input type="number" name="dealer_stock[${index}][quantity]" class="form-control" value="1" min="1" required>
</div>
<div class="col-md-3">
<button type="button" class="btn btn-danger btn-sm removeDealerRow">Hapus</button>
</div>
</div>
`;
}
addBtn.addEventListener("click", function () {
dealerRows.insertAdjacentHTML("beforeend", createDealerRow(rowCount));
rowCount++;
});
dealerRows.addEventListener("click", function (e) {
if (e.target.classList.contains("removeDealerRow")) {
e.target.closest(".dealer-row").remove();
}
});
});

View File

@@ -0,0 +1,48 @@
document.addEventListener("DOMContentLoaded", function () {
let dealerRowContainer = document.getElementById("dynamicDealerRows");
let addDealerButton = document.getElementById("addDealerRow");
// Initial index from existing dealer rows
let rowIndex =
dealerRowContainer.querySelectorAll(".dealer-stock-row").length;
addDealerButton.addEventListener("click", function () {
const newRow = document.createElement("div");
newRow.className = "form-group row align-items-center dealer-stock-row";
newRow.innerHTML = `
<div class="col-md-6">
<select name="dealer_stock[${rowIndex}][dealer_id]" class="form-control">
<option value="">-- Pilih Dealer --</option>
${generateDealerOptions()}
</select>
</div>
<div class="col-md-4">
<input type="number" name="dealer_stock[${rowIndex}][quantity]" class="form-control" value="1" min="1" required placeholder="Jumlah Stok" />
</div>
<div class="col-md-2">
<button type="button" class="btn btn-danger btn-sm remove-dealer-row"> Hapus </button>
</div>
`;
dealerRowContainer.appendChild(newRow);
rowIndex++;
});
// Handle removal of dealer row
dealerRowContainer.addEventListener("click", function (event) {
if (
event.target &&
event.target.classList.contains("remove-dealer-row")
) {
event.target.closest(".dealer-stock-row").remove();
}
});
// Function to generate dealer <option> elements dynamically
function generateDealerOptions() {
const dealerDataDiv = document.getElementById("dealerData");
const dealers = JSON.parse(dealerDataDiv.getAttribute("data-dealers"));
return dealers
.map((d) => `<option value="${d.id}">${d.name}</option>`)
.join("");
}
});

View File

@@ -10,12 +10,6 @@ let table = $("#products-table").DataTable({
serverSide: true,
ajax: url,
columns: [
{
data: "DT_RowIndex",
name: "DT_RowIndex",
orderable: false,
searchable: false,
},
{ data: "code", name: "code" },
{ data: "name", name: "name" },
{ data: "category_name", name: "category.name" },
@@ -24,65 +18,9 @@ let table = $("#products-table").DataTable({
],
});
$(document).ready(function () {
$("#addProductCategory").click(function () {
$("#productCategoryForm")[0].reset();
$("#category_id").val("");
$("#modalTitle").text("Tambah Kategori");
$("#productCategoryModal").modal("show");
});
// Submit form (baik tambah maupun edit)
$("#productCategoryForm").submit(function (e) {
e.preventDefault();
let id = $("#category_id").val();
let url = id
? `/warehouse/product_categories/${id}`
: `/warehouse/product_categories`;
let method = id ? "PUT" : "POST";
$.ajax({
url: url,
method: method,
data: {
name: $("#name").val(),
_token: $('meta[name="csrf-token"]').attr("content"),
...(id && { _method: "PUT" }),
},
success: function () {
$("#productCategoryModal").modal("hide");
$("#product-categories-table").DataTable().ajax.reload();
},
error: function (xhr) {
alert("Gagal menyimpan data");
console.error(xhr.responseText);
},
});
});
});
$(document).on("click", ".btn-edit-product-category", function () {
const id = $(this).data("id");
const url = $(this).data("url");
$.ajax({
url: url,
method: "GET",
success: function (response) {
$("#category_id").val(response.id);
$("#name").val(response.name);
$("#modalTitle").text("Edit Kategori");
$("#productCategoryModal").modal("show");
},
error: function (xhr) {
alert("Gagal mengambil data");
console.error(xhr.responseText);
},
});
});
$(document).on("click", ".btn-destroy-product-category", function () {
$(document).on("click", ".btn-destroy-product", function () {
Swal.fire({
title: "Hapus nama kategori?",
title: "Hapus produk?",
text: "Anda tidak akan bisa mengembalikannya!",
showCancelButton: true,
confirmButtonColor: "#d33",
@@ -99,11 +37,11 @@ $(document).on("click", ".btn-destroy-product-category", function () {
_token: $('meta[name="csrf-token"]').attr("content"),
},
success: function () {
alert("Kategori berhasil dihapus.");
$("#product-categories-table").DataTable().ajax.reload();
alert("Produk berhasil dihapus.");
$("#products-table").DataTable().ajax.reload();
},
error: function (xhr) {
alert("Gagal menghapus kategori.");
alert("Gagal menghapus produk.");
console.error(xhr.responseText);
},
});