ria/app/Views/bagStockDetails.php
2024-12-05 15:03:16 +05:30

806 lines
33 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<style type="text/css">
.num {
text-align: right;
}
.fht-table,
.fht-table thead,
.fht-table tfoot,
.fht-table tbody,
.fht-table tr,
.fht-table th,
.fht-table td {
margin: 0;
}
.fht-table td {
text-align: center;
}
.fht-table td:hover {
background-color: #00a65a;
color: #ffffff;
}
.fht-table {
border: 0 none;
height: auto;
width: auto;
border-collapse: collapse;
border-spacing: 0;
/*table-layout: fixed; Algoritmo de distribucion fijo */
white-space: nowrap;
}
.fht-table th,
.fht-table td {
overflow: hidden;
}
.fht-table-wrapper,
.fht-table-wrapper .fht-thead,
.fht-table-wrapper .fht-tfoot,
.fht-table-wrapper .fht-fixed-column .fht-tbody,
.fht-table-wrapper .fht-fixed-body .fht-tbody,
.fht-table-wrapper .fht-tbody {
overflow: hidden;
position: relative;
}
.fht-table-wrapper .fht-fixed-body .fht-tbody,
.fht-table-wrapper .fht-tbody {
overflow: auto;
}
.fht-table-wrapper .fht-table .fht-cell {
overflow: hidden;
height: 1px;
}
.fht-table-wrapper .fht-fixed-column,
.fht-table-wrapper .fht-fixed-body {
top: 0;
left: 0;
position: absolute;
}
.fht-table-wrapper .fht-fixed-column {
z-index: 1;
}
.fht-fixed-body .fht-thead table {
margin-right: 20px;
border: 0 none;
}
/*For Examples*/
.ContenedorTabla {
height: 500px;
margin: 0 auto;
overflow: auto;
width: auto;
position: relative;
}
.header,
.main {
display: inline-block;
height: auto;
width: 100%;
}
.titulosHeader {
border-bottom: 1px solid #e8bb25;
height: auto;
margin-bottom: 10px;
padding-bottom: 8px;
padding-top: 8px;
width: 100%;
}
.celda_encabezado_general {
background-color: #00a65a;
border: 1px solid #ccc;
color: #ffffff;
font-weight: bold;
padding: 6px 10px;;
text-align: center;
}
._Separador {
background-color: #fff;
height: 12px;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
width: 7px;
}
._Separador div {
width: 4px;
}
.celda_normal {
/*background-color: #fff;*/
/* <!-- ad9271 into ffffff brown-light to green-light --> */
text-align: center;
border: 1px solid #ccc;
padding: 2px 4px;
}
/*style excel*/
.excel_cell {
border: 1px solid #CCC;
color: #222;
text-align: center;
font-size: 13px;
font-weight: normal;
padding: 4px;
white-space: pre-line;
empty-cells: show;
}
._cell_header {
background-color: #EEE;
}
._cell_Default {
background-color: #FFF;
text-align: left;
}
.excel_cell div {
width: 30px;
height: 20px;
}
#bagStockDetailsTableId th:nth-child(1),
#bagStockDetailsTableId td:nth-child(1) {
position: sticky;
left: 0;
background-color: #00a65a;
z-index: 2;
border-right: 2px solid #ddd;
color: #ffffff;
}
</style>
<?php
$date = DateTime::createFromFormat('M-Y', $month);
$startDate = $date->modify('first day of this month')->format('Y-m-d');
$endDate = $date->modify('last day of this month')->format('Y-m-d');
$datesInMonth = [];
$period = new DatePeriod(
new DateTime($startDate),
new DateInterval('P1D'),
(new DateTime($endDate))->modify('+1 day')
);
foreach ($period as $day) {
$datesInMonth[] = $day->format('Y-m-d');
}
?>
<div class="content-page">
<div class="content">
<!-- Start Content-->
<div class="container-fluid">
<!-- start page title -->
<div>
<div class="row">
<div class="col-6">
<div class="page-title-box page-title-box-alt">
<div class="page-title-right">
<ol class="breadcrumb m-0">
<li class="breadcrumb-item"><a href="javascript: void(0);">Stocks</a></li>
<li class="breadcrumb-item active">
<h4 class="page-title">Bag Stock Details </h4>
</li>
</ol>
</div>
</div>
</div>
<div class="col-6 text-right">
<!-- Right-aligned buttons or links can be added here -->
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<form action="<?= base_url('bagStockDetails'); ?>" method="post">
<div class="row">
<div class="col-3">
<input type="text" name="month" id="month" value="<?php echo "$month" ?>"
class="form-control mt-2" data-provide="datepicker"
data-date-format="M-yyyy" data-date-min-view-mode="1">
</div>
<div class="form-group col-md-2">
<button type="submit" class="btn btn-success"> Change Month </button>
</div>
<div class="col-md-1"></div>
<div class="col-6">
<div class="dropdown float-right">
<a href="#" class="dropdown-toggle arrow-none" data-toggle="dropdown"
aria-expanded="false">
<i class="mdi mdi-dots-vertical m-0 text-muted h3"></i>
</a>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" data-toggle="modal" data-target="#bs-example-modal-lg">Navigation</a>
<a class="dropdown-item" href="#">Export</a>
</div>
</div>
</div>
</div>
</form>
<div class="table-responsive">
<table id="bagStockDetailsTableId" class="fht-table table-striped">
<thead class="celda_encabezado_general" style="padding: 10px;">
<tr>
<th class="celda_encabezado_general" colspan="1">material </th>
<?php foreach($bagMaterials as $bagMaterial){ ?>
<!-- this will loop till materials present -->
<th class="celda_encabezado_general" colspan="4">
<?= $bagMaterial['MaterialName']?>
</th>
<?php } ?>
</tr>
<tr>
<th class="celda_encabezado_general" colspan="1"> Customer </th>
<?php foreach($bagMaterials as $bagMaterial){ ?>
<!-- this will loop till materials present -->
<th class="celda_encabezado_general" colspan="4"
data-materialCode="<?=$bagMaterial['MaterialCode']?>"
oninput="customerChange(this)" contenteditable="true">
<?= $bagMaterial['customers']?>
</th>
</th>
<?php } ?>
</tr>
<tr>
<th class="celda_encabezado_general" colspan="1">Date </th>
<?php foreach($bagMaterials as $bagMaterial){ ?>
<!-- this will loop till materials present -->
<th class="celda_encabezado_general" style="display:none">Date</th>
<th class="celda_encabezado_general" style="display:none"> material</th>
<th class="celda_encabezado_general" style="display:none"> customer</th>
<th class="celda_encabezado_general">Opening Stock</th>
<th class="celda_encabezado_general">Receipt</th>
<th class="celda_encabezado_general">Used</th>
<th class="celda_encabezado_general">Balance Stock</th>
<?php } ?>
</tr>
</thead>
<tbody style="background-color: #fff;" >
<?php if(!empty($groupedBagStockDetails))
{
foreach($groupedBagStockDetails as $groupedBagStockDetailsIndex => $bagStockDetails){
?>
<tr
<?php
$currentDate = date('d-m-Y');
$dateInMonthDmYFormat= DateTime::createFromFormat('Y-m-d', $bagStockDetails[0]['date'])->format('d-m-Y');
if ($dateInMonthDmYFormat === $currentDate) { echo 'style="background: #cef0ad;"';}
?>
>
<?php foreach($bagStockDetails as $bagStockIndex => $bagStock){ ?>
<?php if ($bagStockIndex == 0): ?>
<?php
$startDate = DateTime::createFromFormat('Y-m-d', $bagStock['date'])->format('d-m-Y');
?>
<td class="celda_normal">
<?= $startDate ?>
</td>
<?php endif; ?>
<td style="display:none">
<?= $bagStock['date']?>
</td>
<td style="display:none"
data-id="<?=$bagStock['date']?> <?=$bagStock['materialCode']?>"
class="materialCode" ><?= $bagStock['materialCode']?>
</td>
<td style="display:none" class="celda_normal customer"
data-materialCode="<?=$bagStock['materialCode']?>"
data-id="<?=$bagStock['date']?> <?=$bagStock['materialCode']?>">
<?= $bagStock['customer']?>
</td>
<td class="celda_normal openingStock"
data-id="<?=$bagStock['date']?> <?=$bagStock['materialCode']?>"
<?php if ($groupedBagStockDetailsIndex == 0): ?>
oninput="openingStockChange(this)"
contenteditable="true"
<?php endif; ?>
><?= $bagStock['opening']?>
</td>
<td class="celda_normal receiptStock"
data-id="<?=$bagStock['date']?> <?=$bagStock['materialCode']?>"
oninput="receiptStockChange(this)"
contenteditable="true">
<?= $bagStock['receipt']?>
</td>
<td class="celda_normal usedStock"
data-id="<?=$bagStock['date']?> <?=$bagStock['materialCode']?>"
oninput="usedStockChange(this)"
contenteditable="true"><?= $bagStock['used']?>
</td>
<td class="celda_normal balanceStock"
data-id="<?=$bagStock['date']?> <?=$bagStock['materialCode']?>">
<?= $bagStock['balanceStock']?>
</td>
<?php } ?>
</tr>
<?php } ?>
<!-- this else condition work if groupedBagStockDetails is empty and creating new records
with initial values 0 for entire month -->
<?php } else { ?>
<?php foreach($datesInMonth as $datesInMonthIndex => $dateInMonth){ ?>
<tr
<?php
$currentDate = date('d-m-Y');
$dateInMonthDmYFormat=DateTime::createFromFormat('Y-m-d', $dateInMonth)->format('d-m-Y');
if ($dateInMonthDmYFormat === $currentDate) { echo 'style="background: #cef0ad;"';}
?>
>
<?php
foreach($bagMaterials as $bagMaterialIndex => $bagMaterial){ ?>
<!-- this will loop till materials present -->
<?php if ($bagMaterialIndex == 0): ?>
<?php
$startDate =DateTime::createFromFormat('Y-m-d', $dateInMonth)->format('d-m-Y');
?>
<td class="celda_normal">
<?= $startDate ?>
</td>
<?php endif; ?>
<td class="celda_normal" style="display:none">
<?= $dateInMonth?>
</td>
<td class="celda_normal" style="display:none"
data-id="<?=$dateInMonth?> <?=$bagMaterial['MaterialCode']?>">
<?= $bagMaterial['MaterialCode']?>
</td>
<td class="celda_normal customer" style="display:none"
data-materialCode="<?=$bagMaterial['MaterialCode']?>"
data-id="<?=$dateInMonth?> <?=$bagMaterial['MaterialCode']?>">
<?= $bagMaterial['customers']?>
</td>
<td class="celda_normal openingStock"
data-id="<?=$dateInMonth?> <?=$bagMaterial['MaterialCode']?>"
<?php if($datesInMonthIndex == 0){ ?>
oninput="openingStockChange(this)"
contenteditable="true"
<?php }?>
><?= $previousMonthBagStockDetails[$bagMaterialIndex]['balanceStock']??'0' ?></td>
<td class="celda_normal receiptStock"
data-id="<?=$dateInMonth?> <?=$bagMaterial['MaterialCode']?>"
oninput="receiptStockChange(this)"
contenteditable="true">0</td>
<td class="celda_normal usedStock"
data-id="<?=$dateInMonth?> <?=$bagMaterial['MaterialCode']?>"
oninput="usedStockChange(this)"
contenteditable="true">0</td>
<td class="celda_normal balanceStock"
data-id="<?=$dateInMonth?> <?=$bagMaterial['MaterialCode']?>"
><?= $previousMonthBagStockDetails[$bagMaterialIndex]['balanceStock']??'0' ?></td>
<?php } ?>
</tr>
<?php } ?>
<?php }?>
</tbody>
</table>
</div>
<div class="row">
<div class="col-md-12 text-right">
<input type="button" class="btn btn-success" id="saveId" value="save">
</div>
</div>
</div>
</div> <!-- End card-body -->
</div> <!-- End card -->
</div> <!-- End col -->
</div> <!-- End row -->
</div>
</div> <!-- End container-fluid -->
</div>
</div>
<div >
<div class="modal fade" id="bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" >
<div class="modal-content" >
<div class="modal-header">
<h4 class="modal-title" id="myLargeModalLabel">Navigation Options</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<div class="row">
<!-- bag Dropdown -->
<div class="col-md-6">
<div class="form-group">
<label for="bagDropdown">Select Bag</label>
<select id="bagDropdown" class="form-control">
<option value="">Select Bag</option>
<?php foreach($bagMaterials as $bagMaterial): ?>
<option value=" <?= $bagMaterial['MaterialName']?>">
<?= $bagMaterial['MaterialName']?>
</option>
<?php endforeach; ?>
</select>
</div>
</div>
<!-- Date Dropdown -->
<div class="col-md-6">
<div class="form-group">
<label for="dateDropdown">Select Date</label>
<select id="dateDropdown" class="form-control">
<?php foreach($datesInMonth as $selectDate): ?>
<?php $selectDate=DateTime::createFromFormat('Y-m-d', $selectDate)->format('d-m-Y'); ?>
<option value="<?=$selectDate?>"><?=$selectDate?></option>
<?php endforeach; ?>
</select>
</div>
</div>
</div>
<button class="btn btn-primary float-right" onclick="navigateToBag()">Navigate</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</div>
<script>
function navigateToBag() {
$('.close').click();
const bagDropdown = document.getElementById('bagDropdown');
const dateDropdown = document.getElementById('dateDropdown');
const selectedBag = bagDropdown.value;
const selectedDate = dateDropdown.value;
const table = document.getElementById('bagStockDetailsTableId');
const headerCells = table.querySelectorAll('thead tr:nth-child(1) th');
const rows = table.querySelectorAll('tbody tr');
let targetColumnIndex = -1;
headerCells.forEach((header, index) => {
if ((header.innerText.trim()) === selectedBag.trim()) {
targetColumnIndex = index;
return;
}
});
if (targetColumnIndex === -1) {
console.log("Bag column not found.");
return;
}
let targetRow = null;
rows.forEach(row => {
const dateCell = row.querySelector('td:first-child');
if (dateCell && dateCell.textContent.trim() === selectedDate) {
targetRow = row;
}
});
if (!targetRow) {
console.log("Date row not found.");
return;
}
console.log(targetColumnIndex);
console.log(targetRow);
targetColumnIndex = targetColumnIndex * 7;
targetRow.cells[targetColumnIndex].scrollIntoView({
behavior: 'smooth',
inline: 'center',
block: 'center'
});
const highlightDuration = 10000;
for (let i = targetColumnIndex-4 ; i <= targetColumnIndex ; i++) {
const cell = targetRow.cells[i];
if (cell) {
cell.style.transition = "background-color 0.5s";
cell.style.backgroundColor = "#df9675";
setTimeout(() => {
cell.style.backgroundColor = "";
}, highlightDuration);
}
}
}
</script>
<script type="text/javascript">
$(document).ready(function () {
$('#saveId').click(function () {
//table to json function
var updateBagStockDetails = tableToJson();
alert('Updation may take a while, And we appreciate your patience..!!');
$('#loader').show();
$.ajax({
data: {
updateBagStockDetails
},
type: "POST",
url: "<?php echo base_url() ?>updateBagStockDetails",
success: function (data) {
if (data) {
$('#loader').hide();
console.log(data);
alert(data);
}
},
error: function(xhr, status, error) {
alert("An error occurred while processing the request. Please try again.");
console.error("Error Code:", xhr.status);
console.error("Error Message:", error);
console.error("Response Text:", xhr.responseText);
},
complete: function() {
$('#loader').hide();
}
});
});
});
</script>
<script>
function tableToJson() {
const table = $('#bagStockDetailsTableId');
const rows = [];
//this table to json is customized for bagstock not for all
table.find('tbody tr').each(function() {
const rowCells = $(this).find('td');
const date = rowCells.eq(0).text().trim();
/** we get eight entries against a material so we loop from 1 to 7 and so on
in a single row **/
for (let i = 1; i < rowCells.length; i += 7) {
const rowData = {
date: rowCells.eq(i).text().trim(),
materialCode: rowCells.eq(i+1).text().trim(),
customer: rowCells.eq(i+2).text().trim(),
opening: rowCells.eq(i+3).text().trim(),
receipt: rowCells.eq(i+4).text().trim(),
used: rowCells.eq(i+5).text().trim(),
balanceStock: rowCells.eq(i + 6).text().trim()
};
rows.push(rowData);
}
});
return JSON.stringify(rows, null, 2);
}
</script>
<script>
function openingStockChange(tdElement) {
try{
let dataId = tdElement.getAttribute('data-id');
let [date,materialCode] = tdElement.getAttribute('data-id').split(' ');
let openingStock = tdElement.innerText;
let usedStock = document.querySelector(`td.usedStock[data-id="${dataId}"]`).innerText;
let receiptStock = document.querySelector(`td.receiptStock[data-id="${dataId}"]`).innerText;
let currentBalanceStock = (Number(openingStock) + Number(receiptStock)) - Number(usedStock);
document.querySelector(`td.balanceStock[data-id="${dataId}"]`).innerText=currentBalanceStock;
updateStockValue( date,materialCode,currentBalanceStock )
} catch(error){
console.error("There is an error updating stock ..!!" + error);
}
}
function receiptStockChange(tdElement) {
try{
let dataId = tdElement.getAttribute('data-id');
let [date,materialCode] = tdElement.getAttribute('data-id').split(' ');
let openingStock = document.querySelector(`td.openingStock[data-id="${dataId}"]`).innerText;
let receiptStock = tdElement.innerText;
let usedStock = document.querySelector(`td.usedStock[data-id="${dataId}"]`).innerText;
let currentBalanceStock = (Number(openingStock) + Number(receiptStock)) - Number(usedStock);
document.querySelector(`td.balanceStock[data-id="${dataId}"]`).innerText=currentBalanceStock;
updateStockValue( date,materialCode,currentBalanceStock )
} catch(error){
console.error("There is an error updating stock ..!!" + error);
}
}
function usedStockChange(tdElement) {
try {
let dataId = tdElement.getAttribute('data-id');
let [date,materialCode] = tdElement.getAttribute('data-id').split(' ');
let openingStock = document.querySelector(`td.openingStock[data-id="${dataId}"]`).innerText;
let receiptStock = document.querySelector(`td.receiptStock[data-id="${dataId}"]`).innerText;
let usedStock = tdElement.innerText;
let currentBalanceStock = ( Number(openingStock) + Number(receiptStock) ) - Number(usedStock);
document.querySelector(`td.balanceStock[data-id="${dataId}"]`).innerText=currentBalanceStock;
updateStockValue( date,materialCode,currentBalanceStock )
} catch (error) {
console.error("There is an error updating stock ..!!" + error);
}
}
</script>
<script>
function updateStockValue( date, materialCode, currentBalanceStock ){
const table = $('#bagStockDetailsTableId');
const rows = [];
table.find('tbody tr').each(function() {
const rowCells = $(this).find('td');
const otherDate = rowCells.eq(1).text().trim();
if( new Date(otherDate) > new Date(date) ){ //other records present after it
/**this data-id ,openingStock ,used stock , current Balance Stock
is for changing subsequent dates not the earlier one **/
let dataId = `${otherDate} ${materialCode}`;
document.querySelector(`td.openingStock[data-id="${dataId}"]`).innerText=currentBalanceStock;
let usedStock = document.querySelector(`td.usedStock[data-id="${dataId}"]`).innerText;
let receiptStock = document.querySelector(`td.receiptStock[data-id="${dataId}"]`).innerText;
currentBalanceStock = (Number(currentBalanceStock) + Number(receiptStock)) - Number(usedStock);
document.querySelector(`td.balanceStock[data-id="${dataId}"]`).innerText=currentBalanceStock;
// console.log( 'other date' , new Date(otherDate));
// console.log('new balance stock' , currentBalanceStock)
}
})
}
function customerChange(thElement){
let materialCode = thElement.getAttribute('data-materialCode');
let newCustomerValue = thElement.innerText;
let matchingCustomerData = document.querySelectorAll(`td.customer[data-materialCode="${materialCode}"]`);
matchingCustomerData.forEach((element,index)=>{
element.innerText=newCustomerValue;
})
}
</script>