@extends('layouts.app')
@section('title', 'ETIMS Integrations')

@section('content')
<section class="content-header">
    <h1 class="tw-text-xl md:tw-text-3xl tw-font-bold tw-text-black">ETIMS Integration Settings</h1>
</section>

<section class="content">

    <!-- Add Integration Button -->
    <div class="d-flex justify-content-end mb-4">
        <button class="btn btn-success" data-toggle="modal" data-target="#addEtimsModal">
            <i class="bi bi-plus-circle"></i> Add Integration
        </button>
    </div>

    <div class="card">
        @if(session('success'))
            <div class="alert alert-success">{{ session('success') }}</div>
        @endif

        @if($errors->any())
            <div class="alert alert-danger">
                <ul class="mb-0">
                    @foreach($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        <div class="table-responsive card p-4" style="background:white;border-radius:10px;">
            <table class="table table-bordered">
                <thead>
                    <tr>
                        <th>API</th>
                        <th>Site URL</th>
                        <th style="text-align:center;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @if ($paymentSettings)
                        <tr>
                            <td>{{ $paymentSettings->api }}</td>
                            <td>{{ $paymentSettings->site_url }}</td>
                            <td style="text-align:center;">
                                <button class="btn btn-warning btn-sm" data-toggle="modal" data-target="#editEtimsModal">
                                    Edit
                                </button>
                            </td>
                        </tr>
                    @else
                        <tr>
                            <td colspan="3" class="text-center">No ETIMS integration found.</td>
                        </tr>
                    @endif
                </tbody>
            </table>
        </div>
    </div>
</section>

<!-- Add Modal -->
<div class="modal fade" id="addEtimsModal" tabindex="-1" role="dialog" aria-labelledby="addEtimsModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <form action="{{ route('etimsintegrations.etims.save') }}" method="POST">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Add ETIMS Integration</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label>API</label>
                        <input type="text" name="api" class="form-control" required>
                    </div>
                    <div class="form-group">
                        <label>Site URL</label>
                        <input type="text" name="site_url" class="form-control" required>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-success">Save</button>
                </div>
            </div>
        </form>
    </div>
</div>

<!-- Edit Modal -->
<div class="modal fade" id="editEtimsModal" tabindex="-1" role="dialog" aria-labelledby="editEtimsModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <form action="{{ route('etimsintegrations.etims.save') }}" method="POST">
            @csrf
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Edit ETIMS Integration</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label>API</label>
                        <input type="text" name="api" class="form-control" value="{{ $paymentSettings->api ?? '' }}" required>
                    </div>
                    <div class="form-group">
                        <label>Site URL</label>
                        <input type="text" name="site_url" class="form-control" value="{{ $paymentSettings->site_url ?? '' }}" required>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-warning">Update</button>
                </div>
            </div>
        </form>
    </div>
</div>

@endsection