@extends(session('staff_logged_in') ? 'Staff.layout' : 'Admin.layout')

@section('content')
<div id="alertBox" style="display:none;"></div>
<div class="row align-items-center justify-content-between mb-3 mt-3">
    <div class="col-auto">
        <h5>
            <button type="button" class="btn btn-icon bg-white me-2" style="box-shadow: 0px 9px 12px -2px #66328E1F;">
                <a href="{{ route('product') }}">
                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
                        stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
                        class="icon icon-tabler">
                        <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                        <path d="M15 6l-6 6l6 6" />
                    </svg>
                </a>
            </button>
            Edit Product
        </h5>
    </div>
</div>

@if(session('error'))
<div class="alert alert-danger">{{ session('error') }}</div>
@endif
@if(session('success'))
<div class="alert alert-success">{{ session('success') }}</div>
@endif

<div class="row justify-content-center">
    <div class="col-lg-10">
        <div class="card border-0 shadow-sm">

            <div class="card-header py-3">
                <h4 class="fw-bold mb-1">Edit Product</h4>
                <p class="text-muted mb-0">Update clinic inventory product information</p>
            </div>

            <div class="card-body p-4">

                {{-- Update Form --}}
                <form id="productEditForm"
                    action="{{ route('update_product', $product->id) }}"
                    method="POST"
                    enctype="multipart/form-data">

                    @csrf

                    {{-- Product Information --}}
                    <div class="section-title mb-4">
                        <h5><i class="ti tabler-package me-2"></i>Product Information</h5>
                    </div>

                    <div class="row g-3 mb-3">

                        <div class="col-md-3">
                            <label class="form-label">Category *</label>
                            <select name="category" class="form-select @error('category') is-invalid @enderror">
                                <option value="">Select Category</option>
                                @foreach($categories as $cat)
                                <option value="{{ $cat->id }}"
                                    {{ old('category', $product->category) == $cat->id ? 'selected' : '' }}>
                                    {{ $cat->name }}
                                </option>
                                @endforeach
                            </select>
                            @error('category')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-3">
                            <label class="form-label">Product Name *</label>
                            <input type="text" name="product_name"
                                class="form-control @error('product_name') is-invalid @enderror"
                                value="{{ old('product_name',$product->product_name) }}">
                            @error('product_name')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-3">
                            <label class="form-label">Brand *</label>
                            <input type="text" name="brand" class="form-control @error('brand') is-invalid @enderror"
                                value="{{ old('brand',$product->brand) }}">
                            @error('brand')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-3">
                            <label class="form-label">HSN Code *</label>
                            <input type="text" name="hsn_code"
                                class="form-control @error('hsn_code') is-invalid @enderror"
                                value="{{ old('hsn_code',$product->hsn_code) }}">
                            @error('hsn_code')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-12">
                            <label class="form-label">Description</label>
                            <textarea rows="4" name="description"
                                class="form-control">{{ old('description',$product->description ?? '-') }}</textarea>
                        </div>

                    </div>

                    {{-- Pricing --}}
                    <div class="section-title my-4">
                        <h5><i class="ti tabler-currency-rupee me-2"></i>Pricing</h5>
                    </div>

                    <div class="row">

                        <div class="col-md-3 mb-3">
                            <label class="form-label">Purchase Price *</label>
                            <input type="number" name="purchase_price" step="1"
                                class="form-control @error('purchase_price') is-invalid @enderror"
                                value="{{ old('purchase_price',$product->purchase_price) }}">
                            @error('purchase_price')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-3 mb-3">
                            <label class="form-label">Selling Price *</label>
                            <input type="number" name="selling_price" step="1"
                                class="form-control @error('selling_price') is-invalid @enderror"
                                value="{{ old('selling_price',$product->selling_price) }}">
                            @error('selling_price')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-3 mb-3">
                            <label class="form-label">GST</label>
                            <input type="number" name="tax" step="0.01" class="form-control"
                                value="{{ old('tax',$product->tax) }}">
                        </div>
                        <div class="col-md-3 mb-3">
                            <label class="form-label">Status</label>
                            <select name="status" class="form-select">
                                <option value="Active" {{ old('status',$product->status)=='Active' ? 'selected' : '' }}>
                                    Active
                                </option>
                                <option value="Inactive"
                                    {{ old('status',$product->status)=='Inactive' ? 'selected' : '' }}>
                                    Inactive
                                </option>
                            </select>
                        </div>
                    </div>

                    {{-- Inventory --}}
                    <!-- <div class="section-title my-4">
                        <h5><i class="ti tabler-building-warehouse me-2"></i>Inventory</h5>
                    </div>

                    <div class="row">

                        <div class="col-md-4 mb-3">
                            <label class="form-label">Quantity *</label>
                            <input type="number" name="current_stock"
                                class="form-control @error('current_stock') is-invalid @enderror"
                                value="{{ old('current_stock',$product->current_stock) }}">
                            @error('current_stock')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-4 mb-3">
                            <label class="form-label">Minimum Stock Alert *</label>
                            <input type="number" name="minimum_stock"
                                class="form-control @error('minimum_stock') is-invalid @enderror"
                                value="{{ old('minimum_stock',$product->minimum_stock) }}">
                            @error('minimum_stock')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-4 mb-3">
                            <label class="form-label">Strength Value *</label>
                            <input type="text" name="st_val" class="form-control @error('st_val') is-invalid @enderror"
                                value="{{ old('st_val',$product->st_val) }}">
                            @error('st_val')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-4 mb-3">
                            <label class="form-label">Strength Unit *</label>
                            <input type="text" name="st_unit"
                                class="form-control @error('st_unit') is-invalid @enderror"
                                value="{{ old('st_unit',$product->st_unit) }}">
                            @error('st_unit')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-4 mb-3">
                            <label class="form-label">Batch Number *</label>
                            <input type="text" name="batch_number"
                                class="form-control @error('batch_number') is-invalid @enderror"
                                value="{{ old('batch_number',$product->batch_number) }}">
                            @error('batch_number')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-4 mb-3">
                            <label class="form-label">Expiry Date *</label>
                            <input type="date" name="expiry_date"
                                class="form-control @error('expiry_date') is-invalid @enderror"
                                value="{{ old('expiry_date',$product->expiry_date) }}">
                            @error('expiry_date')
                            <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>



                    </div> -->

                    {{-- Additional Settings --}}
                    <!-- <div class="section-title my-4">
                        <h5><i class="ti tabler-settings me-2"></i>Additional Settings</h5>
                    </div>

                    <div class="row g-3 mb-3">
                        <div class="col-md-6">
                            <label class="form-label">Prescription Required</label>
                            <select name="prescription_required" class="form-select">
                                <option value="No"
                                    {{ old('prescription_required', $product->prescription_required) == 'No'  ? 'selected' : '' }}>
                                    No</option>
                                <option value="Yes"
                                    {{ old('prescription_required', $product->prescription_required) == 'Yes' ? 'selected' : '' }}>
                                    Yes</option>
                            </select>
                        </div>
                    
                    </div> -->

                    <hr class="my-4">

                    <div class="d-flex justify-content-center align-items-center">
                        <!-- <button type="button" class="btn btn-danger" data-bs-toggle="modal"
                            data-bs-target="#confirmDeleteModal">
                            <i class="ti tabler-trash me-1"></i> Delete Product
                        </button> -->
                        <div class="d-flex gap-2">
                            <a href="{{ route('product') }}" class="btn btn-light px-4">Cancel</a>
                            <button type="submit" class="btn btn-primary px-4" id="submitBtn">
                                <i class="ti tabler-device-floppy me-1"></i>
                                <span id="submitText">Save Changes</span>
                            </button>
                        </div>
                    </div>

                </form>

                {{-- Delete form outside main form --}}
                <form id="deleteForm" action="{{ url('admin/product/' . $product->id . '/delete') }}" method="POST">
                    @csrf
                    @method('DELETE')
                </form>

            </div>
        </div>
    </div>
</div>

{{-- Delete Confirmation Modal --}}
<div class="modal fade" id="confirmDeleteModal" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered modal-sm">
        <div class="modal-content" style="border-radius: 16px; overflow: hidden;">
            <div class="modal-body text-center p-4">
                <div class="mb-3">
                    <div
                        style="width: 60px; height: 60px; background: #fff0f0; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto;">
                        <i class="ti tabler-trash" style="font-size: 28px; color: #dc3545;"></i>
                    </div>
                </div>
                <h5 class="fw-bold mb-1">Delete Product</h5>
                <p class="text-muted mb-4">Are you sure you want to delete
                    <strong>{{ $product->product_name }}</strong>? This action cannot be undone.
                </p>
                <div class="d-flex gap-2 justify-content-center">
                    <button type="button" class="btn btn-light px-4" data-bs-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-danger px-4"
                        onclick="document.getElementById('deleteForm').submit();">
                        <i class="ti tabler-trash me-1"></i> Yes, Delete
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
.card {
    border-radius: 18px;
}

.form-control,
.form-select {
    min-height: 46px;
    border-radius: 10px;
}

.form-control:focus,
.form-select:focus {
    border-color: #696cff;
    box-shadow: none;
}

.section-title {
    border-left: 4px solid #696cff;
    padding-left: 12px;
}

.section-title h5 {
    margin: 0;
    font-weight: 700;
}

.card-header {
    border-bottom: 1px solid #edf1f7;
}

.product-preview {
    width: 150px;
    height: 150px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
}

.product-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
</style>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
$(document).ready(function() {

    const Toast = Swal.mixin({
        toast: true,
        position: 'top-end',
        showConfirmButton: false,
        timer: 3000,
        timerProgressBar: true
    });

    function clearErrors() {
        $('.form-control, .form-select').removeClass('is-invalid');
        $('.invalid-feedback').text('');
    }
    
$('#productEditForm').on('submit', function () {

    $('#submitBtn').prop('disabled', true);

    $('#submitText').html(`
        <span class="spinner-border spinner-border-sm me-1"></span>
        Processing...
    `);

});

});
</script>
@endsection