@extends('admin.layouts')

@section('title','Users')
@section('page_title','Users')

@section('content')

<div class="container-fluid">

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

<div class="card shadow">

<div class="card-header bg-dark text-white">
<h5 class="mb-0">Users List</h5>
</div>

<div class="card-body p-0">

<div class="table-responsive">

<table class="table table-striped table-bordered mb-0">

<thead class="table-dark">
<tr>
<th>ID</th>
<th>Name</th>
<th>Phone</th>
<th>Refer Code</th>
<th>Referred By</th>
<th>Balance</th>
<th>Action</th>
</tr>
</thead>

<tbody>

@foreach($users as $user)

<tr>

<td>{{ $user->id }}</td>

<td>{{ $user->name }}</td>

<td>{{ $user->phone }}</td>

<td>{{ $user->refer_code }}</td>

<td>
@if($user->referrer)
{{ $user->referrer->name }}
@else
-
@endif
</td>

<td class="fw-bold text-success">
₹ {{ number_format($user->balance,2) }}
</td>

<td>

<button 
class="btn btn-sm btn-primary"
data-bs-toggle="modal"
data-bs-target="#balanceModal{{ $user->id }}"
>
Change Balance
</button>

</td>

</tr>

{{-- Balance Modal --}}

<div class="modal fade" id="balanceModal{{ $user->id }}">

<div class="modal-dialog">

<div class="modal-content">

<form method="POST" action="{{ route('admin.users.changeUserBalance') }}">

@csrf

<div class="modal-header">
<h5 class="modal-title">Change Balance</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>

<div class="modal-body">

<input type="hidden" name="id" value="{{ $user->id }}">

<div class="mb-3">
<label>Type</label>
<select name="type" class="form-control">
<option value="inc">Increase</option>
<option value="dec">Decrease</option>
</select>
</div>

<div class="mb-3">
<label>Amount</label>
<input type="number" step="0.01" name="amount" class="form-control" required>
</div>

<div class="mb-3">
<label>Reason</label>
<input type="text" name="reason" class="form-control" required>
</div>

</div>

<div class="modal-footer">
<button class="btn btn-success">Submit</button>
</div>

</form>

</div>

</div>

</div>

@endforeach

</tbody>

</table>

</div>

</div>

</div>

</div>

@endsection