<?php
session_start();
/*
try {
    if (isset($_COOKIE["session"])) { 
        //echo 'Cookie is active!';
        $lifetime=60*60;
        setcookie("session", "1", time() + $lifetime, "/");
    } else{ 
        //echo 'Cookie is NOT active!';
        header("Location: /login.php"); 
    }
    $auth = $_SESSION["auth"];
    if (!$auth){
        header("Location: /login.php"); 
    }
} catch(Exception $e){
    header("Location: /login.php"); 
}
*/

//receiving parameter
$id = $_GET['id'];
//echo $id;
echo "<input id='id' type='hidden' value='" .$id. "'/>";
?>

<div class="container-fluid">

	<div class="row">
		<div class="col-lg-12 col-md-12">
			<div class="card card-plain">

				<div class="content">
					<form id="formid">

					<select id="search_status" name="berat_unit" class="form-control border-input hidden">
						<option value="-" selected>SEMUA</option>
						<option value="0" >PROSES COA</option>
						<option value="1" >AKTIF</option>
						<option value="2" >SEMAK SEMULA</option>
						<option value="3" >GAGAL</option>
						<option value="4" >COA LUPUT</option>
						<option value="5" >PENGGANTUNGAN</option>
					</select>  


						<div>
							<div class="row">
								<div class="header">
									<h5 class="title">Maklumat Produk</h5><br/>
								</div>                                                                            
							</div>
							
							<div style="padding-left:20px;padding-right:20px;">
								<div class="row" >
									<div class="col-md-4" style="padding:10px;">
										<label>No. SKU</label><br/>
										<p id="sku">-</p>
									</div>
									<div class="col-md-4" style="padding:10px;">
										<label>ID Produk</label><br/>
										<p id="produk">-</p>
									</div>
									<div class="col-md-4" style="padding:10px;">
										<label>Tahun Keluaran</label><br/>
										<p id="tahun">-</p>
									</div>                                                                                
								</div>    						
								<div class="row">
									<div class="col-md-4" style="padding:10px;">
										<label>Nama Jenama</label><br/>
										<p id="jenama">-</p>
									</div>
									<div class="col-md-4" style="padding:10px;">
										<label>Model Produk</label><br/>
										<p id="model">-</p>
									</div>
									<div class="col-md-4" style="padding:10px;">
										<label>URL Produk</label><br/>
										<p id="url">-</p>
									</div>                                                                                
								</div>    
								<div class="row">
									<div class="col-md-4" style="padding:10px;">
										<label>Kategori Produk</label><br/>
										<p id="kategori">-</p>
									</div> 
									<div class="col-md-4" style="padding:10px;">
										<label>Tempoh Waranti</label><br/>
										<p id="waranti">-</p>
									</div> 	
									<div class="col-md-4" style="padding:10px;">
										<label>Insurans</label><br/>
										<p id="insuran">-</p>
									</div>																	                                                                          
								</div> 
							</div>
							
							<hr/>
						</div>

						<div>
							<div class="row">
								<div class="header">
									<h5 class="title">Spesifikasi Produk</h5><br/>
								</div>
							</div>
								
							<div style="padding-left:20px;padding-right:20px;">
								<div class="row">							
									<div class="col-md-4" style="padding:10px;">
										<label>Berat Produk</label><br/>
										<p id="berat">-</p>								
									</div>
									<div class="col-md-4" style="padding:10px;">
										<label>Had Lingkungan Umur</label><br/>
										<select id="optumur" name="optumur" style="display:none;">
											<option value="-" selected>-tiada-</option>
											<option value="01" >5 - 7 tahun</option>
										</select> 
										<p id="umur">-</p>  
									</div>
								</div>

								<div class="row">
									<div class="col-md-4" style="padding:10px;">
										<label>Saiz Produk</label><br/>
										<p id="saiz">-</p>
									</div>
									<div class="col-md-4" style="padding:10px;">
										<label>Bahan Buatan</label><br/>
										<select id="optbahan" name="optbahan" style="display:none;">
											<option value="-" selected>-tiada-</option>
											<option value="01" >Plastik</option>
											<option value="02" >Kaca</option>
											<option value="03" >Kayu</option>
											<option value="04" >Besi</option>
											<option value="99" >Lain-lain</option>
										</select> 										
										<p id="bahan">-</p>
									</div>								
								</div>      
								<div class="row">
									<div class="col-md-4" style="padding:10px;">
										<label>Input Kuasa / Tenaga</label><br/>
										<p id="input">-</p>
									</div>
								</div>   
							</div>						
							
							<hr/>
						</div>
						
						<div>
							<div class="row">
								<div class="header">
									<h5 class="title">Gambar Produk</h5><br/>
								</div>
							</div>						
							
							<div class="row">
								<div class="col-md-12">
									<div class="col-md-3">
										<img id="img1" src="/assets/img/blank-image.png" alt="img1" height="200px" style="border:1px dashed #E0E0E0;">
									</div>
									<div class="col-md-3">
										<img id="img2" src="/assets/img/blank-image.png" alt="img2" height="200px" style="border:1px dashed #E0E0E0;">
									</div>   							
									<div class="col-md-3">
										<img id="img3" src="/assets/img/blank-image.png" alt="img3" height="200px" style="border:1px dashed #E0E0E0;">
									</div>
									<div class="col-md-3">
										<img id="img4" src="/assets/img/blank-image.png" alt="img4" height="200px" style="border:1px dashed #E0E0E0;">
									</div>                                                
								</div>
							</div>	
							<!--
							<div class="row">
								<div class="col-md-4">
									<div class="form-group">
										<input id="fileinput1" type="file" accept="image/gif, image/jpeg, image/png" />
									</div>
								</div>                              
							</div> 
							-->						

							<hr/>
						</div>


						<div class="row ">
							<div class="header">
								<h5 class="title">Dokumentasi COC</h5><br/>
								<br/>
							</div>
							<div class="row " style="padding-left:20px;">
								<div class="col-md-12">
									<div class="col-md-6">
										<div id="coc_list"></div>
									</div>
									<div class="col-md-6"></div>
								</div>
							</div>
							<hr/>  							
						</div>							
						

						<div class="row hidden">
							<div class="header">
								<h5 class="title">Pensijilan Produk</h5><br/>
							</div>
							<div class="row " >
								<div class="col-md-12">
									<div class="col-md-8">
										<div class="col-md-4"  style="padding:1px;">
											<label>No. Sijil</label>
											<input id="nosijil" name="nosjil" type="text" class="form-control border-input" placeholder="Berat Produk" value="" >
										</div>                                            
										<div class="col-md-4"  style="padding:1px;">
											<label>Pensijilan</label>
											<select id="jenis_sijil" name="jenis_sijil" class="form-control border-input">
												<option value="000" >-tiada-</option>
												<option value="001" selected>gram</option>
												<option value="002" >kilogram</option>
												<option value="003" >liter</option>
												<option value="004" >tan</option>
											</select>                                             
										</div>									
										<div class="col-md-4"  style="padding:1px;">
											<label>Logo Sijil</label>
											<input id="logo" name="logo" type="text" class="form-control border-input" placeholder="Berat Produk" value="" >
										</div> 
									</div>
									<div class="col-md-4">
									</div>								
								</div>
							</div>					

							<hr/>							
						</div>							


						
						<div class="clearfix"></div>
					</form>
				</div>
				
			</div>
		</div>
	</div>



<!-- Modal -->
<div id="myModalCOA" class="modal fade" role="dialog" style="z-index:9999 !important;">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Mohon COA</h4>
      </div>
      <div class="modal-body">
        <p>Hantar maklumat produk untuk permohonan COA ?</p>
      </div>
      <div class="modal-footer">
	  	<button type="button" class="btn btn-default coa-apply" data-dismiss="modal">Hantar</button>
	  	<button type="button" class="btn btn-default coa-cancel" data-dismiss="modal">Batal</button>
      </div>
    </div>

  </div>
</div>

<!-- Modal -->
<div id="myModalCOAsuccess" class="modal fade" role="dialog" style="z-index:9999 !important;">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Berjaya</h4>
      </div>
      <div class="modal-body">
		<p>Permohonan telah berjaya dihantar.</p>
		<p>No. Permohonan: <b><span id="appno">&nbsp;</span></b></p>
      </div>
      <div class="modal-footer">
	  	<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
      </div>
    </div>

  </div>
</div>



</div>


    <!--   Core JS Files   -->
    <script src="/assets/js/jquery-1.10.2.js" type="text/javascript"></script>
	<script src="/assets/js/bootstrap.min.js" type="text/javascript"></script>

	<!--  Checkbox, Radio & Switch Plugins -->
	<script src="/assets/js/bootstrap-checkbox-radio.js"></script>

    <!--  Notifications Plugin    -->
    <script src="/assets/js/bootstrap-notify.js"></script>

    <!-- Paper Dashboard Core javascript and methods for Demo purpose -->
	<script src="/assets/js/paper-dashboard.js"></script>

	<script src="/assets/js/app.js"></script>	
	


<script type="text/javascript">
	$(document).ready(function() {

		$.ajaxSetup({
			cache: false
		});	

		var url = "";
		url = getBase();

		var id = $('#id').val();
		//console.log('info_produk:id...', id);

		getData();


		function getData(){
			$.ajax({
				type: "get",
				url: url + "/m/ws/get_product.php?id=" + id
				}).done(function(json) { 
				//console.log(json);
				var data = $.parseJSON(json);
				console.log('info_produk:getdata...', data);
				
				if (data && data[0]){
					
					var item = data[0];
					//console.log('item:getdata...', item);
					
					$('#sku').text(item.sku);
					$('#model').text(item.model);
					$('#jenama').text(item.jenama);
					$('#tahun').text(item.prod_year);
					$('#produk').text(item.produk);
					$('#kategori').text(item.type);
					$('#url').text(item.remark);

					$('#waranti').text(item.waranti);
					$('#insuran').text(item.insuran);					
					
					if (item.photo) {
						$('#img1').attr('src',item.photo);
					}
					if (item.photo2) {
						$('#img2').attr('src',item.photo2);
					}
					if (item.photo3) {
						$('#img3').attr('src',item.photo3);
					}
					if (item.photo4){
						$('#img4').attr('src',item.photo4);
					}

					//console.log("details...", item.details);

					var selectOption = $("#search_status option[value=" + item.status + "]").text();
					//console.log(selectOption);
					if (item.coa_status) $('#status1').text(item.coa_status + " - " + selectOption).change();
					if (item.coa_appno) $('#status2').text(item.coa_appno);
					if (item.coa_lulus) $('#status3').text(item.coa_lulus);					
					if (item.coa_cert) $('#status4').text(item.coa_cert);					
					if (item.coa_mohon) $('#status5').text(item.coa_mohon);					
					if (item.coa_luput) $('#status6').text(item.coa_luput);					

					if (item.details) {
						var details = item.details;
						var json = JSON.parse(details);
						//console.log("json...", json);

						$('#berat').html(json.berat + '&nbsp;' + json.berat_unit);
						$('#saiz').html(json.saiz + '&nbsp;' + json.saiz_unit);
						$('#input').html(json.input + '&nbsp;(' +json.input_jenis+ ')');	

						$('#optumur').val(json.umur);
						$('#umur').html($('#optumur option:selected').text());
						
						$('#optbahan').val(json.bahan);
						$('#bahan').html($('#optbahan option:selected').text());
					}
				}

				getData_COC();
			});	
		}

		function getData_COC(){
			$.ajax({
				type: "get",
				url: url + "/m/ws/get_product_coc.php?id=" + id
				}).done(function(json) { 
				//console.log(json);
				var data = $.parseJSON(json);
				if (data && data.length > 0){

					$("#coc_list").empty();
					
					var loop = 0;
					$.each(data, function(k, v) {
						//console.log("v: ", v.remark);
						//console.log("v: ", v.filename);
						var html = "";
						html = html + "<p>";
						html = html + v.remark;
						html = html + "&nbsp;&nbsp;&nbsp;<span class='show-coc' style='cursor:pointer;' data1='" + v.filename + "'>[Papar Dokumen]</span>";
						html = html + "<hr/>";
						html = html + "</p>";
						$("#coc_list").append(html);
					});
					
				}
			});	
		}		


		$('#edit').on('click', function (e) {
            event.preventDefault();
			//console.log('data1:', data1);
			//$('#edit').off('click', '#edit');
			$(document).off('click', '#edit');
			setPage(this, 'Kemaskini Produk', './edit_produk.php?id='+id);
        });  

		$(document).on('click', '.show-coc' , function() {
            event.preventDefault();
			//$(document).off('click', '.show-coc');
            var data1 = $(this).attr('data1');
			//console.log('data1: ', data1);
			window.open(data1, '_blank');
        }); 	

		$(document).on('click', '.coa-apply' , function() {
            event.preventDefault();
			//$(document).off('click', '.show-coc');
			//alert("coa-apply");
			applyCOA();
        }); 

		function applyCOA(remark){

			var json = {
				"id": id
			};

			$.ajax({
				url: '/m/ws/post_item_apply_coa.php',
				type: 'POST',
				data: JSON.stringify(json),
				async: false,
				success: function (data) {
					data = $.parseJSON(data);
					//console.log("applyCOA: ", data);
					if (data){
						var result = data[0];
						//console.log("result: ", result);
						var selectOption = $("#search_status option[value=" + result.status + "]").text();
						console.log(selectOption);
						$('#status1').text(result.status + " - " + selectOption).change();
						$('#status2').text(result.appno);
						$('#status5').text(result.tarikh);
						$('#myModalCOAsuccess').modal('show');
					}
				},
				error:function(data){
					alert(data);
					console.log(data);
				},
				cache: false,
				contentType: false,
				processData: false
			});

			return false;			
		}		

					

	});
</script>    