@extends('layout')


@section('content')
<style type="text/css">
	.special {
  font-weight: bold !important;
  color: #fff !important;
  background: #bc0000 !important;
  text-transform: uppercase;
}
</style>

<div class="page-header page-header-default">
	<div class="breadcrumb-line">
		<ul class="breadcrumb">
			<li><a href="#"><i class="icon-home2 position-left"></i> User</a></li>
			<li class="active">Menu</li>
		</ul>
	</div>
</div>

<div class="content">
	<div class="panel panel-flat">
		<div class="panel-heading">
			<h5 class="panel-title">Menu</h5>
			<div class="heading-elements">
				<ul class="icons-list">
		      		<li><a data-action="collapse"></a></li>
		      	</ul>
	       	</div>
	    </div>
	    <div class="panel-body">    

	    &nbsp; <button class="btn btn-primary" type="button" id="btn_tambah_menu">Tambah</button>
	    <!-- <div id="div_kembali" style="padding-top:10px">
	    	<button class="btn btn-warning" type="button" id="btn_kembali" dataid="" parent="">Kembali</button>
	    </div> -->
	    <table class="table datatable-basic table-striped table_menu">
	    	<thead>
				<tr>
					<th width="4%">No</th>
					<th>Nama Menu</th>
					<th>Link Menu</th>
					<th>Parent Menu</th>
					<th>Sort Menu</th>
					<th>Icon Menu</th>
					<th>Active</th>
					<th class="text-center">Aksi</th>
				</tr>
			</thead>
			<tbody>

			</tbody>
	    </table>
	    </div>
	</div>
</div>

<div class="modal fade" id="exampleModal" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg" role="document">
	    <div class="modal-content">
	    	<div class="modal-header">
	    		<h5 class="modal-title" id="exampleModalLabel">Data Form Menu</h5>
	    		<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span></button>
	      	</div>
	      	<div class="modal-body">
	      		<form class="form-horizontal" autocomplete="off" id="form_menu">
	      			<input type="hidden" name="popup_id">
	      					<div class="form-group">
			      				<label class="control-label col-sm-4">Nama Menu</label>
			      				<div class="col-sm-8">
			      					<input type="text" name="popup_nama" class="form-control">
			      				</div>
			      			</div>
			      			<div class="form-group">
			      				<label class="control-label col-sm-4">Link Menu</label>
			      				<div class="col-sm-8">
			      					<input type="text" name="popup_link" class="form-control">
			      				</div>
			      			</div>
			      			<!-- <div class="form-group">
			      				<label class="control-label col-sm-4">Parent Menu</label>
			      				<div class="col-sm-8">
			      					<select class="form-control select-search" name="popup_parent">
			      						
			      					</select>
			      				</div>
			      			</div> -->
			      			

			      			<div class="form-group">
			      				<label class="control-label col-sm-4">Parent Menu</label>
			      				<div class="col-sm-8">
			      					@php
    						function createTreeViewSub2($array, $currentParent, $currLevel = 0, $prevLevel = -1) {
								foreach ($array as $categoryId => $category) {
									if ($currentParent == $category['parent_id']) {                       
    								if ($currLevel > $prevLevel); 
										if ($currLevel == $prevLevel) echo " </option> ";
									echo '<option value="'.$category['kode'].'" id="1">'.$category['name'];
									if ($currLevel > $prevLevel) { $prevLevel = $currLevel; }
									$currLevel++;
									createTreeViewSub3($array, $categoryId, $currLevel, $prevLevel);
									$currLevel--;               
    							}   
    						}
    						if ($currLevel == $prevLevel) echo " </option>";
    						}

    						function createTreeViewSub3($array, $currentParent, $currLevel = 0, $prevLevel = -1) {
								foreach ($array as $categoryId => $category) {
									if ($currentParent == $category['parent_id']) {                       
    								if ($currLevel > $prevLevel); 
										if ($currLevel == $prevLevel) echo " </option> ";
									echo '<option value="'.$category['kode'].'">&emsp;>'.$category['name'];
									if ($currLevel > $prevLevel) { $prevLevel = $currLevel; }
									$currLevel++;
									createTreeViewSub4($array, $categoryId, $currLevel, $prevLevel);
									$currLevel--;               
    							}   
    						}
    						if ($currLevel == $prevLevel) echo " </option>";
    						}

    						function createTreeViewSub4($array, $currentParent, $currLevel = 0, $prevLevel = -1) {
								foreach ($array as $categoryId => $category) {
									if ($currentParent == $category['parent_id']) {                       
    								if ($currLevel > $prevLevel); 
										if ($currLevel == $prevLevel) echo " </option> ";
									echo '<option value="'.$category['kode'].'">&emsp;&emsp;>>'.$category['name'];
									if ($currLevel > $prevLevel) { $prevLevel = $currLevel; }
									$currLevel++;
									createTreeViewSub5($array, $categoryId, $currLevel, $prevLevel);
									$currLevel--;               
    							}   
    						}
    						if ($currLevel == $prevLevel) echo " </option>";
    						}

    						function createTreeViewSub5($array, $currentParent, $currLevel = 0, $prevLevel = -1) {
								foreach ($array as $categoryId => $category) {
									if ($currentParent == $category['parent_id']) {                       
    								if ($currLevel > $prevLevel); 
										if ($currLevel == $prevLevel) echo " </option> ";
									echo '<option value="'.$category['kode'].'">&emsp;&emsp;&emsp;>>>'.$category['name'];
									if ($currLevel > $prevLevel) { $prevLevel = $currLevel; }
									$currLevel++;
									createTreeViewSub5($array, $categoryId, $currLevel, $prevLevel);
									$currLevel--;               
    							}   
    						}
    						if ($currLevel == $prevLevel) echo " </option>";
    						}

							$kode_group= session('kode_group');
    						$sql = DB::select("SELECT  a.* FROM tb_menu a
                        			JOIN tb_role b ON a.kode_menu=b.kode_menu WHERE kode_group='$kode_group' AND status_role='1'  AND active='1' order by sort_menu asc");
    						$arrayCategories = array();
    						foreach($sql as $row){
    							$arrayCategories[$row->kode_menu] = array("parent_id" => $row->parent_menu, 
    																		"kode" => $row->kode_menu,
    																		"name" => $row->nama_menu,
    																		"link" => $row->link_menu,
    																		"icon" => $row->icon_menu,
    																		"sort" => $row->sort_menu);
    						}
							@endphp
			      					<select class="form-control select-bold" name="popup_parent">
			      						<option value="">--- Pilih ---</option>
			      						<option value="0">Parent Menu</option>
			      						@php
			      						if(count($sql) != 0){
			      							createTreeViewSub2($arrayCategories, 0);
			      						}
			      						@endphp
			      					</select>
			      				</div>
			      			</div>
			      			<div class="form-group">
			      				<label class="control-label col-sm-4">Sort Menu</label>
			      				<div class="col-sm-8">
			      					<input type="text" name="popup_sort" class="form-control no-symbol text-uppercase">
			      				</div>
			      			</div>
			      			<div class="form-group">
			      				<label class="control-label col-sm-4">Icon Menu</label>
			      				<div class="col-sm-8">
			      					<input type="text" name="popup_icon" class="form-control">
			      				</div>
			      			</div>
			      			<div class="form-group">
			      				<label class="control-label col-sm-4">Status</label>
			      				<div class="col-sm-8">
			      					<div class="radio">
			      						<label>
                              			<input type="radio" class="control-success" id="status_active" name="popup_status" value="1" > Aktif
                            			</label>
			      					</div>
			      					<div class="radio">
			      						<label>
                              			<input type="radio" class="control-warning" id="status_nonactive" name="popup_status" value="2"> Tidak Aktif
                            			</label>
			      					</div>
			      				</div>
			      			</div>
	      		</form>
	      	</div>
	      	<div class="modal-footer">
	        	<button type="button" class="btn btn-primary" id="btn_popup_simpan">Simpan</button>
	      	</div>
	    </div>
	</div>
</div>

<script type="text/javascript">
	var tb;
	var formBarang = $("#form_menu");

	$(document).ready(function(){
		tb = $(".table_menu").DataTable({
			processing: true,
	        serverSide: true,
	        ajax: '{{ url('menu/tampil') }}',
	        columns: [
	            {data: 'rownum', name: 'rownum', orderable: false, searchable: false, render : function(data, type, full, meta){
			  		return meta.row+1;
			  	}},
	            {data: 'nama_menu', name: 'nama_menu'},
	            {data: 'link_menu', name: 'link_menu'},
	            {data: 'parent_menu', name: 'parent_menu'},
	            {data: 'sort_menu', name: 'sort_menu'},
	            {data: 'icon_menu', name: 'icon_menu'},
	            {data: 'status', name: 'status', orderable: false, searchable: false},
	            {data: 'aksi', name: 'aksi', orderable: false, searchable: false}
	        ],
		});

		/*$("#btn_kembali").hide();
	 	$("#btn_kembali").attr('dataid', '');
	 	$("#btn_kembali").attr('parent', '');*/
		//get_parent();

	})
	$("#btn_tambah_menu").click(function(){
		$("[name=popup_id]").val('');
		$("[name=popup_nama]").val('');
		$("[name=popup_link]").val('');
		$("[name=popup_parent]").val(null).trigger('change');
		$("[name=popup_sort]").val('');
		$("[name=popup_icon").val('');
		$("input:radio[name=popup_status][value=1]")[0].checked = false;
		$("input:radio[name=popup_status][value=2]")[0].checked = false;
		
		// Success
	    $(".control-success").uniform({
	        wrapperClass: 'border-success-400 text-success-600'
	    });
	    // Warning
	    $(".control-warning").uniform({
	        wrapperClass: 'border-warning-400 text-warning-600'
	    });

		disabled('#btn_popup_simpan', false);
		
		$("#exampleModal").modal("show");
	})	

	/*function get_parent(){
		$.ajax({
			url: "{{ url('menu/get_parent') }}",
			success: function(respon){
				$("[name=popup_parent]").html('');
				$("[name=popup_parent]").append('<option value="">--- Pilih Perent ---</option>');
				$("[name=popup_parent]").append('<option value="0">Parent Menu</option>');
				if(respon.parent.length > 0){
					for(i in respon.parent){
						$("[name=popup_parent]").append('<option value="'+respon.parent[i].kode_menu+'" nama="'+respon.parent[i].nama_menu+'">'+respon.parent[i].nama_menu+'</option>');
					}
				}
				
			}
		})
	}*/

	function edit_table(id){
		var id_menu = $("#table_id"+id).val();
		var nama = $("#table_nama"+id).val();
		var link = $("#table_link"+id).val();
		var parent = $("#table_parent"+id).val();
		var sort = $("#table_sort"+id).val();
		var icon = $("#table_icon"+id).val();
		var status = $("#table_status"+id).val();

		$("[name=popup_id]").val(id_menu);
		$("[name=popup_nama]").val(nama);
		$("[name=popup_link]").val(link);
		$("[name=popup_parent]").val(parent).trigger('change');
		$("[name=popup_sort]").val(sort);
		$("[name=popup_icon]").val(icon);
		$("input:radio[name=popup_status][value="+status+"]")[0].checked = true;
		
		// Success
	    $(".control-success").uniform({
	        wrapperClass: 'border-success-400 text-success-600'
	    });
	    // Warning
	    $(".control-warning").uniform({
	        wrapperClass: 'border-warning-400 text-warning-600'
	    });

		$("#exampleModal").modal('show');
	}


	function hapus(id){
		swal({
			title: 'Anda yakin akan menghapus item ini?',
			type: 'warning',
			showCancelButton: true,
			confirmButtonColor: '#3085d6',
			cancelButtonColor: '#d33',
			confirmButtonText: 'Ya',
			cancelButtonText: 'Tidak',
		}).then((result) => {
		 	if(result.value){
		 		$.ajax({
					url: "{{ url('menu/hapus')}} ",
					type: 'post',
					data: {id : id},
					headers : {
						'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
					},
					success: function(respon){
					tb.ajax.reload();
					}
				})
		 	}
		})
	}

	$("#btn_popup_simpan").click(function(){
		var nama = $("[name=popup_nama]").val();
		var link = $("[name=popup_link]").val();
		var parent = $("[name=popup_parent]").val();
		var sort = $("[name=popup_sort]").val();
		var icon = $("[name=popup_icon]").val();
		var status_aktif = $("#status_active").val();
		var status_nonactive = $("#status_nonactive").val();
		if(nama != '' && link != '' && parent != '' && sort != '' && (status_active 
			!= '' || status_nonactive != '')){

		
			 disabled('#btn_popup_simpan', true);
			$.ajax({
				url: "{{ url('menu/simpan')}} ",
				type: 'post',
				data: $("#form_menu").serialize(),
				headers : {
					'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
				},
				success: function(respon){
					if(respon.status == 1){
					tb.ajax.reload();
						$("#exampleModal").modal('hide');
					}else{
						$("#info_barang").text('Kode sudah ada!');
					}
					 disabled('#btn_popup_simpan', false);
				}
			})
		}
	})


</script>

@endsection