@extends('layouts.app', ['title' => 'Add animal', 'showNav' => true])

@section('content')
    <div class="row justify-content-center">
        <div class="col-lg-7">
            <h1 class="h3 mb-4">Add animal</h1>
            <div class="card border-0 shadow-sm">
                <div class="card-body">
                    <form method="post" action="{{ route('animals.store') }}">
                        @csrf
                        <div class="row g-3 mb-3">
                            <div class="col-md-6">
                                <label class="form-label" for="category">Category</label>
                                <select class="form-select" name="category" id="category" required>
                                    <option value="" disabled {{ old('category') ? '' : 'selected' }}>Choose…</option>
                                    @foreach($categories as $value => $label)
                                        <option value="{{ $value }}" @selected(old('category') === $value)>{{ $label }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-md-6">
                                <label class="form-label" for="gender">Gender</label>
                                <select class="form-select" name="gender" id="gender" required>
                                    <option value="" disabled {{ old('gender') ? '' : 'selected' }}>Choose…</option>
                                    <option value="male" @selected(old('gender') === 'male')>Male</option>
                                    <option value="female" @selected(old('gender') === 'female')>Female</option>
                                </select>
                            </div>
                        </div>
                        <div class="mb-3">
                            <label class="form-label" for="tag_no">Tag no</label>
                            <input class="form-control" type="text" name="tag_no" id="tag_no" value="{{ old('tag_no') }}" required>
                        </div>

                        <h6 class="text-muted text-uppercase mt-4 mb-3 border-bottom pb-2">Purchase details</h6>
                        <div class="row g-3 mb-3">
                            <div class="col-md-4">
                                <label class="form-label" for="purchase_date">Date</label>
                                <input class="form-control" type="date" name="purchase_date" id="purchase_date" value="{{ old('purchase_date') }}" required>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="purchase_from">From</label>
                                <input class="form-control" type="text" name="purchase_from" id="purchase_from" value="{{ old('purchase_from') }}" required>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="purchase_price">Price</label>
                                <input class="form-control" type="number" step="0.01" min="0" name="purchase_price" id="purchase_price" value="{{ old('purchase_price') }}" required>
                            </div>
                        </div>

                        @include('animals._birth_fields', [
                            'bornInFarm' => false,
                            'bornDate' => '',
                            'motherId' => null,
                        ])

                        <button type="submit" class="btn btn-primary mt-2">Save</button>
                        <a href="{{ route('animals.index') }}" class="btn btn-outline-secondary mt-2">Cancel</a>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection