@extends('layouts.app')
@section('title', isset($rmb) ? 'Edit RMB' : 'Add RMB')

@section('content')
<div class="content-wrapper">
    <div class="col-12 grid-margin stretch-card">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title text-primary mb-4" style="font-weight: 600; letter-spacing: 0.5px;">
                  <i class="mdi mdi-currency-cny mr-2"></i>
                  {{ isset($rmb) ? 'Edit RMB' : 'Add RMB' }}
                </h4>
                <form id="RmbForm" class="forms-sample" method="POST">
                    @csrf
                    <div class="row">
                        <div class="col-md-12">
                            <hr class="mb-4" style="border-color: rgba(26, 115, 232, 0.1); border-width: 2px;">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="idr" class="text-dark">IDR (Indonesian Rupiah)</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend">
                                              <span class="input-group-text bg-primary text-white"><i class="mdi mdi-currency-idr"></i></span>
                                            </div>
                                            <input type="number" name="idr" class="form-control" id="idr" placeholder="Enter IDR value" value="{{ $rmb->idr ?? '' }}">
                                        </div>
                                        <div id="idr-error" class="invalid-feedback"></div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="rmb" class="text-dark">RMB (Chinese Yuan)</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend">
                                              <span class="input-group-text bg-primary text-white"><i class="mdi mdi-currency-cny"></i></span>
                                            </div>
                                            <input type="number" name="rmb" class="form-control" id="rmb" placeholder="Enter RMB value" value="{{ $rmb->rmb ?? '' }}">
                                        </div>
                                        <div id="rmb-error" class="invalid-feedback"></div>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="is_active" class="text-dark">Status</label>
                                        <div class="input-group">
                                            <div class="input-group-prepend">
                                              <span class="input-group-text bg-primary text-white"><i class="mdi mdi-toggle-switch"></i></span>
                                            </div>
                                            <select name="is_active" id="is_active" class="form-control" style="height: auto; padding: 0.6rem 0.85rem;">
                                                <option value="1" {{ isset($rmb) && $rmb->is_active ? 'selected' : '' }}>Active</option>
                                                <option value="0" {{ isset($rmb) && !$rmb->is_active ? 'selected' : '' }}>Inactive</option>
                                            </select>
                                        </div>
                                        <div id="is_active-error" class="invalid-feedback"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <br><hr><br>
                    </div>

                    <div class="form-group mt-4 pt-3" style="border-top: 1px solid #eee;">
                      <button type="button" id="btn-save" class="btn btn-primary me-2 px-4" style="font-weight: 500; letter-spacing: 0.5px;">
                        <i class="mdi mdi-content-save mr-1"></i> {{ isset($rmb) ? 'Update' : 'Submit' }}
                      </button>
                      <a href="{{ route('rmbs.index') }}" class="btn btn-light px-4" style="font-weight: 500;">
                        <i class="mdi mdi-close-circle mr-1"></i> Cancel
                      </a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@stop

@section('footer')
<script type="text/javascript">
    $(document).ready(function() {
        $('#btn-save').on('click', function() {
            var data = {
                idr: $('#idr').val(),
                rmb: $('#rmb').val(),
                is_active: $('#is_active').val(),
                _token: '{{ csrf_token() }}'
            };

            var url = "{{ isset($rmb) ? route('rmbs.update', $rmb->id) : route('rmbs.store') }}";
            var method = "{{ isset($rmb) ? 'PATCH' : 'POST' }}";

            $.ajax({
                url: url,
                method: method,
                data: data,
                success: function(response) {
                    if (response.success) {
                        Swal.fire("Success!", response.message, "success");
                        setTimeout(() => { window.location.href = "{{ route('rmbs.index') }}"; }, 1000);
                    } else {
                        Swal.fire("Failed!", response.message, "error");
                    }
                },
                error: function() {
                    Swal.fire("Failed!", "An error occurred while saving data.", "error");
                }
            });
        });
    });
</script>
@stop