<?php

include('nav-mobile.php');
include('response.php');








?>

<div style="margin-top: 15px; padding-left: 12px; "  class="hp-main-layout-content">
<div class="row mb-32 gy-32">
				<div class="col-12">
        <div class="page-header-modern">
            <h2 class="header-modern">Create Voucher</h2>

    <div class="user-dropdown dropdown">
        <button class="btn btn-user" type="button" data-toggle="dropdown">
            <i class=""></i>
             <img src="images/icon/invoice360-user.png" height=30px; width=30px;>
            <span class="caret"></span>
        </button>

        <ul class="dropdown-menu user-menu" aria-labelledby="userDropdown">
            <li>
                <a class="dropdown-item" href="">
                    <i class="fa fa-user me-2"></i> <?php echo strtok($_SESSION['user_name'], ' ');?> (<?php echo $_SESSION['role']; ?>)
                </a>
            </li>

            <li>
                <a class="dropdown-item" href="Admin/payment-details.php">
                    <i class="fa fa-credit-card"></i> Billing history
                </a>
            </li>

            <li>
                <a class="dropdown-item" href="Admin/company-profile.php">
                    <i class="fa fa-cog me-2"></i> Settings
                </a>
            </li>

            <li><hr class="dropdown-divider"></li>

            <li>
                <a class="dropdown-item text-danger" href="logout.php">
                    <i class="fa fa-sign-out me-2"></i> Sign Out
                </a>
            </li>
        </ul>
        </div>
    </div>
</div>


				
            <div class="col-lg-12">
                <div class="card">
                    
                            
        <div class="card-body">
		<!-- <hr> -->

		<div id="response" class="alert alert-success" style="display:none;">
			<a href="#" class="close" data-dismiss="alert">&times;</a>
			<div class="message"></div>
		</div>

		<form method="post" id="create_voucher">
			<input type="hidden" name="action" value="create_voucher">
			
			<div class="row">
    <!-- LEFT SIDE -->
    <div id="info1" class="col-xl-6">

    <div class="row">
<?php
$peekNextVoucherNumber = previewNextVoucherNumber($mysqli, $_SESSION['company_id']);
?>
    	            <!-- Invoice ID -->
            <div style="margin-bottom: 15px" class="col-xl-6 mb-3">
                <label class="form-label">Reference No</label>
                <div class="input-group">
                    <span class="input-group-addon">#<?php echo $invoice_prefix ?></span>
                    <input type="text" name="voucher_id" id="voucher_id"
                           class="form-control required"
                           placeholder="Reference Number"
                           value="<?= htmlspecialchars($peekNextVoucherNumber) ?>">
                </div>
            </div>
 <input type="hidden" name="preview_voucher_number" value="<?= $previewVoucherNumber ?>">
                        <!--  Date -->
            <div style="margin-bottom: 15px" class="col-xl-6 mb-3">
                <label class="form-label">Date</label>
                <div class="input-group date" id="invoice_date">
                    <input type="text" class="form-control required" 
                           name="voucher_date" placeholder=""
                           data-date-format="<?php echo DATE_FORMAT ?>">
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>


    </div>
    

        <div class="row">

            <!-- Invoice Type -->
            <div class="col-xl-6 mb-3">
                <span class="form-label">Requested By</span>
                <input style="margin-top: 5px;" name="requested_by" id="requested_by" class="form-control">
                
            </div>

            <!-- Invoice Status -->
            <div class="col-xl-6 mb-3">
                <span class="form-label">Department</span>
                <input style="margin-top: 5px;"  name="voucher_dept" id="voucher_dept" class="form-control">
                 
            </div>

        </div>

        <div style="margin-top: 15px;" class="row">

            <!-- Invoice Type -->
            <div class="col-xl-9 mb-3">
                <span class="form-label">Short Title <span style="color: red;">(Required)</span></span>
                <input style="margin-top: 5px;" name="short_title" id="short_title" class="form-control required">
                
            </div>

        </div>
    </div>
	<div class="col-xl-1"></div>

    <!-- RIGHT SIDE -->
    <div id="info1" class="col-xl-5">


        
		<div class="row">


            <!-- Due Date -->
            <div style="margin-bottom: 15px" class="col-xl-6 mb-3">
                <label class="form-label">Payment Mode</label>
                <div class="input-group" id="payment_mode">
                    <input type="text" class="form-control" 
                           name="payment_mode" placeholder="">
                    
                </div>
            

			</div>

            <div style="margin-bottom: 15px" class="col-xl-6 mb-3">
                <label class="form-label">Ben. Account Name</label>
                <div class="input-group" id="ben_account_name">
                    <input type="text" class="form-control" 
                           name="ben_account_name" placeholder="">
                    
                </div>
            

			</div>

        </div>

        <div class="row">


            <!-- Due Date -->
            <div style="margin-bottom: 15px" class="col-xl-6 mb-3">
                <label class="form-label">Ben. Account No</label>
                <div class="input-group date" id="ben_account_no">
                    <input type="text" class="form-control" 
                           name="ben_account_no" placeholder="">
                    
                </div>
            

			</div>

            <div style="margin-bottom: 15px" class="col-xl-6 mb-3">
                <label class="form-label">Bank</label>
                <div class="input-group " id="bank">
                    <input type="text" class="form-control" 
                           name="bank" placeholder="">
                    
                </div>
            

			</div>

        </div>

        
    </div>
</div>





<div class="divider"></div>


			<!-- / end client details section -->
			<div class="row mx-n24">
    <div id="" class="col-12">
        <div class="table-responsive">
            <table class="table " id="invoice_table">
             <thead>
					<tr>
					<th width="49%">
							<h5> Item&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h5>
						</th>
						<th width="13%">
							<h5>Qty&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h5>
						</th>
						<th width="18%">
							<h5>Price(<?php echo $currency ?>)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h5>
						</th>
						
						<th width="20%">
							<h5>Sub Total(<?php echo $currency ?>)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h5>
						</th>
						<th></th>
					</tr>
				</thead>

                <tbody>
                <tr>
						<td class="text-right">
							
							<div class="input-group form-group-sm  no-margin-bottom">
								<div class="col-lg-8  col-xs-8">
									<input type="text" class="form-control form-group-sm item-input invoice_product" name="invoice_product[]" aria-describedby="sizing-addon1" placeholder="Enter or Select Product">
									<textarea id="auto-resize-textarea" type="text" class="form-control form-group-sm item-input invoice_product_description" name="invoice_product_description[]" placeholder="Enter Product Description"></textarea>
									
								</div>
								
							</div>	
                            </div>
						</td>
						<td class="text-right">
							<div class="input-group input-group-sm no-margin-bottom">
								<input direction="ltr" type="text" class="form-control  invoice_product_qty calculate" name="invoice_product_qty[]" value="1" >
							</div>
						</td>
						<td class="text-right">
							<div class="input-group input-group-sm  no-margin-bottom">
								
								<input type="text" class="form-control calculate invoice_product_price required" name="invoice_product_price[]" aria-describedby="sizing-addon1" placeholder="0.00">
							</div>
						</td>
						
						<td class="text-right">
							<div class="input-group input-group-sm">
								
								<input type="text" class="form-control calculate-sub" name="invoice_product_sub[]" id="invoice_product_sub" value="0.00" readonly>
							</div>
						</td>
						<td><a href="#" style="float:left;" class=" btn btn-danger btn-xs delete-row"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a></td>
					</tr>
                </tbody>
				
            </table>
			<div style="padding: 3px 3px"><a href="#" class=" add-row"><img src="images/icon/add-new.png" width="20px" height="20px"><span style="color: black; font-weight: 700;">  Add New</span></a></div>
        </div>
    </div>
</div>

	<div class="divider"></div>
	
<div class="row">

    <!-- LEFT SIDE: FORM INPUTS -->
<div class="col-12 col-lg-7">

 <div class="col-xl-12 mb-3">
                <div class="form-group">
                    <label class="col-form-label">Additional Notes</label>
                    <textarea type="text" rows="5" class="form-control" name="notes"></textarea>
                </div>
            </div>

    <div class="row">

    	
            <div class="col-xl-6 mb-3">
                <div class="form-group">
                    <label class="col-form-label">Created By</label>
                    <input type="text" class="form-control" name="created_by" readonly
                           value="<?php 
                           if (!isset($_SESSION['user_id'])) {
                               header('Location: login.php'); exit;
                           }
                           echo $_SESSION['user_name']; 
                           ?>">
                </div>
            </div>

            <div class="col-xl-6 mb-3">
                <div class="form-group">
                    <label class="col-form-label">Payment by</label>
                    <input type="text" class="form-control" name="payment_by">
                </div>
            </div>


    </div>
    

        <div class="row">

            <div class="col-xl-6 mb-3">
                <div class="form-group">
                    <label class="col-form-label">Approved By</label>
                    <input type="text" class="form-control" name="approved_by">
                </div>
            </div>

            <div class="col-xl-6 mb-3">
                <div class="form-group">
                    <label class="col-form-label">Approved By</label>
                    <input type="text" class="form-control" name="approved_by2">
                </div>
            </div>

        </div>
    </div>
<div class="col-xl-1"></div>



    <!-- RIGHT SIDE:   Voucher TOTALS -->
    <div class="col-12 col-lg-4">
        <div style="margin-top: 30px" id="invoice_totals" class="p-3 border rounded" style="background:#f8f9fa;">

            <div style="margin-bottom: 10px" class="row align-items-center justify-content-between mb-2">
                <label class="col-6" style="font-size: 13px;"><b>Subtotal (<?php echo $currency ?>)</b></label>
                <div class="col-6 text-end" style="font-size:15px;font-weight:600;">
                    <span class="invoice-sub-total">0.00</span>
                    <input type="hidden" id="invoice_subtotal" name="invoice_subtotal">
                </div>
            </div>

            <div style="margin-bottom: 10px"class="row align-items-center justify-content-between mb-2">
                <label class="col-6" style="font-size: 13px;"><b>Discount (<?php echo $currency ?>)</b></label>
                <div class="col-6 text-end">
                    <input type="text" class="form-control calculate discount"
                           name="invoicediscount" placeholder="0.00 or %">
                </div>
            </div>

            <!--
            <div style="margin-bottom: 10px" class="row align-items-center justify-content-between mb-2">
                <label class="col-6" style="font-size: 13px;"><b>Shipping (<?php echo $currency ?>)</b></label>
                <div class="col-6 text-end">
                    <input type="text" class="form-control calculate shipping"
                           name="invoice_shipping" placeholder="0.00">
                </div>
            </div>

            <div style="margin-bottom: 10px"class="row align-items-center justify-content-between mb-2">
                <label class="col-6" style="font-size:11px;">
                    <b>TAX/VAT (<?php echo $currency ?>)</b><br>
                    Remove TAX/VAT <input type="checkbox" class="remove_vat">
                </label>
                <div class="col-6 text-end" style="font-size:15px;font-weight:600;">
                    <span class="invoice-vat"
                          data-enable-vat="<?php echo $enable_vat ?>"
                          data-vat-rate="<?php echo $vat_rate ?>"
                          data-vat-method="<?php echo VAT_INCLUDED ?>">0.00</span>
                    <input type="hidden" id="invoice_vat" name="invoice_vat">
                </div>
            </div>
                        -->
 
            <div style="margin-bottom: 10px" class="row align-items-center justify-content-between">
                <label class="col-6 text-primary" style="font-size:15px;"><b>Total (<?php echo $currency ?>)</b></label>
                <div class="col-6 text-end text-primary" style="font-size:17px;font-weight:900;">
                    <span class="invoice-total">0.00</span>
                    <input type="hidden" id="invoice_total" name="invoice_total">
                </div>
            </div>

        </div>
    </div>
    <!-- END RIGHT SIDE -->

</div>

<div class="divider"></div>


                          
								<div class="row mt-3">
    
    <!-- LEFT: CANCEL BUTTON -->
    <div class="col-6">
        <button type="button" class="btn btn-secondary w-auto float-left">
            Cancel
        </button>
    </div>

    <!-- RIGHT: SUBMIT BUTTON -->
    <div class="col-6 text-end">
        <input type="submit"
       id="action_create_voucher"
       class="btn btn-primary"
       value="Create Voucher"
       data-loading-text="Creating...">

    </div>

</div>

							
						
</form>					




                                    
                                   

		


		<div id="insert" class="modal fade">
		  <div class="modal-dialog">
		    <div class="modal-content">
		      <div class="modal-header">
		        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
		        <h4 class="modal-title">Select Product</h4>
		      </div>
		      <div class="modal-body">
				<?php popProductsList(); ?>
		      </div>
		      <div class="modal-footer">
		        <button type="button" data-dismiss="modal" class="btn btn-primary" id="selected">Add</button>
				<button type="button" data-dismiss="modal" class="btn">Cancel</button>
		      </div>
		    </div><!-- /.modal-content -->
		  </div><!-- /.modal-dialog -->
		</div><!-- /.modal -->

		<div id="insert_customer" class="modal fade">
		  <div class="modal-dialog">
		    <div class="modal-content">
		      <div class="modal-header">
		        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
		        <h4 class="modal-title">Select An Existing Customer</h4>
		      </div>
		      <div class="table-responsive modal-body">
				<?php popCustomersList(); ?>
		      </div>
		      <div class="modal-footer">
				<button type="button" data-dismiss="modal" class="btn">Cancel</button>
		      </div>
		    </div><!-- /.modal-content -->
		  </div><!-- /.modal-dialog -->
		</div><!-- /.modal -->






             
		
 <!-- Plugin -->
 	
 	
    <script src="app-assets/js/plugin/swiper-bundle.min.js"></script>
    <script src="app-assets/js/plugin/jquery.mask.min.js"></script>
    <script src="app-assets/js/plugin/autocomplete.min.js"></script>
    <script src="app-assets/js/plugin/moment.min.js"></script>

    <!-- Layouts -->
    <script src="app-assets/js/layouts/header-search.js"></script>
    <script src="app-assets/js/layouts/sider.js"></script>
    <script src="app-assets/js/components/input-number.js"></script>

    <!-- Base -->
    <script src="app-assets/js/base/index.js"></script>
    <!-- Customizer -->
    <script src="app-assets/js/customizer.js"></script>

    <!-- Charts -->
    <script src="app-assets/js/plugin/apexcharts.min.js"></script>
    <script src="app-assets/js/charts/apex-chart.js"></script>

    <!-- Cards -->
    <script src="app-assets/js/cards/card-advance.js"></script>
    <script src="app-assets/js/cards/card-analytic.js"></script>
    <script src="app-assets/js/cards/card-statistic.js"></script>

    <!-- Pages -->
    <script src="app-assets/js/pages/dashboard-ecommerce.js"></script>

    <!-- Custom -->
    <script src="assets/js/main.js"></script>  
	
	
	<script> 
	const textarea = document.getElementById('auto-resize-textarea');

textarea.addEventListener('input', () => {
  textarea.style.height = 'auto'; // Reset height to recalculate
  textarea.style.height = textarea.scrollHeight + 'px'; // Set height based on scrollHeight
});

// Optional: Initial resize if content is pre-filled
textarea.style.height = 'auto';
textarea.style.height = textarea.scrollHeight + 'px';
</script>
</body>


</html>