@extends('layout.master')

@section('content')

<section class="content">
	<div class="box box-primary">
      <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#modal-tambah"><i class="fa fa-plus"></i> Tambah Barang
	  </button>
		<table class="table table-bordered">
			<thead>
				<tr>
					<th>User Id</th>
					<th>Nama</th>
					<th>Action</th>
				</tr>
			</thead>
	@foreach($users as $user)
			<tbody>
				<tr>
					<td>{!! $user->userId !!}</td>
					<td>{!! $user->namaUser !!}</td>
					<td><input type="button" id="edit" value="edit" onclick="editUser({!! $user->userId !!})" ></td>
				</tr>
			</tbody>
	@endforeach
		</table>
	</div>

<!-- modal tambah -->
<div class="modal fade" id="modal-tambah" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Tambah User</h4>
      </div>

      <div class="col-md-12">
      	<div class="modal-body">
		{!! Form::open(['class'=>'form-horizontal','files'=>true,'enctype'=>'multipart/form-data']) !!}
		{!! csrf_field() !!}
    		@include('user._form')
    	</div>
      </div>


      <div class="modal-footer">

      </div>

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


<!--  -->

<!-- modal edit -->
<div class="modal fade" id="modal-edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Tambah User</h4>
      </div>

      <div class="col-md-12">
      	<div class="modal-body">
		{!! Form::model(['class'=>'form-horizontal','files'=>true,'enctype'=>'multipart/form-data']) !!}
		{!! csrf_field() !!}
    		@include('user._form')
    	</div>
      </div>


      <div class="modal-footer">

      </div>

    </div>
  </div>
</div>
<!--  -->

</section>
<script src="{{asset('/lib/jquery/jquery-2.1.4.min.js')}}" type="text/javascript"></script>
<script src="{{asset('/lib/angular/angular.min.js')}}" type="text/javascript"></script>
<script>
function editUser(userId){
	$.ajax({
		type:"GET",
		url:"edit/"+userId,
		data:{"_token":"{{ csrf_token() }}"},
		success:function(data){
			$("#modal-edit").modal('show');
			$("#userId").val(data.userId);
			$("#namaUser").val();
			$("#password").val();
			$("#password_confirmation").val();
			$("#namaRole").val();
			}

		})
	}

	$(document).ready(function(){

		$("#btn-tambah").click(function(){
			var userId=$("#userId").val();
			var namaUser=$("#namaUser").val();
			var password=$("#password").val();
			var password_confirmation=$("#password_confirmation").val();
			var namaRole=$("#namaRole").val();
			var foto=$("#foto").val().replace(/^.*\\/, "");
			$.ajax({
				type:"POST",
				url:"{!! URL::to('user/store') !!}",
				data:{"userId":userId,
					"namaUser":namaUser,
					"password_confirmation":password_confirmation,
					"password":password,
					"namaRole":namaRole,
					"foto":foto,
					"_token":"{{ csrf_token() }}"},
				success:function(data){
					if(data.errors){
						 $.each(data.errors, function(index, error){
						 	$("#error").append("<li>"+error+"</li>")
						 })
					}
				}
			})
		})
	})
</script>

@stop