<?php
session_start();
include("../../php_crud/my_class.php");
$obj = new my_class();
$year = date('Y');
?>
<style>
	canvas{
	 height: 300px !important;

	}
	.wwd_curve_chart_container {
  		overflow-x: hidden;
   		overflow-y: hidden;
		}
</style>
<!--<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.1/css/all.css" rel="stylesheet" media="all" type="text/css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>-->
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<!--graph print link start-->
<script type="text/javascript" src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
<!--graph print link end-->
<script src="module/ground_water_ex/js/ground_water_table_entry_daily.js"></script>

<div id="cover-spin"></div>

<div class="table-header"><i class="fas fa-list"></i>&ensp;Ground Water Information (Daily)</div>
<div class="row-fluid" style="background-color:#f5f5f5; -webkit-box-shadow: 0px 8px 6px -6px black; -moz-box-shadow: 0px 8px 6px -6px black; box-shadow:0px 8px 6px -6px black;">
   <!--Old Id--> 
    <div class="span3" style="padding-left:15px; margin-top:5px; margin-bottom:3px;">
        <div class="control-group">
            <label class="control-level"for="old_id"><b>Old Id</b><font style="color:#FF0000"></font></label>
            <div class="controls">
                <select name="old_id" id="old_id" class="chosen-select" onchange="load_by_old_id(this.value)">
                <option value=""></option>
						<?php
						/*$table_name = "HYDROLOGY.GWT_DILY_TBL@HYDRO10 A LEFT JOIN HYDROLOGY.GWM_TBL@HYDRO10 B ON A.WELL_ID=B.WELL_ID";
                        $columns = "DISTINCT A.WELL_ID,B.OLD_ID";
						$where_cond = '1=1 ORDER BY B.OLD_ID ASC';*/
						$table_name = "HYDROLOGY.GWM_TBL@HYDRO10 GW_INFO LEFT JOIN HYDROLOGY.UPAZILA_TBL@HYDRO10 UPZ_INFO ON GW_INFO.UPAZILA_CODE=UPZ_INFO.UPZL_CODE
LEFT JOIN HYDROLOGY.DISTRICT_TBL@HYDRO10 DIST_INFO ON UPZ_INFO.DST_CODE=DIST_INFO.DISTRICT_NO";
						$columns = "GW_INFO.WELL_ID,GW_INFO.OLD_ID,UPZ_INFO.UPZL_NAME,DIST_INFO.DISTRICT_NAME";
						$where_cond = "','||WELL_DATA_TYPE||','LIKE'%,'||'1'||',%' ORDER BY WELL_ID ASC";
						foreach($obj->View_colmn_By_Cond($table_name,$columns,$where_cond) as $old_id){
						echo '<option value="'.$old_id['OLD_ID'].'">'.$old_id['OLD_ID'].' ('.$old_id['UPZL_NAME'].','.$old_id['DISTRICT_NAME'].')</option>';
						 }
						?>
                </select>
            </div>
        </div>
    </div>
    <!--Old Id--> 

    <!--Field For New ID-->
    <div class="span3" style="margin-top:5px; margin-bottom:3px;">
        <div class="control-group">
            <label class="control-label" for="well_id"><b>New ID<font color="#FF0000"></font></b></label>
            <div class="controls" style="width: 100%;" id="well_id_list_holder">
                <input type="text" style="width: 94%; height: 12px !important;" id="well_id" name="well_id"  value="" readonly/>
            </div>
        </div>
    </div>
    <!--Field For New ID-->

    <!--Year-->
   <div class="span2" style="padding-left:8px; margin-top:5px; margin-bottom:3px;">
        <div class="control-group">
            <label class="control-level" for="year"><b>Year</b><font style="color:#FF0000"></font></label>
            <div class="controls" style="width: 100%;">
                <input type="text" style="width: 94%; height: 12px !important; font-weight:bold;" id="year" name="year"  value="<?php echo $year ;?>" maxlength="4"/>
            </div>
        </div>
    </div>
    <!--Year-->
	 <!--<div class="span3" style="margin-top:5px; margin-bottom:3px;">
        <div class="control-group">
            <label class="control-label" for="date"><b>Month-Year<font color="#FF0000"></font></b></label>
			<div class="controls" style="width: 100%">
				<input style="height: 12px !important;" class="date-picker" onchange="flushData()" type="text" id="gtwd_m_y" name="gtwd_m_y" data-date-format="mm-yyyy" placeholder="mm-yyyy" value="<?php echo date("m-Y"); ?>">
			</div>
        </div>
    </div>-->
    <!--Month-->
   <div class="span2" style="padding-left:8px; margin-top:5px; margin-bottom:2px;">
        <div class="control-group">
            <label  class="control-level" for="month"><b>Month</b></label>
            <div class="controls">
            <select id="month" name="month" class="chosen-select" onchange="flushData()">
				<option value=""></option>
				<option value="01">January</option>
				<option value="02">February</option>
				<option value="03">March</option>
				<option value="04">April</option>
				<option value="05">May</option>
				<option value="06">June</option>
				<option value="07">July</option>
				<option value="08">August</option>
				<option value="09">September</option>
				<option value="10">October</option>
				<option value="11">November</option>
				<option value="12">December</option>
				</select>
            </div>
        </div>
    </div>
    <!--Month-->

    <!--Button-->
    <div class="span2" style="margin-top:25px; margin-bottom:2px;">
        <div class="control-group">
            <div class="controls">
                <button type="button"  class="btn btn-small btn-info"  onclick="show_water_table_entry_daily()">
                <i class="icon-search"></i><b style="font-size: 12px;">Show Data</b></button>
            </div>
        </div>
    </div>
    <!--Button-->
</div>
</div>

<!--Multiple Save Button-->
<!--<div class="row-fluid" style="margin-top: 15px;">
    <div class="btn-group" style="float: right;">
		<button id = "gwd_sva_btn" style="margin-right: 5px; display: none;" class="btn btn-small btn-success" type="button" onclick="multiple_save()">
			<i class="icon-save"></i> <b style="font-size: 13px; padding: 5px;">Save All</b>
		</button>
    </div>
</div>-->
<!--Multiple Save Button-->

<!--Show Data-->
<div class="row-fluid" style="margin-top: 15px;">
    <div class="col-sm-6 widget-container-col" id="widget-container-col-10">
	    <div class="widget-box" id="widget-box-10">
            <!--Top-->
		    <div class="widget-header widget-header-large">
				<div class="widget-toolbar no-border">
					<ul class="nav nav-tabs" id="myTab">
						<li class="active">
							<a data-toggle="tab" href="#data_list">Data List</a>
						</li>
						<li>
							<a data-toggle="tab" href="#wt_dly_graph_data" onclick="load_wt_dly_graph()"> Hydro Graph</a>
						</li>
					</ul>
				</div>
			</div>
            <!--Top -->

            <!--Data Table-->
			<div class="widget-body">
				<div class="widget-main padding-5">
					<div class="tab-content">
						<div id="data_list" class="tab-pane in active">
				            <div id="view_data_table"></div>
						</div>
						<div id="wt_dly_graph_data" class="tab-pane"> 
						<button type="button" class="btn  btn-small btn-success" style="float:right;" onclick="download_gwd_chart()"><i class="icon-download"></i> Graph</button>	 
                           			 <div id='wt_dly_curve_chart' class="wwd_curve_chart_container"></div>                 
              			</div>
					</div>
			    </div>
			</div>
            <!--Data Table-->
		</div>
	</div>
</div>



<!--Show Data-->
<script type="text/javascript">
	$(".date-picker").datepicker( {
		format: "mm-yyyy",
		viewMode: "months", 
		minViewMode: "months"
	});
    $('.chosen-select').chosen({
		allow_single_deselect:true,
		search_contains: true
	}); 
	//resize the chosen on window resize
	$(window)
	.off('resize.chosen')
	.on('resize.chosen', function() {
		$('.chosen-select').each(function() {
			 var $this = $(this);
			 $this.next().css({'width': '100%'});
		})
	}).trigger('resize.chosen');
	//resize chosen on sidebar collapse/expand
	$(document).on('settings.ace.chosen', function(e, event_name, event_val) {
		if(event_name != 'sidebar_collapsed') return;
		$('.chosen-select').each(function() {
			 var $this = $(this);
			 $this.next().css({'width':'100%'});
		})
	});
</script>