arifal/CKB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add more seeder product and product category and fix daterangepicker

Browse Source
This commit is contained in:
arifal
2025-06-25 16:29:34 +07:00
parent e96ca0a83c
commit e5daafc8f0
17 changed files with 334 additions and 319 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
resources/js/warehouse_management/mutations/index.js
View File

@@ -35,17 +35,25 @@ function initializeSelect2() {
function initializeDatepickers() {
console.log("Initializing datepickers...");
// Initialize start date picker with bootstrap datepicker
// Check if bootstrap datepicker is available
if (typeof $.fn.datepicker === "undefined") {
console.error("Bootstrap Datepicker not available!");
return;
}
// Initialize start date picker
$("#date_from")
.datepicker({
format: "yyyy-mm-dd",
autoclose: true,
todayHighlight: true,
orientation: "bottom auto",
language: "id",
clearBtn: true,
container: "body",
orientation: "bottom left",
templates: {
leftArrow: '<i class="la la-angle-left"></i>',
rightArrow: '<i class="la la-angle-right"></i>',
},
endDate: new Date(), // Don't allow future dates
clearBtn: true,
})
.on("changeDate", function (e) {
console.log("Start date selected:", e.format());
@@ -56,14 +64,11 @@ function initializeDatepickers() {
resetEndDatePicker();
});
// Initialize end date picker with bootstrap datepicker
// Initialize end date picker
initializeEndDatePicker();
// Initially disable end date input
$("#date_to").prop("disabled", true);
// Setup change event handlers
setupChangeEventHandlers();
}
function enableEndDatePicker(startDate) {
@@ -72,21 +77,23 @@ function enableEndDatePicker(startDate) {
// Enable the input
$("#date_to").prop("disabled", false);
// Destroy existing datepicker
// Remove existing datepicker
$("#date_to").datepicker("remove");
// Re-initialize with new startDate constraint using bootstrap datepicker
// Re-initialize with new startDate constraint
$("#date_to")
.datepicker({
format: "yyyy-mm-dd",
autoclose: true,
todayHighlight: true,
orientation: "bottom auto",
language: "id",
clearBtn: true,
container: "body",
orientation: "bottom left",
templates: {
leftArrow: '<i class="la la-angle-left"></i>',
rightArrow: '<i class="la la-angle-right"></i>',
},
startDate: startDate, // Set minimum date to selected start date
endDate: new Date(), // Don't allow future dates
clearBtn: true,
})
.on("changeDate", function (e) {
console.log("End date selected:", e.format());
@@ -104,11 +111,13 @@ function initializeEndDatePicker() {
format: "yyyy-mm-dd",
autoclose: true,
todayHighlight: true,
orientation: "bottom auto",
language: "id",
clearBtn: true,
container: "body",
orientation: "bottom left",
templates: {
leftArrow: '<i class="la la-angle-left"></i>',
rightArrow: '<i class="la la-angle-right"></i>',
},
endDate: new Date(), // Don't allow future dates
clearBtn: true,
})
.on("changeDate", function (e) {
console.log("End date selected:", e.format());
@@ -120,21 +129,6 @@ function initializeEndDatePicker() {
// Calendar icons and click handlers removed since bootstrap datepicker handles these automatically
function setupChangeEventHandlers() {
// For bootstrap datepicker, we already handle events in the datepicker initialization
// But we can add additional handling if needed
$("#date_from").on("change", function () {
const selectedDate = $(this).val();
if (selectedDate) {
console.log("Start date change event:", selectedDate);
enableEndDatePicker(selectedDate);
} else {
console.log("Start date cleared via change event");
resetEndDatePicker();
}
});
}
function initializeDataTable() {
console.log("Initializing DataTable...");

101
resources/js/warehouse_management/opnames/index.js
View File

@@ -35,22 +35,30 @@ function initializeSelect2() {
}
/**
* Initialize date pickers with bootstrap datepicker - same as stock audit
* Initialize date pickers with bootstrap datepicker - same as transaction view
*/
function initializeDatepickers() {
console.log("Initializing datepickers...");
// Initialize start date picker with bootstrap datepicker
// Check if bootstrap datepicker is available
if (typeof $.fn.datepicker === "undefined") {
console.error("Bootstrap Datepicker not available!");
return;
}
// Initialize start date picker
$("#date_from")
.datepicker({
format: "yyyy-mm-dd",
autoclose: true,
todayHighlight: true,
orientation: "bottom auto",
language: "id",
clearBtn: true,
container: "body",
orientation: "bottom left",
templates: {
leftArrow: '<i class="la la-angle-left"></i>',
rightArrow: '<i class="la la-angle-right"></i>',
},
endDate: new Date(), // Don't allow future dates
clearBtn: true,
})
.on("changeDate", function (e) {
console.log("Start date selected:", e.format());
@@ -61,18 +69,15 @@ function initializeDatepickers() {
resetEndDatePicker();
});
// Initialize end date picker with bootstrap datepicker
// Initialize end date picker
initializeEndDatePicker();
// Initially disable end date input
$("#date_to").prop("disabled", true);
// Setup change event handlers as backup
setupChangeEventHandlers();
}
/**
* Enable end date picker with minimum date constraint using bootstrap datepicker
* Enable end date picker with minimum date constraint
*/
function enableEndDatePicker(startDate) {
console.log("Enabling end date picker with min date:", startDate);
@@ -83,18 +88,20 @@ function enableEndDatePicker(startDate) {
// Remove existing datepicker
$("#date_to").datepicker("remove");
// Re-initialize with new startDate constraint using bootstrap datepicker
// Re-initialize with new startDate constraint
$("#date_to")
.datepicker({
format: "yyyy-mm-dd",
autoclose: true,
todayHighlight: true,
orientation: "bottom auto",
language: "id",
clearBtn: true,
container: "body",
orientation: "bottom left",
templates: {
leftArrow: '<i class="la la-angle-left"></i>',
rightArrow: '<i class="la la-angle-right"></i>',
},
startDate: startDate, // Set minimum date to selected start date
endDate: new Date(), // Don't allow future dates
clearBtn: true,
})
.on("changeDate", function (e) {
console.log("End date selected:", e.format());
@@ -107,7 +114,7 @@ function enableEndDatePicker(startDate) {
}
/**
* Initialize end date picker without constraints using bootstrap datepicker
* Initialize end date picker without constraints
*/
function initializeEndDatePicker() {
$("#date_to")
@@ -115,11 +122,13 @@ function initializeEndDatePicker() {
format: "yyyy-mm-dd",
autoclose: true,
todayHighlight: true,
orientation: "bottom auto",
language: "id",
clearBtn: true,
container: "body",
orientation: "bottom left",
templates: {
leftArrow: '<i class="la la-angle-left"></i>',
rightArrow: '<i class="la la-angle-right"></i>',
},
endDate: new Date(), // Don't allow future dates
clearBtn: true,
})
.on("changeDate", function (e) {
console.log("End date selected:", e.format());
@@ -129,24 +138,23 @@ function initializeEndDatePicker() {
});
}
// Calendar icons and click handlers removed since bootstrap datepicker handles these automatically
/**
* Setup change event handlers for date inputs
* Reset end date picker to initial state
*/
function setupChangeEventHandlers() {
// For bootstrap datepicker, we already handle events in the datepicker initialization
// But we can add additional handling if needed
$("#date_from").on("change", function () {
const selectedDate = $(this).val();
if (selectedDate) {
console.log("Start date change event:", selectedDate);
enableEndDatePicker(selectedDate);
} else {
console.log("Start date cleared via change event");
resetEndDatePicker();
}
});
function resetEndDatePicker() {
// Remove existing datepicker
$("#date_to").datepicker("remove");
// Clear the input value
$("#date_to").val("");
// Re-initialize without startDate constraint
initializeEndDatePicker();
// Disable the input
$("#date_to").prop("disabled", true);
console.log("End date picker reset and disabled");
}
/**
@@ -293,25 +301,6 @@ function setupFilterHandlers(table) {
});
}
/**
* Reset end date picker to initial state using bootstrap datepicker
*/
function resetEndDatePicker() {
// Remove existing datepicker
$("#date_to").datepicker("remove");
// Clear the input value
$("#date_to").val("");
// Re-initialize without startDate constraint
initializeEndDatePicker();
// Disable the input
$("#date_to").prop("disabled", true);
console.log("End date picker reset and disabled");
}
/**
* Setup additional table event handlers
*/

4
resources/views/transaction/index.blade.php
View File

@@ -824,7 +824,7 @@ use Illuminate\Support\Facades\Auth;
</div>
<div class="form-group">
<label for="to_dealer_id">Dealer Tujuan <span class="text-danger">*</span></label>
<label for="to_dealer_id">Dealer Tujuan </label>
<select name="to_dealer_id" id="to_dealer_id" class="form-control" required>
<option value="">Pilih Dealer Tujuan</option>
@php
@@ -838,7 +838,7 @@ use Illuminate\Support\Facades\Auth;
<div class="form-group">
<div class="d-flex justify-content-between align-items-center mb-3">
<label class="form-label mb-0">Detail Produk <span class="text-danger">*</span></label>
<label class="form-label mb-0">Detail Produk</span></label>
<button type="button" class="btn btn-success btn-sm" id="add-product-mutasi">
<i class="fa fa-plus"></i> Tambah Produk
</button>

25
resources/views/warehouse_management/mutations/index.blade.php
View File

@@ -26,7 +26,7 @@
<div class="kt-portlet__body">
<!-- Filter Section -->
<div class="row mb-3">
<div class="row">
<div class="col-md-3">
<div class="form-group">
<label class="form-label">Tanggal Awal</label>
@@ -39,7 +39,7 @@
<input type="text" class="form-control datepicker" id="date_to" name="date_to" placeholder="Tanggal akhir" readonly>
</div>
</div>
<div class="col-md-3">
<div class="col-md-6">
<div class="form-group">
<label class="form-label">Filter Dealer</label>
<select class="form-control select2" id="dealer_filter" name="dealer_filter">
@@ -50,18 +50,15 @@
</select>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="form-label">&nbsp;</label>
<div class="filter-buttons">
<button type="button" class="btn btn-primary btn-sm" id="kt_search">
Filter
</button>
<button type="button" class="btn btn-secondary btn-sm" id="kt_reset">
Reset
</button>
</div>
</div>
</div>
<div class="row mb-3">
<div class="col-md-12 filter-buttons">
<button type="button" class="btn btn-primary btn-sm" id="kt_search">
Filter
</button>
<button type="button" class="btn btn-secondary btn-sm" id="kt_reset">
Reset
</button>
</div>
</div>

203
resources/views/warehouse_management/opnames/index.blade.php
View File

@@ -1,57 +1,56 @@
@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-list-1"></i>
</span>
<h3 class="kt-portlet__head-title">
Tabel Opname
</h3>
</div>
@can('create', $menus['opnames.index'])
<div class="kt-portlet__head-toolbar">
<div class="kt-portlet__head-wrapper">
<div class="kt-portlet__head-actions">
<a href="{{ route('opnames.create') }}" class="btn btn-bold btn-label-brand btn--sm">Tambah</a>
</div>
</div>
</div>
@endcan
</div>
<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-list-1"></i>
</span>
<h3 class="kt-portlet__head-title">
Tabel Opname
</h3>
</div>
@can('create', $menus['opnames.index'])
<div class="kt-portlet__head-toolbar">
<div class="kt-portlet__head-wrapper">
<div class="kt-portlet__head-actions">
<a href="{{ route('opnames.create') }}" class="btn btn-bold btn-label-brand btn--sm">Tambah</a>
</div>
</div>
</div>
@endcan
</div>
<div class="kt-portlet__body">
<!-- Filter Section -->
<div class="row mb-3">
<div class="col-md-3">
<div class="form-group">
<label class="form-label">Tanggal Awal</label>
<input type="text" class="form-control datepicker" id="date_from" name="date_from" placeholder="Tanggal awal" readonly>
<div class="kt-portlet__body">
<!-- Filter Section -->
<div class="row">
<div class="col-md-3">
<div class="form-group">
<label class="form-label">Tanggal Awal</label>
<input type="text" class="form-control datepicker" id="date_from" name="date_from" placeholder="Tanggal awal" readonly>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="form-label">Tanggal Akhir</label>
<input type="text" class="form-control datepicker" id="date_to" name="date_to" placeholder="Tanggal akhir" readonly>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="form-label">Filter Dealer</label>
<select class="form-control select2" id="dealer_filter" name="dealer_filter">
<option value="">Semua Dealer</option>
@foreach($dealers as $dealer)
<option value="{{ $dealer->id }}">{{ $dealer->name }}</option>
@endforeach
</select>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="form-label">Tanggal Akhir</label>
<input type="text" class="form-control datepicker" id="date_to" name="date_to" placeholder="Tanggal akhir" readonly>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="form-label">Filter Dealer</label>
<select class="form-control select2" id="dealer_filter" name="dealer_filter">
<option value="">Semua Dealer</option>
@foreach($dealers as $dealer)
<option value="{{ $dealer->id }}">{{ $dealer->name }}</option>
@endforeach
</select>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label class="form-label">&nbsp;</label>
<div class="filter-buttons">
<div class="row mb-3">
<div class="col-md-12 filter-buttons">
<button type="button" class="btn btn-primary btn-sm" id="kt_search">
Filter
</button>
@@ -60,68 +59,66 @@
</button>
</div>
</div>
<div class="table-responsive">
<!--begin: Datatable -->
<table class="table table-striped table-bordered table-hover" id="opnames-table" data-url="{{ route('opnames.index') }}">
<thead>
<tr>
<th>Waktu Dibuat</th>
<th>Tanggal Opname</th>
<th>Dealer</th>
<th>Pengguna</th>
<th>Status</th>
<th>Aksi</th>
</tr>
</thead>
</table>
<!--end: Datatable -->
</div>
</div>
</div>
<div class="table-responsive">
<!--begin: Datatable -->
<table class="table table-striped table-bordered table-hover" id="opnames-table" data-url="{{ route('opnames.index') }}">
<thead>
<tr>
<th>Waktu Dibuat</th>
<th>Tanggal Opname</th>
<th>Dealer</th>
<th>Pengguna</th>
<th>Status</th>
<th>Aksi</th>
</tr>
</thead>
</table>
<!--end: Datatable -->
</div>
</div>
</div>
@endsection
@section('styles')
<style>
.filter-buttons {
display: flex;
gap: 10px;
}
.filter-buttons .btn {
white-space: nowrap;
}
.datepicker {
width: 100% !important;
max-width: 100%;
}
.datepicker-dropdown {
width: auto !important;
min-width: 250px;
max-width: 300px;
}
/* Ensure input field follows parent width */
input.datepicker {
width: 100% !important;
box-sizing: border-box;
}
.form-label {
font-weight: 600;
color: #595d6e;
margin-bottom: 8px;
font-size: 13px;
text-transform: none;
letter-spacing: normal;
display: block;
}
/* Select2 styling - same as stock audit (minimal) */
.select2-container {
width: 100% !important;
}
.filter-buttons {
display: flex;
gap: 10px;
}
.filter-buttons .btn {
white-space: nowrap;
}
/* Datepicker styling */
.datepicker {
width: 100% !important;
max-width: 100%;
}
.datepicker-dropdown {
width: auto !important;
min-width: 250px;
max-width: 300px;
}
/* Ensure input field follows parent width */
input.datepicker {
width: 100% !important;
box-sizing: border-box;
}
.form-label {
font-weight: 600;
color: #595d6e;
margin-bottom: 8px;
font-size: 13px;
text-transform: none;
letter-spacing: normal;
display: block;
}
/* Select2 styling - same as stock audit (minimal) */
.select2-container {
width: 100% !important;
}
</style>
@endsection

180
resources/views/warehouse_management/stock_audit/index.blade.php
View File

@@ -38,7 +38,7 @@ input.datepicker {
<div class="kt-portlet__body">
<!-- Filter Section -->
<div class="ke-form row mb-3">
<div class="ke-form row">
<div class="form-group col-md-3">
<label class="form-label">Filter Dealer</label>
<select class="form-control select2" id="filter-dealer">
@@ -105,103 +105,103 @@ input.datepicker {
</thead>
</table>
</div>
</div>
</div>
<!-- Detail Modal -->
<div class="modal fade" id="auditDetailModal" tabindex="-1" role="dialog" aria-labelledby="auditDetailModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="auditDetailModalLabel">Detail Audit Stock</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close" id="modal-close-btn">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" id="auditDetailContent">
<!-- Loading State -->
<div id="modal-loading" class="text-center">
<div class="spinner-border" role="status">
<span class="sr-only">Memuat...</span>
<!-- Detail Modal -->
<div class="modal fade" id="auditDetailModal" tabindex="-1" role="dialog" aria-labelledby="auditDetailModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="auditDetailModalLabel">Detail Audit Stock</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close" id="modal-close-btn">
<span aria-hidden="true">&times;</span>
</button>
</div>
<p class="mt-2">Memuat data audit...</p>
</div>
<!-- Error State -->
<div id="modal-error" class="alert alert-danger" style="display: none;">
<strong>Error:</strong> <span id="error-message">Gagal memuat detail audit</span>
</div>
<!-- Content Area -->
<div id="modal-content" style="display: none;">
<!-- Stock Information -->
<div class="row">
<div class="col-md-6">
<h6 class="font-weight-bold">Informasi Stock</h6>
<table class="table table-sm">
<tr>
<td><strong>Produk:</strong></td>
<td id="product-name">-</td>
</tr>
<tr>
<td><strong>Dealer:</strong></td>
<td id="dealer-name">-</td>
</tr>
<tr></tr>
<td><strong>Stock Sebelum:</strong></td>
<td id="previous-quantity">-</td>
</tr>
<tr>
<td><strong>Stock Sesudah:</strong></td>
<td id="new-quantity">-</td>
</tr>
<tr>
<td><strong>Perubahan:</strong></td>
<td id="quantity-change">-</td>
</tr>
<tr>
<td><strong>Jenis Perubahan:</strong></td>
<td id="change-type">-</td>
</tr>
</table>
</div>
<div class="col-md-6">
<h6 class="font-weight-bold">Informasi Sistem</h6>
<table class="table table-sm">
<tr>
<td><strong>User:</strong></td>
<td id="user-name">-</td>
</tr>
<tr>
<td><strong>Tanggal:</strong></td>
<td id="created-at">-</td>
</tr>
<tr>
<td><strong>Deskripsi:</strong></td>
<td id="description">-</td>
</tr>
</table>
</div>
</div>
<!-- Source Detail (will be shown/hidden based on data) -->
<div id="source-detail" style="display: none;">
<hr>
<h6 class="font-weight-bold">Detail Sumber Perubahan</h6>
<div class="card">
<div class="card-header">
<h6 class="mb-0" id="source-title">-</h6>
<div class="modal-body" id="auditDetailContent">
<!-- Loading State -->
<div id="modal-loading" class="text-center">
<div class="spinner-border" role="status">
<span class="sr-only">Memuat...</span>
</div>
<div class="card-body" id="source-content">
<!-- Content will be populated by JavaScript -->
<p class="mt-2">Memuat data audit...</p>
</div>
<!-- Error State -->
<div id="modal-error" class="alert alert-danger" style="display: none;">
<strong>Error:</strong> <span id="error-message">Gagal memuat detail audit</span>
</div>
<!-- Content Area -->
<div id="modal-content" style="display: none;">
<!-- Stock Information -->
<div class="row">
<div class="col-md-6">
<h6 class="font-weight-bold">Informasi Stock</h6>
<table class="table table-sm">
<tr>
<td><strong>Produk:</strong></td>
<td id="product-name">-</td>
</tr>
<tr>
<td><strong>Dealer:</strong></td>
<td id="dealer-name">-</td>
</tr>
<tr></tr>
<td><strong>Stock Sebelum:</strong></td>
<td id="previous-quantity">-</td>
</tr>
<tr>
<td><strong>Stock Sesudah:</strong></td>
<td id="new-quantity">-</td>
</tr>
<tr>
<td><strong>Perubahan:</strong></td>
<td id="quantity-change">-</td>
</tr>
<tr>
<td><strong>Jenis Perubahan:</strong></td>
<td id="change-type">-</td>
</tr>
</table>
</div>
<div class="col-md-6">
<h6 class="font-weight-bold">Informasi Sistem</h6>
<table class="table table-sm">
<tr>
<td><strong>User:</strong></td>
<td id="user-name">-</td>
</tr>
<tr>
<td><strong>Tanggal:</strong></td>
<td id="created-at">-</td>
</tr>
<tr>
<td><strong>Deskripsi:</strong></td>
<td id="description">-</td>
</tr>
</table>
</div>
</div>
<!-- Source Detail (will be shown/hidden based on data) -->
<div id="source-detail" style="display: none;">
<hr>
<h6 class="font-weight-bold">Detail Sumber Perubahan</h6>
<div class="card">
<div class="card-header">
<h6 class="mb-0" id="source-title">-</h6>
</div>
<div class="card-body" id="source-content">
<!-- Content will be populated by JavaScript -->
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal" id="modal-close-footer-btn">Tutup</button>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal" id="modal-close-footer-btn">Tutup</button>
</div>
</div>
</div>
</div>