<?php include('header.php'); ?>
<?php
	if($_SESSION['name_user']==""){header('Location: '.$IP_SERVER.'login/?link=work');}
	//***************************************************************
	$sql_WHERE = "and ID = '".$_GET['id']."' ";
	
	//***************************************************************
	$sql_request = "SELECT request.remark_text as detail,place.remark as remark,gender,ID,floors,building,building,title,Fname,Lname,request_type.request_type AS request_type,request.request_typeID AS request_typeID,status,date(time_create) as time_create,date(time_finish) as time_finish,remark_img,finish_img_1,finish_img_2,finish_img_3,remark_finish,request_type.url_img as request_type_img FROM request,place,worker,request_type WHERE request.placeID = place.ID_place and worker.IDworker = place.workerID and request_type.request_typeID = request.request_typeID ".$sql_WHERE;
	$query_request = mysqli_query($conn,$sql_request);
	$result_request=mysqli_fetch_array($query_request);
?>
	<body>
		<a href="<?=$IP_SERVER?>work_request_list/">
			<div class="header" style="height: 30px;">
				<div class="logo">
					<center> 
						
							<table border="0" cellspacing="0" cellpadding="0" >
								<tr>
									<td height="40">
										<img src="<?=$IP_SERVER?>img/fmd.png">	
									</td>
									<td>
										ระบบแจ้งปัญหาห้องน้ำ 
										<b><font color="red">อหท.</font></b>
									</td>
								</tr>
							</table>
						
					</center>
				</div>
			</a>
		</div>
		<div style="width: auto; height: 40px;">
			
		</div>
		<div class="data">
			<div class="CONTACT">	
				<h3>
					<center>ปัญหา</center> 
				</h3>
				<center>
<?php
				if (mysqli_num_rows($query_request) > 0) { //ตรวจสอบข้อมูลมีหรือไม่
					//มีข้อมูล
?>
				<table class="table_detail" width="95%">
					<tr>
						<td align="center" height="40">
							<b>เลขที่ :</b> <?=$result_request['ID']?>
						</td>
					</tr>
					<tr>
						<td>
							<b>สถานที่ :</b> ห้องน้ำ<?php if($result_request['gender']=="f"){ echo"หญิง"; }else if($result_request['gender']=="m"){echo"ชาย";}else{echo"รวม";} ?> <?=$result_request['remark']?> ชั้น <?=$result_request['floors']?> ตึก <?=$result_request['building']?>
						</td>
					</tr>
					<tr>
						<td>
							<b>ผู้รับผิดชอบ :</b> <?=$result_request['title']?><?=$result_request['Fname']?> <?=$result_request['Lname']?>
						</td>
					</tr>
					<tr>
						<td>
							<b>วันที่ :</b> <?=date_time_work($result_request['time_create'])?> <b>แล้วเสร็จ :</b> <?php if($result_request['time_finish']==''||$result_request['time_finish']=='0000-00-00'){echo "ยังไม่เสร็จ";}else{echo date_time_work($result_request['time_finish']);}  ?>
						</td>
					</tr>
					<tr>
						<td>
							<b>สถานะ :</b> <?php	if($result_request['status']=="1"){echo "แจ้งปัญหา";}else if ($result_request['status']=="2") {echo "กำลังดำเนินการ";}else if ($result_request['status']=="3") {echo "รอตรวจสอบ";}else if ($result_request['status']=="4") {echo "แก้ปัญหาเรียบร้อย";}else if ($result_request['status']=="5") {echo "ไม่สามารถแก้ปัญหาได้";}?>
						</td>
					</tr>
					
					<tr>
						<td>
							<b>รายละเอียด : </b>
						</td>
					</tr>
					<tr>
						<td align="center">
							<img src="<?=$result_request['request_type_img']?>" width="150" >
							<br /><b><?=$result_request['request_type']?></b>
						</td>
					</tr>
<?php
					if($result_request['request_typeID']=='1'){
?>
						<tr>
							<td>
								&nbsp;&nbsp;&nbsp;&nbsp;<?php if($result_request['detail']=='no_text'){ }else{echo $result_request['detail'];} ?>
							</td>
						</tr>
<?php
						if($result_request['remark_img']!='no_img'){
?>
							<tr>
								<td>
									<b>ภาพประกอบ : </b>
								</td>
							</tr>
							<tr>
								<td align="center">
									<?php if($result_request['remark_img']=='no_img'){ echo'ไม่มีรูปภาพประกอบ'; }else{echo '<img src="'.$result_request['remark_img'].'" style="max-width: 90%;">';}?>
									
								</td>
							</tr>
<?php
						}
					}
					if($result_request['finish_img_1']!='no_img'||$result_request['finish_img_2']!='no_img'||$result_request['finish_img_3']!='no_img'){
?>
						<tr>
							<td >
								<b>ภาพรายงาน : </b>
							</td>
						</tr>
						<tr>
							<td align="center">
								<?php 
									if($result_request['finish_img_1']=='no_img'&&$result_request['finish_img_2']=='no_img'&&$result_request['finish_img_3']=='no_img'){ 
										echo'ไม่มีรูปภาพประกอบ'; 
									}else{
										if($result_request['finish_img_1']!='no_img'){
											echo '<img src="'.$result_request['finish_img_1'].'" style="max-width: 90%;">';
										}
										if($result_request['finish_img_2']!='no_img'){
											echo '<img src="'.$result_request['finish_img_2'].'" style="max-width: 90%;">';
										}
										if($result_request['finish_img_3']!='no_img'){
											echo '<img src="'.$result_request['finish_img_3'].'" style="max-width: 90%;">';
										}
										
									}
								?>
							</td>
						</tr>
						<tr>
							<td >
								<b>ข้อความเพิ่มเติม : </b>
							</td>
						</tr>
						<tr>
							<td>
								&nbsp;&nbsp;&nbsp;&nbsp;<?=$result_request['remark_finish']?><br /><br />
							</td>
						</tr>
<?php
					}
?>	
				</table>	
			</center>
<?php
					if($result_request['status']=="1"||$result_request['status']=="2"){
?>
					<div class="CONTACT_from">
						<textarea placeholder="พิมพ์ข้อความที่นี่" id="CONTACT_from_txt"></textarea>
						<br />
						<center>
							
							<div id="image_file" style="display : none; width: 100%;">
								<div class="btn-file">
								    <div class="btn-file-button2"><span>รูปภาพ</span></div>
								    <div class="data-file-name" id="data-file-name"></div>
								    <div class="btn-file-close2" onclick="javascript:close_load_image();"><span>ลบรูป</span></div>
								</div>
								<br/>
							</div>
							
							<table border="0" width="90%" cellpadding="0" cellspacing="0">
								<tr>
									<td align="left" width="100">
										<div class="load_image" id="load_image" style="display : block;" onclick="javascript:load_image();" >
											<center>
												<img src="<?=$IP_SERVER?>img/Upload.png"><span>เพิ่มรูปภาพ</span>
												<!--<input name="image_file" id="imageInput" type="file" onchange="javascript:ChangeText(this, 'btn-file-name');" accept=".png, .jpg, .jpeg, .gif" />-->
												<input name="image_file" id="imageInput" type="file" onchange="javascript:ChangeText();" accept=".jpg, .jpeg" multiple />
											</center>
										</div>
										
									</td>
									<td align="center">
										<button class="send_data" style="color: #ffffff;font-size: 20px;" onclick="javascript:upload_send_data();">ส่งงาน</button>
									</td>
								</tr>
							</table>
						</center>
						<br />

					</div>
<?php
					}
				}else{
					echo "<br /><h1>ไม่พบข้อมูล</h1><br /><br />";
				}
?>
			</div>				
		</div>
		<!---------------------popup---------------------------->
		<div id="myModal" class="modal" onclick="javascript:close_popup();" >
			<div class="modal-content">
				<span class="close"></span>
				<div id="popup">
					<br />
					<img src="<?=$IP_SERVER?>img/load.gif"><br />
					<center><div id="loading"><div id="loadingup"></div></div></center>
					<br />
				</div>
			</div>
		</div>
		<div id="url_upload_ok" style="display: none;">
			<textarea id="url_ok_1">no_img</textarea>
			<textarea id="url_ok_2">no_img</textarea>
			<textarea id="url_ok_3">no_img</textarea>
			<div id="url_error">error</div>
		</div>
		<!---------------------popup---------------------------->
		<script type="text/javascript">
			var work_ID = '<?=$result_request['ID']?>';

			//----------------------------------------------------------
			

			function ChangeText() {
				var files = $('#imageInput')[0].files;
				if(files.length!=0){
					document.getElementById("load_image").style.display = "none";
					document.getElementById("image_file").style.display = "block";
				}
				var html_code = '';
				for (var count_files = 0; count_files<files.length; count_files++) {
					
					
					html_code = html_code+'<div class="btn-file-name2"><span>'+$('#imageInput')[0].files[count_files].name+'</span></div>';
				}
				document.getElementById("data-file-name").innerHTML = html_code;
			}

			//---------------------updload----------------------------------------
			function load_image(){
				//document.getElementById("load_image").style.display = "none";
				//document.getElementById("image_file").style.display = "block";
			}
			function close_load_image(){
				document.getElementById("load_image").style.display = "block";
				document.getElementById("image_file").style.display = "none";
				document.getElementById("imageInput").value = "";
				document.getElementById("data-file-name").innerHTML = "";
			}
			function upload_send_data(){
				var CONTACT_from_txt = document.getElementById("CONTACT_from_txt").value;
				if(CONTACT_from_txt!=''){
					var r = confirm("คุณต้องการส่งรายงาน");
					if (r == true) {
						start_upload_multiple();
					} else {
						
					}
				}else{
					alert("กรุณาพิมพ์ข้อความ");
				}
			}
			function start_upload_multiple(){
				document.getElementById("myModal").style.display = "block";
				document.getElementById("loading").style.display = "block";
				document.getElementById("loadingup").style.width = "0%";
				var files = $('#imageInput')[0].files;
				var error_type = 0;
				var error_size = 0;
				var error_text = '';
				var form_data = new FormData();
				for(var count = 0; count<files.length; count++){
					var fsize = $('#imageInput')[0].files[count].size; //get file size
	 				var ftype = $('#imageInput')[0].files[count].type;
	 				//alert(fsize);
					if(ftype=='image/jpeg' || ftype=='image/pjpeg')
					{	
						if(fsize > (5*1048576)){
							error_size++;
						}else{
							form_data.append("file[]", files[count]);
						}
					}else{
						error_type++;
					}
				}
				if(error_type == 0 && error_size == 0 && files.length > 0 && files.length <= 3){
					$.ajax({
						url: '../sql/multiple_upload.php',
						type: 'post',
						data: form_data,
						contentType: false,
						processData: false,
						xhr: function () {
							var xhr = new window.XMLHttpRequest();
							xhr.upload.addEventListener("progress", function(evt){
								if (evt.lengthComputable) {
							 		var percentComplete = evt.loaded / evt.total;
									document.getElementById("loadingup").style.width = (Math.round((percentComplete * 100)-10) + "%");
								}
							}, false);
							xhr.addEventListener("progress", function(evt){
								if (evt.lengthComputable) {
									var percentComplete = evt.loaded / evt.total;
									document.getElementById("loadingup").style.width = (Math.round((percentComplete * 100)-10) + "%");
								}
							}, false);
							return xhr;
						},
						success: function(data){						            	
							document.getElementById("url_upload_ok").innerHTML = data;
							var url_error = document.getElementById("url_error").innerHTML;
		            		if(url_error=="no_error"){
		            			start_send_data();
		            		}else{
		            			alert('รูปภาพไม่รองรับกรุณาเปลี่ยนรูปภาพ');
								document.getElementById("loading").style.display = "none";
								document.getElementById("myModal").style.display = "none";
		            		}
							
							//alert(data);
						},
						error: function (error) {
							alert("error");
						    
						}
					});
				}else if(files.length==0){
					alert('คุณยังไม่ได้เลือกภาพ');
					document.getElementById("loading").style.display = "none";
					document.getElementById("myModal").style.display = "none";
				}else{
					if(error_type > 0){
						error_text = error_text + 'กรุณาเลือกไฟล์ชนิดรูปภาพ ';
					}
					if(error_size > 0){
						error_text = error_text + 'ไฟล์รูปภาพขนาดเกิน 5 MB ';
					}if(files.length > 3){
						error_text = error_text + 'ไฟล์รูปภาพเกิน 3 ไฟล์ ';
					}
					alert(error_text);
					document.getElementById("loading").style.display = "none";
					document.getElementById("myModal").style.display = "none";
					
				}
			}
			function start_send_data(){
				
				document.getElementById("loadingup").style.width = "99%";
				var url_ok_1 = document.getElementById("url_ok_1").value;
				var url_ok_2 = document.getElementById("url_ok_2").value;
				var url_ok_3 = document.getElementById("url_ok_3").value;
				var contact_txt = document.getElementById("CONTACT_from_txt").value;
				contact_txt = escapeHtml(contact_txt);
				$.ajax({
					type: "POST",
					url: "../sql/save.php",
					data: {
						type : 'update',
						work : contact_txt,
						url_ok_1 : url_ok_1,
						url_ok_2 : url_ok_2,
						url_ok_3 : url_ok_3,
						work_ID : work_ID
					},
					success: function(result) {
						//alert(result);
						if(result=='ok'){
							document.getElementById("loadingup").style.width = "100%";
							alert("บันทึกข้อมูลเรียบร้อย");
							location.reload();
						}else{
							alert("ระบบขัดข้องกรุณาแจ้งภายหลัง");
							document.getElementById("loading").style.display = "none";
							document.getElementById("myModal").style.display = "none";
							//document.getElementById("popup").innerHTML = html_code;
						}
					}
				});



				function escapeHtml (string) {
					var entityMap = {
						'&': '&amp;',
						'<': '&lt;',
						'>': '&gt;',
						'"': '&quot;',
						"'": '&#39;',
						'/': '&#x2F;',
						'`': '&#x60;',
						'=': '&#x3D;',
						'\\': '&#92;'
					};
					return String(string).replace(/[&<>"'`=\/\\]/g, function (s) {
						return entityMap[s];
					});
				}
			}
			//---------------------updload----------------------------------------
			
		</script>

		<?php include('footer.php'); ?>