@extends('layouts.layoutMaster')

@section('title', 'Tambah Stock Opname')

@section('vendor-style')
@vite([
  'resources/assets/vendor/libs/select2/select2.scss'
])
@endsection

@section('vendor-script')
@vite([
  'resources/assets/vendor/libs/select2/select2.js'
])
@endsection

@section('content')
<div class="card mb-4">
    <div class="card-header">
        <h5>Tambah Stock Opname</h5>
    </div>
    <div class="card-body">
        <!-- Notice about stock availability -->
        <div class="alert alert-info mb-4">
            <div class="d-flex">
                <i class="ri-information-line fs-3 me-2"></i>
                <div>
                    <h6 class="alert-heading mb-1">Informasi Stock Opname</h6>
                    <p class="mb-0">Sistem hanya akan menampilkan bahan dengan stok aktual (positif) di dalam gudang yang dipilih. Bahan dengan stok kosong atau negatif tidak akan ditampilkan dalam pencarian.</p>
                </div>
            </div>
        </div>
        
        <!-- Improved Warehouse Filter -->
        <div class="warehouse-filter-card mb-4">
            <div class="card border shadow-sm">
                <div class="card-body">
                    <div class="row align-items-center">
                        <div class="col-md-3">
                            <label for="warehouse_id" class="form-label fw-bold mb-0">Pilih Gudang:</label>
                        </div>
                        <div class="col-md-9">
                            <select class="form-select select2" id="warehouse_id" name="warehouse_id" required>
                                <option value="">-- Pilih Gudang untuk Stock Opname --</option>
                                @foreach ($warehouses as $warehouse)
                                    <option value="{{ $warehouse->id }}">
                                        {{ $warehouse->name }} {{ $warehouse->main_location ? '(Utama)' : '' }}
                                    </option>
                                @endforeach
                            </select>
                            <div class="form-text text-info mt-1">
                                <i class="ri-information-line"></i>
                                Pilih gudang terlebih dahulu untuk menampilkan daftar bahan yang tersedia.
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <form id="stockOpnameForm">
            @csrf
            <div class="row mb-4">
                <div class="col-md-6">
                    <label for="opname_date">Tanggal Opname:</label>
                    <input type="date" class="form-control" id="opname_date" name="opname_date" required>
                </div>
                <div class="col-md-6">
                    <label for="reference_no">No. Referensi (Kosongkan Jika tidak ada):</label>
                    <input type="text" class="form-control" id="reference_no" name="reference_no">
                </div>
            </div>

            <div class="mb-4">
                <div class="card bg-light border">
                    <div class="card-body">
                        <div class="d-flex align-items-center mb-2">
                            <i class="ri-search-line me-2 text-primary"></i>
                            <label for="ingredient_search" class="form-label mb-0 fw-semibold">Cari Bahan:</label>
                        </div>
                <select id="ingredient_search" class="form-select" style="width: 100%;"></select>
                        <div class="form-text text-info mt-2">
                            <i class="ri-information-line me-1"></i>
                            Hanya bahan dengan stok tersedia yang akan ditampilkan. Stok negatif atau kosong tidak akan muncul dalam hasil pencarian.
                        </div>
                    </div>
                </div>
            </div>

            <div class="card border mb-4">
                <div class="card-header bg-light">
                    <h6 class="mb-0">Daftar Bahan untuk Stock Opname</h6>
                </div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-hover" id="ingredients_table">
                            <thead class="table-light">
                    <tr>
                        <th>Bahan</th>
                        <th>Batch</th>
                        <th>Stok Sistem</th>
                        <th>Stok Fisik</th>
                        <th>Aksi</th>
                    </tr>
                </thead>
                <tbody id="ingredient_list">
                    <!-- Daftar bahan yang ditambahkan akan muncul di sini -->
                </tbody>
            </table>
                    </div>
                </div>
            </div>

            <div class="form-group mt-3">
                <label for="notes">Catatan Tambahan:</label>
                <textarea id="notes" name="notes" class="form-control" rows="3"></textarea>
            </div>

            <!-- Journal Preview Section -->
            <div class="card border mt-4">
                <div class="card-header bg-light d-flex justify-content-between align-items-center">
                    <h6 class="mb-0"><i class="ri-book-line me-1"></i> Preview Jurnal Akuntansi</h6>
                    <span class="badge bg-info">Simulasi</span>
                </div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-sm mb-0">
                            <thead class="table-light">
                                <tr>
                                    <th>Akun</th>
                                    <th class="text-end">Debit</th>
                                    <th class="text-end">Kredit</th>
                                </tr>
                            </thead>
                            <tbody id="journalPreviewContainer">
                                <tr>
                                    <td colspan="3" class="text-center py-3 text-muted">
                                        <i class="ri-information-line me-1"></i>
                                        Tambahkan bahan dan masukkan kuantitas fisik untuk melihat preview jurnal
                                    </td>
                                </tr>
                            </tbody>
                            <tfoot class="table-light" id="journalPreviewFooter" style="display: none;">
                                <tr>
                                    <th>Total</th>
                                    <th class="text-end" id="totalDebit">0</th>
                                    <th class="text-end" id="totalCredit">0</th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
                <div class="card-footer bg-light">
                    <small class="text-muted">
                        <i class="ri-information-line me-1"></i> Preview ini menunjukkan dampak akuntansi dari penyesuaian stok. Jurnal aktual akan dibuat setelah stock opname disimpan.
                    </small>
                </div>
            </div>

            <div class="d-flex justify-content-between mt-4">
                <a href="{{ route('opname.index') }}" class="btn btn-secondary">
                    <i class="ri-arrow-left-line me-1"></i> Kembali
                </a>
                <button type="button" id="submitOpname" class="btn btn-primary">
                    <i class="ri-save-line me-1"></i> Simpan Stock Opname
                </button>
            </div>
        </form>
    </div>
</div>
@endsection

@section('page-script')
@vite(['Modules/Stockist/resources/assets/js/stock-opname-add.js'])
@endsection