{{-- resources/views/branches/create.blade.php --}}
@extends('layouts.main')

@section('title', 'Branch Management - Create Branch')

@section('content')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css">

<style>
    .error-text {
        color: red;
        font-size: 13px;
    }
    .btn-loading {
        position: relative;
        pointer-events: none;
        opacity: 0.8;
    }
    .required-field::after {
        content: " *";
        color: red;
    }
</style>

<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">
            <h1 class="page-title mb-0 text-primary">Create Branch</h1>
            <div class="ms-auto">
                <a href="{{ route('branches.index') }}" class="btn btn-secondary">
                    <i class="fas fa-arrow-left"></i> Back to List
                </a>
            </div>
        </div>

        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Branch Information</h3>
                    </div>
                    <div class="card-body">
                        <form id="branchForm" action="{{ route('branches.store') }}" method="POST">
                            @csrf
                            <div class="row">
                                <!-- <div class="col-md-6 mb-3">
                                    <label for="branch_code" class="form-label required-field">Branch Code</label>
                                    <input type="text" class="form-control @error('branch_code') is-invalid @enderror" 
                                        id="branch_code" name="branch_code" value="{{ old('branch_code') }}" 
                                        placeholder="e.g., BR001" required>
                                    @error('branch_code')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div> -->

                                <div class="col-md-6 mb-3">
                                    <label for="branch_name" class="form-label required-field">Branch Name</label>
                                    <input type="text" class="form-control @error('branch_name') is-invalid @enderror" 
                                        id="branch_name" name="branch_name" value="{{ old('branch_name') }}" 
                                        placeholder="e.g., Main Street Branch" required>
                                    @error('branch_name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-12 mb-3">
                                    <label for="address_line_1" class="form-label required-field">Address Line 1</label>
                                    <textarea class="form-control @error('address_line_1') is-invalid @enderror" 
                                            id="address_line_1" name="address_line_1" rows="2" 
                                            placeholder="Street address, P.O. box, company name" required>{{ old('address_line_1') }}</textarea>
                                    @error('address_line_1')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-12 mb-3">
                                    <label for="address_line_2" class="form-label">Address Line 2</label>
                                    <textarea class="form-control @error('address_line_2') is-invalid @enderror" 
                                            id="address_line_2" name="address_line_2" rows="2" 
                                            placeholder="Apartment, suite, unit, building, floor">{{ old('address_line_2') }}</textarea>
                                    @error('address_line_2')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="city" class="form-label required-field">City</label>
                                    <input type="text" class="form-control @error('city') is-invalid @enderror" 
                                        id="city" name="city" value="{{ old('city') }}" placeholder="e.g., New York" required>
                                    @error('city')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="state" class="form-label required-field">State</label>
                                    <input type="text" class="form-control @error('state') is-invalid @enderror" 
                                        id="state" name="state" value="{{ old('state') }}" placeholder="e.g., NY" required>
                                    @error('state')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="postal_code" class="form-label required-field">Postal Code</label>
                                    <input type="text" class="form-control @error('postal_code') is-invalid @enderror" 
                                        id="postal_code" name="postal_code" value="{{ old('postal_code') }}" 
                                        placeholder="e.g., 10001" required>
                                    @error('postal_code')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-6 mb-3">
                                    <label for="country" class="form-label required-field">Country</label>
                                    <input type="text" class="form-control @error('country') is-invalid @enderror" 
                                        id="country" name="country" value="{{ old('country') }}" 
                                        placeholder="e.g., USA" required>
                                    @error('country')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-6 mb-3">
                                    <label for="contact_number" class="form-label required-field">Contact Number</label>
                                    <input type="text" class="form-control @error('contact_number') is-invalid @enderror" 
                                        id="contact_number" name="contact_number" value="{{ old('contact_number') }}" 
                                        placeholder="e.g., +1 234-567-8900" required>
                                    @error('contact_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-6 mb-3">
                                    <label for="email" class="form-label required-field">Email</label>
                                    <input type="email" class="form-control @error('email') is-invalid @enderror" 
                                        id="email" name="email" value="{{ old('email') }}" 
                                        placeholder="branch@example.com" required>
                                    @error('email')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-6 mb-3">
                                    <label for="gst_number" class="form-label">GST Number</label>
                                    <input type="text" class="form-control @error('gst_number') is-invalid @enderror" 
                                        id="gst_number" name="gst_number" value="{{ old('gst_number') }}" 
                                        placeholder="e.g., 22AAAAA0000A1Z5">
                                    @error('gst_number')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="status" class="form-label required-field">Status</label>
                                    <select class="form-select @error('status') is-invalid @enderror" 
                                            id="status" name="status" required>
                                        <option value="">Select Status</option>
                                        <option value="active" {{ old('status') == 'active' ? 'selected' : '' }}>Active</option>
                                        <option value="inactive" {{ old('status') == 'inactive' ? 'selected' : '' }}>Inactive</option>
                                    </select>
                                    @error('status')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="col-md-4 mb-3">
                                    <label for="opening_date" class="form-label">Opening Date</label>
                                    <input type="date" class="form-control datepicker @error('opening_date') is-invalid @enderror" 
                                        id="opening_date" name="opening_date" value="{{ old('opening_date') }}" 
                                        placeholder="dd-mm-yyyy" autocomplete="off">
                                    @error('opening_date')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-md-12 mt-4 text-end">
                                <button type="reset" class="btn btn-secondary me-2">Reset</button>
                                <button type="submit" class="btn btn-primary" id="submitBtn">Create Branch</button>
                            </div>
                        </form>
                    </div>
                </div>
            </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 src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>

<script>
    toastr.options = {
        "closeButton": true,
        "progressBar": true,
        "positionClass": "toast-top-right",
        "timeOut": "4000"
    }

    @if (session('success'))
        toastr.success("{{ session('success') }}");
    @endif

    @if (session('error'))
        toastr.error("{{ session('error') }}");
    @endif

    @if (session('validation_errors'))
        @foreach (session('validation_errors') as $error)
            toastr.error("{{ $error }}");
        @endforeach
    @endif

    // Initialize datepicker
    // $('.datepicker').datepicker({
    //     format: 'dd-mm-yyyy',
    //     autoclose: true,
    //     todayHighlight: true
    // });

    // Form submission loader
    $('#branchForm').on('submit', function(e) {
        const btn = $('#submitBtn');
        btn.prop('disabled', true)
           .html('<span class="spinner-border spinner-border-sm me-2"></span>Creating branch...');
        toastr.info('Creating branch...');
    });
</script>
@endsection