@extends('layout')

@section('css')
<style type="text/css">
	.datatable-column-width{
		overflow: hidden; text-overflow: ellipsis; max-width: 200px;
	}
</style>
@endsection

@section('content')

	<!-- Page header -->
	<div class="page-header page-header-light">
		<div class="page-header-content header-elements-md-inline">
			<div class="page-title d-flex">
				<h4><i class="icon-arrow-left52 mr-2"></i>Data User</h4>
				<a href="#" class="header-elements-toggle text-default d-md-none"><i class="icon-more"></i></a>
			</div>
		</div>
	</div>
	<!-- /page header -->

	<!-- Content area -->
	<div class="content">

		<!-- Hover rows -->
		<div class="card">



				<div class="card-body">
					<form action="{{url('downloaduser')}}" method="POST">
						@csrf
					<div class="row">
						<div class="col-lg-2">
							<a href="{{ route('users.create')}}"><button type="button" class="btn btn-primary rounded-round"><i class="icon-help mr-2"></i> Tambah</button></a>
						</div>

						@if (\Auth::user()->role == 1)
						<div class="col-lg-2 ml-md-auto text-right">
							<div class="form-control-plaintext">List Member Baru</div>
						</div>

						<div class="col-lg-2">
							<select name="sales" class="form-control form-control-select2">
								<option value="semua" selected>Semua</option>
								@foreach($sales as $sale)
									<option value="{{$sale->id}}" {{ app('request')->input('s') == $sale->id ? 'selected' : null }}>{{ $sale->nama }}</option>
								@endforeach
							</select>
						</div>
						<div class="col-lg-2">
							<select name="month" class="form-control form-control-select2">
								<option value="semua">Semua</option>
								@foreach(config('custom.bulan') as $key => $value)
									<option value="{{$key}}" {{date('m')==$key? 'selected':''}}>{{$value}}</option>
								@endforeach
							</select>
						</div>
						<div class="col-lg-2">
							<select name="year" class="form-control form-control-select2">
								<option value="semua">Semua</option>
								@foreach(range(date('Y')-5, date('Y')+5) as $y)
									<option value="{{$y}}" {{date('Y')==$y?'selected':''}}>{{$y}}</option>
								@endforeach
							</select>
						</div>
						<div class="col-lg-2" style="text-align: center">
							<button type="submit" class="btn btn-success" data-popup="tooltip" data-original-title="Download Xls">Download Xls <i class="icon-file-spreadsheet"></i></button>
						</div>
						@endif

						</form>

					</div>

				</div>


			<table class="table datatable-basic table-hover">
				<thead>
					<tr>
						<th>No</th>
						<th>Foto</th>
						<th>Nama</th>
						<th>Nama Marketing</th>
						{{--<th>Sumber</th>--}}
						<th>Harga Deals</th>
						<th>Shipping Mark</th>
						<th>No HP</th>
						<th>Email</th>
						<th>Username</th>
						<th>Role</th>
						<th class="text-center">Status Notifikasi</th>
						<th class="text-center">Agreement</th>
						<th class="text-center">Actions</th>
					</tr>
				</thead>
				<tbody>
				@if(!$users->isEmpty())
					@php($i=1)
					@foreach($users as $user)
				    <tr>
				        <td><div class="datatable-column-width">{{$i}}</div></td>
				        <td>
							<div class="datatable-column-width">
								<a href="{{ $user->gambar ? $user->gambar : asset('global_assets/images/user-default.png') }}" data-popup="lightbox">
									<img src="{{ $user->gambar ? $user->gambar : asset('global_assets/images/user-default.png') }}" class="img-preview rounded-round mr-2" width="100" height="100" style="object-fit: cover">
								</a>
							</div>
						</td>
				        <td><div class="datatable-column-width">{{ucwords($user->nama)}}</div></td>
				        <td><div class="datatable-column-width">{{ucwords(@$user->sales->nama?@$user->sales->nama:'-')}}</div></td>
				        {{--<td><div class="datatable-column-width">{{array_key_exists($user->sumber, config('custom.sumber_leads')) ? config('custom.sumber_leads')[$user->sumber] : '-'}}</div></td>--}}
				        <td><div class="datatable-column-width">{!! $user->harga_deals?$user->harga_deals:'-' !!}</div></td>
				        <td><div class="datatable-column-width">{{$user->shipping_mark?$user->shipping_mark:'-'}}</div></td>
				        <td>
							<div class="datatable-column-width">
								@if ($user->telp)
									@if($user->telp[0] == 0)
										@php($telpon = "62".ltrim($user->telp, '0'))
									@else
										@php($telpon = $user->telp)
									@endif
									
								@else
									@php($telpon = '-')
								@endif

								<a href="https://wa.me/{{$telpon}}" class="font-weight-bold" target="_blank">+{{$telpon}}</a>
							</div>
						</td>
				        <td><div class="datatable-column-width">{{$user->email}}</div></td>
				        <td><div class="datatable-column-width">{{$user->username}}</div></td>
				        <td><div class="datatable-column-width">{{config('custom.role.'.$user->role)}}</div></td>
						<td class="text-center" style="white-space:nowrap">
							@if($user->status_notifikasi === NULL)
								-
							@else
								<b class="{{config('custom.status_notifikasi_color')[$user->status_notifikasi]}}">{{config('custom.status_notifikasi')[$user->status_notifikasi]}}</b>
							@endif

							@if($user->role == 99)
							<form action="{{url('resendnotifuser')}}" method="post">
								@csrf
								<input type="hidden" name="id_user" value="{{$user->id}}">
								<button type="submit" class="btn btn-success btn-sm py-0">Kirim Ulang</button>
							</form>
							@endif
						</td>
						<td class="text-center" style="white-space:nowrap">
							@if($user->role == 99)
								@if(@$user->agreement->token)

									@if(is_null($user->status_notifikasi_agreement))
									-
									@else
									<b class="{{config('custom.status_notifikasi_color')[$user->status_notifikasi_agreement]}}">{{config('custom.status_notifikasi')[$user->status_notifikasi_agreement]}}</b>
									@endif

									@if(@$user->agreement->status==0)
										@php($baseurl = @$user->coload->id==2 ? 'https://mte.co.id' : 'https://antaralogistic.com')
										@php($link_copy = $baseurl.'/useragreement?t='.@$user->agreement->token)
										<button id="copyclip" class="btn btn-block btn-sm btn-info text-white mb-2" data-popup="tooltip" data-original-title="Copy to Clipboard" data-copytext="{{$link_copy}}" onclick="copyclip(this)">Copy Url Agreement <i class="icon-copy3"></i></button>
										<form action="{{url('resend-url-agreement')}}" method="post">
											@csrf
											<input type="hidden" name="id_user" value="{{$user->id}}">
											<input type="hidden" name="url_agreement" value="{{$link_copy}}">
											<button type="submit" class="btn btn-block btn-sm btn-success text-white">Resend URL Agreement <i class="icon-copy3"></i></button>
										</form>
									@else
										<button data-toggle="modal"
												data-target="#modal_theme_agreement"
												data-ip="{{@$user->agreement->ip_address}}"
												data-ua="{{@$user->agreement->user_agent}}"
												data-time="{{date('d/m/Y H:i:s', strtotime(@$user->agreement->agree_time))}}"
												class="detbutton btn btn-sm btn-success text-white"
												data-popup="tooltip"
										>
											Detail Agreement <i class="icon-checkmark-circle"></i>
										</button>
									@endif
								@else
									<form action="{{url('createagreementurl')}}" method="post">
										@csrf
										<input type="hidden" name="user_id" value="{{$user->id}}">
										<button type="submit" class="btn btn-warning btn-sm py-0">Buat Url Agreement</button>
									</form>
								@endif
							@else
								-
							@endif
						</td>
						<td style="white-space:nowrap" align="center">
							{{-- @if ($user->role == 20 && $user->status == 1) --}}
							@if ((in_array($user->role,[20, 21])) && $user->status == 1)
							<a href="{{ route('users.show',$user->id)}}"><button type="button" class="btn btn-warning btn-icon" data-popup="tooltip" data-placement="bottom" data-original-title="Deactivate"><i class="icon-user-cancel" title="Deactivate"></i></button></a>
							@endif
							<a href="{{ route('users.edit',$user->id)}}"><button type="button" class="btn btn-primary btn-icon" data-popup="tooltip" data-placement="bottom" data-original-title="Edit User"><i class="icon-pencil7" title="Ubah"></i></button></a>
							@if (\Auth::user()->role == 1)
								<a class="delbutton" data-toggle="modal" data-target="#modal_theme_danger" data-uri="{{ route('users.destroy', $user->id)}}"><button type="button" class="btn btn-danger btn-icon" data-popup="tooltip" data-placement="bottom" data-original-title="Delete"><i class="icon-x" title="Hapus"></i></button></a>
							@endif
						</td>
				    </tr>
							@php($i++)
				    @endforeach
				@else
				  	<tr><td align="center" colspan="11">Data Kosong</td></tr>
				@endif

				</tbody>
			</table>
		</div>
		<!-- /hover rows -->

	</div>
	<!-- /content area -->

    <!-- Danger modal -->
	<div id="modal_theme_danger" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-danger" align="center">
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="" method="post" id="delform">
				    @csrf
				    @method('DELETE')
					<div class="modal-body" align="center">
						<h2> Hapus Data? </h2>
					</div>

					<div class="modal-footer">
						<button type="button" class="btn btn-link" data-dismiss="modal">Batal</button>
						<button type="submit" class="btn bg-danger">Hapus</button>
					</div>
				</form>
			</div>
		</div>
	</div>
	<!-- /default modal -->

	<div id="modal_theme_agreement" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header bg-success" align="center">
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<form action="" method="post" id="delform">
				    @csrf
				    @method('DELETE')
					<div class="modal-body" align="center">
						<h2> Detail Agreement </h2>
						<div class="form-group row">
							<label class="col-form-label col-lg-2">Ip Address</label>
							<div class="col-lg-10" id="det-ip">

							</div>
						</div>
						<div class="form-group row">
							<label class="col-form-label col-lg-2">User Agent</label>
							<div class="col-lg-10" id="det-ua">

							</div>
						</div>
						<div class="form-group row">
							<label class="col-form-label col-lg-2">Time</label>
							<div class="col-lg-10" id="det-time">

							</div>
						</div>
					</div>

					<div class="modal-footer">
						<button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
					</div>
				</form>
			</div>
		</div>
	</div>

@endsection

@section('js')
	<!-- Theme JS files -->
	<script src="{{asset('global_assets/js/plugins/notifications/pnotify.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/notifications/bootbox.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/tables/datatables/datatables.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/forms/selects/select2.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/buttons/spin.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/buttons/ladda.min.js')}}"></script>
    <script src="{{asset('global_assets/js/plugins/media/fancybox.min.js')}}"></script>
	<script src="{{asset('global_assets/js/plugins/forms/styling/uniform.min.js')}}"></script>

	<script src="{{asset('assets/js/app.js')}}"></script>
	<script src="{{asset('global_assets/js/demo_pages/components_modals.js')}}"></script>
	<script src="{{asset('global_assets/js/demo_pages/gallery_library.js')}}"></script>
	<script>
		//modal delete
		$(document).on("click", ".delbutton", function () {
		     var url = $(this).data('uri');
		     $("#delform").attr("action", url);
		});

		$(document).on("click", ".detbutton", function () {
		     var ip = $(this).data('ip');
		     var ua = $(this).data('ua');
		     var time = $(this).data('time');
		     $("#det-ip").html(ip);
		     $("#det-ua").html(ua);
		     $("#det-time").html(time);
		});

		var DatatableBasic = function() {

		    // Basic Datatable examples
		    var _componentDatatableBasic = function() {
		        if (!$().DataTable) {
		            console.warn('Warning - datatables.min.js is not loaded.');
		            return;
		        }

		        // Setting datatable defaults
		        $.extend( $.fn.dataTable.defaults, {
		            autoWidth: false,
		            columnDefs: [{
		                orderable: false,
		                width: 200,
		                targets: [ 1,9,10 ]
		            }],
		            dom: '<"datatable-header"fl><"datatable-scroll"t><"datatable-footer"ip>',
		            language: {
		                search: '<span>Filter:</span> _INPUT_',
		                searchPlaceholder: 'Type to filter...',
		                lengthMenu: '<span>Show:</span> _MENU_',
		                paginate: { 'first': 'First', 'last': 'Last', 'next': $('html').attr('dir') == 'rtl' ? '&larr;' : '&rarr;', 'previous': $('html').attr('dir') == 'rtl' ? '&rarr;' : '&larr;' }
		            }
		        });

		        // Basic datatable
		        $('.datatable-basic').DataTable();

		        // Alternative pagination
		        $('.datatable-pagination').DataTable({
		            pagingType: "simple",
		            language: {
		                paginate: {'next': $('html').attr('dir') == 'rtl' ? 'Next &larr;' : 'Next &rarr;', 'previous': $('html').attr('dir') == 'rtl' ? '&rarr; Prev' : '&larr; Prev'}
		            }
		        });

		        // Datatable with saving state
		        $('.datatable-save-state').DataTable({
		            stateSave: true
		        });

		        // Scrollable datatable
		        var table = $('.datatable-scroll-y').DataTable({
		            autoWidth: true,
		            scrollY: 300
		        });

		        // Resize scrollable table when sidebar width changes
		        $('.sidebar-control').on('click', function() {
		            table.columns.adjust().draw();
		        });
		    };

		    // Select2 for length menu styling
		    var _componentSelect2 = function() {
		        if (!$().select2) {
		            console.warn('Warning - select2.min.js is not loaded.');
		            return;
		        }

		        // Initialize
		        $('.dataTables_length select').select2({
		            minimumResultsForSearch: Infinity,
		            dropdownAutoWidth: true,
		            width: 'auto'
		        });
		    };


		    //
		    // Return objects assigned to module
		    //

		    return {
		        init: function() {
		            _componentDatatableBasic();
		            _componentSelect2();
		        }
		    }
		}();


		// Initialize module
		// ------------------------------

		document.addEventListener('DOMContentLoaded', function() {
		    DatatableBasic.init();
		});
	</script>
	<script type="text/javascript">
		$( document ).ready(function() {
	        // Default style
	        @if(session('error'))
	            new PNotify({
	                title: 'Error',
	                text: '{{ session('error') }}.',
	                icon: 'icon-blocked',
	                type: 'error'
	            });
            @endif
            @if ( session('success'))
	            new PNotify({
	                title: 'Success',
	                text: '{{ session('success') }}.',
	                icon: 'icon-checkmark3',
	                type: 'success'
	            });
            @endif

		});

		function copyclip(e) {
				var copied = $(e).data('copytext')

				var textArea = document.createElement( "textarea" );
				textArea.value = copied;
				document.body.appendChild( textArea );
				textArea.select();

				try {
					var successful = document.execCommand( 'copy' );
					var msg = successful ? 'successful' : 'unsuccessful';
				} catch (err) {
					console.log('Oops, unable to copy',err);
				}
				document.body.removeChild( textArea );

				new PNotify({
					title: msg,
					text: 'Copying text command was ' + msg,
					icon: 'icon-checkmark3',
					type: 'success'
				});
		}
	</script>
@endsection