@extends('layouts.layout')

@section('body_class', 'nav-md')

@section('body_content')
<style>
    th {
        vertical-align: middle !important;
        text-align: center;
    }
</style>

<div class="container body">
    <div class="main_container">
        @include('includes.sidebar')
        <div class="right_col" role="main">
            <div class="page-title">
                <div class="title_left">
                    <div class="col-xs-6 col-sm-6 col-md-6">
                        <h2 class="title-dashboard text-left">
                            <h3>List Agent Customer</h3>
                        </h2>
                    </div>
                    <div class="clearfix"></div>
                </div>

                <div class="row">
                    <div class="co-xs-12 col-sm-12">
                        <div class="x_panel">                        
                            <div class="x_panel">
                                <h4 style="margin: 0px;"><b><center>FILTER</center></b><hr style="border: 1px dashed #ccc;"></h4>
                                <form class="form-horizontal">
                                    <div class="col-xs-12 col-sm-8 col-sm-offset-1">
                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Pilih Store</label>
                                            <div class="col-xs-12 col-sm-8" >
                                                 <select id="brand" name="brand" class="form-control">
                                                    <option value="">-- Pilih Store --</option>
                                                    @foreach($list_store as $brand => $stores)
                                                        <option value="{{ $brand }}" 
                                                            {{ request('brand') == $brand ? 'selected' : '' }}>
                                                            {{ $brand }}
                                                        </option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="col-xs-12 col-sm-4 control-label">Search :</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <input type="text" class="form-control" name="search" id="search" value="{{ $request['search'] }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xs-12 text-center">
                                        <hr style="border: 1px dashed #ccc;">
                                        <button type="submit" class="btn btn-success">Search</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>


                <div class="row">
                    <div class="col-xs-12">
                        <div class="x_panel">
                            <div class="x_content">
                                <div class="text-right" style="margin-bottom: 10px;">
                                    <a href="{{ route('add_agent') }}" class="btn btn-primary">
                                        Create Agent
                                    </a>
                                </div>
                                <div class="table-responsive">
                                    <table class="table table-bordered table-striped" style="zoom: 0.75">
                                        <thead>
                                            <tr>
                                                <th class="text-center">No</th>
                                                <th class="text-center">Nama</th>
                                                <th class="text-center">Email</th>
                                                <th class="text-center">Phone</th>
                                                <th class="text-center">Code Store</th>
                                                <th class="text-center">Nama Store</th>
                                                <th class="text-center">Move User</th>
                                                <th class="text-center">Reset Password</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @php
                                                $no = 1;    
                                            @endphp
                                            @forelse($agents as $agent)
                                            <tr>
                                                <td class="text-center">{{ $no++ }}</td>
                                                <td class="text-center">{{ $agent->customer->name }}</td>
                                                <td class="text-center">{{ $agent->customer->email }}</td>
                                                <td class="text-center">{{ $agent->customer->handphone }}</td>
                                                <td class="text-center">{{ $agent->cmk_sales->store ?? '' }}</td>
                                                <td class="text-center">{{ $agent->cmk_sales->nama_store ?? '' }}</td>
                                                <td class="text-center">
                                                    <button type="button"
                                                            class="btn btn-success btn-sm"
                                                            onclick="window.location.href='{{ url('/agent/edit_page/'.$agent->id) }}'">
                                                        Move User
                                                    </button>
                                                </td>
                                                <td class="text-center">
                                                    <button 
                                                        class="btn btn-warning btn-sm btn-reset-password" 
                                                        data-id="{{ $agent->id }}"
                                                        data-email="{{ $agent->email }}">
                                                        Reset Password
                                                    </button>
                                                </td>
                                            </tr>
                                            @empty
                                            <tr>
                                                <td colspan="6" class="text-center">No data available</td>
                                            </tr>
                                            @endforelse
                                    </table>
                                    <div style="text-align:center">{{ $agents->appends($_GET)->links() }}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="modalResetPassword" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            
            <div class="modal-header">
                <h5 class="modal-title">Konfirmasi</h5>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>

            <div class="modal-body">
                <p>Apakah yakin ingin reset password?</p>
            </div>

            <div class="modal-footer">
                <form id="formResetPassword" method="GET">
                    {{ csrf_field() }}
                    <button type="submit" class="btn btn-danger">Yes</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
$(document).on('click', '.btn-reset-password', function() {
    var id = $(this).data('id');
    var email = $(this).data('email');

    if (confirm("Reset password dan kirim ke email " + email + " ?")) {
        
        $.ajax({
            url: "{{ url('agent/send_email_password') }}/" + id,
            type: "POST",
            data: {
                _token: "{{ csrf_token() }}"
            },
            success: function(res) {
                alert(res.message);
            },
            error: function(err) {
                alert("Terjadi error");
            }
        });

    }
});
</script>