@extends('Admin.layout')
<link rel="stylesheet" href="{{ asset('assets/css/form.css') }}">
@section('content')

<style>
    .border-brand {
        border-color: var(--primary) !important;
    }
</style>

<div class="d-flex align-items-center gap-3 mb-4">
    <a href="{{ route('medicines') }}"
        class="btn btn-icon btn-white border rounded-3 d-flex align-items-center justify-content-center btn-back shadow-sm"
        style="width: 42px; height: 42px; transition: all .2s ease;">
        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="var(--primary)" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left" style="transition: stroke .2s ease;">
            <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
            <path d="M15 6l-6 6l6 6"></path>
        </svg>
    </a>
    <h5 class="mb-0 fw-bold border-start border-4 border-brand ps-3">Medicines</h5>
</div>

<div class="card border-0 shadow-lg rounded-4 overflow-hidden">
    <div class="card-header bg-brand-gradient border-0 py-4 px-4">
        <h4 class="mb-1 text-white fw-bold">Add Medicines</h4>
        <small class="text-white">Fill in the details below to add a new medicine to inventory</small>
    </div>

    <div class="card-body p-4">
        <form id="productForm" action="{{ route('store_product') }}" method="POST" enctype="multipart/form-data">
            @csrf

            <div class="section-title mb-4">
                <h5><i class="ti tabler-package me-2"></i>Product Information</h5>
            </div>
            <div class="row">
            <div class="col-md-4 mb-3">
                <label class="form-label">Category Name <span class="text-danger">*</span></label>

                <select name="category_id" class="form-select @error('category_id') is-invalid @enderror">
                    <option value="">Select Category</option>

                    @foreach($categories as $category)
                        <option value="{{ $category->id }}" 
                            {{ old('category_id') == $category->id ? 'selected' : '' }}>
                            {{ $category->name }}
                        </option>
                    @endforeach
                </select>

                @error('category_id')
                    <div class="invalid-feedback">{{ $message }}</div>
                @enderror
            </div>

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


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

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

                <!-- <div class="col-12 mb-3">
                    <label class="form-label">Description</label>
                    <textarea rows="4" name="description" class="form-control"
                        placeholder="Product description">{{ old('description') }}</textarea>
                </div> -->
                <div class="col-md-6 mb-3">
                    <label class="form-label">Minimum Stock Alert <span class="text-danger">*</span></label>
                    <input type="number" name="minimum_stock"
                        class="form-control @error('minimum_stock') is-invalid @enderror"
                        value="{{ old('minimum_stock') }}">
                    @error('minimum_stock') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-6 mb-3">
                    <label class="form-label">Strength Unit <span class="text-danger">*</span></label>
                    <input type="text" name="st_val" class="form-control @error('st_val') is-invalid @enderror"
                        placeholder="25 mg" value="{{ old('st_val') }}">
                    @error('st_val') <div class="invalid-feedback">{{ $message }}</div> @enderror

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

                </div> -->
            </div>
            <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-4 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') }}">
                    @error('purchase_price') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>

                <div class="col-md-4 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') }}">
                    @error('selling_price') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>

                <div class="col-md-4 mb-3">
                    <label class="form-label">GST (Optional)</label>
                    <input type="number" name="tax" step="0.01" class="form-control" value="{{ old('tax') }}">
                </div>


            </div>

            <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 <span class="text-danger">*</span></label>
                    <input type="number" name="current_stock"
                        class="form-control @error('current_stock') is-invalid @enderror"
                        value="{{ old('current_stock') }}">
                    @error('current_stock') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>




                <div class="col-md-4 mb-3">
                    <label class="form-label">Batch Number <span class="text-danger">*</span></label>
                    <input type="text" name="batch_number"
                        class="form-control @error('batch_number') is-invalid @enderror"
                        value="{{ old('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 <span class="text-danger">*</span></label>
                    <input type="date" name="expiry_date"
                        class="form-control @error('expiry_date') is-invalid @enderror"
                        value="{{ old('expiry_date') }}">
                    @error('expiry_date') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>


            </div>


            <hr class="my-4">

            <div class="d-flex justify-content-center gap-2">
                <a href="{{ route('medicines') }}" 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">Add Product</span>
                </button>
            </div>

        </form>
    </div>
</div>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
$(function () {

    $('#productForm').on('submit', function () {

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

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

    });

});
</script>
@endsection