<?php $this->load->view("common/header"); ?>
<!-- end: HEAD -->

<style type="text/css">
	.table>thead:first-child>tr:first-child>th,
	.table>thead:first-child>tr:first-child>td,
	.table-striped thead tr.primary:nth-child(2n+1) th {
		background-color: #428bca;
		border-color: #357ebd;
		border-top: 1px solid #357ebd;
		color: white;
		text-align: center;
	}
</style>
<link rel="stylesheet" href="<?php echo asset_url(); ?>css/buttons.dataTables.min.css" type="text/css" />
<style type="text/css">
	.dt-button-collection {
		font-size: 1.4em;
	}

	.dt-button-collection .active span:after {
		font-family: FontAwesome;
		content: " \f00c";
		text-align: right
	}

	a.dt-button,
	button.dt-button,
	div.dt-button,
	.dt-buttons {
		font-size: .83em;
		float: right !important;
		/*  background-color:#e9e9e9;
	background-image:linear-gradient(to bottom,#fff 0,#e9e9e9 100%);*/

		margin-left: .3em;
	}
</style>
<!-- end: CSS REQUIRED FOR THIS PAGE ONLY -->
<!-- end: HEAD -->
<!-- start: BODY -->

<body>
	<!-- start: HEADER -->
	<div class="navbar navbar-inverse navbar-fixed-top">
		<!-- start: TOP NAVIGATION CONTAINER -->
		<div class="container">
			<div class="navbar-header">
				<!-- start: RESPONSIVE MENU TOGGLER -->
				<button data-target=".navbar-collapse" data-toggle="collapse" class="navbar-toggle" type="button">
					<span class="clip-list-2"></span>
				</button>
				<!-- end: RESPONSIVE MENU TOGGLER -->
				<!-- start: LOGO -->
				<?php $this->load->view("common/logo"); ?>
				<!-- end: LOGO -->
			</div>
			<div class="navbar-tools">
				<!-- start: TOP NAVIGATION MENU -->
				<?php $this->load->view("common/notifications.php"); ?>
				<!-- end: TOP NAVIGATION MENU -->
			</div>
		</div>
		<!-- end: TOP NAVIGATION CONTAINER -->
	</div>
	<!-- end: HEADER -->
	<!-- start: MAIN CONTAINER -->
	<div class="main-container">
		<div class="navbar-content">
			<!-- start: SIDEBAR -->
			<?php $this->load->view("common/navigation"); ?>
			<!-- end: SIDEBAR -->
		</div>
		<!-- start: PAGE -->
		<div class="main-content">
			<!-- end: SPANEL CONFIGURATION MODAL FORM -->
			<div class="container">
				<!-- start: PAGE HEADER -->
				<div class="row">
					<div class="col-sm-12">
						<!-- start: PAGE TITLE & BREADCRUMB -->
						<ol class="breadcrumb">
							<li>
								<a href="<?php echo base_url('dashboard'); ?>">
									DASHBOARD
								</a>
							</li>
							<li>
								<a href="#">
									STORE
									<?php $cmn = new $this->Common_Model();
									if ($cmn->check_permission(113, $this->session->userdata('ss_group_id'), 1)) {
										echo "S";
									} ?>
								</a>
							</li>

							<li class="active">
								LIST PENDING BOM
							</li>
							<li class="search-box">
								<form class="sidebar-search">
									<div class="form-group">
										<input type="text" placeholder="Start Searching...">
										<button class="submit">
											<i class="clip-search-3"></i>
										</button>
									</div>
								</form>
							</li>
						</ol>
						<div class="page-header">
							<h3>LIST PENDING BOM</h3>
						</div>

						<p>Please use the table below to navigate or filter the results. </p>
					</div>
				</div <!-- end: PAGE HEADER -->
				<!-- start: PAGE CONTENT 
					<!-- start grid -->
				<div class="row">
					<div class="col-md-12">
						<!-- start: DYNAMIC TABLE PANEL -->
						<div class="panel panel-default">
							<div class="panel-heading">
								<i class="fa fa-external-link-square"></i>
								List Pending Jobs (BOM-Store)
							</div>
							<div class="panel-body">
								<div class="col-sm-12">
									<div class="col-sm-3">
										<div class="form-group">
											<label>Warehouse * </label>
											<select id="warehouse_id" class="form-control" name="warehouse_id"
												onchange="products_load();">
												<option value="">-- Select Warehouse --</option>
												<?php $ss_warehouse_id = $this->session->userdata('ss_warehouse_id');
												foreach ($warehouse_list as $row) {
													$sel = '';
													if ($ss_warehouse_id == $row->id) {
														$sel = ' selected="selected"';
													} ?>
													<option value="<?php echo $row->id; ?>" <?php echo $sel ?>>
														<?php echo $row->name; ?>
													</option>
												<?php } ?>
											</select>
										</div>
									</div>
								</div>
								<div id="error"></div>
								<table class="table table-bordered table-condensed table-hover table-striped dataTable"
									id="products_table">
									<thead>
										<tr>
											<th>BOM NO</th>
											<th>DOCUMENT NO</th>
											<th>DATE TIME</th>
											<th>PREPARE BY</th>
											<th>WAREHOUSE</th>
											<th>SHEDUCLE DATE</th>
											<th>DEPARTMENT</th>
											<th>TIME PROFILE</th>
											<th>NOTE</th>
											<th>ACTION</th>

										</tr>
									</thead>
									<tfoot>
										<tr>
											<th>BOM NO</th>
											<th>DOCUMENT NO</th>
											<th>DATE TIME</th>
											<th>PREPARE BY</th>
											<th>WAREHOUSE</th>
											<th>SHEDUCLE DATE</th>
											<th>DEPARTMENT</th>
											<th>TIME PROFILE</th>
											<th>NOTE</th>
											<th>ACTION</th>
										</tr>
									</tfoot>
								</table>
							</div>
						</div>
						<!-- end: DYNAMIC TABLE PANEL -->
					</div>
				</div>

				<!-- end grid -->


			</div>
			<!-- end: PAGE -->
		</div>
		<!-- end: MAIN CONTAINER -->
		<!-- start: FOOTER -->
		<div class="footer clearfix">
			<div class="footer-inner">
				2014 &copy; clip-one by cliptheme.
			</div>
			<div class="footer-items">
				<span class="go-top"><i class="clip-chevron-up"></i></span>
			</div>
		</div>
		<!-- end: FOOTER -->
		<!-- start: RIGHT SIDEBAR -->
		<!-- end: RIGHT SIDEBAR -->
		<div id="event-management" class="modal fade" tabindex="-1" data-width="760" style="display: none;">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
						<h4 class="modal-title">Event Management</h4>
					</div>
					<div class="modal-body"></div>
					<div class="modal-footer">
						<button type="button" data-dismiss="modal" class="btn btn-light-grey">
							Close
						</button>
						<button type="button" class="btn btn-danger remove-event no-display">
							<i class='fa fa-trash-o'></i> Delete Event
						</button>
						<button type='submit' class='btn btn-success save-event'>
							<i class='fa fa-check'></i> Save
						</button>
					</div>
				</div>
			</div>
		</div>

		<!-- start ajax model -->
		<div id="ajax-modal" class="modal fade" data-backdrop="static" data-keyboard="false" tabindex="-1"
			style="display: none;"></div>
		<!-- end ajax model -->

		<!-- start: MAIN JAVASCRIPTS -->
		<?php $this->load->view("common/footer"); ?>
		<!-- end: MAIN JAVASCRIPTS -->
		<script type="text/javascript" src="<?php echo asset_url(); ?>js/jquery.dataTables.min.js"></script>
		<script type="text/javascript" src="<?php echo asset_url(); ?>js/dataTables.bootstrap.min.js"></script>
		<script type="text/javascript" language="javascript"
			src="<?php echo asset_url(); ?>js/dataTables.buttons.min.js">
			</script>
		<script src="<?php echo asset_url(); ?>/plugins/select2/select2.min.js"></script>
		<script type="text/javascript" language="javascript" src="<?php echo asset_url(); ?>js/buttons.print.min.js">
		</script>
		<script type="text/javascript" language="javascript" src="<?php echo asset_url(); ?>js/buttons.flash.min.js">
		</script>
		<script type="text/javascript" language="javascript" src="<?php echo asset_url(); ?>js/jszip.min.js">
		</script>
		<script type="text/javascript" language="javascript" src="<?php echo asset_url(); ?>js/pdfmake.min.js">
		</script>
		<script type="text/javascript" language="javascript" src="<?php echo asset_url(); ?>js/vfs_fonts.js">
		</script>
		<script type="text/javascript" language="javascript" src="<?php echo asset_url(); ?>js/buttons.html5.min.js">
		</script>
		<script type="text/javascript" language="javascript"
			src="<?php echo asset_url(); ?>js/buttons.print.min.js"></script>
		<script>
			jQuery(document).ready(function () {
				//TableData.init();
				products_load();
			});

			var req;

			function products_load() {
				var warehouse_id = $('#warehouse_id').val();
				req = $('#products_table').DataTable({
					dom: 'Blfrtip',
					lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
					buttons: [{ extend: 'copy', text: '<i class="fa fa-copy fa-2x"></i>', footer: true, exportOptions: [0, 1, 2, 3] },
					{
						extend: 'print',
						text: '<i class="fa fa-print fa-2x"></i>',
						footer: true,
						exportOptions: { columns: [1, 2, 3, 4, 5, 6, 7, 8, 9] },
						title: "<center>Products</center>"
					},
					{
						extend: 'excel', text: '<i class="far fa-file-excel fa-2x"></i>Excel', footer: true, exportOptions:
							{ columns: [1, 2, 3, 4, 5, 6, 7, 8, 9] }, title: "Products"
					},
					{
						extend: 'pdf', text: '<i class="far fa-file-pdf fa-2x"></i>PDF', footer: true, exportOptions:
							{ columns: [1, 2, 3, 4, 5, 6, 7, 8, 9] }, title: "Products"
					},

					],
					"serverSide": true,
					"ajax": "<?php echo base_url('production_material_in_out/getListPendingStoreNote?id=') ?>" + warehouse_id,
					"bDestroy": true,
					"iDisplayLength": 10
				});
			}


			function print_storenote(id) {
				window.open('<?php echo base_url('production_material_in_out/printSTN?id=') ?>' + id, 'sma_popup', 'width=700,height=900,scrollbars=yes,menubar=yes,status=no,resizable=yes,screenx=0,screeny=0');
			}


			function issue_stocks(id) {
            	bootbox.confirm({
            		title: "Confirm Stock Issue",
            		message: "Are you sure you want to issue this stock?",
            		callback: function (result) {
            			if (result) {
            				_issue_stocks_internal(id); // Call the real logic if confirmed
            			}
            		},
            		className: "modal-warning"
            	});
            }
            
            function _issue_stocks_internal(id) {
            	// Show a bootbox dialog with a loading spinner
            	const loadingDialog = bootbox.dialog({
            		message: '<div class="text-center text-primary"><i class="fa fa-spinner fa-spin fa-3x fa-fw"></i><br><br>Issuing stock, please wait...</div>',
            		closeButton: false
            	});
            
            	// Perform the AJAX request to issue stock
            	$.ajax({
            		type: "POST",
            		url: "<?php echo base_url('stock_in_out/IssueMaterialBatchForSTN?id='); ?>" + id,
            		data: { id: id },
            		cache: false,
            		dataType: "json",
            		success: function (response) {
            			loadingDialog.modal('hide'); // Hide loading spinner
            
            			if (response.status === 0) {
            				bootbox.alert({
            					title: "Validation Error",
            					message: response.validation || "An unknown error occurred.",
            					className: "modal-danger"
            				});
            			} else {
            				bootbox.alert({
            					title: "Success",
            					message: "Stock issued successfully!",
            					callback: function () {
            						products_load();
            					},
            					className: "modal-success"
            				});
            			}
            		},
            		error: function (xhr, status, error) {
            			loadingDialog.modal('hide');
            			console.error("AJAX Error:", error);
            			bootbox.alert({
            				title: "Server Error",
            				message: "Something went wrong while issuing stock. Please try again later.",
            				className: "modal-danger"
            			});
            		}
            	});
            }

		</script>
</body>
<!-- end: BODY -->

</html>