<?php $this->load->view("main/drs/header"); ?>
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/datepicker/bootstrap-datepicker.min.css" />
    <section class="panel">
		<style>
			.folder{
	   float: right;
	   margin-left:15px;
	   cursor: pointer;
	   border-radius: 5px;
	   margin-bottom:10px;
	   position: relative;
	   margin-top:10px;
}
.folder i:hover{
	   border: 1px solid rgb(112,146,190) !important;
	   color: rgb(112,146,190) !important;
}
.add:hover,.back:hover{
	 border: 1px solid green;
	   color: green !important;   
}
.folder i {
	   font-size: 55px;
	   display: block;
	   text-align: center;
	   margin-right:5px;
	    border: 1px solid #ddd;
		width: 90px;
		height: 90px;
		line-height: 90px;
		color: #000;
		border-radius: 10px;
		
}.folder span{
	   width: 85%;
	   display: block;
	   text-align: center;
	   font-size: 12px;
	   margin-top:15px;
	   margin-right:10%;
	   text-align: center;
	   font-size: 10px;
}
.col-lg-12{
	float: right;
	margin-bottom:30px;
}
.col-lg-12 input{
	float: right;
	height: 88px;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid #ccc;
	margin-top:11px;
	
}
h4
{
color: rgb(56,171,181);
}
.green{
	color:#a9d96c !important;
	border:1px solid #a9d96c !important;
}
.red{
	color:#f00 !important;
	border:1px solid #f00 !important;
}
.green:hover{
	color:#a9d96c !important;
	border:1px solid #a9d96c !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{
		border: 1px solid #ccc !important;
		border-radius: 7px  !important;
	}
	.ui-state-default:hover, .ui-widget-content .ui-state-default:hover, .ui-widget-header .ui-state-default:hover{
		background:#08c !important;
		color: #fff;
	}
	.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{
		background:#08c !important;
		
	}
	.edit_nobat{
	   width: 100%;
	   height: 100%;
	   position: fixed;
	   top: 0;
	   left: 0;
	   z-index: 3000;
	   background: rgba(0,0,0,0.5);
}
.modal-title
{
	color: #fff;
}
		</style>
					  	<div class="edit_nobat" data_id="" style="display: none;">
	   <div class="modal-dialog">
		<input type="hidden" id="ajaxupdater" value="" >
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
                                                <h4 class="modal-title">تغییر نوبت</h4>
                                            </div>
                                            <div class="modal-body">
												 <input type="hidden" id="hidden_path" name="path" value="" />
												
												
												
                                            
										   <div id="folder">
                                                    <div class="form-group">
                                                        <label for="date">تاریخ</label>
                                                        <input type="text" name="foldername" class="form-control" id="date">
                                                    </div>
													 <div class="form-group">
                                                        <label for="time">ساعت مراجعه</label>
                                                         <input type="text" name="foldername" class="form-control" id="timeer">
                                                    </div>
													 
													
													
                                                   </div>
										  
                                                    <button type="submit" class="btn btn-info set_calender" id="button_creator">ثبت</button>
                                            </div>
                                        </div>
                                    </div>
</div>
	<header class="panel-heading">نوبت دهی</header>
		<div class="panel-body">
			<div class="col-lg-12">
			<div class="folder"><i class="icon-calendar od"></i><span>نوبت های دیگر</span></div>
			<input type="text" id="otherdate" data_type="od" style="display:none"  >
			</div>
			<div class="col-lg-12">
				<div class="folder" data_type="folder"><i class="icon-user name"></i><span>نام و نام خانوادگی</span></div>
				<input type="text" id="name" data_type="name"  style="display: none">
			<div class="folder"><i class="icon-calendar date"></i><span>تاریخ</span></div>
			<input type="text" id="date2" data_type="date" style="display: none;">
			<div class="folder"><i class="icon-time"></i><span>ساعت</span></div>
			<input type="text" id="time" data_type="icon-time" style="display: none;">
			<div class="folder"><i class="icon-plus"></i><span>ثبت</span></div>
			
			</div>
			<h4>مدیریت نوبت</h4>
			<table class="table table-striped border-top dataTable" id="sample_1" aria-describedby="sample_1_info">
                                
								<tbody role="alert" aria-live="polite" aria-relevant="all">
											<?php $count = 1; foreach($data as $value){ ?>
											<?php
											$date = $value->po_date;
											$date = $date[0].$date[1].$date[2].$date[3]."/".$date[4].$date[5]."/".$date[6].$date[7];
											?>
										<tr class="gradeX odd" data_id="<?php echo $value->id; ?>">
                                        <td class="radife"><?php echo $count; ?></td>
                                        <td class="hidden-phone "><?php echo $value->po_name; ?></td>
										<td class="hidden-phone "><?php echo $date; ?></td>
                                        <td class="hidden-phone "><?php echo $value->po_time; ?></td>
										<td class="icons">
											<button class="btn btn-primary btn-xs" data_id="<?php echo $value->id; ?>" ><i class="icon-pencil"></i></button>
											<button class="btn btn-danger btn-xs" data_id="<?php echo $value->id; ?>" href="#myModal-1" data-toggle="modal"><i class="icon-trash "></i></button>
										</td>
									
                                    </tr>
											<?php $count++; } ?>				
							
							</tbody></table>
		</div>
	</section>
		
<?php $this->load->view("main/drs/footer"); ?>
<script src="<?php echo base_url(); ?>assets/datepicker/bootstrap-datepicker.min.js"></script>
<script src="<?php echo base_url(); ?>assets/datepicker/bootstrap-datepicker.fa.min.js"></script>
<script>
	$("#date2").datepicker();
	$("#otherdate").datepicker();
	$("#date").datepicker();
	$("#otherdate").change(function(){
		$value = $(this).val();
		$value = $value[6]+$value[7]+$value[8]+$value[9]+$value[3]+$value[4]+$value[0]+$value[1];
		window.location = "<?php echo base_url(); ?>panel/appointment?date="+$value;
		
		});
	$(".od").click(function(){
		$(this).parent().css({"display":"none"});
		$("#otherdate").css({"display":"block"});
		$("#otherdate").select();
		});
	$(".name").click(function(){
		$(this).parent().css({"display":"none"});
		
		$("#name").css({"display":"block"});
		$("#name").select();
		});
	$(".date").click(function(){
		$("#date2").css({"display":"block"});
		$(this).parent().css({"display":"none"});
		$("#date2").select();
		});
	
	$("input").change(function(){
		$("input").css({"display":"none"});
		$("#date").css({"display":"block"});
		$("#timeer").css({"display":"block"});
		$(".icon-time").parent().css({"display":"block"});
		$(".folder").css({"display":"block"});
		if ($(this).val != "") {
			$attr = $(this).attr("data_type");
			$("."+$attr).addClass("green").removeClass("red");
		}
		});
	$(".icon-time").click(function(){
		$("#time").css({"display":"block"});
		$(this).parent().css({"display":"none"});
		$("#time").select();
		});
	$(".icon-plus").click(function(){

		$date = $("#date2").val();
		$time = $("#time").val();
		$name = $("#name").val();
		$data_today = false;
		$isreturn = true;
		$today = "<?php echo $today ?>";
		//for name check
				if ($name == "") {
			$classname = $("#name").attr("data_type");
			$("."+$classname).addClass("red");
			$isreturn = false;
		}else{
			$classname = $("#name").attr("data_type");
			$("."+$classname).removeClass("red");
		}
		//for date check
		if ($date == "") {
			$classname = $("#date2").attr("data_type");
			$("."+$classname).addClass("red");
			$isreturn = false;
		}else{
			$classname = $("#date2").attr("data_type");
			$("."+$classname).removeClass("red");
		}
		//for time
		if ($time == "") {
			$classname = $("#time").attr("data_type");
			$("."+$classname).addClass("red");
			$isreturn = false;
		}else{
			$classname = $("#time").attr("data_type");
			$("."+$classname).removeClass("red");
		}
		if ($today == $date) {
			$data_today = true;
		}
		if ($isreturn) {
					$.post("./set_appointment_control",{date:$date,time:$time,name:$name},function(e){
			if(e == "done"){
				location.reload();
				if ($data_today) {
					location.reload();
					if ($("tbody tr").length % 2 == 0) {
						$oddoreven = "odd";
					}else{
						$oddoreven = "even";
					}
					$html = '<tr class="gradeX '+ $oddoreven +'" data_id="1">'
                    $html +='<td class="radife">'+($(".gradeX").length+1) +'</td>';
					$html +='<td class="hidden-phone ">'+$name+'</td>';
					$html +='<td class="hidden-phone ">'+$date+'</td>';
                    $html +='<td class="hidden-phone ">'+$time+'</td>';
					$html +='<td class="icons">';
					$html +='<a href=""><button class="btn btn-primary btn-xs"><i class="icon-pencil"></i></button></a>';
					$html +='<button class="btn btn-danger btn-xs" href="#myModal-1" data-toggle="modal"><i class="icon-trash "></i></button></td></tr>';
					$("tbody").append($html);
				}
			}
			});
		}else{
			return false;
		}

		});
	$(".btn-danger").click(function(){
		$id = $(this).attr("data_id");
		$value = $(this).parent().parent();
		$.post("<?php echo base_url(); ?>panel/delete_appointment",{"id":$id},function(e){
			if (e == "done") {
				$value.remove();
			}
			});
		});
	$(".close").click(function(){
			$(".edit_nobat").css({"display":"none"});
			});
	$(".btn-primary").click(function(){
		$date = $(this).parent().parent().find("td").eq(2).text();
		$time = $(this).parent().parent().find("td").eq(3).text();
		$date = $date[8]+$date[9]+"/"+$date[5]+$date[6]+"/"+$date[0]+$date[1]+$date[2]+$date[3];
		$id = $(this).attr("data_id");
		$("#date").val($date);
		$("#timeer").val($time);
		$(".edit_nobat").css({"display":"block"}).attr({"data_id":$id});
		});
	$(".set_calender").click(function(){
		$date = $("#date").val();
		$time = $("#timeer").val();
		$id = $(".edit_nobat").attr("data_id");
		$.post("<?php echo base_url(); ?>panel/update_appointment",{"id":$id,"date":$date,"time":$time},function(e){
			if (e == "done") {
				location.reload();
			}
			});
		});
</script>