@extends('layouts.app')
@push('styles')
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<!-- JQuery DataTable Css -->
<link href="{{ url('material') }}/plugins/jquery-datatable/skin/bootstrap/css/dataTables.bootstrap.css" rel="stylesheet">
<!-- JQuery DataTable Css -->
{{-- datapicker-CSS --}}
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
{{-- datapicker-CSs --}}
<style>
.stok-habis {
background-color: #ffcccc !important;
}
.stok-habis td {
color: red !important;
}
.stok-habis th {
color: red !important;
}
.custom-grid {
display: grid;
grid-template-columns: repeat(7, 1fr); /* default: 7 cols */
gap: 1rem;
align-items: stretch; /* makes items take full row height */
}
/* Tablet breakpoint (≤ 1024px): 3 columns */
@media (max-width: 1024px) {
.custom-grid {
grid-template-columns: repeat(3, 1fr);
}
}
/* Mobile breakpoint (≤ 640px): 1 column */
@media (max-width: 640px) {
.custom-grid {
grid-template-columns: 1fr;
}
}
.custom-grid .col-md-2 {
width: 100%;
padding: 1rem;
display: flex; /* optional: center content */
justify-content: stretch;
align-items: stretch;
}
.custom-grid .col-md-2 .card {
width: 100%;
}
.card .footer {
padding: 8px;
border-top: 1px solid rgba(204, 204, 204, 0.35);
}
</style>
@endpush
@push('scripts')
{{-- data Table --}}
<script src="{{ url('material') }}/js/pages/tables/jquery-datatable.js"></script>
<script src="{{ url('material') }}/plugins/jquery-datatable/jquery.dataTables.js"></script>
<script src="{{ url('material') }}/plugins/jquery-datatable/skin/bootstrap/js/dataTables.bootstrap.js"></script>
{{-- data Table --}}
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<script>
$(function() {
$('#daterange').daterangepicker({
opens: 'right',
locale: {
format: 'DD/MM/YYYY'
},
showCustomRangeLabel: true,
alwaysShowCalendars: true,
ranges: {
'Hari Ini': [moment(), moment()],
'Kemarin': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
'7 Hari Terakhir': [moment().subtract(6, 'days'), moment()],
'1 Bulan Terakhir': [moment().subtract(29, 'days'), moment()],
'Bulan Ini': [moment().startOf('month'), moment().endOf('month')],
'Bulan Terakhir': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1,
'month').endOf('month')],
'Semua Waktu': [moment().subtract(10, 'year'), moment().add(10, 'year')]
}
}, function(start, end, label) {
console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end
.format('YYYY-MM-DD'));
var delayInMilliseconds = 500; //1 second
setTimeout(function() {
$("#filter-form").submit();
}, delayInMilliseconds);
});
$(function() {
$('#itemTable').DataTable({
responsive: true,
});
});
});
</script>
@endpush
@section('content')
<div class="container-fluid">
<div class="block-header">
<h2>Data Barang</h2>
</div>
<div class="row clearfix">
<!-- Task Info -->
<div class="col-xs-12 col-sm-12 col-md-12">
<div class="card">
<div class="header">
@if (\Helper::hakAkses('master_data', 'create'))
<a href="{{ route('item.create') }}" class="btn btn-primary">Tambah Barang</a>
@endif
</div>
<div class="body">
<form action="" id="filter-form">
<div class="row">
<div class="col-md-3">
<div class="input-group">
<span class="input-group-addon">
<i class="material-icons">assignment</i>
</span>
<div class="form-line">
<select class="form-control" name="kategori">
<option value="">Pilih Kategori</option>
@foreach ($kategori as $item)
<option value="{{ $item->id }}" @selected(request()->kategori == $item->id)>
{{ $item->nama_kategori }}
</option>
@endforeach
</select>
</div>
</div>
</div>
<div class="col-md-3">
<div class="input-group">
<span class="input-group-addon">
<i class="material-icons">assignment</i>
</span>
<div class="form-line">
<select class="form-control" name="jenis">
<option value="">Pilih Jenis</option>
@foreach ($jenis as $item)
<option value="{{ $item->id }}" @selected(request()->jenis == $item->id)>
{{ $item->nama_jenis }}
</option>
@endforeach
</select>
</div>
</div>
</div>
<div class="col-md-3">
<div class="input-group">
<span class="input-group-addon">
<i class="material-icons">assignment</i>
</span>
<div class="form-line">
<select class="form-control" name="merk">
<option value="">Pilih Merk</option>
@foreach ($merk as $item)
<option value="{{ $item->nama_merk }}" @selected(request()->merk == $item->nama_merk)>
{{ $item->nama_merk }}
</option>
@endforeach
</select>
</div>
</div>
</div>
<div class="col-md-3">
<div class="input-group">
<span class="input-group-addon">
<i class="material-icons">assignment</i>
</span>
<div class="form-line">
<select class="form-control" name="supplier">
<option value="">Pilih Supplier</option>
@foreach ($supplier as $item)
<option value="{{ $item->id }}" @selected(request()->supplier == $item->id)>
{{ $item->nama_supplier }}
</option>
@endforeach
</select>
</div>
</div>
</div>
{{-- <div class="col-md-3">
<div class="input-group">
<span class="input-group-addon">
<i class="material-icons">memory</i>
</span>
<div class="form-line">
<input class="form-control" placeholder="Nama Barang" name="nama_item"
value="">
</div>
</div>
</div> --}}
<div class="col-md-2">
<div class="input-group">
<button class="btn btn-primary">Cari</button>
</div>
</div>
</div>
</form>
<div class="custom-grid">
<div class="col-md-2">
<div class="card">
<div class="header text-center">
<div>
<h2><i class="material-icons col-orange ">markunread_mailbox</i>Stok Total</h2>
</div>
</div>
<div class="body text-center" style="padding-top:0">
<div style="margin-bottom:0px;margin-top:0">
<h3>{{ $stokTotal }}</h3>
</div>
</div>
<div class="footer text-center">
<h4>{{ number_format($modalTotal) }}</h4>
</div>
</div>
</div>
<div class="col-md-2">
<div class="card">
<div class="header text-center">
<div>
<h2><i class="material-icons col-orange ">markunread_mailbox</i>Stok Tersedia</h2>
</div>
</div>
<div class="body text-center" style="padding-top:0">
<div style="margin-bottom:0px;margin-top:0">
<h3>{{ $stokTersedia }}</h3>
</div>
</div>
<div class="footer text-center">
<h4>{{ number_format($modalTersedia) }}</h4>
</div>
</div>
</div>
<div class="col-md-2">
<div class="card">
<div class="header text-center">
<div>
<h2><i class="material-icons col-orange ">markunread_mailbox</i>Stok Servis</h2>
</div>
</div>
<div class="body text-center" style="padding-top:0">
<div style="margin-bottom:0px;margin-top:0">
<h3>{{ $stokServis }}</h3>
</div>
</div>
<div class="footer text-center">
<h4>{{ number_format($modalServis) }}</h4>
</div>
</div>
</div>
<div class="col-md-2">
<div class="card">
<div class="header text-center">
<div>
<h2><i class="material-icons col-orange ">markunread_mailbox</i>Stok Retur Penjualan</h2>
</div>
</div>
<div class="body text-center" style="padding-top:0">
<div style="margin-bottom:0px;margin-top:0">
<h3>{{ $stokReturPenjualan }}</h3>
</div>
</div>
<div class="footer text-center">
<h4>{{ number_format($modalReturPenjualan) }}</h4>
</div>
</div>
</div>
<div class="col-md-2">
<div class="card">
<div class="header text-center">
<div>
<h2><i class="material-icons col-orange ">markunread_mailbox</i>Stok Retur Pembelian</h2>
</div>
</div>
<div class="body text-center" style="padding-top:0">
<div style="margin-bottom:0px;margin-top:0">
<h3>{{ $stokReturPembelian }}</h3>
</div>
</div>
<div class="footer text-center">
<h4>{{ number_format($modalReturPembelian) }}</h4>
</div>
</div>
</div>
<div class="col-md-2">
<div class="card">
<div class="header text-center">
<div>
<h2><i class="material-icons col-orange ">markunread_mailbox</i>Stok Garansi</h2>
</div>
</div>
<div class="body text-center" style="padding-top:0">
<div style="margin-bottom:0px;margin-top:0">
<h3>{{ $stokGaransi }}</h3>
</div>
</div>
<div class="footer text-center">
<h4>{{ number_format($modalGaransi) }}</h4>
</div>
</div>
</div>
<div class="col-md-2">
<div class="card">
<div class="header text-center">
<div>
<h2><i class="material-icons col-orange ">markunread_mailbox</i>Stok Rusak</h2>
</div>
</div>
<div class="body text-center" style="padding-top:0">
<div style="margin-bottom:0px;margin-top:0">
<h3>{{ $stokRusak }}</h3>
</div>
</div>
<div class="footer text-center">
<h4>{{ number_format($modalRusak) }}</h4>
</div>
</div>
</div>
</div>
<div class="table-responsive">
<table class="table table-bordered table-striped table-hover dataTable" id="itemTable">
<thead>
<tr>
<th>No.</th>
<th>Nama Barang</th>
<th>Status Stok</th>
<th>Harga Jual</th>
<th>Harga Beli</th>
<th>Total Harga Beli</th>
<th>Stok Total</th>
<th>Tersedia</th>
<th>Tertahan Di Servis</th>
<th>Retur Penjualan</th>
<th>Retur Pembelian</th>
<th>Garansi</th>
<th>Rusak</th>
<th>Stok Minimum</th>
<th>Tools</th>
</tr>
</thead>
<tbody>
@foreach ($datas as $key => $data)
<tr >
<td>
{{ $loop->iteration }}
</td>
<td>
{{ $data->nama_item }}
</td>
<td>
@switch($data->status_stok)
@case("Kosong")
<span class="label label-danger">{{ $data->status_stok }}</span>
@break
@case("Mau Habis")
<span class="label label-warning">{{ $data->status_stok }}</span>
@break
@default
<span class="label label-success">{{ $data->status_stok }}</span>
@endswitch
</td>
<td data-order="{{ $data->harga_item }}">
{{ number_format($data->harga_item) }}
</td>
<td data-order="{{ $data->biaya_item }}">
{{ number_format($data->biaya_item) }}
</td>
<td
data-order="{{ $data->biaya_item * @$data->stok_item_tokos->sum('stok') }}">
{{ number_format($data->biaya_item * ((@$data->stok_item_tokos->sum('stok') ?? 0) + $data->stok_gudang + $data->total_retur_penjualan)) }}
</td>
<td data-order="{{ $data->stok_total }}">
{{ $data->stok_total }}
</td>
<td data-order="{{ $data->stok_tersedia }}">
{{ $data->stok_tersedia }}
</td>
<td data-order="{{ $data->stok_tertahan }}">
{{ $data->stok_tertahan}}
</td>
<td data-order="{{ $data->stok_retur_penjualan }}">
{{ $data->stok_retur_penjualan }}
</td>
<td data-order="{{ $data->stok_retur_pembelian }}">
{{ $data->stok_retur_pembelian }}
</td>
<td data-order="{{ $data->stok_garansi }}">
{{ $data->stok_garansi}}
</td>
<td>
{{ $data->stok_rusak }}
</td>
<td>
{{ $data->stok_minimal }}
</td>
<td>
<div style="display: flex; gap: 6px;">
@if (isset($data) && $data->bukti_retur != null)
<a href="{{ isset($data) && $data->bukti_retur != null ? route('storage.gambar', ['path' => $data->bukti_retur]) : '' }}"
target="_blank" class="btn btn-info" title="File Bukti"><i class="material-icons">attach_file</i></a>
@endif
@if (\Helper::hakAkses('master_data', 'edit'))
<a title="Edit Data"
href="{{ route('item.edit', $data->id) }}"
class="btn btn-primary"><i class="material-icons">create</i></a>
@endif
@if (\Helper::hakAkses('master_data', 'delete'))
<form action="{{ route('item.destroy', $data->id) }}"
method="POST" style="display:inline">
@csrf
@method('DELETE')
<button title="Delete Data" type="submit"
class="btn btn-danger" id="hapus-button"><i
class="material-icons">delete</i></button>
</form>
@endif
</div>
</td>
</tr>
@endforeach
</tbody>
<tfoot>
</tfoot>
</table>
</div>
</div>
</div>
</div>
<!-- #END# Task Info -->
</div>
</div>
@endsection
Anons79 File Manager Version 1.0, Coded By Anons79
Email: [email protected]