@extends('layouts.main')

@section('title', 'Add Monthly Profit')

@section('content')

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">

<div class="main-content app-content">
    <div class="container-fluid">

        <div class="d-md-flex d-block align-items-center justify-content-between page-header-breadcrumb mb-4">
            <div>
                <h1 class="page-title text-primary">Add Monthly Profit</h1>
            </div>
            <div class="ms-auto">
                <a href="{{ route('monthly-profits.index') }}" class="btn btn-secondary">Back</a>
            </div>
        </div>

        <div class="card mt-3">
            <div class="card-body">
                <form action="{{ route('monthly-profits.store') }}" method="POST" id="profitForm">
                    @csrf

                    <div class="row">

                        <!-- Branch -->
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Branch *</label>
                            <select name="branch_id" class="form-select @error('branch_id') is-invalid @enderror" required>
                                <option value="">Select Branch</option>
                                @foreach($branches as $branch)
                                    <option value="{{ $branch->id }}" {{ old('branch_id') == $branch->id ? 'selected' : '' }}>
                                        {{ $branch->branch_name }}
                                    </option>
                                @endforeach
                            </select>
                            @error('branch_id')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Month -->
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Financial Month *</label>
                            <input type="month" name="financial_month"
                                class="form-control @error('financial_month') is-invalid @enderror"
                                value="{{ old('financial_month') }}" required>
                            @error('financial_month')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Profit -->
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Net Profit *</label>
                            <input type="number" step="0.01" name="net_profit_amount"
                                class="form-control @error('net_profit_amount') is-invalid @enderror"
                                value="{{ old('net_profit_amount') }}" required>
                            @error('net_profit_amount')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <!-- Lock -->
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Lock Record</label>
                            <select name="is_locked" class="form-select">
                                <option value="0">No</option>
                                <option value="1">Yes</option>
                            </select>
                        </div>

                        <!-- Notes -->
                        <div class="col-12 mb-3">
                            <label class="form-label">Notes</label>
                            <textarea name="notes" class="form-control">{{ old('notes') }}</textarea>
                        </div>

                    </div>

                    <div class="text-end">
                        <button type="submit" class="btn btn-primary" id="submitBtn">
                            Save
                        </button>
                    </div>

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

    </div>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>

<script>
$('#profitForm').on('submit', function() {
    $('#submitBtn').prop('disabled', true)
        .html('<span class="spinner-border spinner-border-sm"></span> Saving...');
});
</script>

@endsection