@extends('AdminLte.template')

@section('title', __('Stock Adjustment Credit/Debit'))

@section('ExternalCss')
@parent
<style>
    #creditDebitAdjustment { background: #fff; font-size: 12px; font-weight: bold; }
    #creditDebitAdjustment .input { border: none; border-bottom: 1px solid #aaa; }
    #creditDebitAdjustment .stock-grid { overflow: auto; min-height: 230px; max-height: 420px; border: 1px solid #aaa; margin: 15px 0; }
    #creditDebitAdjustment td { vertical-align: middle; }
    #creditDebitAdjustment .quantity { width: 100px; }
    #creditDebitItems > thead > tr > th { border-top: 1px solid #000; border-bottom: 1px solid #000; vertical-align: middle; }
    #creditDebitItems > thead > tr:first-child > th[colspan] { border-bottom: none; }
    #creditDebitItems > thead > tr:last-child > th { border-top: none; }
    #creditDebitItems > tbody > tr > td { border-top: 1px solid #aaa; border-bottom: 1px solid #aaa; }
    #creditDebitItems .expiry { width: 1%; min-width: 64px; white-space: nowrap; }
    #creditDebitItems .system-total-stock-column { width: 1%; min-width: 82px; }
    #creditDebitItems .manufacturer { min-width: 160px; white-space: nowrap; }
    #creditDebitItems .system-stock, #creditDebitItems .revised-stock { white-space: nowrap; }
    #creditDebitAdjustment #creditDebitItems .input { border: none; }
    #creditDebitItems .type option { color: #333; background: #fff; }
    #creditDebitItems .type.is-increase, #creditDebitItems .type option[value="A"] { color: #008000; }
    #creditDebitItems .type.is-reduce, #creditDebitItems .type option[value="R"] { color: #d32f2f; }
    .credit-debit-batch-menu { max-height: 230px; overflow-y: auto; overflow-x: hidden; padding: 0 4px 4px; background: #eee; z-index: 1100; }
    .credit-debit-batch-menu .batch-heading, .credit-debit-batch-menu .batch-option { display: grid; grid-template-columns: 34% 44% 12% 10%; border: 1px solid #000; font-weight: bold; }
    .credit-debit-batch-menu .batch-heading { background: #f8f8f8; position: sticky; top: 0; z-index: 1; font-size: 16px; }
    .credit-debit-batch-menu .batch-menu-header { padding: 0; opacity: 1; cursor: default; }
    .credit-debit-batch-menu .batch-option { margin: 4px 0 0; padding: 0; font-size: 13px; background: #eee; }
    .credit-debit-batch-menu .batch-heading > span, .credit-debit-batch-menu .batch-option > span { padding: 1px 3px; border-right: 1px solid #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .credit-debit-batch-menu .batch-heading > span:last-child, .credit-debit-batch-menu .batch-option > span:last-child { border-right: none; }
    .credit-debit-batch-menu .batch-number { text-align: right; }
    .credit-debit-batch-menu .ui-menu-item { padding: 0; }
    .credit-debit-batch-menu .ui-menu-item.ui-state-focus { margin: 0; border: none; background: none; }
    .credit-debit-batch-menu .ui-state-focus > .batch-option, .credit-debit-batch-menu .batch-option.ui-state-active { border: 1px solid #e7a522; background: #fff9dd; color: #c77700; }
</style>
@endsection

@section('Content')
<div class="container-fluid" id="creditDebitAdjustment">
    @include('Components.transaction_validation_errors')
    <h3 class="txtCenter">{{ __('Stock Adjustment Credit/Debit') }}</h3>
    @if(session('message'))
        <div class="alert alert-success">{{ session('message') }}</div>
    @endif
    <form method="post" action="{{ route('stock-adjustment-credit-debit.store') }}" id="creditDebitAdjustmentForm" autocomplete="off">
        @csrf
        <div class="row">
            <div class="col-md-10">
                <label for="creditDebitDate"><span class="required">&#10033;</span> {{ __('Transaction Date') }} :</label>
                <input type="date" name="adjustmentTranDate" id="creditDebitDate" class="input" value="{{ old('adjustmentTranDate', date('Y-m-d')) }}" required>
                <label for="creditDebitStore"><span class="required">&#10033;</span> {{ __('Store') }} :</label>
                <input type="text" name="storeName" id="creditDebitStore" class="input" value="{{ old('storeName') }}" required>
                <input type="hidden" name="storeCode" id="creditDebitStoreCode" value="{{ old('storeCode') }}">
            </div>
            <div class="col-md-1 txtRight" style="padding-left: 70px;">
                <button type="button" id="bulkStockOpen" class="btn btn-sm btn-success" disabled>{{ __('Bulk Stock Upload') }}</button>

            </div>
        </div>
        <div class="stock-grid">
            <table class="table commonFontSize" id="creditDebitItems">
                <thead>
                    <tr class="warning">
                        <th rowspan="2"><input type="checkbox" id="creditDebitSelectAll" aria-label="{{ __('Select all rows') }}"></th>
                        <th rowspan="2" class="txtRight">{{ __('Sr') }}</th>
                        <th rowspan="2">{{ __('Medicine/Item Name') }}</th>
                        <th rowspan="2">{{ __('Batch') }}</th>
                        <th rowspan="2">{{ __('Category') }}</th>
                        <th rowspan="2">{{ __('SUOM') }}</th>
                        <th rowspan="2">{{ __('Manufacture') }}</th>
                        <th rowspan="2" class="expiry txtRight">{{ __('Exp') }}</th>
                        <th colspan="2" scope="colgroup" class="txtCenter">{{ __('System Stock') }}</th>
                        <th rowspan="2">{{ __('Adj. Type') }}</th>
                        <th rowspan="2" class="txtRight">{{ __('Adj. Qty') }}</th>
                        <th colspan="2" scope="colgroup" class="txtCenter">{{ __('Revised Stock') }}</th>
                    </tr>
                    <tr class="warning">
                        <th scope="col" class="system-total-stock-column txtRight">{{ __('Total Stock') }}</th>
                        <th scope="col" class="txtRight">{{ __('Batch Stock') }}</th>
                        <th scope="col" class="txtRight">{{ __('Total Stock') }}</th>
                        <th scope="col" class="txtRight">{{ __('Batch Stock') }}</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
        <div>
            <button type="button" id="creditDebitAdd" class="btn btn-xs btn-success">{{ __('+ Add More') }}</button>
            <button type="button" id="creditDebitDelete" class="btn btn-xs btn-danger">{{ __('- Delete') }}</button>
        </div>
        <div style="margin-top:35px;">
            <label for="creditDebitRemark"><span class="required">&#10033;</span> {{ __('Remark') }} :</label>
            <input type="text" name="remark" id="creditDebitRemark" class="input" maxlength="50" size="45" value="{{ old('remark') }}" required>
        </div>
        <div class="txtCenter" style="margin:25px 0;">
            <button type="submit" id="creditDebitSubmit" class="btn btn-xs btn-primary"><span class="glyphicon glyphicon-ok"></span> {{ __('Submit') }}</button>
            <button type="button" id="creditDebitReset" class="btn btn-xs btn-info"><span class="glyphicon glyphicon-repeat"></span> {{ __('Reset') }}</button>
        </div>
    </form>
    <script type="application/json" id="creditDebitOldInput">@json(session()->getOldInput())</script>
</div>
@endsection

@section('BootstrapModals')
<div class="modal fade" id="bulkStockModal" tabindex="-1" role="dialog" aria-labelledby="bulkStockTitle" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="{{ __('Close') }}">&times;</button>
                <h4 class="modal-title" id="bulkStockTitle">{{ __('Bulk Stock Upload') }}</h4>
            </div>
            <form id="bulkStockForm" autocomplete="off">
                <div class="modal-body">
                    <div class="form-group">
                        <label for="bulkStockStore">{{ __('Store') }}</label>
                        <input type="text" id="bulkStockStore" class="form-control" disabled>
                        <input type="hidden" name="storeCode" id="bulkStockStoreCode">
                    </div>
                    <div class="row">
                        <div class="col-xs-6">
                            <div class="form-group">
                                <label for="bulkStockCategory">{{ __('Product Category') }}</label>
                                <select name="category" id="bulkStockCategory" class="form-control">
                                    <option value="A">{{ __('All') }}</option>
                                    @foreach($productCategories as $category)
                                        <option value="{{ $category->category_id }}">{{ $category->category_abbrev }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-xs-6">
                            <div class="form-group">
                                <label for="bulkStockFrom">{{ __('Product Between') }}</label>
                                <div class="row">
                                    <div class="col-xs-5"><input name="productFrom" id="bulkStockFrom" class="form-control text-uppercase" value="A" maxlength="1" pattern="[A-Za-z]" required aria-label="{{ __('From letter') }}"></div>
                                    <div class="col-xs-2 text-center">{{ __('To') }}</div>
                                    <div class="col-xs-5"><input name="productTo" id="bulkStockTo" class="form-control text-uppercase" value="Z" maxlength="1" pattern="[A-Za-z]" required aria-label="{{ __('To letter') }}"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <p id="bulkStockCount" role="status" aria-live="polite"></p>
                    <button type="button" id="bulkStockDownload" class="btn btn-primary" disabled>{{ __('Download Excel') }}</button>
                    <hr style="border: 0; border-top: 3px solid #000; opacity: 1;">
                    <!-- <p>{{ __('Enter Physical Stock in the displayed selling unit. Difference = Physical Stock minus downloaded System Stock. This difference is applied to current stock, preserving later purchases and sales. Blank counts are skipped.') }}</p> -->
                    <div class="row" style="display: flex; align-items: flex-end;">
                        <div class="col-xs-4">
                            <div class="form-group">
                                <label for="bulkStockDate"><span class="required">&#10033;</span> {{ __('Transaction Date') }}</label>
                                <input type="date" name="transactionDate" id="bulkStockDate" class="form-control" value="{{ date('Y-m-d') }}" required>
                            </div>
                        </div>
                        <div class="col-xs-8">
                            <div class="form-group">
                                <label for="bulkStockFile">{{ __('Completed Excel File') }}</label>
                                <input type="file" name="file" id="bulkStockFile" class="form-control" accept=".xlsx" data-max-bytes="{{ $bulkUploadMaxKb * 1024 }}">
                                <!-- <small>{{ __('Excel .xlsx only. Maximum file size') }}: {{ $bulkUploadMaxKb / 1024 }} MB. {{ __('Maximum 10,000 batch rows.') }}</small> -->
                            </div>
                        </div>
                    </div>
                    <div id="bulkStockResult" role="status" aria-live="polite" hidden></div>
                </div>
                <div class="modal-footer">
                    <button type="submit" id="bulkStockUpload" class="btn btn-success">{{ __('Update Stock') }}</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{ __('Close') }}</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection

@section('ExternalJs')
<script src="{{ asset("/js/item_adjustment_credit_debit.js?$releaseVersion") }}"></script>
<script src="{{ asset("/js/product_stock_bulk_upload.js?$releaseVersion") }}"></script>
@endsection